/* Slides Pixeldorado — CSS scopé sous .pxs (généré, ne pas éditer à la main) */
.pxs, .pxs *, .pxs *::before, .pxs *::after { box-sizing: border-box; }
.pxs { font-family: var(--sans); color: var(--ink); line-height: 1.55; -webkit-font-smoothing: antialiased; }
.pxs section { position: relative; }
.pxs button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.pxs img, .pxs svg, .pxs canvas { display: block; max-width: 100%; }
.pxs ul, .pxs ol { list-style: none; margin: 0; padding: 0; }
.pxs h1, .pxs h2, .pxs h3, .pxs p { margin: 0; }
.pxs{
  /* Couleurs Pixeldorado */
  --navy: #244B5C;
  --navy-deep: #1A3744;
  --coral: #F97171;
  --gold: #F6CD67;
  --slate: #3D4459;
  --sky: #CEE4E8;
  --cream: #FFF7EA;
  --paper: #F4F4F4;

  /* Thème courant (piloté au scroll) */
  --bg: #FFF7EA;
  --ink: #244B5C;
  --hi: #F97171;
  --btn: #F97171;
  --btn-ink: #FFF7EA;

  --display: "Beni PX", "Anton", Impact, "Arial Narrow", sans-serif;
  --sans: "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;

  --gutter: clamp(16px, 3vw, 48px);
  --r: clamp(16px, 1.6vw, 26px);
  --cw: clamp(200px, min(23vw, 40vh), 370px);
  --ease: cubic-bezier(.7, 0, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}
.pxs .lenis.lenis-smooth{ scroll-behavior: auto !important; }
.pxs .lenis.lenis-stopped{ overflow: hidden; }
.pxs body.is-loading{ overflow: hidden; }
.pxs img, .pxs svg{ display: block; max-width: 100%; }
.pxs a{ color: inherit; text-decoration: none; }
.pxs button{ font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.pxs h1, .pxs h2, .pxs h3, .pxs p{ margin: 0; }
.pxs ul{ list-style: none; margin: 0; padding: 0; }
.pxs ::selection{ background: var(--gold); color: var(--navy-deep); }
.pxs :focus-visible{ outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 6px; }
.pxs .sr-only{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pxs .d{
  font-family: var(--display);
  font-weight: 700;
  text-transform: uppercase;
  line-height: .86;
  letter-spacing: .003em;
  font-kerning: normal;
}
.pxs .hi{ color: var(--hi); transition: color .5s; }
.pxs .kicker{
  font-size: .9rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: .6em;
}
.pxs .w{ display: inline-block; overflow: hidden; vertical-align: top; padding: .12em .02em .04em; margin: -.12em -.02em -.04em; }
.pxs .wi{ display: inline-block; will-change: transform; }
.pxs .ch{ display: inline-block; will-change: transform; }
.pxs .btn{
  --b: var(--ink);
  --t: var(--bg);
  display: inline-flex; align-items: center; gap: .7em;
  padding: .95em 1.4em;
  border-radius: 999px;
  background: var(--b);
  color: var(--t);
  font-weight: 600;
  font-size: .95rem;
  line-height: 1;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: color .4s var(--ease), background .5s;
}
.pxs .btn::after{
  content: "";
  position: absolute; inset: 0;
  background: var(--hi);
  border-radius: inherit;
  transform: translateY(101%);
  transition: transform .5s var(--ease);
  z-index: -1;
}
.pxs .btn:hover::after{ transform: translateY(0); }
.pxs .btn:hover{ color: var(--navy-deep); }
.pxs .btn svg{ width: 1.1em; height: 1.1em; transition: transform .4s var(--ease); }
.pxs .btn:hover svg{ transform: translate(2px, -2px) rotate(0deg); }
.pxs .btn--ghost{ background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px currentColor; }
.pxs .btn--light{ --b: var(--cream); --t: var(--navy-deep); }
.pxs .btn--coral{ --b: var(--coral); --t: var(--navy-deep); }
.pxs .btn--coral::after{ background: var(--cream); }
.pxs .rb{
  width: 42px; height: 42px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: var(--cream);
  color: var(--navy-deep);
  flex: none;
  transition: transform .4s var(--ease), background .3s;
}
.pxs .rb svg{ width: 18px; height: 18px; }
.pxs .rb:hover{ transform: rotate(-12deg) scale(1.08); background: var(--gold); }
.pxs .rb--coral{ background: var(--coral); color: var(--cream); }
.pxs .chips{ display: flex; flex-wrap: wrap; gap: 6px; }
.pxs .chip{
  display: inline-flex; align-items: center; gap: .4em;
  padding: .42em .8em;
  border-radius: 999px;
  font-size: .85rem;
  font-weight: 600;
  line-height: 1;
  background: var(--cream);
  color: var(--navy-deep);
  white-space: nowrap;
}
.pxs .chip--coral{ background: var(--coral); color: var(--navy-deep); }
.pxs .chip--gold{ background: var(--gold); color: var(--navy-deep); }
.pxs .chip--navy{ background: var(--navy); color: var(--cream); }
.pxs .chip--line{ background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; color: inherit; }
.pxs .chip .dot{ width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: pxs-blink 1.2s steps(1) infinite; }
.pxs .i{ width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pxs .loader{
  position: fixed; inset: 0;
  z-index: 200;
  background: var(--navy);
  display: grid; place-items: center;
  overflow: hidden;
  cursor: pointer;
}
.pxs .loader-txt{
  text-align: center;
  color: var(--cream);
  font-size: clamp(32px, 4.4vw, 76px);
  line-height: .92;
  padding: 0 var(--gutter);
}
.pxs .loader-txt.d{ font-family: var(--sans); font-weight: 400; text-transform: none; letter-spacing: -.02em; line-height: 1.18; font-size: clamp(20px, 2.1vw, 36px); }
.pxs .loader-txt .y{ font-weight: 600; }
.pxs .loader-txt .ll{ display: block; overflow: hidden; padding-top: .1em; }
.pxs .loader-txt .ll > span{ display: inline-block; }
.pxs .loader-txt{ opacity: 0; }
.pxs .loader-txt .ll--hi, .pxs .loader-txt .y{ color: var(--gold); }
.pxs .loader-heart{
  position: absolute;
  left: 50%; top: 50%;
  width: clamp(90px, 12vw, 180px);
  translate: -50% -45%;
  shape-rendering: crispEdges;
  overflow: visible;
}
.pxs .loader-heart rect{ fill: var(--cream); }
.pxs .loader-heart rect.g{ fill: var(--gold); }
.pxs .loader-skip{
  position: absolute; bottom: 24px; left: 50%; translate: -50% 0;
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cream); opacity: .6;
}
.pxs .topbar{
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 90;
  display: flex; align-items: center; justify-content: space-between;
  padding: clamp(14px, 1.8vw, 26px) var(--gutter);
  pointer-events: none;
}
.pxs .topbar > *{ pointer-events: auto; }
.pxs .rbtn{
  width: clamp(46px, 3.6vw, 58px); height: clamp(46px, 3.6vw, 58px);
  border-radius: 50%;
  background: var(--btn);
  color: var(--btn-ink);
  display: grid; place-items: center;
  position: relative;
  transition: background .5s, color .5s;
  will-change: transform;
}
.pxs .rbtn::before{
  content: ""; position: absolute; inset: -6px; border-radius: 50%;
  border: 1.5px solid var(--btn); opacity: 0; scale: .8;
  transition: opacity .4s, scale .5s var(--ease-out);
}
.pxs .rbtn:hover::before{ opacity: .6; scale: 1; }
.pxs .burger{ width: 20px; height: 12px; position: relative; }
.pxs .burger i{ position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px; background: currentColor; transition: transform .5s var(--ease), top .5s var(--ease); }
.pxs .burger i:nth-child(1){ top: 1px; }
.pxs .burger i:nth-child(2){ top: 9px; }
.pxs .menu-open .burger i:nth-child(1){ top: 5px; transform: rotate(45deg); }
.pxs .menu-open .burger i:nth-child(2){ top: 5px; transform: rotate(-45deg); }
.pxs .menu-open .rbtn--menu{ background: var(--gold); color: var(--navy-deep); }
.pxs .brand{
  width: clamp(42px, 3.2vw, 52px); height: clamp(42px, 3.2vw, 52px);
  border-radius: 12px;
  background: var(--navy-deep);
  display: grid; place-items: center;
  transition: transform .5s var(--ease);
}
.pxs .brand:hover{ transform: rotate(-8deg) scale(1.06); }
.pxs .brand svg{ width: 62%; shape-rendering: crispEdges; }
.pxs .brand:hover .px-beat{ animation-duration: .7s; }
.pxs .px-beat{ animation: pxs-beat 1.4s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
.pxs .sec-label{
  position: fixed; left: var(--gutter); bottom: clamp(14px, 2vw, 24px);
  z-index: 40;
  font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  overflow: hidden; height: 1.4em;
  pointer-events: none;
}
.pxs .sec-label span{ display: block; border-bottom: 1.5px solid currentColor; }
.pxs .progress{
  position: fixed; right: 6px; top: 50%; translate: 0 -50%;
  z-index: 40; width: 3px; height: 26vh; border-radius: 3px;
  background: color-mix(in srgb, var(--ink) 15%, transparent);
  pointer-events: none;
}
.pxs .progress i{ position: absolute; left: 0; right: 0; top: 0; height: 18%; border-radius: 3px; background: var(--ink); }
.pxs .menu{
  position: fixed; inset: 0;
  z-index: 80;
  background: var(--navy);
  color: var(--cream);
  visibility: hidden;
  clip-path: circle(0 at 40px 40px);
  display: grid;
  grid-template-columns: auto auto;
  justify-content: center;
  align-items: center;
  column-gap: clamp(60px, 11vw, 220px);
  padding: 100px var(--gutter) 90px;
  overflow: hidden;
}
.pxs .menu-nav{ align-self: center; }
.pxs .menu-nav li{ overflow: hidden; }
.pxs .menu-link{
  display: inline-flex; align-items: center; gap: .25em;
  font-size: clamp(34px, min(7vw, 9.2vh), 132px);
  padding: .02em 0;
  transition: color .35s;
  position: relative;
}
.pxs .menu-link .num{ font-family: var(--sans); font-size: .8rem; font-weight: 600; letter-spacing: .1em; opacity: .5; align-self: flex-start; margin-top: .6em; margin-left: .5em; }
.pxs .menu-link:hover, .pxs .menu-link:focus-visible{ color: var(--gold); }
.pxs .menu-nav:hover .menu-link:not(:hover){ color: color-mix(in srgb, var(--cream) 45%, transparent); }
.pxs .menu-heart{
  justify-self: center;
  width: min(34vw, 62vh);
  aspect-ratio: 7 / 6;
  position: relative;
}
.pxs .menu-heart svg{ width: 100%; height: 100%; overflow: visible; shape-rendering: crispEdges; }
.pxs .menu-heart .hp{ fill: var(--coral); }
.pxs .menu-heart .hp.g{ fill: var(--gold); }
.pxs .menu-heart .hp.c{ fill: var(--cream); }
.pxs .menu-heart .ecg{ fill: none; stroke: var(--navy-deep); stroke-width: .14; stroke-linecap: round; stroke-linejoin: round; }
.pxs .menu-side{ text-align: center; max-width: 400px; display: grid; justify-items: center; gap: 22px; padding: 44px 36px; border-radius: 28px; background: rgba(255, 247, 234, .06); box-shadow: inset 0 0 0 1.5px rgba(255, 247, 234, .12); }
.pxs .menu-side h2{ font-size: clamp(42px, 4vw, 72px); }
.pxs .menu-side p{ font-size: 1.15rem; }
.pxs .menu-avatar{ width: 128px; height: 128px; border-radius: 50%; overflow: hidden; background: var(--cream); border: 4px solid var(--gold); }
.pxs .menu-avatar img{ width: 100%; height: 100%; object-fit: cover; translate: 9% 0; }
.pxs .menu-foot{
  position: absolute; left: var(--gutter); right: var(--gutter); bottom: 22px;
  display: flex; justify-content: space-between; align-items: center; gap: 20px;
  font-size: .95rem; opacity: .9;
}
.pxs .socials{ display: flex; gap: 10px; }
.pxs .socials a{ width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; box-shadow: inset 0 0 0 1.5px currentColor; transition: background .3s, color .3s; }
.pxs .socials a:hover{ background: var(--gold); color: var(--navy-deep); box-shadow: none; }
.pxs .socials svg{ width: 16px; height: 16px; }
.pxs .overlay{
  position: fixed; inset: 0; z-index: 94;
  background: color-mix(in srgb, var(--navy-deep) 45%, transparent);
  backdrop-filter: blur(3px);
  opacity: 0; visibility: hidden;
}
.pxs .panel{
  position: fixed; z-index: 95;
  top: 12px; right: 12px; bottom: 12px;
  width: min(640px, calc(100vw - 24px));
  background: var(--navy);
  color: var(--cream);
  border-radius: calc(var(--r) + 6px);
  padding: clamp(24px, 2.4vw, 38px);
  display: flex; flex-direction: column;
  overflow: auto;
  overscroll-behavior: contain;
  visibility: hidden;
  box-shadow: 0 30px 80px -20px rgba(10, 25, 32, .5);
}
.pxs .panel-close{ position: absolute; top: 18px; right: 18px; }
.pxs .panel-head{ display: grid; justify-items: center; text-align: center; gap: 14px; padding-top: 10px; }
.pxs .panel-head svg.pulse{ width: 72px; shape-rendering: crispEdges; }
.pxs .panel-head h2{ font-size: clamp(42px, 4vw, 68px); }
.pxs .panel-head p{ font-size: 1.1rem; max-width: 34ch; }
.pxs .field{ display: grid; gap: 6px; }
.pxs .field label{ font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; opacity: .7; font-weight: 600; }
.pxs .field input, .pxs .field textarea{
  font: inherit; font-size: 1rem; color: var(--cream);
  background: rgba(255, 247, 234, .08);
  border: 1.5px solid rgba(255, 247, 234, .25);
  border-radius: 14px;
  padding: .85em 1em;
  outline: none;
  transition: border-color .3s, background .3s;
}
.pxs .field input:focus, .pxs .field textarea:focus{ border-color: var(--gold); background: rgba(255, 247, 234, .12); }
.pxs .pform{ margin-top: 26px; display: grid; gap: 16px; flex: 1; align-content: start; }
.pxs .pform-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.pxs .pform textarea{ resize: vertical; min-height: clamp(150px, 26vh, 260px); }
.pxs .field--msg label{ font-size: .95rem; letter-spacing: .1em; opacity: .9; }
.pxs .pform textarea::placeholder{ color: rgba(255, 247, 234, .38); }
.pxs .pform-send{ justify-self: start; margin-top: 4px; }
.pxs .pform-done{ display: none; text-align: center; justify-items: center; gap: 12px; padding-top: 10px; }
.pxs .pform-done.is-on{ display: grid; }
.pxs .pform-done h3{ font-family: var(--display); font-weight: 700; font-size: 40px; line-height: .9; text-transform: uppercase; color: var(--gold); }
.pxs .panel-tel{ font-weight: 600; white-space: nowrap; opacity: .9; }
@media (max-width: 480px){.pxs .pform-row{ grid-template-columns: 1fr; }}
.pxs .panel-foot{ margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255, 247, 234, .15); font-size: .95rem; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; opacity: .85; }
.pxs .panel-foot a{ text-decoration: underline; text-underline-offset: 3px; }
.pxs .case{
  position: fixed; right: var(--gutter); bottom: clamp(14px, 2vw, 24px);
  z-index: 45;
  width: 300px;
  display: grid; grid-template-columns: 104px 1fr; gap: 12px;
  padding: 10px;
  border-radius: 20px;
  background: var(--slate);
  color: var(--cream);
  box-shadow: 0 20px 50px -18px rgba(10, 25, 32, .55);
  translate: 0 140%;
  transition: translate .8s var(--ease-out), opacity .4s;
}
.pxs .case.is-in{ translate: 0 0; }
.pxs .case.is-hidden{ translate: 0 140%; }
.pxs .case-media{ border-radius: 12px; overflow: hidden; aspect-ratio: 104 / 132; background: var(--slate); }
.pxs .case-media svg{ width: 100%; height: 100%; }
.pxs .case-body{ display: flex; flex-direction: column; gap: 6px; padding: 4px 4px 2px 0; }
.pxs .case-body small{ font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; opacity: .7; font-weight: 600; }
.pxs .case-body strong{ font-family: var(--display); font-weight: 700; font-size: 30px; line-height: .85; text-transform: uppercase; color: var(--gold); }
.pxs .case-body p{ font-size: .88rem; line-height: 1.35; }
.pxs .case-body .btn{ padding: .6em .9em; font-size: .72rem; margin-top: auto; align-self: flex-start; --b: var(--coral); --t: var(--navy-deep); }
.pxs .case-body .btn::after{ background: var(--cream); }
.pxs .case-x{ position: absolute; top: -8px; right: -8px; width: 26px; height: 26px; border-radius: 50%; background: var(--cream); color: var(--navy-deep); display: grid; place-items: center; }
.pxs .case-x svg{ width: 12px; height: 12px; }
.pxs .cursor{
  position: fixed; left: 0; top: 0; z-index: 150;
  pointer-events: none;
  width: 0; height: 0;
}
.pxs .cursor-dot{
  position: absolute; left: -7px; top: -7px;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--coral);
  display: grid; place-items: center;
  transition: width .45s var(--ease-out), height .45s var(--ease-out), left .45s var(--ease-out), top .45s var(--ease-out), background .3s, opacity .3s;
  font-size: .72rem; font-weight: 700; color: var(--navy-deep); letter-spacing: .06em; text-transform: uppercase;
  overflow: hidden;
}
.pxs .cursor-dot span{ opacity: 0; transition: opacity .2s; }
.pxs .cursor.is-label .cursor-dot{ width: 86px; height: 86px; left: -43px; top: -43px; background: var(--gold); }
.pxs .cursor.is-label .cursor-dot span{ opacity: 1; transition-delay: .12s; }
.pxs .cursor.is-hidden .cursor-dot{ opacity: 0; }
@media (hover: none){.pxs .cursor{ display: none; }}
.pxs main{ position: relative; }
.pxs section{ position: relative; }
.pxs .pin{ position: relative; height: 100vh; height: 100svh; overflow: hidden; }
.pxs .card{
  position: absolute; inset: 0;
  will-change: transform;
}
.pxs .card-in{
  position: absolute; inset: 0;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: 0 30px 60px -30px rgba(10, 25, 32, .45);
  transform-style: preserve-3d;
  will-change: transform;
}
.pxs .card-in > svg.ill, .pxs .scene > svg.ill{ position: absolute; inset: 0; width: 100%; height: 100%; }
.pxs .card-cap{
  position: absolute; left: 14px; right: 14px; bottom: 14px;
  display: flex; justify-content: space-between; align-items: flex-end; gap: 8px;
  z-index: 2;
}
.pxs .bubble{ position: absolute; z-index: 6; will-change: transform; }
.pxs .bubble-in{ will-change: transform; }
.pxs .bubble-box{
  display: flex; gap: 4px; align-items: center;
  padding: 9px 11px;
  background: var(--cream);
  border-radius: 16px;
  box-shadow: 0 10px 30px -12px rgba(10, 25, 32, .35);
  position: relative;
  animation: pxs-bob 3.6s ease-in-out infinite;
}
.pxs .bubble-box::after{
  content: ""; position: absolute; bottom: -7px; left: 18px;
  width: 16px; height: 16px; background: inherit;
  clip-path: polygon(0 0, 100% 0, 0 100%);
}
.pxs .bubble--r .bubble-box::after{ left: auto; right: 18px; clip-path: polygon(0 0, 100% 0, 100% 100%); }
.pxs .bubble svg{ width: 26px; height: 26px; }
.pxs .duo{ fill: none; stroke: var(--navy-deep); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pxs .hero-word{
  font-weight: 900;
  position: absolute; left: 0; right: 0; top: clamp(70px, 10vh, 110px);
  text-align: center;
  white-space: nowrap;
  color: var(--navy);
  line-height: .8;
  z-index: 1;
  pointer-events: none;
}
.pxs .hero-word .ch{ transform-origin: 50% 100%; }
.pxs .stage{
  position: absolute;
  left: 63%; top: 58%;
  width: var(--cw);
  aspect-ratio: 3 / 4;
  translate: -50% -50%;
  z-index: 3;
}
.pxs .hero-title{
  position: absolute; z-index: 5;
  left: var(--gutter); bottom: clamp(56px, 7vh, 90px);
}
.pxs .hero-title .hero-h{ font-size: clamp(38px, min(4.4vw, 8.5vh), 92px); }
.pxs .hero-title .hero-h .l2{ color: var(--hi); }
.pxs .hero-title .kicker{ margin-bottom: 14px; }
.pxs .hero-aside{
  position: absolute; z-index: 5;
  left: var(--gutter); top: 40%;
  max-width: min(16.5vw, 260px);
  font-size: .9rem;
  font-size: .95rem;
  display: grid; gap: 14px; justify-items: start;
}
.pxs .hero-aside .rating{ display: flex; align-items: center; gap: 8px; font-size: .8rem; font-weight: 600; }
.pxs .hero-aside .stars{ display: flex; gap: 2px; color: var(--gold); }
.pxs .hero-aside .stars svg{ width: 15px; height: 15px; fill: currentColor; stroke: none; }
.pxs .scroll-hint{
  position: absolute; left: 50%; bottom: 18px; translate: -50% 0; z-index: 5;
  display: grid; justify-items: center; gap: 6px;
  font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 700;
}
.pxs .scroll-hint .mouse{ width: 20px; height: 32px; border-radius: 12px; box-shadow: inset 0 0 0 2px currentColor; position: relative; }
.pxs .scroll-hint .mouse::after{ content: ""; position: absolute; left: 7px; top: 6px; width: 6px; height: 6px; background: var(--hi); animation: pxs-scrollpx 1.6s var(--ease) infinite; }
.pxs .story-txt{ position: absolute; z-index: 4; top: 50%; translate: 0 -50%; }
.pxs .story-txt h2{ font-size: clamp(40px, 5.6vw, 104px); }
.pxs .story-txt--l{ left: var(--gutter); max-width: 36vw; }
.pxs .story-txt--r{ right: var(--gutter); max-width: 30vw; }
.pxs .story-txt--r.story-txt--para{ max-width: 27vw; }
.pxs .story-txt--para p{ font-size: clamp(15px, 1.15vw, 19px); margin-bottom: 1em; }
.pxs .story-txt--para p strong{ color: var(--hi); font-weight: 700; }
.pxs .card--c .scene{ position: absolute; inset: 0; }
.pxs .scene-graph{ opacity: 0; }
.pxs .graph-chips{ position: absolute; left: 14px; top: 14px; right: 14px; z-index: 2; display: flex; justify-content: space-between; }
.pxs .graph-chips .chip{ position: absolute; left: 0; top: 0; }
.pxs .graph-chips .chip--gold{ opacity: 0; }
.pxs .rail .pin{ display: block; }
.pxs .rail-head{
  position: absolute; z-index: 5;
  left: var(--gutter); top: 50%; translate: 0 -50%;
  width: 30vw;
}
.pxs .rail-head h2{ font-size: clamp(42px, 5.2vw, 96px); margin-bottom: 26px; }
.pxs .avatars{ display: flex; align-items: center; }
.pxs .avatars span{
  width: 46px; height: 46px; border-radius: 50%;
  background: #fff center / 78% no-repeat;
  border: 3px solid var(--bg);
  margin-left: -10px;
  transition: border-color .5s, transform .3s var(--ease-out);
}
.pxs .avatars span:first-child{ margin-left: 0; }
.pxs .avatars span:hover{ transform: translateY(-4px) rotate(-6deg); }
.pxs .avatars .more{ background: var(--coral); color: var(--navy-deep); display: grid; place-items: center; font-weight: 700; font-size: .8rem; }
.pxs .rail-head p{ margin-top: 18px; max-width: 32ch; font-size: 1.15rem; }
.pxs .track{
  position: absolute;
  left: 36vw; top: 50%;
  width: var(--pw);
  aspect-ratio: 3 / 4;
  translate: 0 -50%;
  --pw: clamp(230px, min(24vw, 44vh), 380px);
}
.pxs .pcard{ position: absolute; inset: 0; transform-origin: 50% 50%; }
.pxs .pcard .card-in{ background: var(--slate); box-shadow: none; }
.pxs .pcard-top{
  position: absolute; left: 16px; right: 16px; top: 16px; z-index: 2;
  display: flex; justify-content: space-between;
  font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--cream);
}
.pxs .pcard-top span{ background: rgba(26, 55, 68, .35); backdrop-filter: blur(6px); padding: .45em .75em; border-radius: 999px; }
.pxs .pcard-title{
  position: absolute; left: 0; right: 0; top: 13%;
  text-align: center; z-index: 2;
  color: var(--cream);
  font-size: calc(var(--pw) * .15);
  text-shadow: 0 4px 30px rgba(10, 25, 32, .25);
  will-change: transform;
  pointer-events: none;
}
.pxs .pcard[data-ink="dark"] .pcard-title{ color: var(--navy-deep); text-shadow: none; }
.pxs .pcard .card-cap .chips .chip{ font-size: .78rem; }
.pxs .pcard-shade{ position: absolute; inset: 0; background: var(--navy-deep); opacity: 0; z-index: 1; pointer-events: none; }
.pxs .pcard--more .card-in{ background: var(--navy); display: grid; place-items: center; text-align: center; }
.pxs .pcard--more .more-in{ display: grid; gap: 18px; justify-items: center; padding: 20px; color: var(--cream); }
.pxs .pcard--more h3{ font-size: calc(var(--pw) * .16); }
.pxs .aide{ padding: clamp(96px, 14vh, 180px) 0 clamp(72px, 9vh, 124px); }
.pxs .aide-in{ max-width: 1480px; margin: 0 auto; padding: 0 var(--gutter); }
.pxs .aide-grid{
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(40px, 5vw, 104px);
  align-items: start;
}
.pxs .aide-head{ position: sticky; top: clamp(96px, 16vh, 180px); }
.pxs .aide-head .kicker{ color: var(--coral); margin-bottom: 16px; }
.pxs .aide-head h2{ font-size: clamp(40px, 4.3vw, 82px); }
.pxs .aide-heart{
  display: block; width: clamp(130px, 14vw, 230px); margin-top: clamp(34px, 5vh, 60px);
  shape-rendering: crispEdges; transform-origin: 50% 55%;
}
.pxs .aide-heart .hp{ fill: color-mix(in srgb, var(--ink) 14%, transparent); }
.pxs .aide-heart .hp.g{ fill: color-mix(in srgb, var(--coral) 55%, transparent); }
.pxs .aide.is-live .aide-heart{ animation: pxs-beat 1.3s ease-in-out infinite; }
.pxs .aide.is-live .aide-heart .hp{ fill: color-mix(in srgb, var(--ink) 20%, transparent); }
.pxs .aide-list{ position: relative; display: grid; gap: clamp(36px, 5vh, 62px);
  padding: clamp(30px, 4vh, 46px) 0 clamp(30px, 4vh, 46px) clamp(46px, 4.6vw, 74px); }
.pxs .aide-ecg{
  position: absolute; left: 0; top: 0;
  width: clamp(38px, 3.6vw, 56px); height: 100%;
  overflow: visible; pointer-events: none;
  color: color-mix(in srgb, var(--navy) 26%, transparent);
}
.pxs .aide-ecg.is-live{ color: var(--coral); }
.pxs .aide-ecg{ transition: color .5s ease; }
.pxs .ecg-head{ fill: var(--coral); }
.pxs .ecg-halo{ fill: color-mix(in srgb, var(--coral) 22%, transparent); }
.pxs .aide-ecg:not(.is-live) .ecg-head, .pxs .aide-ecg:not(.is-live) .ecg-halo, .pxs .aide-ecg.is-done .ecg-head, .pxs .aide-ecg.is-done .ecg-halo{ opacity: 0; }
.pxs .ecg-head, .pxs .ecg-halo{ transition: opacity .35s ease; }
.pxs .aide-it{
  display: grid; grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(15px, 1.5vw, 24px); align-items: start;
  opacity: .34; filter: saturate(.25);
  transition: opacity .55s var(--ease-out), filter .55s var(--ease-out), transform .55s var(--ease-out);
  transform: translateY(10px);
}
.pxs .aide-it.is-on{ opacity: 1; filter: none; transform: none; }
.pxs .aide-ic svg{ display: block; width: clamp(34px, 2.7vw, 46px); height: clamp(34px, 2.7vw, 46px); }
.pxs .aide-ic{ transition: transform .5s var(--ease-out); transform: scale(.7); transform-origin: 50% 50%; }
.pxs .aide-it.is-on .aide-ic{ transform: scale(1); }
.pxs .aide-tx h3{ font-size: clamp(23px, 2vw, 36px); line-height: .94; }
.pxs .aide-tx p{ margin-top: 12px; font-size: clamp(17px, 1.2vw, 21px); line-height: 1.55; color: color-mix(in srgb, var(--ink) 80%, transparent); max-width: 44ch; }
.pxs .viv{ display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.pxs .viv li{
  display: inline-flex; align-items: center; gap: .55em;
  padding: .42em .9em .42em .5em;
  border-radius: 999px;
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--navy) 22%, transparent);
  font-size: clamp(15px, 1.02vw, 18px);
  white-space: nowrap;
}
.pxs .viv b{
  display: grid; place-items: center;
  width: 1.85em; height: 1.85em; border-radius: 50%;
  background: var(--gold); color: var(--navy-deep);
  font-family: var(--display); font-weight: 700; font-size: 1.05em; line-height: 1;
  padding-top: .12em;
}
.pxs .aide-foot{
  margin-top: clamp(64px, 9vh, 120px);
  padding-top: clamp(28px, 3.4vh, 46px);
  border-top: 1px solid color-mix(in srgb, var(--ink) 16%, transparent);
  font-size: clamp(26px, 2.6vw, 48px);
}
@media (max-width: 1120px){.pxs .aide-grid{ grid-template-columns: 1fr; gap: clamp(28px, 4vw, 44px); }.pxs .aide-head{ position: static; }.pxs .aide-heart{ display: none; }.pxs .aide-list{ padding-left: clamp(38px, 9vw, 56px); }}
@media (max-width: 560px){.pxs .aide-tx h3{ font-size: clamp(21px, 6vw, 27px); }.pxs .viv li{ font-size: 15px; }}
.pxs .xp .pin{
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  align-items: center;
  gap: clamp(32px, 6vw, 110px);
  padding: 88px var(--gutter) 72px;
}
.pxs .xp-head h2{ font-size: clamp(42px, 4.4vw, 84px); margin: 16px 0 22px; }
.pxs .xp-head p{ max-width: 38ch; font-size: 1.12rem; }
.pxs .xp-count{ margin-top: 28px; font-family: var(--display); font-weight: 700; font-size: 64px; line-height: .8; display: flex; align-items: flex-end; gap: 6px; }
.pxs .xp-count small{ font-size: 24px; opacity: .4; }
.pxs .xp-count .n{ display: inline-block; overflow: hidden; height: .8em; }
.pxs .acc{ border-top: 1.5px solid color-mix(in srgb, var(--ink) 25%, transparent); }
.pxs .acc-item{ border-bottom: 1.5px solid color-mix(in srgb, var(--ink) 25%, transparent); }
.pxs .acc-btn{
  width: 100%; text-align: left;
  display: flex; align-items: center; gap: 14px;
  padding: clamp(10px, 1.4vh, 16px) 0;
  font-family: var(--display); font-weight: 700; text-transform: uppercase;
  font-size: clamp(22px, 2vw, 36px); line-height: .9;
  color: color-mix(in srgb, var(--ink) 55%, transparent);
  transition: color .4s;
}
.pxs .acc-btn .ic{ width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--ink) 10%, transparent); flex: none; transition: background .4s, color .4s, transform .5s var(--ease-out); }
.pxs .acc-btn .ic svg{ width: 22px; height: 22px; }
.pxs .acc-btn .ar{ margin-left: auto; width: 18px; height: 18px; transition: transform .5s var(--ease); }
.pxs .acc-item.is-open .acc-btn{ color: var(--hi); }
.pxs .acc-item.is-open .acc-btn .ic{ background: var(--gold); color: var(--navy-deep); transform: rotate(-8deg); }
.pxs .acc-item.is-open .acc-btn .ar{ transform: rotate(90deg); }
.pxs .acc-body{ height: 0; overflow: hidden; }
.pxs .acc-body-in{ padding: 0 0 16px 52px; display: grid; gap: 12px; font-size: 1.1rem; }
.pxs .why .pin{ display: grid; place-items: center; }
.pxs .why-title{ text-align: center; color: var(--hi); font-size: clamp(70px, 15vw, 280px); line-height: .8; position: relative; z-index: 1; }
.pxs .why-cards{ position: absolute; left: 50%; top: 52%; z-index: 2; width: 0; height: 0; }
.pxs .wcard{
  position: absolute;
  width: clamp(200px, 17vw, 270px);
  aspect-ratio: 3 / 4;
  left: 0; top: 0;
  will-change: transform;
}
.pxs .wcard .card-in{
  background: var(--navy);
  color: var(--cream);
  display: grid; grid-template-rows: 1fr auto auto; justify-items: center; text-align: center;
  padding: clamp(16px, 1.4vw, 24px);
  gap: 10px;
}
.pxs .wcard .pic{ width: 64%; align-self: center; }
.pxs .wcard:nth-child(2) .card-in{ background: var(--coral); color: var(--navy); }
.pxs .wcard:nth-child(3) .card-in{ background: var(--gold); color: var(--navy); }
.pxs .wcard:nth-child(4) .card-in{ background: var(--sky); color: var(--navy); }
.pxs .wcard:nth-child(5) .card-in{ background: var(--cream); color: var(--navy); }
.pxs .wcard h3{ font-size: clamp(24px, 2vw, 34px); }
.pxs .wcard p{ font-size: 1rem; line-height: 1.4; }
.pxs .stats{ padding: clamp(60px, 10vh, 120px) var(--gutter) clamp(40px, 8vh, 90px); }
.pxs .stats-grid{ display: grid; grid-template-columns: repeat(4, 1fr); border-top: 2px solid var(--ink); }
.pxs .stat{ padding: 22px 18px 10px 0; display: grid; gap: 10px; align-content: start; border-right: 2px solid color-mix(in srgb, var(--ink) 25%, transparent); padding-left: 18px; }
.pxs .stat:first-child{ padding-left: 0; }
.pxs .stat:last-child{ border-right: 0; }
.pxs .stat b{ font-family: var(--display); font-weight: 700; font-size: clamp(64px, 8vw, 150px); line-height: .8; color: var(--ink); }
.pxs .stat span{ font-size: 1.1rem; font-weight: 500; max-width: 24ch; }
.pxs .stats-note{ margin-top: 30px; display: flex; align-items: center; gap: 12px; font-size: 1.15rem; font-weight: 600; }
.pxs .bands{ padding: 30px 0 60px; overflow: hidden; }
.pxs .band{ white-space: nowrap; padding: 14px 0; font-size: clamp(34px, 4.4vw, 76px); display: flex; }
.pxs .band-in{ display: flex; flex: none; will-change: transform; }
.pxs .band-in span{ display: inline-flex; align-items: center; gap: .35em; padding-right: .35em; }
.pxs .band-in i{ width: .32em; height: .32em; background: var(--gold); display: inline-block; flex: none; }
.pxs .band--a{ background: var(--navy); color: var(--cream); rotate: -2deg; margin: 0 -2vw; }
.pxs .band--b{ background: var(--cream); color: var(--navy); rotate: 1.5deg; margin: -8px -2vw 0; }
.pxs .band--b .band-in i{ background: var(--coral); }
.pxs .faq{ padding: clamp(80px, 14vh, 160px) var(--gutter); display: grid; grid-template-columns: 1fr 1.25fr; gap: clamp(30px, 6vw, 110px); align-items: start; }
.pxs .faq-head{ position: sticky; top: 110px; }
.pxs .faq-head h2{ font-size: clamp(50px, 6.4vw, 118px); }
.pxs .faq-list{ border-top: 2px solid var(--ink); }
.pxs .faq-item{ border-bottom: 2px solid color-mix(in srgb, var(--ink) 20%, transparent); }
.pxs .faq-q{ width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; text-align: left; padding: 26px 0; font-weight: 600; font-size: clamp(19px, 1.62vw, 28px); line-height: 1.28; }
.pxs .faq-q .pm{ width: 44px; height: 44px; border-radius: 50%; flex: none; background: var(--coral); color: var(--navy-deep); display: grid; place-items: center; transition: transform .5s var(--ease), background .3s; }
.pxs .faq-q .pm svg{ width: 18px; height: 18px; }
.pxs .faq-q:hover .pm{ background: var(--gold); }
.pxs .faq-item.is-open .pm{ transform: rotate(135deg); background: var(--navy); color: var(--cream); }
.pxs .faq-a{ height: 0; overflow: hidden; }
.pxs .faq-a p{ padding: 0 60px 24px 0; max-width: 60ch; }
.pxs .contact{ padding: clamp(60px, 12vh, 140px) var(--gutter) 0; }
.pxs .contact-stage{ position: relative; display: flex; justify-content: center; align-items: center; min-height: 70vh; }
.pxs .c-photo{
  width: clamp(240px, 26vw, 400px); aspect-ratio: 4 / 5;
  border-radius: var(--r); overflow: hidden;
  rotate: -5deg; translate: -18% 0;
  background: var(--navy);
  box-shadow: 0 30px 60px -30px rgba(10, 25, 32, .5);
  position: relative;
}
.pxs .c-photo img{ width: 100%; height: 100%; object-fit: cover; }
.pxs .c-photo .chip{ position: absolute; left: 14px; bottom: 14px; }
.pxs .c-card{
  position: absolute; left: 50%; top: 50%;
  width: clamp(280px, 30vw, 460px);
  translate: -8% -38%;
  rotate: 4deg;
  background: var(--coral);
  color: var(--navy-deep);
  border-radius: var(--r);
  padding: clamp(24px, 2.4vw, 40px);
  display: grid; gap: 16px; justify-items: center; text-align: center;
  box-shadow: 0 30px 60px -30px rgba(10, 25, 32, .5);
}
.pxs .c-card small{ font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; }
.pxs .c-card h2{ font-size: clamp(44px, 4.6vw, 84px); color: var(--cream); }
.pxs .c-card p{ font-size: 1.15rem; max-width: 34ch; }
.pxs .c-card .row{ display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.pxs .c-card .btn--ghost{ color: var(--navy-deep); }
.pxs .footer{ padding: 0 var(--gutter) 18px; position: relative; }
.pxs .big-word{
  font-weight: 900;
  display: block; white-space: nowrap; text-align: center;
  color: var(--ink);
  line-height: .78;
  padding-top: .06em;
  overflow: hidden;
  user-select: none;
}
.pxs .big-word .ch{ transition: transform .5s var(--ease-out), color .3s; transform-origin: 50% 100%; }
.pxs .big-word .ch:hover{ transform: translateY(-6%) scaleY(1.06); color: var(--coral); }
.pxs .foot-grid{
  display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 26px;
  padding: 34px 0 26px;
  border-top: 2px solid var(--ink);
  margin-top: 20px;
  font-size: 1rem;
}
.pxs .foot-grid h3{ font-size: .85rem; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 10px; font-weight: 700; }
.pxs .foot-grid li{ margin-bottom: 4px; }
.pxs .foot-grid a:hover{ text-decoration: underline; text-underline-offset: 3px; }
.pxs .badges{ display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.pxs .foot-bar{ display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; font-size: .85rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding-top: 12px; }
.pxs .foot-bar nav{ display: flex; gap: 18px; }
.pxs .ill *{ transform-box: fill-box; }
.pxs .a-bob{ animation: pxs-bob 3.4s ease-in-out infinite; }
.pxs .a-bob2{ animation: pxs-bob 4.2s ease-in-out -1.4s infinite; }
.pxs .a-spin{ animation: pxs-spin 9s linear infinite; transform-origin: center; }
.pxs .a-spin-f{ animation: pxs-spin 1.1s linear infinite; transform-origin: center; }
.pxs .a-spin-r{ animation: pxs-spin 14s linear infinite reverse; transform-origin: center; }
.pxs .a-beat{ animation: pxs-beat 1.3s ease-in-out infinite; transform-origin: center; }
.pxs .a-blink{ animation: pxs-blink 1s steps(1) infinite; }
.pxs .a-dash{ animation: pxs-dash 1.4s linear infinite; }
.pxs .a-flow{ animation: pxs-flow 1.6s linear infinite; }
.pxs .a-ring{ animation: pxs-ring 2.8s ease-out infinite; transform-origin: center; }
.pxs .a-rise{ animation: pxs-rise 5s linear infinite; }
.pxs .a-sway{ animation: pxs-sway 5s ease-in-out infinite; transform-origin: 50% 0; }
.pxs .a-flag{ animation: pxs-flag 1.4s ease-in-out infinite; transform-origin: 0 50%; }
.pxs .a-twinkle{ animation: pxs-twinkle 2.2s ease-in-out infinite; transform-origin: center; }
.pxs .a-swim{ animation: pxs-swim 11s linear infinite; }
.pxs .a-build{ animation: pxs-build 7s var(--ease-out) infinite; transform-origin: 0 50%; }
.pxs .a-grow{ animation: pxs-growY 4.8s var(--ease) infinite; transform-origin: 50% 100%; }
.pxs .a-ecg{ stroke-dasharray: var(--len, 420); animation: pxs-ecgDraw 2.6s linear infinite; }
.pxs .a-cable{ animation: pxs-cable 6s var(--ease) infinite; transform-origin: 50% 0; }
.pxs .a-toast{ animation: pxs-toastIn 5s var(--ease-out) infinite; }
.pxs .s1{ animation-delay: -6.7s; }
.pxs .s2{ animation-delay: -6.4s; }
.pxs .s3{ animation-delay: -6.1s; }
.pxs .s4{ animation-delay: -5.8s; }
.pxs .s5{ animation-delay: -5.5s; }
.pxs .a-blip{ animation: pxs-blip 4s ease-out infinite; transform-origin: center; opacity: 0; }
.pxs .a-hoist{ animation: pxs-hoist 6s var(--ease) infinite; }
.pxs .a-paint{ animation: pxs-paint 5s var(--ease) infinite; transform-origin: 50% 0; }
.pxs .a-roller{ animation: pxs-roller 5s var(--ease) infinite; }
.pxs .a-arrow{ animation: pxs-arrow 4.2s var(--ease-out) infinite; }
.pxs .a-hit{ animation: pxs-hit 4.2s ease-out infinite; transform-origin: center; opacity: 0; }
.pxs .a-cursor{ animation: pxs-cursorMove 7s var(--ease) infinite; }
.pxs .a-click{ animation: pxs-clickRing 7s ease-out infinite; transform-origin: center; opacity: 0; }
.pxs .a-type{ animation: pxs-typeCover 7s steps(22) infinite; transform-origin: 100% 50%; }
.pxs .a-caret{ animation: pxs-caret 7s steps(22) infinite; }
.pxs .a-climb{ animation: pxs-climb 7s var(--ease) infinite; }
.pxs .a-shift{ animation: pxs-shift 7s var(--ease) infinite; }
.pxs .a-fadeseq1{ animation: pxs-seq1 7s ease infinite; }
.pxs .a-fadeseq2{ animation: pxs-seq2 7s ease infinite; }
.pxs .a-fly{ animation: pxs-fly 5s var(--ease) infinite; }
.pxs .a-badge{ animation: pxs-badge 5s var(--ease-out) infinite; transform-origin: center; }
.pxs .a-pop{ animation: pxs-popIn 6s var(--ease-out) infinite; transform-origin: center; }
.pxs .a-draw{ stroke-dasharray: var(--len, 300); stroke-dashoffset: var(--len, 300); animation: pxs-drawLoop 5s var(--ease) infinite; }
.pxs .a-bounce{ animation: pxs-bounce 5s var(--ease-out) infinite; transform-origin: 50% 100%; }
.pxs .d1{ animation-delay: -.6s; }
.pxs .d2{ animation-delay: -1.2s; }
.pxs .d3{ animation-delay: -1.8s; }
.pxs .d4{ animation-delay: -2.4s; }
.pxs .d5{ animation-delay: -3s; }
@keyframes pxs-bob{ 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes pxs-spin{ to { transform: rotate(360deg); } }
@keyframes pxs-beat{ 0%, 100% { transform: scale(1); } 12% { transform: scale(1.12); } 24% { transform: scale(.98); } 36% { transform: scale(1.07); } 60% { transform: scale(1); } }
@keyframes pxs-blink{ 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }
@keyframes pxs-dash{ to { stroke-dashoffset: -36; } }
@keyframes pxs-flow{ to { stroke-dashoffset: -60; } }
@keyframes pxs-ring{ 0% { transform: scale(.4); opacity: .9; } 100% { transform: scale(1.9); opacity: 0; } }
@keyframes pxs-rise{ 0% { transform: translateY(0); opacity: 0; } 12% { opacity: 1; } 85% { opacity: .9; } 100% { transform: translateY(-340px); opacity: 0; } }
@keyframes pxs-sway{ 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
@keyframes pxs-flag{ 0%, 100% { transform: skewY(0) scaleX(1); } 50% { transform: skewY(9deg) scaleX(.9); } }
@keyframes pxs-twinkle{ 0%, 100% { transform: scale(.7) rotate(0); opacity: .6; } 50% { transform: scale(1.15) rotate(45deg); opacity: 1; } }
@keyframes pxs-swim{ from { transform: translateX(-80px); } to { transform: translateX(460px); } }
@keyframes pxs-build{ 0%, 4% { transform: scaleX(0); opacity: 0; } 12%, 86% { transform: scaleX(1); opacity: 1; } 94%, 100% { transform: scaleX(1); opacity: 0; } }
@keyframes pxs-growY{ 0%, 8% { transform: scaleY(.12); } 45%, 88% { transform: scaleY(1); } 100% { transform: scaleY(.12); } }
@keyframes pxs-ecgDraw{ 0% { stroke-dashoffset: var(--len, 420); } 70% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: calc(var(--len, 420) * -1); } }
@keyframes pxs-cable{ 0%, 100% { transform: scaleY(1); } 40%, 62% { transform: scaleY(2.17); } }
@keyframes pxs-toastIn{ 0%, 58% { opacity: 0; transform: translateY(14px); } 64%, 92% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } }
@keyframes pxs-ecg{ to { stroke-dashoffset: -28; } }
@keyframes pxs-blip{ 0%, 100% { opacity: 0; transform: scale(.3); } 6% { opacity: 1; transform: scale(1.5); } 14%, 60% { opacity: 1; transform: scale(1); } 80% { opacity: 0; transform: scale(1); } }
@keyframes pxs-hoist{ 0%, 100% { transform: translateY(0); } 40%, 62% { transform: translateY(96px); } }
@keyframes pxs-paint{ 0%, 6% { transform: scaleY(0); } 58%, 92% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }
@keyframes pxs-roller{ 0%, 6% { transform: translateY(0); } 58% { transform: translateY(232px); } 70%, 100% { transform: translateY(0); } }
@keyframes pxs-arrow{ 0% { transform: translate(-240px, -170px); opacity: 0; } 6% { opacity: 1; } 26% { transform: translate(0, 0); } 29% { transform: translate(-5px, -4px); } 32%, 84% { transform: translate(0, 0); opacity: 1; } 96%, 100% { transform: translate(0, 0); opacity: 0; } }
@keyframes pxs-hit{ 0%, 25% { opacity: 0; transform: scale(.3); } 27% { opacity: 1; } 50% { opacity: 0; transform: scale(1.6); } 100% { opacity: 0; } }
@keyframes pxs-cursorMove{ 0% { transform: translate(250px, 420px); } 22% { transform: translate(92px, 196px); } 26% { transform: translate(92px, 196px) scale(.85); } 30% { transform: translate(92px, 196px) scale(1); } 55% { transform: translate(262px, 170px); } 80% { transform: translate(180px, 262px); } 100% { transform: translate(250px, 420px); } }
@keyframes pxs-clickRing{ 0%, 24% { opacity: 0; transform: scale(.2); } 26% { opacity: 1; } 40%, 100% { opacity: 0; transform: scale(1.6); } }
@keyframes pxs-typeCover{ 0%, 6% { transform: scaleX(1); } 38%, 92% { transform: scaleX(0); } 100% { transform: scaleX(1); } }
@keyframes pxs-caret{ 0%, 6% { transform: translateX(0); } 38%, 92% { transform: translateX(166px); } 100% { transform: translateX(0); } }
@keyframes pxs-climb{ 0%, 38% { transform: translateY(180px); } 55%, 92% { transform: translateY(0); } 100% { transform: translateY(180px); } }
@keyframes pxs-shift{ 0%, 38% { transform: translateY(0); } 55%, 92% { transform: translateY(60px); } 100% { transform: translateY(0); } }
@keyframes pxs-seq1{ 0%, 10% { opacity: 0; } 14%, 36% { opacity: 1; } 40%, 100% { opacity: 0; } }
@keyframes pxs-seq2{ 0%, 38% { opacity: 0; transform: translateY(8px); } 44%, 92% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } }
@keyframes pxs-fly{ 0%, 20% { opacity: 0; transform: translate(0, 0) scale(1); } 24% { opacity: 1; } 55% { opacity: 1; transform: translate(150px, -170px) scale(.4); } 60%, 100% { opacity: 0; transform: translate(150px, -170px) scale(.4); } }
@keyframes pxs-badge{ 0%, 54% { transform: scale(1); } 60% { transform: scale(1.5); } 70%, 100% { transform: scale(1); } }
@keyframes pxs-popIn{ 0%, 5% { transform: scale(0); opacity: 0; } 12%, 88% { transform: scale(1); opacity: 1; } 96%, 100% { transform: scale(0); opacity: 0; } }
@keyframes pxs-drawLoop{ 0%, 5% { stroke-dashoffset: var(--len, 300); } 50%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes pxs-bounce{ 0%, 55% { transform: scaleY(1) translateY(0); } 60% { transform: scaleY(.85) translateY(0); } 68% { transform: scaleY(1.05) translateY(-10px); } 76%, 100% { transform: scaleY(1) translateY(0); } }
@keyframes pxs-scrollpx{ 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(12px); opacity: 0; } 100% { transform: translateY(0); opacity: 0; } }
.pxs .pic *{ transform-box: fill-box; }
.pxs .pic .p-spin{ animation: pxs-spin 3s linear infinite; transform-origin: 50% 100%; }
.pxs .pic .p-twk{ animation: pxs-twinkle 1.8s ease-in-out infinite; transform-origin: center; }
.pxs .pic .p-draw{ stroke-dasharray: 160; animation: pxs-drawLoop 3.6s var(--ease) infinite; --len: 160; }
.pxs .pic .p-hop{ animation: pxs-hop 2.4s var(--ease) infinite; }
.pxs .pic .p-flag{ animation: pxs-flag 1.2s ease-in-out infinite; transform-origin: 0 50%; }
.pxs .pic .p-bob{ animation: pxs-bob 2.6s ease-in-out infinite; }
.pxs .wcard:hover .pic *{ animation-duration: .9s; }
@keyframes pxs-hop{
  0% { transform: translate(0, 0); opacity: 1; }
  10% { transform: translate(12px, -30px); } 20% { transform: translate(24px, -20px); }
  32% { transform: translate(36px, -50px); } 44% { transform: translate(48px, -40px); }
  56% { transform: translate(60px, -70px); } 68%, 86% { transform: translate(72px, -60px); opacity: 1; }
  94% { transform: translate(72px, -60px); opacity: 0; } 95% { transform: translate(0, 0); opacity: 0; } 100% { transform: translate(0, 0); opacity: 1; }
}
@media (max-width: 1100px){.pxs .hero-aside{ display: none; }.pxs .menu-side{ max-width: 300px; padding: 30px 24px; }.pxs .menu{ column-gap: 6vw; }.pxs .menu-heart{ width: min(40vw, 50vh); }.pxs .foot-grid{ grid-template-columns: 1fr 1fr; }}
@media (max-width: 800px){.pxs{ --cw: min(58vw, 36vh); }.pxs .hero-word{ top: 84px; }.pxs .stage{ top: 50%; left: 50%; }.pxs .hero-title{ bottom: 64px; right: var(--gutter); }.pxs .hero-title .hero-h{ font-size: clamp(38px, 11vw, 64px); }.pxs .hero-aside{ display: none; }.pxs .scroll-hint{ display: none; }.pxs .bubble svg{ width: 20px; height: 20px; }.pxs .bubble-box{ padding: 7px 8px; }.pxs .story-txt{ translate: none; max-width: none !important; left: var(--gutter); right: var(--gutter); }.pxs .story-txt--l{ top: 84px; }.pxs .story-txt--r{ top: auto; bottom: 50px; }.pxs .story-txt h2{ font-size: clamp(36px, 10.5vw, 58px); }.pxs .story-txt--para p{ font-size: 14px; margin-bottom: .6em; }.pxs .story-txt--para .btn, .pxs .m-hide{ display: none; }.pxs .rail-head{ top: 84px; translate: none; width: auto; right: var(--gutter); }.pxs .rail-head h2{ font-size: clamp(36px, 10vw, 56px); margin-bottom: 14px; }.pxs .rail-head p{ display: none; }.pxs .avatars span{ width: 38px; height: 38px; }.pxs .track{ left: var(--gutter); top: auto; bottom: 7vh; translate: none; --pw: min(64vw, 44vh); }.pxs .xp .pin{ grid-template-columns: 1fr; gap: 18px; padding-top: 86px; align-content: start; }.pxs .xp .pin{ height: auto; overflow: visible; }.pxs .xp-head h2{ font-size: clamp(38px, 10vw, 56px); margin: 10px 0 12px; }.pxs .xp-count{ display: none; }.pxs .acc-body-in{ padding-left: 0; }.pxs .why .pin{ height: auto; overflow: visible; display: block; padding: 90px var(--gutter) 40px; }.pxs .why-title{ font-size: clamp(64px, 19vw, 120px); margin-bottom: 30px; }.pxs .why-cards{ position: static; width: auto; height: auto; display: grid; gap: 14px; }.pxs .wcard{ position: relative; translate: none; width: 100%; aspect-ratio: auto; }.pxs .wcard .card-in{ position: relative; grid-template-columns: 76px 1fr; grid-template-rows: auto auto; text-align: left; justify-items: start; column-gap: 16px; }.pxs .wcard .pic{ width: 76px; grid-row: span 2; }.pxs .wcard:nth-child(odd){ rotate: -1.5deg; }.pxs .wcard:nth-child(even){ rotate: 1.5deg; }.pxs .stats-grid{ grid-template-columns: 1fr 1fr; }.pxs .stat{ border-right: 0; padding-left: 0; border-bottom: 2px solid color-mix(in srgb, var(--ink) 25%, transparent); }.pxs .stat b{ font-size: 18vw; }.pxs .faq{ grid-template-columns: 1fr; }.pxs .faq-head{ position: static; }.pxs .faq-a p{ padding-right: 0; }.pxs .contact-stage{ min-height: auto; flex-direction: column; gap: 0; padding-bottom: 20px; }.pxs .c-photo{ translate: -8% 0; width: 62vw; }.pxs .c-card{ position: relative; left: auto; top: auto; translate: 0 -18%; width: calc(100% - 16px); rotate: 3deg; }.pxs .menu{ grid-template-columns: 1fr; align-content: start; padding-top: 110px; }.pxs .menu-side{ display: none; }.pxs .menu-heart{ position: absolute; right: -14vw; bottom: 10vh; width: 60vw; opacity: .9; z-index: -1; }.pxs .menu-link{ font-size: clamp(44px, 12vw, 70px); }.pxs .menu-foot{ flex-direction: column; align-items: flex-start; gap: 10px; }.pxs .case{ width: auto; left: var(--gutter); right: var(--gutter); grid-template-columns: 70px 1fr; }.pxs .case-body p{ display: none; }.pxs .case-body strong{ font-size: 24px; }.pxs .progress{ display: none; }.pxs .sec-label{ display: none; }.pxs .foot-grid{ grid-template-columns: 1fr; }}
.pxs .menu-open .rbtn--panel{ background: var(--coral); color: var(--cream); }
.pxs .menu-open .rbtn--menu::before, .pxs .menu-open .rbtn--panel::before{ border-color: var(--gold); }
@media (max-width: 800px){.pxs .case{ grid-template-columns: 52px 1fr; padding: 8px; border-radius: 16px; align-items: center; }.pxs .case-media{ aspect-ratio: 1; border-radius: 10px; }.pxs .case-body{ flex-direction: row; align-items: center; justify-content: space-between; padding: 0 6px 0 0; }.pxs .case-body small{ display: none; }.pxs .case-body .btn{ margin-top: 0; align-self: center; }}
.pxs .rbtn--menu{ background: transparent; isolation: isolate; }
.pxs .rbtn--menu::before{
  inset: 0; border: 0; border-radius: 0; opacity: 1; scale: 1;
  background: var(--btn);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 157 157'%3E%3Cg transform='matrix%281,0,0,1,-1421.616667,-921.616667%29'%3E%3Cg transform='matrix%280,-8.333333,-8.333333,0,1500,921.616667%29'%3E%3Cpath d='M-9.406,-9.406C-15.999,-9.406 -18.812,-6.832 -18.812,0C-18.812,6.832 -16.115,9.406 -9.406,9.406C-2.697,9.406 0,6.479 0,0C0,-6.479 -2.813,-9.406 -9.406,-9.406'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 157 157'%3E%3Cg transform='matrix%281,0,0,1,-1421.616667,-921.616667%29'%3E%3Cg transform='matrix%280,-8.333333,-8.333333,0,1500,921.616667%29'%3E%3Cpath d='M-9.406,-9.406C-15.999,-9.406 -18.812,-6.832 -18.812,0C-18.812,6.832 -16.115,9.406 -9.406,9.406C-2.697,9.406 0,6.479 0,0C0,-6.479 -2.813,-9.406 -9.406,-9.406'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") center / 100% 100% no-repeat;
  z-index: -1;
  transition: background .5s, scale .6s var(--ease-out), rotate .8s var(--ease-out);
}
.pxs .rbtn--menu:hover::before{ opacity: 1; scale: 1.1; rotate: 90deg; }
.pxs .menu-open .rbtn--menu{ background: transparent; }
.pxs .menu-open .rbtn--menu::before{ background: var(--gold); rotate: 45deg; }
.pxs .card-in > img, .pxs .scene > img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pxs .scene-photo{ background: #fff; }
.pxs .scene > img.mascot{ inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: 50% 50%; padding: 2%; }
.pxs .hero-title .kicker{ margin-bottom: 10px; }
.pxs .hero-title .hero-h .l2{ color: var(--hi); }
.pxs .pcard .card-in > img{ transition: transform 1.2s var(--ease-out); }
.pxs .pcard:hover .card-in > img{ transform: scale(1.06); }
.pxs .pcard-grad{ position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(26,55,68,.55) 0%, rgba(26,55,68,0) 38%, rgba(26,55,68,0) 62%, rgba(26,55,68,.6) 100%); }
.pxs .pcard .card-cap{ z-index: 3; }
.pxs .pcard-top{ z-index: 3; }
.pxs .pcard-title{ z-index: 3; }
.pxs .case-media img{ width: 100%; height: 100%; object-fit: cover; object-position: 46% 50%; }
@media (max-width: 800px){.pxs .stage{ left: 50%; }}
.pxs .immersion .im-pin{
  /* La premiere image de la sequence sert d'image d'attente : elle est de
     toute facon telechargee, donc elle ne coute rien de plus, et le canevas
     vient se poser dessus sans transition visible. */
  background: #0E222A url("/wp-content/uploads/px/seq/d/000.webp") center / cover no-repeat;
  color: var(--cream);
}
.pxs .im-canvas{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pxs .im-white{ position: absolute; inset: 0; background: #fff; opacity: 0; pointer-events: none; z-index: 1; }
.pxs .im-shade{
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(70% 60% at 14% 26%, rgba(10, 25, 32, .7), transparent 72%);
}
.pxs .im-beat{ position: absolute; z-index: 2; max-width: min(46vw, 760px); }
.pxs .im-beat h2{ font-size: clamp(44px, 5.6vw, 108px); margin-bottom: 0; }
.pxs .im-beat .hi{ color: var(--gold); }
.pxs .im-beat p{ font-size: clamp(15px, 1.15vw, 19px); max-width: 38ch; text-shadow: 0 2px 14px rgba(10, 25, 32, .6); }
.pxs .im-b1{ left: var(--gutter); top: 16vh; }
.pxs .im-b2{ left: var(--gutter); top: 16vh; }
.pxs .im-rush{ position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.pxs .im-rush span{
  position: absolute; left: 50%; top: 50%;
  translate: -50% -50%;
  font-size: clamp(56px, 9vw, 170px);
  color: var(--cream);
  white-space: nowrap;
  opacity: 0;
  text-shadow: 0 10px 40px rgba(0, 0, 0, .35);
  will-change: transform, opacity;
}
.pxs .im-rush span:nth-child(even){ color: var(--gold); }
.pxs .im-end{
  position: absolute; inset: 0; z-index: 3;
  display: grid; place-content: center; justify-items: center; text-align: center; gap: 18px;
  padding: 0 var(--gutter);
  color: var(--navy);
  pointer-events: none;
}
.pxs .im-end > *{ opacity: 0; }
.pxs .im-end.is-on{ pointer-events: auto; }
.pxs .im-end h2{ font-size: clamp(42px, 5.6vw, 104px); max-width: 16ch; }
.pxs .im-end .hi{ color: var(--coral); }
.pxs .im-end h2{ color: var(--navy); }
.pxs .im-end .rasp{ color: var(--navy); }
.pxs .im-end .rasp .wi, .pxs .im-end .rasp:not(:has(.wi)){
  background-image: linear-gradient(transparent 62%, var(--gold) 0);
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
  padding: 0 .05em;
}
.pxs .im-end h2{ font-weight: 700; }
.pxs .im-end p{ font-size: clamp(21px, 1.8vw, 30px); font-weight: 600; }
.pxs .im-end .btn{ --b: var(--navy); --t: var(--cream); }
.pxs .im-heart{ width: clamp(64px, 7vw, 110px); shape-rendering: crispEdges; overflow: visible; }
.pxs .im-heart .hp{ fill: var(--coral); }
.pxs .im-heart .hp.g{ fill: var(--gold); }
@media (max-width: 800px){.pxs .im-shade{
    background:
      linear-gradient(180deg, rgba(10, 25, 32, .7) 0%, rgba(10, 25, 32, 0) 38%),
      linear-gradient(0deg, rgba(10, 25, 32, .75) 0%, rgba(10, 25, 32, 0) 42%);
  }.pxs .im-beat{ max-width: none; left: var(--gutter); right: var(--gutter); }.pxs .im-b1{ top: 88px; }.pxs .im-b2{ top: 88px; }.pxs .im-beat h2{ font-size: clamp(36px, 10.4vw, 58px); margin-bottom: 0; }.pxs .im-beat p{ font-size: 15px; }}
.pxs .an-pin{ color: var(--cream); }
.pxs .an-map{
  position: absolute; right: var(--gutter); top: 50%;
  width: min(50vw, 82vh); aspect-ratio: 1;
  translate: 0 -50%;
}
.pxs .an-canvas, .pxs .an-svg{ position: absolute; inset: 0; width: 100%; height: 100%; }
.pxs .an-svg{ overflow: visible; }
.pxs .an-svg .arc{ fill: none; stroke: var(--gold); stroke-width: .05; stroke-linecap: round; opacity: 0; }
.pxs .an-svg .arc-halo{ display: none; }
.pxs .an-svg .city circle{ fill: var(--coral); }
.pxs .an-svg .city .ring{ fill: none; stroke: var(--coral); stroke-width: .03; animation: pxs-ring 2.4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.pxs .an-svg text{
  font-family: var(--sans); font-weight: 700; font-size: .3px; fill: var(--cream);
  paint-order: stroke; stroke: var(--navy); stroke-width: .08px; stroke-linejoin: round;
}
.pxs .an-svg .home text{ fill: var(--gold); font-family: var(--display); font-size: .46px; text-transform: uppercase; letter-spacing: .01px; }
.pxs .an-svg .home .ring{ fill: none; stroke: var(--gold); stroke-width: .04; animation: pxs-ring 2s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.pxs .an-photo{ position: absolute; inset: 0; z-index: 2; will-change: clip-path; }
.pxs .an-lyon{ position: absolute; inset: 0; z-index: 3; will-change: clip-path; clip-path: inset(100% 0 0 0); }
.pxs .an-lyon-img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 45% 50%; will-change: transform; }
.pxs .an-svg .home2 text{ fill: var(--gold); font-family: var(--display); font-size: .46px; text-transform: uppercase; }
.pxs .an-svg .home2 .ring{ fill: none; stroke: var(--gold); stroke-width: .04; animation: pxs-ring 2s ease-out infinite; transform-box: fill-box; transform-origin: center; }
.pxs .an-photo img{ width: 100%; height: 100%; object-fit: cover; object-position: 58% 55%; }
.pxs .an-photo-scrim{ position: absolute; inset: 0; background: linear-gradient(90deg, rgba(14, 34, 42, .82) 0%, rgba(14, 34, 42, .45) 42%, transparent 72%); }
.pxs .an-a1, .pxs .an-a2, .pxs .an-a3{ position: absolute; z-index: 4; left: var(--gutter); top: 50%; translate: 0 -50%; max-width: min(40vw, 620px); }
.pxs .an-kick{ display: block; font-size: .95rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 16px; opacity: .85; }
.pxs .an-a1 h2, .pxs .an-a2 h2, .pxs .an-a3 h2{ font-size: clamp(44px, 5.6vw, 108px); margin-bottom: 22px; }
.pxs .an-a1 .hi, .pxs .an-a2 .hi, .pxs .an-a3 .hi{ color: var(--gold); }
.pxs .an-a1 p, .pxs .an-a2 p, .pxs .an-a3 p{ font-size: clamp(19px, 1.55vw, 26px); line-height: 1.5; font-weight: 500; max-width: 38ch; margin-bottom: 1em; text-shadow: 0 2px 16px rgba(10, 25, 32, .55); }
.pxs .an-addr{
  display: inline-flex !important; align-items: center; gap: 14px;
  margin-top: 10px; padding: 12px 22px 12px 12px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .14);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28);
  color: var(--cream);
  font-size: 1.05rem !important; font-weight: 500 !important; line-height: 1.35 !important;
  max-width: none !important;
}
.pxs .an-addr b{ font-weight: 700; }
.pxs .an-pin-ic{ width: 38px; height: 38px; flex: none; padding: 8px; border-radius: 10px; background: rgba(255, 255, 255, .16); fill: var(--gold); }
.pxs .an-pin-ic circle{ fill: var(--navy); }
.pxs .an-a3{ max-width: min(40vw, 600px); }
.pxs .an-sectors{ display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 30px; padding: 0; }
.pxs .an-sectors li{
  padding: .5em 1em; border-radius: 999px;
  font-size: .95rem; font-weight: 500;
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
}
.pxs .an-stats{ opacity: 0; display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 0; border-top: 1.5px solid rgba(255, 247, 234, .2); padding-top: 22px; }
.pxs .an-stat{ display: grid; gap: 10px; align-content: start; padding: 0 30px; border-left: 1.5px solid rgba(255, 247, 234, .2); }
.pxs .an-stat:first-child{ padding-left: 0; border-left: 0; }
.pxs .an-stat b{ font-size: clamp(56px, 5.4vw, 104px); line-height: .8; color: var(--gold); font-weight: 400; }
.pxs .an-stat:first-child b{ color: var(--coral); }
.pxs .an-stat > span{ font-size: 1.15rem; font-weight: 500; line-height: 1.3; max-width: 13ch; }
@media (max-width: 800px){.pxs .an-map{ right: auto; left: 50%; top: auto; bottom: 2vh; translate: -50% 0; width: min(88vw, 45vh); }.pxs .an-a1, .pxs .an-a2, .pxs .an-a3{ top: 96px; translate: none; right: var(--gutter); max-width: none; }.pxs .an-a1, .pxs .an-a2{ top: auto; bottom: 8vh; }.pxs .an-a1 h2, .pxs .an-a2 h2, .pxs .an-a3 h2{ font-size: clamp(36px, 10vw, 56px); margin-bottom: 12px; }.pxs .an-a3 p{ font-size: 17px; }.pxs .an-sectors{ margin: 4px 0 16px; }.pxs .an-sectors li{ font-size: .82rem; }.pxs .an-stats{ padding-top: 14px; }.pxs .an-stat{ padding: 0 14px; }.pxs .an-stat b{ font-size: 44px; }.pxs .an-stat > span{ font-size: .92rem; }.pxs .an-addr{ font-size: .95rem !important; padding: 10px 16px 10px 12px; gap: 10px; }.pxs .an-pin-ic{ width: 32px; height: 32px; padding: 6px; }.pxs .an-photo-scrim{ background: linear-gradient(0deg, rgba(14, 34, 42, .8) 0%, rgba(14, 34, 42, .2) 55%, transparent 80%); }}
@media (min-width: 801px) and (max-height: 760px){.pxs .menu{ padding-top: 84px; padding-bottom: 64px; }.pxs .menu-side{ padding: 24px 26px; gap: 12px; max-width: 340px; }.pxs .menu-avatar{ width: 84px; height: 84px; }.pxs .menu-side h2{ font-size: clamp(30px, 6.4vh, 60px); }.pxs .menu-side p{ font-size: 1rem; }.pxs .menu-foot{ bottom: 14px; }}
@media (min-width: 801px) and (max-height: 560px){.pxs .menu-foot > span{ display: none; }.pxs .menu-side p{ display: none; }}
.pxs .im-end h2{ max-width: 18ch; }
.pxs .im-notifs{ position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.pxs .im-notif{
  position: absolute;
  display: flex; align-items: center; gap: 14px;
  width: min(330px, 26vw);
  padding: 14px 18px 14px 14px;
  border-radius: 18px;
  background: #fff;
  color: var(--navy);
  box-shadow: 0 24px 50px -24px rgba(26, 55, 68, .45), 0 2px 8px rgba(26, 55, 68, .06);
  opacity: 0;
}
.pxs .im-notif > span:last-child{ display: grid; gap: 2px; line-height: 1.25; }
.pxs .im-notif b{ font-size: 1rem; font-weight: 700; }
.pxs .im-notif small{ font-size: .88rem; color: color-mix(in srgb, var(--navy) 70%, transparent); }
.pxs .im-notif .ic{ width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; flex: none; }
.pxs .im-notif .ic svg{ width: 28px; height: 28px; }
.pxs .c-coral{ background: #FDE3E3; }
.pxs .c-navy{ background: #DCE7EB; }
.pxs .c-gold{ background: #FDF1D3; }
.pxs .c-sky{ background: var(--sky); }
.pxs .c-cream{ background: var(--cream); }
.pxs .n1{ left: 7vw; top: 17vh; }
.pxs .n2{ right: 6vw; top: 22vh; }
.pxs .n3{ left: 4vw; bottom: 22vh; }
.pxs .n4{ right: 8vw; bottom: 16vh; }
.pxs .n5{ left: 16vw; bottom: 6vh; }
@media (max-width: 1100px){.pxs .im-notif{ width: 270px; }.pxs .n5{ display: none; }}
@media (max-width: 800px){.pxs .im-notif{ width: auto; left: var(--gutter) !important; right: var(--gutter) !important; padding: 10px 14px 10px 10px; }.pxs .im-notif .ic{ width: 38px; height: 38px; }.pxs .n1{ top: 84px; }.pxs .n2{ top: 152px; bottom: auto; }.pxs .n3{ top: auto; bottom: 92px; }.pxs .n4{ top: auto; bottom: 24px; }.pxs .im-end h2{ font-size: clamp(34px, 9vw, 52px); }}
.pxs .rbtn--panel{ width: calc(clamp(46px, 3.6vw, 58px) * 1.05); height: calc(clamp(46px, 3.6vw, 58px) * 1.05); margin-right: -1px; }
.pxs .an-a3 > p{ font-weight: 400 !important; }
@media (min-width: 801px) and (max-height: 720px){.pxs .an-a3 h2{ font-size: clamp(34px, 7.4vh, 64px); margin-bottom: 12px; }.pxs .an-a3 > p{ font-size: clamp(15px, 2.9vh, 20px) !important; margin-bottom: .6em; }.pxs .an-sectors{ margin: 2px 0 14px; gap: 6px; }.pxs .an-sectors li{ font-size: .8rem; padding: .4em .85em; }.pxs .an-stats{ padding-top: 12px; }.pxs .an-stat{ gap: 6px; padding: 0 20px; }.pxs .an-stat b{ font-size: clamp(36px, 8.4vh, 70px); }.pxs .an-stat > span{ font-size: .92rem; }}
.pxs .clients{ padding: clamp(80px, 14vh, 170px) var(--gutter) clamp(70px, 12vh, 150px); }
.pxs .clients-title{ text-align: center; font-size: clamp(40px, 4.6vw, 88px); margin: 0 auto clamp(40px, 7vh, 80px); max-width: 20ch; }
.pxs .clients-grid{ list-style: none; margin: 0 auto; padding: 0; max-width: 1320px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.pxs .clients-grid li{ aspect-ratio: 16 / 10; min-width: 0; position: relative; padding: clamp(10px, 1.4vw, 24px); }
.pxs .clients-grid img{ display: block; width: 100%; height: 100%; object-fit: contain; transition: transform .5s var(--ease-out); }
.pxs .clients-grid li:hover img{ transform: scale(1.08); }
@media (max-width: 1100px){.pxs .clients-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }}
@media (max-width: 640px){.pxs .clients-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }.pxs .clients-grid li{ padding: 7px; }}
.pxs .visib{ --vs: clamp(56px, 7.4vw, 140px); position: relative; height: clamp(440px, 64vh, 700px); overflow: hidden; }
.pxs .visib-row{ position: absolute; left: 0; right: 0; white-space: nowrap; font-size: var(--vs); line-height: .9; pointer-events: none; }
.pxs .visib-row--a{ top: 40%; color: var(--cream); z-index: 1; }
.pxs .visib-row--b{ top: calc(40% + var(--vs) * .94); color: var(--gold); z-index: 3; }
.pxs .visib-track{ display: inline-flex; align-items: center; will-change: transform; }
.pxs .visib-track span{ padding: 0 .28em; }
.pxs .visib-track i{ width: .2em; height: .2em; background: var(--coral); flex: none; }
.pxs .visib-row--b .visib-track i{ background: var(--cream); }
.pxs .visib-row--a .visib-track{ animation: pxs-visL 46s linear infinite; }
.pxs .visib-row--b .visib-track{ animation: pxs-visR 46s linear infinite; }
@keyframes pxs-visL{ from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes pxs-visR{ from { transform: translateX(-50%); } to { transform: translateX(0); } }
.pxs .visib-photo{ position: absolute; z-index: 2; left: 50%; bottom: 0; height: 94%; width: auto; max-width: none; translate: -50% 0; }
@media (max-width: 800px){.pxs .visib{ --vs: clamp(44px, 15vw, 80px); height: clamp(420px, 66vh, 560px); }.pxs .visib-row--a{ top: 44%; }.pxs .visib-photo{ height: 88%; }}
.pxs .clients{ background: #fff; }
.pxs .visib{ background: #ADCBDA; }
.pxs .visib-row--a{ color: var(--navy); }
.pxs .visib-row--b{ color: #fff; }
.pxs .visib-row--a .visib-track i{ background: var(--coral); }
.pxs .visib-row--b .visib-track i{ background: var(--navy); }
.pxs .pcard-top .pcard-meta{ letter-spacing: .1em; }
.pxs .card-cap--end{ justify-content: flex-end; }
.pxs .rail-head p{ font-size: 1.15rem; max-width: 30ch; }
@media (min-width: 801px) and (max-width: 1100px){.pxs .im-notif{ width: 232px; padding: 10px 14px 10px 10px; gap: 10px; }.pxs .im-notif .ic{ width: 38px; height: 38px; }.pxs .n1, .pxs .n3{ left: 2vw; }.pxs .n2, .pxs .n4{ right: 2vw; }}
@media (min-width: 801px) and (max-height: 720px){.pxs .im-notif small{ display: none; }.pxs .n1{ top: 14vh; }.pxs .n2{ top: 18vh; }.pxs .n3{ bottom: 10vh; }.pxs .n4{ bottom: 5vh; }.pxs .n5{ display: none; }}
.pxs .ident{
  background: var(--navy);
  color: var(--cream);
  position: relative;
  overflow: hidden;
}
.pxs .ident::before{
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px;
  background: rgba(246, 205, 103, .6);
}
.pxs .ident-in{
  max-width: 1480px; margin: 0 auto;
  padding: clamp(56px, 7.5vh, 96px) var(--gutter) clamp(52px, 7vh, 88px);
  display: grid;
  grid-template-columns: minmax(260px, 26%) minmax(0, 1fr);
  gap: clamp(30px, 4vw, 64px);
  align-items: center;
}
.pxs .ident h1{
  font-size: clamp(31px, 3.35vw, 60px);
  line-height: .9;
}
.pxs .ident h1 .g{ color: var(--gold); }
.pxs .ident-r{
  border-left: 1px solid rgba(246, 205, 103, .32);
  padding-left: clamp(28px, 3.6vw, 66px);
}
.pxs .ident-svc{
  display: grid; row-gap: .62em;
  font-size: clamp(19px, 1.45vw, 25px);
  line-height: 1.45;
  color: color-mix(in srgb, var(--cream) 88%, transparent);
}
.pxs .ident-svc b{ font-weight: inherit; display: flex; flex-wrap: wrap; column-gap: .8em; row-gap: .45em; }
.pxs .ident-svc span{ white-space: nowrap; }
.pxs .ident-svc span + span::before{
  content: ''; display: inline-block; vertical-align: .1em;
  width: 6px; height: 6px; margin-right: .8em;
  background: var(--gold);
}
@media (max-width: 1240px){.pxs .ident-in{ grid-template-columns: 1fr; gap: clamp(20px, 3.2vw, 32px); }.pxs .ident-r{ border-left: 0; padding-left: 0; }.pxs .ident-r::before{
    content: ''; display: block; width: 72px; height: 1px; margin-bottom: 20px;
    background: rgba(246, 205, 103, .6);
  }}
@media (max-width: 680px){.pxs .ident-svc{ row-gap: .34em; }.pxs .ident-svc b{ display: grid; row-gap: .34em; }.pxs .ident-svc span{ display: flex; align-items: baseline; gap: .62em; white-space: normal; }.pxs .ident-svc span::before, .pxs .ident-svc span + span::before{
    content: ''; display: block; flex: none;
    width: 6px; height: 6px; margin: 0; background: var(--gold);
    transform: translateY(-.18em);
  }}
.pxs .wcard .card-in > img.pic{
  position: static; inset: auto;
  width: 64%; height: auto; aspect-ratio: 1 / 1;
  object-fit: cover; border-radius: 16px;
  align-self: center;
  box-shadow: none;
  transition: transform .9s var(--ease-out);
}
.pxs .wcard:hover .card-in > img.pic{ transform: scale(1.05) rotate(-1.2deg); }
@media (max-width: 800px){.pxs .wcard .card-in > img.pic{ width: 76px; grid-row: span 2; border-radius: 12px; box-shadow: none; }}
.pxs .avis{ background: var(--cream); padding: clamp(84px, 12vh, 150px) 0 clamp(78px, 11vh, 140px); }
.pxs .avis-in{ max-width: 1480px; margin: 0 auto; padding: 0 var(--gutter); }
.pxs .avis-head{ margin-bottom: clamp(34px, 4.6vh, 58px); }
.pxs .avis-head .kicker{ color: var(--coral); display: block; margin-bottom: 12px; }
.pxs .avis-head h2{ font-size: clamp(32px, 3.1vw, 58px); }
.pxs .ti{ background: #fff; border-radius: 20px; padding: clamp(18px, 1.8vw, 26px); box-shadow: 0 18px 44px -30px rgba(10, 25, 32, .35); }
.pxs .ti-top{ display: flex; align-items: center; gap: 12px; padding: 4px 6px 20px; flex-wrap: wrap; }
.pxs .ti-top b{ font-size: clamp(17px, 1.2vw, 20px); color: var(--navy); letter-spacing: .01em; }
.pxs .ti-exc{ font-weight: 600; font-size: clamp(15px, 1.05vw, 17px); color: color-mix(in srgb, var(--navy) 72%, transparent); }
.pxs .ti-score{ font-family: var(--display); font-weight: 700; font-size: clamp(20px, 1.5vw, 26px); color: var(--navy); line-height: 1; }
.pxs .ti-src{
  display: grid; place-items: center; flex: none;
  width: 22px; height: 22px; border-radius: 50%;
  background: var(--navy); color: var(--cream);
  font-family: var(--display); font-weight: 700; font-size: 15px; line-height: 1; padding-top: 2px;
}
.pxs .ti-src--lg{ width: 30px; height: 30px; font-size: 20px; }
.pxs .ti-stars{ display: inline-flex; gap: 2px; }
.pxs .ti-stars svg{ width: 18px; height: 18px; fill: var(--gold); }
.pxs .ti-body{ display: flex; align-items: center; gap: 6px; }
.pxs .ti-arrow{
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center;
  color: color-mix(in srgb, var(--navy) 50%, transparent);
  transition: background .3s, color .3s;
}
.pxs .ti-arrow:hover{ background: var(--cream); color: var(--navy); }
.pxs .ti-arrow svg{ width: 18px; height: 18px; }
.pxs .ti-prev svg{ transform: rotate(180deg); }
.pxs .ti-vp{ flex: 1; min-width: 0; overflow: hidden; }
.pxs .ti-track{ display: flex; gap: 16px; align-items: stretch; list-style: none; margin: 0; padding: 4px 0 6px; will-change: transform; }
.pxs .ti-card{ flex: none; display: flex; }
.pxs .ti-inner{
  flex: 1; min-width: 0;
  background: #fff;
  border: 1px solid rgba(26, 55, 68, .12);
  border-radius: 14px;
  padding: 16px 18px 18px;
  display: grid; gap: 10px; align-content: start;
  box-shadow: 0 2px 10px -6px rgba(10, 25, 32, .2);
}
.pxs .ti-h{ display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px; }
.pxs .ti-av{
  width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center; flex: none;
  font-family: var(--display); font-weight: 700; font-size: 20px; line-height: 1; padding-top: 3px;
}
.pxs .ti-av.c1{ background: var(--coral); color: #fff; }
.pxs .ti-av.c2{ background: var(--navy); color: var(--cream); }
.pxs .ti-av.c3{ background: var(--gold); color: var(--navy-deep); }
.pxs .ti-av.c4{ background: var(--sky); color: var(--navy-deep); }
.pxs .ti-id{ display: grid; gap: 1px; min-width: 0; }
.pxs .ti-id b{ font-size: 16px; font-weight: 600; color: var(--navy); line-height: 1.15; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pxs .ti-id small{ font-size: 13px; color: color-mix(in srgb, var(--navy) 52%, transparent); }
.pxs .ti-rate{ display: flex; align-items: center; gap: 8px; }
.pxs .ti-ok{ width: 15px; height: 15px; fill: #4C8FD8; flex: none; }
.pxs .ti-txt{
  font-size: 16px; line-height: 1.5;
  color: color-mix(in srgb, var(--navy) 82%, transparent);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;
}
.pxs .ti-card.is-open .ti-txt{ -webkit-line-clamp: unset; display: block; }
.pxs .ti-more{
  justify-self: start; font-size: 14px;
  color: color-mix(in srgb, var(--navy) 55%, transparent);
  text-decoration: underline; text-underline-offset: 3px;
}
.pxs .ti-more:hover{ color: var(--coral); }
.pxs .ti-card.is-short .ti-more{ display: none; }
@media (max-width: 760px){.pxs .ti-top{ gap: 9px; padding-bottom: 16px; }.pxs .ti-arrow{ width: 30px; height: 30px; }.pxs .ti-track{ gap: 12px; }}
.pxs .nuit{ background: var(--navy); color: var(--cream); }
.pxs .nu-pin{
  position: relative; overflow: hidden;
  background: #0B1A22 url("/wp-content/uploads/px/seq2/d/000.webp") center / cover no-repeat;
}
.pxs .nu-canvas{ position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pxs .nu-scrim{
  position: absolute; inset: 0; z-index: 1; opacity: 0;
  background: linear-gradient(to top, rgba(11, 26, 34, .86) 0%, rgba(11, 26, 34, .35) 42%, rgba(11, 26, 34, 0) 70%);
}
.pxs .nu-mask{ position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.pxs .nu-mask text{
  font-family: var(--display); font-weight: 900;
  fill: #000; letter-spacing: .01em;
}
.pxs .nu-plate{ fill: var(--navy); }
.pxs .nu-ink{ pointer-events: none; }
.pxs .nu-edge text{
  font-family: var(--display); font-weight: 900;
  fill: none; stroke: #ADCBDA; stroke-width: .5; stroke-linejoin: round;
}
.pxs .nu-open{
  position: absolute; z-index: 3; left: 0; right: 0;
  top: calc(50% + 30vh);
  text-align: center;
  font-size: clamp(19px, 1.55vw, 27px);
  font-weight: 600;
  letter-spacing: .02em;
  color: color-mix(in srgb, var(--cream) 86%, transparent);
}
.pxs .nu-open span{ color: var(--gold); }
.pxs .nu-peak{
  position: absolute; z-index: 3;
  left: var(--gutter); right: var(--gutter); bottom: clamp(70px, 11vh, 130px);
}
.pxs .nu-peak h2{ font-size: clamp(38px, 5.2vw, 104px); max-width: 15ch; }
.pxs .nu-peak .hi{ color: var(--gold); }
.pxs .nu-close{
  position: absolute; z-index: 3; left: 0; right: 0;
  top: calc(50% + 30vh);
  display: grid; justify-items: center; gap: 22px;
  padding: 0 var(--gutter); text-align: center;
  opacity: 0;
}
.pxs .nu-close p{ font-size: clamp(20px, 1.7vw, 30px); font-weight: 600; max-width: 26ch; color: var(--cream); }
.pxs .nu-close .btn{ --b: var(--gold); --t: var(--navy-deep); }
@media (max-width: 800px){.pxs .immersion .im-pin{ background-image: url("/wp-content/uploads/px/seq/m/000.webp"); }.pxs .nu-pin{ background-image: url("/wp-content/uploads/px/seq2/m/000.webp"); }.pxs .nu-peak{ bottom: clamp(70px, 12vh, 120px); }.pxs .nu-peak h2{ font-size: clamp(30px, 8.4vw, 46px); max-width: none; }.pxs .nu-open{ top: calc(50% + 28vh); font-size: 17px; }.pxs .nu-close{ top: calc(50% + 28vh); gap: 12px; }}
.pxs{
  --display: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --sans: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.pxs .d{
  font-weight: 800;
  letter-spacing: -.022em;
  line-height: 1.04;
}
.pxs .hero-word, .pxs .big-word, .pxs .why-title{ font-weight: 800; }
.pxs .im-end h2, .pxs .stat b, .pxs .pform-done h3, .pxs .ti-score, .pxs .ti-av, .pxs .ti-src{ font-weight: 800; }
.pxs .an-stat b{ font-weight: 700; }
.pxs .stat b, .pxs .an-stat b, .pxs .ti-score, .pxs .ti-av, .pxs .ti-src, .pxs .avis-count, .pxs .menu-link, .pxs .wcard h3, .pxs .pcard-title, .pxs .c-card h2, .pxs .ident h1{ letter-spacing: -.022em; }
.pxs .hero-title .hero-h{ font-size: clamp(26px, min(2.7vw, 5.2vh), 54px); line-height: 1.08; }
.pxs .menu-link{ font-size: clamp(24px, min(4.2vw, 5.6vh), 74px); }
.pxs .menu-link .num{ margin-top: .35em; }
.pxs .ident h1{ font-size: clamp(22px, 2.15vw, 38px); line-height: 1.08; }
.pxs .im-beat h2{ font-size: clamp(28px, 3.4vw, 62px); }
.pxs .im-end h2{ font-size: clamp(27px, 3.4vw, 60px); max-width: 21ch; }
.pxs .im-rush span{ font-size: clamp(34px, 5.4vw, 96px); }
.pxs .nu-peak h2{ font-size: clamp(26px, 3.2vw, 58px); max-width: 20ch; }
.pxs .rail-head h2{ font-size: clamp(28px, 3.3vw, 56px); }
.pxs .aide-head h2{ font-size: clamp(27px, 2.7vw, 48px); }
.pxs .aide-tx h3{ font-size: clamp(18px, 1.4vw, 25px); line-height: 1.2; }
.pxs .xp-head h2{ font-size: clamp(28px, 2.8vw, 50px); }
.pxs .why-title{ font-size: clamp(42px, 8.4vw, 152px); line-height: 1; }
.pxs .wcard h3{ font-size: clamp(18px, 1.4vw, 24px); }
.pxs .stat b{ font-family: var(--display); font-size: clamp(40px, 4.8vw, 88px); line-height: 1; }
.pxs .an-stat b{ font-size: clamp(34px, 3.3vw, 60px); line-height: 1; font-weight: 800; }
.pxs .faq-head h2{ font-size: clamp(32px, 3.8vw, 66px); }
.pxs .an-a1 h2, .pxs .an-a2 h2, .pxs .an-a3 h2{ font-size: clamp(26px, 3.15vw, 58px); margin-bottom: 18px; }
.pxs .an-a1 p, .pxs .an-a2 p, .pxs .an-a3 p{ font-size: clamp(17px, 1.3vw, 22px); max-width: 34ch; }
.pxs .an-svg text{ font-size: .26px; stroke-width: .07px; }
.pxs .an-svg .home text, .pxs .an-svg .home2 text{ font-size: .32px; letter-spacing: 0; font-weight: 800; }
.pxs .avis-head h2{ font-size: clamp(23px, 2.1vw, 38px); }
.pxs .c-card h2{ font-size: clamp(28px, 2.9vw, 50px); }
.pxs .panel-head h2{ font-size: clamp(27px, 2.5vw, 42px); }
.pxs .band{ font-size: clamp(20px, 2.5vw, 44px); }
.pxs .visib{ --vs: clamp(32px, 4.3vw, 80px); }
.pxs .pcard-title{ font-size: calc(var(--pw) * .092); }
.pxs .loader-txt.d{ font-size: clamp(18px, 1.8vw, 31px); }
.pxs .ti-score{ font-size: clamp(17px, 1.2vw, 21px); }
.pxs .ti-av{ font-size: 16px; padding-top: 0; }
.pxs .ti-src{ font-size: 12px; padding-top: 0; }
.pxs .ti-src--lg{ font-size: 16px; }
.pxs .avis-count{ font-size: .95rem; }
.pxs .pform-done h3, .pxs .quiz-done h3{ font-size: 28px; line-height: 1.1; }
@media (max-width: 800px){.pxs .hero-title .hero-h{ font-size: clamp(24px, 6.4vw, 38px); }.pxs .im-beat h2{ font-size: clamp(23px, 6vw, 34px); }.pxs .im-end h2{ font-size: clamp(22px, 5.6vw, 32px); }.pxs .nu-peak h2{ font-size: clamp(21px, 5.4vw, 30px); }.pxs .rail-head h2{ font-size: clamp(23px, 6vw, 34px); }.pxs .xp-head h2{ font-size: clamp(23px, 6vw, 34px); }.pxs .why-title{ font-size: clamp(38px, 11vw, 72px); }.pxs .an-stat b{ font-size: clamp(24px, 5vh, 44px); }.pxs .an-a1 h2, .pxs .an-a2 h2, .pxs .an-a3 h2{ font-size: clamp(22px, 5.6vw, 34px); }.pxs .menu-link{ font-size: clamp(24px, 7vw, 42px); }.pxs .aide-tx h3{ font-size: clamp(17px, 4.4vw, 22px); }.pxs .visib{ --vs: clamp(26px, 9vw, 48px); }}

/* ---------------------------------------------------------
   Ajustements propres a la page WordPress hote
   --------------------------------------------------------- */

/* Le site applique scroll-behavior: smooth sur <html>. Le navigateur anime
   alors le defilement de facon asynchrone, et l'epinglage de GSAP, qui bascule
   l'element entre relative et fixed selon la position de scroll, se desynchronise :
   la section saute pour se caler en plein ecran. GSAP documente l'incompatibilite,
   la seule issue est de rendre la main au defilement natif. */
html { scroll-behavior: auto !important; }

.pxs { --pxs-head: 104px; }

/* Open Sans ne va que jusqu'a 800 : en demandant 900 le navigateur graissait
   artificiellement le mot, qui devenait plus large que ce qu'on avait mesure,
   et depassait de l'ecran. */
.pxs .nu-mask text { font-weight: 800; }

/* Le bouton est devenu un lien vers la page contact */
.pxs a.btn, .pxs a.btn:hover, .pxs a.btn:focus { text-decoration: none; }

/* --- Ordinateur uniquement : degagement sous l'en-tete collant ---
   Ces reglages ne doivent surtout pas fuiter vers le telephone, ou les
   sections ont deja leur propre mise en page. */
@media (min-width: 801px) {
  .pxs .im-b1, .pxs .im-b2 { top: calc(16vh + 62px); }
  .pxs .n1 { top: calc(17vh + 78px); }
  .pxs .n2 { top: calc(22vh + 44px); }
  .pxs .an-a1, .pxs .an-a2, .pxs .an-a3 { top: calc(50% + 48px); }
  .pxs .an-map { top: calc(50% + 54px); }
}
@media (min-width: 801px) and (max-height: 720px) {
  .pxs .n1 { top: calc(14vh + 70px); }
  .pxs .n2 { top: calc(18vh + 40px); }
}

/* --- Corps de texte --- */
.pxs .im-beat h2 { font-size: clamp(24px, 2.75vw, 50px); }
.pxs .im-end h2 { font-size: clamp(23px, 2.9vw, 50px); max-width: 23ch; }
.pxs .an-a1 h2, .pxs .an-a2 h2, .pxs .an-a3 h2 { font-size: clamp(26px, 3.15vw, 58px); margin-bottom: 18px; }
.pxs .an-a1 p, .pxs .an-a2 p, .pxs .an-a3 p { font-size: clamp(17px, 1.3vw, 22px); max-width: 34ch; }
.pxs .an-svg text { font-size: .26px; stroke-width: .07px; }
.pxs .an-svg .home text, .pxs .an-svg .home2 text { font-size: .32px; letter-spacing: 0; font-weight: 800; }

@media (max-width: 800px) {
  .pxs .im-beat h2 { font-size: clamp(20px, 5.2vw, 29px); }
  .pxs .im-end h2 { font-size: clamp(19px, 5vw, 28px); }
  .pxs .an-a1 h2, .pxs .an-a2 h2, .pxs .an-a3 h2 { font-size: clamp(22px, 5.6vw, 34px); }
}