/* One Distri Motion — enhancement layer (fx). Loads after app.css; brand tokens come from app.css :root. */

@property --fx-a { syntax: "<color>"; inherits: true; initial-value: #7b5cff33; }
@property --fx-b { syntax: "<color>"; inherits: true; initial-value: #14b8c829; }

:root {
  --fx-a: #7b5cff33;
  --fx-b: #14b8c829;
  --fx-ease: cubic-bezier(.16, 1, .3, 1);
  --fx-ease-io: cubic-bezier(.65, 0, .35, 1);
  --fx-fast: .32s;
  --fx-mid: .7s;
  --fx-slow: 1.2s;
  transition: --fx-a 1.8s var(--fx-ease-io), --fx-b 1.8s var(--fx-ease-io);
}

/* Focus never hides under the fixed header (WCAG 2.2 · 2.4.11) */
html { scroll-padding-top: calc(var(--nav-h) + 28px + env(safe-area-inset-top, 0px)); }

/* ---------- Atmosphere: glow temperature follows the section ---------- */
.atmos__b { background: radial-gradient(circle, var(--fx-a), transparent 70%); }
.atmos__c { background: radial-gradient(circle, var(--fx-b), transparent 70%); }

/* ---------- Scroll progress ---------- */
.fx-progress {
  position: fixed; z-index: 60; left: 0; right: 0; top: env(safe-area-inset-top, 0px);
  height: 2px; pointer-events: none;
}
.fx-progress i {
  display: block; height: 100%; background: var(--spectrum);
  transform-origin: 0 50%; transform: scaleX(0);
  box-shadow: 0 0 12px rgba(123, 92, 255, .45);
}
@supports ((animation-timeline: scroll()) and (animation-range: 0% 100%)) {
  .fx-progress i { animation: fx-grow linear both; animation-timeline: scroll(root); }
  .fx-progress.is-js i { animation: none; }
}
@keyframes fx-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- Decode labels ---------- */
.fx-decoding { font-variant-numeric: tabular-nums; }

/* ---------- Why: rail in the sticky column ---------- */
.fx-rail { display: none; }
@media (min-width: 960px) {
  .fx-rail {
    position: relative; display: grid; gap: 2px; margin-top: 2.4rem; padding-left: 22px; max-width: 260px;
  }
  .fx-rail::before {
    content: ""; position: absolute; left: 4px; top: 10px; bottom: 10px; width: 1px;
    background: linear-gradient(var(--alu), var(--alu));
  }
  .fx-rail__dot {
    position: absolute; left: 0; top: 0; width: 9px; height: 9px; border-radius: 50%;
    background: var(--spectrum); box-shadow: 0 0 0 5px rgba(36, 56, 232, .1);
    transform: translateY(var(--fx-y, 10px)) translateY(-50%);
    transition: transform .7s var(--fx-ease);
  }
  .fx-rail button {
    all: unset; cursor: pointer; display: flex; align-items: center; gap: .7em;
    font-family: var(--font-mono); font-size: .72rem; font-weight: 500; letter-spacing: .1em;
    text-transform: uppercase; color: var(--slate); padding: 7px 0; transition: color .4s var(--fx-ease);
  }
  .fx-rail button:hover, .fx-rail button[aria-current="true"] { color: var(--ink); }
  .fx-rail button:focus-visible { outline: 2px solid var(--sapphire); outline-offset: 3px; border-radius: 6px; }
  .why__row::after {
    content: ""; position: absolute; left: 0; bottom: -1px; height: 1px; width: 100%;
    background: var(--spectrum); transform: scaleX(0); transform-origin: 0 50%;
    transition: transform 1s var(--fx-ease);
  }
  .why__row.fx-current::after { transform: scaleX(1); }
  .why__row.fx-current h3 { color: var(--ink); }
  .why__row:not(.fx-current) h3 { color: var(--graphite); }
}

/* ---------- Scroll-scrubbed statement ---------- */
.fx-scrub .fx-w { opacity: var(--o, 1); transition: opacity .25s linear; }

/* ---------- Footer wordmark: draw-on + spotlight ---------- */
.foot__mark { position: relative; }
.foot__mark .fx-glow {
  position: absolute; inset: 20px 0 40px; pointer-events: none; opacity: 0;
  transition: opacity .6s var(--fx-ease);
  -webkit-mask-image: radial-gradient(circle 190px at var(--fx-x, 50%) var(--fx-y, 50%), #000 0%, rgba(0,0,0,.55) 45%, transparent 72%);
          mask-image: radial-gradient(circle 190px at var(--fx-x, 50%) var(--fx-y, 50%), #000 0%, rgba(0,0,0,.55) 45%, transparent 72%);
}
.foot__mark .fx-glow svg { width: 100%; height: auto; display: block; }
.foot__mark.is-lit .fx-glow { opacity: 1; }
.foot__mark.fx-draw path { transition: stroke-dashoffset 2.6s var(--fx-ease-io), fill-opacity 1.2s 1.6s var(--fx-ease); }

/* ---------- Store card: living mesh ---------- */
.shop__store::before {
  content: ""; position: absolute; z-index: -3; left: 50%; top: 50%;
  width: 150%; aspect-ratio: 1; translate: -50% -50%;
  background: conic-gradient(from 0deg, #2438E8, #7B5CFF, #14B8C8, #FF7E6E, #7B5CFF, #2438E8);
  filter: blur(70px) saturate(1.05); opacity: .28; border-radius: 50%;
  animation: fx-spin 24s linear infinite; will-change: transform;
}
.shop__store.fx-off::before { animation-play-state: paused; }
@keyframes fx-spin { to { transform: rotate(1turn); } }

/* ---------- Primary button sheen ---------- */
.btn--primary::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 32%, rgba(255,255,255,.34) 50%, transparent 68%);
  transform: translateX(-130%);
}
.btn--primary:hover::before { transform: translateX(130%); transition: transform .95s var(--fx-ease); }
.btn--primary > * { position: relative; z-index: 1; }

/* ---------- Request offer: flying category ---------- */
.fx-fly {
  position: fixed; z-index: 90; left: 0; top: 0; pointer-events: none;
  padding: 10px 18px; border-radius: 999px; background: var(--paper); color: var(--ink);
  font-family: var(--font-display); font-weight: 560; font-size: .95rem; letter-spacing: -.01em; white-space: nowrap;
  box-shadow: 0 18px 40px -16px rgba(36, 56, 232, .55), 0 0 0 1px rgba(36, 56, 232, .18);
}
.fx-fly::before {
  content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 9px; border-radius: 50%;
  background: var(--spectrum); vertical-align: middle; translate: 0 -1px;
}
.toggle.fx-pop span { animation: fx-pop .9s var(--fx-ease); }
@keyframes fx-pop {
  0% { box-shadow: 0 0 0 0 rgba(36, 56, 232, .45); scale: 1; }
  35% { scale: 1.08; }
  100% { box-shadow: 0 0 0 14px rgba(36, 56, 232, 0); scale: 1; }
}

/* ---------- 3D cards: rotate controls (WCAG 2.2 · 2.5.7) ---------- */
.fx-rot {
  position: absolute; z-index: 3; right: 12px; bottom: 12px; display: none; gap: 6px;
}
.card.is-3d .fx-rot { display: flex; }
.fx-rot button {
  display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(10, 14, 26, .14); background: var(--glass-strong); color: var(--ink);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); cursor: pointer;
  transition: background-color .3s var(--fx-ease), border-color .3s var(--fx-ease);
}
.fx-rot button:hover { background: var(--paper); border-color: var(--ink); }
.fx-rot svg { width: 16px; height: 16px; }

::view-transition-group(fx-stage) { animation-duration: .42s; animation-timing-function: var(--fx-ease); }
::view-transition-old(fx-stage), ::view-transition-new(fx-stage) { height: 100%; object-fit: cover; }
::view-transition-old(fx-stage) { animation: fx-vt-out .42s var(--fx-ease) both; }
::view-transition-new(fx-stage) { animation: fx-vt-in .42s var(--fx-ease) both; }
@keyframes fx-vt-out { to { opacity: 0; filter: blur(10px); scale: 1.04; } }
@keyframes fx-vt-in { from { opacity: 0; filter: blur(10px); scale: .96; } }

/* ---------- Native entry animations for overlays ---------- */
.mmenu, .lang__panel, .cookie, .legal__sheet, .legal__backdrop {
  transition: opacity .45s var(--fx-ease), translate .55s var(--fx-ease), scale .55s var(--fx-ease);
}
@starting-style {
  .mmenu, .lang__panel { opacity: 0; translate: 0 -10px; scale: .98; }
  .cookie { opacity: 0; translate: 0 24px; }
  .legal__sheet { opacity: 0; translate: 0 40px; }
  .legal__backdrop { opacity: 0; }
}

/* ---------- Business visual: unclip on scroll (progressive enhancement) ---------- */
@supports ((animation-timeline: view()) and (animation-range: entry)) {
  @media (prefers-reduced-motion: no-preference) {
    html:not(.fx-rm) .biz__visual { animation: fx-unclip linear both; animation-timeline: view(); animation-range: entry 0% cover 45%; }
    html:not(.fx-rm) .biz__img { animation: fx-settle linear both; animation-timeline: view(); animation-range: entry 0% cover 60%; }
  }
}
@keyframes fx-unclip { from { clip-path: inset(10% 9% 0 9% round 30px); } to { clip-path: inset(0 0 0 0 round 0px); } }
@keyframes fx-settle { from { scale: 1.14; } to { scale: 1; } }

/* ---------- Chips wave ---------- */
.fx-pre > li { opacity: 0; }
.fx-wave > li { animation: fx-chip .7s var(--fx-ease) both; animation-delay: calc(var(--i, 0) * 24ms); }
@keyframes fx-chip { from { opacity: 0; translate: 0 10px; scale: .9; } }
.coverage__markets li { transition: background-color .3s var(--fx-ease), color .3s var(--fx-ease), border-color .3s var(--fx-ease); }
.coverage__markets li:hover { background: var(--paper); color: var(--ink); border-color: rgba(36, 56, 232, .35); }

/* ---------- Motion toggle (footer) ---------- */
.fx-motion {
  all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: .55em;
  font: inherit; color: inherit; min-height: 24px;
}
.fx-motion i {
  position: relative; width: 30px; height: 18px; border-radius: 999px; background: var(--alu);
  transition: background-color .3s var(--fx-ease);
}
.fx-motion i::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--paper); box-shadow: 0 1px 3px rgba(10, 14, 26, .25); transition: translate .3s var(--fx-ease);
}
.fx-motion[aria-pressed="true"] i { background: var(--sapphire); }
.fx-motion[aria-pressed="true"] i::after { translate: 12px 0; }
.fx-motion:focus-visible { outline: 2px solid var(--sapphire); outline-offset: 3px; border-radius: 6px; }

/* ---------- Mobile: headline in the first screen, compact privacy banner ---------- */
@media (max-width: 899px) {
  .hero { padding-block: calc(var(--nav-h) + 24px) 72px; }
  .hero__stage { width: min(100%, 34svh); }
}
@media (max-width: 899px) and (max-height: 760px) {
  .hero { padding-block: calc(var(--nav-h) + 12px) 64px; }
  .hero__stage { width: min(100%, 28svh); }
}
@media (max-width: 699px) {
  .cookie { padding: 14px 14px 12px; gap: 8px; }
  .cookie__title { font-size: 1rem; }
  .cookie p { font-size: .8rem; line-height: 1.45; }
  .cookie__actions { flex-wrap: wrap; gap: 6px; }
  .cookie__actions .btn { min-height: 40px; padding-inline: .8em; font-size: .82rem; flex: 1 1 auto; min-width: max-content; }
}

/* ---------- Perf HUD (#perf) ---------- */
.fx-perf {
  position: fixed; z-index: 95; left: max(12px, env(safe-area-inset-left, 0px)); bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  padding: 10px 12px; border-radius: 12px; background: rgba(10, 14, 26, .86); color: #fff;
  font: 500 11px/1.5 var(--font-mono); letter-spacing: .04em; pointer-events: none; min-width: 168px;
}
.fx-perf b { color: #9fb0ff; font-weight: 500; }

/* ---------- Reduced motion: system setting or the footer switch ---------- */
@media (prefers-reduced-motion: reduce) {
  .shop__store::before { animation: none; }
  .btn--primary::before { display: none; }
  .fx-rail__dot, .why__row::after { transition: none; }
  .mmenu, .lang__panel, .cookie, .legal__sheet, .legal__backdrop { transition-property: opacity; transition-duration: .15s; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
html.fx-rm {
  .atmos span, .pulse, .scrollcue i, .sound span, .shop__glow, .shop__store::before { animation: none !important; }
  .btn--primary::before { display: none; }
  .fx-rail__dot, .why__row::after, .fx-progress i { transition: none; }
  .mmenu, .lang__panel, .cookie, .legal__sheet, .legal__backdrop { transition-property: opacity; transition-duration: .15s; }
  &::view-transition-group(*), &::view-transition-old(*), &::view-transition-new(*) { animation: none !important; }
}

/* ---------- Live coverage map ---------- */
.coverage__map { transform-origin: 50% 55%; will-change: transform; }
.coverage__map canvas { cursor: crosshair; touch-action: pan-y; }
.fx-map-ticker {
  position: absolute; left: 0; bottom: 2%; margin: 0; display: flex; align-items: center; gap: .7em;
  font-family: var(--font-mono); font-size: .7rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: var(--graphite); padding: 6px 12px 6px 10px; border-radius: 999px;
  background: var(--glass-strong); border: 1px solid rgba(216, 219, 224, .9);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); pointer-events: none;
}
.fx-map-ticker__k { display: inline-flex; align-items: center; gap: .55em; color: var(--slate); }
.fx-map-ticker__k::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--coral);
  box-shadow: 0 0 0 0 rgba(255, 126, 110, .55); animation: fx-live 1.8s var(--fx-ease) infinite;
}
.fx-map-ticker__v { color: var(--ink); font-variant-numeric: tabular-nums; }
@keyframes fx-live { 0% { box-shadow: 0 0 0 0 rgba(255, 126, 110, .55); } 100% { box-shadow: 0 0 0 9px rgba(255, 126, 110, 0); } }
.fx-map-tag {
  position: absolute; left: 0; top: 0; z-index: 2; pointer-events: none; white-space: nowrap;
  translate: -50% calc(-100% - 16px); scale: .92; opacity: 0;
  font-family: var(--font-mono); font-size: .68rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
  color: #fff; background: var(--ink); padding: 6px 10px; border-radius: 999px;
  box-shadow: 0 10px 24px -10px rgba(10, 14, 26, .5);
  transition: opacity .3s var(--fx-ease), scale .4s var(--fx-ease), left .45s var(--fx-ease), top .45s var(--fx-ease);
}
.fx-map-tag::after {
  content: ""; position: absolute; left: 50%; bottom: -4px; width: 8px; height: 8px; translate: -50% 0; rotate: 45deg;
  background: var(--ink); border-radius: 2px;
}
.fx-map-tag.is-on { opacity: 1; scale: 1; }
.coverage__markets li:has(.fx-chip) { padding: 0; }
.fx-chip {
  all: unset; box-sizing: border-box; display: block; cursor: pointer; padding: 4px 9px; border-radius: 999px;
  min-height: 24px; line-height: 16px; font: inherit; letter-spacing: inherit; color: inherit;
  transition: background-color .3s var(--fx-ease), color .3s var(--fx-ease);
}
.coverage__markets li:has(.fx-chip.is-hot) { background: var(--paper); color: var(--ink); border-color: rgba(20, 184, 200, .7); box-shadow: 0 0 0 3px rgba(20, 184, 200, .14); }
.coverage__markets li:has(.fx-chip[aria-pressed="true"]) { background: var(--ink); color: #fff; border-color: var(--ink); }
.fx-chip:focus-visible { outline: 2px solid var(--sapphire); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .fx-map-ticker__k::before { animation: none; } .fx-map-tag { transition: opacity .15s; } }
html.fx-rm .fx-map-ticker__k::before { animation: none; }
html.fx-rm .fx-map-tag { transition: opacity .15s; }
.fx-map-ticker__v b { font-weight: 500; display: inline-block; min-width: 2ch; color: var(--sapphire); }
@media (max-width: 699px) {
  .coverage__map { margin-bottom: 52px; }
  .fx-map-ticker { top: calc(100% + 10px); bottom: auto; }
}
.fx-map-tag.is-jump { transition: none; }
@media (hover: hover) and (pointer: fine) {
  /* establish the 3D layer up front so the first tilt never re-rasterises the map */
  .coverage__map { transform: perspective(1400px) rotateY(0deg) rotateX(0deg); backface-visibility: hidden; }
}

/* ---------- Marketplace logos ---------- */
.shop__markets .mp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border-top:0;margin-top:14px}
.shop__markets .mp-grid li{min-width:0}
.shop__markets .mp-grid .mp{position:relative;display:grid;place-items:center;place-content:center;height:104px;padding:0 18px;border:0;border-radius:20px;
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(255,255,255,.42));
  box-shadow:inset 0 0 0 1px rgba(10,14,26,.07),0 1px 2px rgba(10,14,26,.04);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);isolation:isolate;overflow:hidden;
  transition:transform .55s var(--ease-out,cubic-bezier(.16,1,.3,1)),box-shadow .45s ease}
.shop__markets .mp-grid .mp::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;
  background:linear-gradient(120deg,#2438E8,#7B5CFF 40%,#14B8C8 72%,#FF7E6E);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .45s ease;z-index:1;pointer-events:none}
.shop__markets .mp-grid .mp::after{content:"";position:absolute;inset:-40% auto -40% -60%;width:45%;z-index:2;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-18deg) translateX(-120%);opacity:0}
.shop__markets .mp-grid .mp img{display:block;height:var(--h);width:auto;max-width:100%;object-fit:contain;
  transition:transform .6s var(--ease-out,cubic-bezier(.16,1,.3,1))}
.shop__markets .mp-grid .mp .mp__arr{position:absolute;top:12px;right:12px;width:14px;height:14px;color:var(--ink,#0A0E1A);opacity:.28;
  transition:opacity .35s ease,transform .45s var(--ease-out,cubic-bezier(.16,1,.3,1))}
.shop__markets .mp-grid .mp:hover,.shop__markets .mp-grid .mp:focus-visible{padding-left:18px;transform:translateY(-4px);
  box-shadow:inset 0 0 0 1px rgba(10,14,26,.04),0 18px 40px -18px rgba(36,56,232,.35),0 6px 16px -8px rgba(10,14,26,.12)}
.shop__markets .mp-grid .mp:hover::before,.shop__markets .mp-grid .mp:focus-visible::before{opacity:1}
.shop__markets .mp-grid .mp:hover::after{animation:fx-mp-sheen .9s ease forwards}
.shop__markets .mp-grid .mp:hover img,.shop__markets .mp-grid .mp:focus-visible img{transform:scale(1.06)}
.shop__markets .mp-grid .mp:hover .mp__arr,.shop__markets .mp-grid .mp:focus-visible .mp__arr{opacity:1;color:var(--sapphire,#2438E8);transform:translate(2px,-2px)}
.shop__markets .mp-grid .mp:focus-visible{outline:2px solid var(--sapphire,#2438E8);outline-offset:3px}
@keyframes fx-mp-sheen{0%{opacity:1;transform:skewX(-18deg) translateX(-120%)}100%{opacity:1;transform:skewX(-18deg) translateX(420%)}}
@media (min-width:1100px){.shop__markets .mp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.shop__markets .mp-grid .mp{height:112px}}
@media (max-width:520px){.shop__markets .mp-grid{gap:10px}.shop__markets .mp-grid .mp{height:86px;padding:0 14px;border-radius:16px}.shop__markets .mp-grid .mp img{height:calc(var(--h)*.82)}}
@media (prefers-reduced-motion:reduce){.shop__markets .mp-grid .mp,.shop__markets .mp-grid .mp img{transition:none}.shop__markets .mp-grid .mp:hover{transform:none}.shop__markets .mp-grid .mp:hover::after{animation:none}}
html.fx-rm .shop__markets .mp-grid .mp,html.fx-rm .shop__markets .mp-grid .mp img{transition:none}
html.fx-rm .shop__markets .mp-grid .mp:hover{transform:none}
html.fx-rm .shop__markets .mp-grid .mp:hover::after{animation:none}

/* ---------- Store card: product film ---------- */
.shop__store.has-media::before { opacity: .14; }
.shop__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; border-radius: inherit; pointer-events: none; }
.shop__media img, .shop__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 28%;
  transform: scale(1.001); transition: transform 1.4s var(--fx-ease, cubic-bezier(.16,1,.3,1)); }
.shop__media video { opacity: 0; transition: opacity .9s ease, transform 1.4s var(--fx-ease, cubic-bezier(.16,1,.3,1)); }
.shop__media video.is-on { opacity: 1; }
.shop__store.has-media::after { background:
  radial-gradient(120% 70% at 0% 100%, rgba(247,246,243,.92) 0%, rgba(247,246,243,.7) 38%, rgba(247,246,243,0) 72%),
  linear-gradient(180deg, rgba(255,255,255,0) 55%, rgba(247,246,243,.55) 100%); }
.shop__store.has-media:hover .shop__media img, .shop__store.has-media:hover .shop__media video { transform: scale(1.035); }
@media (max-width: 700px) {
  .shop__store.has-media { min-height: 380px; }
  .shop__media img, .shop__media video { object-position: 70% 18%; }
}
@media (prefers-reduced-motion: reduce) { .shop__media video { display: none; } .shop__media img { transition: none; } }
html.fx-rm .shop__media video { display: none; }
html.fx-rm .shop__media img { transition: none; }
@media (min-width: 901px) {
  .shop__media img, .shop__media video { inset: 0 0 0 auto; width: auto; height: 100%; aspect-ratio: 1 / 1; max-width: none; object-position: 50% 50%;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24%); mask-image: linear-gradient(90deg, transparent 0, #000 24%);
    transform-origin: 70% 40%; }
}

/* ---------- Footer: social links ---------- */
.foot__follow{margin:28px 0 12px}
.foot__social{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0;max-width:380px}
.foot__social a{position:relative;display:inline-flex;align-items:center;gap:6px;padding:8px 12px 8px 14px;border-radius:999px;font-size:.88rem;font-weight:500;color:var(--ink,#0A0E1A);
  background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.5));box-shadow:inset 0 0 0 1px rgba(10,14,26,.1);isolation:isolate;
  transition:transform .45s var(--ease-out,cubic-bezier(.16,1,.3,1)),box-shadow .35s ease,color .3s ease}
.foot__social a::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:linear-gradient(120deg,#2438E8,#7B5CFF 40%,#14B8C8 72%,#FF7E6E);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s ease;pointer-events:none}
.foot__social svg{width:12px;height:12px;opacity:.45;transition:transform .45s var(--ease-out,cubic-bezier(.16,1,.3,1)),opacity .3s ease}
.foot__social a:hover,.foot__social a:focus-visible{transform:translateY(-2px);color:var(--sapphire,#2438E8);box-shadow:inset 0 0 0 1px rgba(10,14,26,.03),0 10px 24px -12px rgba(36,56,232,.4)}
.foot__social a:hover::before,.foot__social a:focus-visible::before{opacity:1}
.foot__social a:hover svg,.foot__social a:focus-visible svg{opacity:1;transform:translate(2px,-2px)}
.foot__social a:focus-visible{outline:2px solid var(--sapphire,#2438E8);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.foot__social a,.foot__social svg{transition:none}.foot__social a:hover{transform:none}}
html.fx-rm .foot__social a,html.fx-rm .foot__social svg{transition:none}
html.fx-rm .foot__social a:hover{transform:none}

/* ---------- Accessibility: HUD note contrast (WCAG AA) ---------- */
.hud__note{opacity:1}

/* ---------- Very small phones (< 360 px): keep the menu button inside the bar ---------- */
@media (max-width:359px){.nav__tools .sound{display:none}}

/* ---------- Store card while the online store is not live: "Coming soon" badge ---------- */
.shop__store.is-soon{cursor:default}
.shop__soon{justify-self:start;display:inline-flex;align-items:center;gap:9px;padding:7px 14px 7px 12px;border-radius:999px;font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink,#0A0E1A);
  background:rgba(255,255,255,.74);box-shadow:inset 0 0 0 1px rgba(10,14,26,.1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.shop__soon::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:linear-gradient(120deg,#2438E8,#7B5CFF 40%,#14B8C8 72%,#FF7E6E);animation:fx-soon 2.4s ease-out infinite}
@keyframes fx-soon{0%{box-shadow:0 0 0 0 rgba(123,92,255,.5)}70%{box-shadow:0 0 0 9px rgba(123,92,255,0)}100%{box-shadow:0 0 0 0 rgba(123,92,255,0)}}
@media (prefers-reduced-motion:reduce){.shop__soon::before{animation:none}}
html.fx-rm .shop__soon::before{animation:none}

/* ---------- Category cards: photos only (no 3D switch since v13) ---------- */
.card--photo .card__stage:active{cursor:default}

/* ---------- Whole words only: no hyphenation, no mid-word breaks (v14) ---------- */
/* fx.js module 18 keeps hyphenated compounds together and shrinks text whose longest word would not fit the line */
h1,h2,h3,h4,p,li,a,label,legend,address,small,b,span,.chip,.toggle span,.btn,.mailbox__addr,.foot address{-webkit-hyphens:manual;hyphens:manual;overflow-wrap:normal;word-break:normal}
.fx-nobr{white-space:nowrap}
/* a too-long word must never widen the page on phones (mobile browsers zoom the whole page out); module 18 shrinks it instead */
html,body{overflow-x:clip}
/* hero HUD: the logo shape reads „ONE DISTRI” on its own, without the „Form” key */
.hud>.is-brand>.hud__k{display:none}
/* v17: privacy note under the forms (instead of a "consent" checkbox) and policy links in the cookie banner */
.form__privacy{margin:0;font-size:.82rem;line-height:1.5;color:var(--slate)}
.form__privacy button,.cookie__more button{font:inherit;color:var(--ink);background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.form__privacy button:hover,.cookie__more button:hover{color:#2438E8}
.cookie__more{margin:0;display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.8rem}
.legal__body .legal__date{font-size:.82rem;color:var(--slate);margin:.5rem 0 0}
.legal__body p+p{margin-top:.7em}

/* v20 — overlays scroll on short screens (menu, language panel); wheel/touch handled natively (data-lenis-prevent) */
.mmenu { max-height: calc(100vh - var(--nav-h) - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); max-height: calc(100dvh - var(--nav-h) - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow: auto; overscroll-behavior: contain; }
@media (min-width: 700px) {
  .lang__panel { max-height: calc(100vh - var(--nav-h) - 48px - env(safe-area-inset-top, 0px)); max-height: calc(100dvh - var(--nav-h) - 48px - env(safe-area-inset-top, 0px)); overflow: auto; overscroll-behavior: contain; }
}


/* v22 — photo cards: stage height from padding instead of aspect-ratio. Safari/iOS (WebKit) sized the stretched
   stage with negative margins wrongly, so the card ended ~24px too short and "Request offer" sat on its bottom edge.
   Same 4:5 box as before: (content width + 12px) × 1.25 = 125% + 15px. */
.card--photo .card__stage { aspect-ratio: auto; height: 0; padding-top: calc(125% + 15px); }

/* ---------- onedistri.ai: ilustracje kart (SVG) ---------- */
.card__art { display: block; background: #fff; }
.jos-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.card__art .va-scan { animation: va-scan 3.6s cubic-bezier(.65,0,.35,1) infinite alternate; }
@keyframes va-scan { from { transform: translateY(0); } to { transform: translateY(78px); } }
.card__art .va-flow { animation: va-flow 1.6s linear infinite; }
@keyframes va-flow { to { stroke-dashoffset: -28; } }
.card__art .va-pop, .jos-art .va-pop { transform-box: fill-box; transform-origin: center; animation: va-pop 4.8s cubic-bezier(.34,1.56,.64,1) infinite; }
@keyframes va-pop { 0%, 8% { transform: scale(0); opacity: 0; } 18%, 82% { transform: scale(1); opacity: 1; } 92%, 100% { transform: scale(0); opacity: 0; } }
.va-d0 { animation-delay: 0s !important; } .va-d1 { animation-delay: .35s !important; } .va-d2 { animation-delay: .7s !important; } .va-d3 { animation-delay: 1.05s !important; }
.card__art .va-draw, .jos-art .va-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: va-draw 5s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes va-draw { 0% { stroke-dashoffset: 1; } 40%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -1; } }
.card__art .va-pulse, .jos-art .va-pulse { transform-box: fill-box; transform-origin: center; animation: va-pulse 2.4s ease-in-out infinite; }
@keyframes va-pulse { 50% { transform: scale(1.12); opacity: .75; } }
.card__art .va-grow, .jos-art .va-grow { transform-box: fill-box; transform-origin: 50% 100%; animation: va-grow 5.4s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes va-grow { 0%, 100% { transform: scaleY(.82); } 50% { transform: scaleY(1); } }
.card__art .va-move { animation: va-move 6s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes va-move { 0%, 12% { transform: translate(0,0); } 38%, 50% { transform: translate(120px,-70px); } 76%, 88% { transform: translate(240px,-140px); } 100% { transform: translate(240px,-140px); opacity: 0; } }
.card__art .va-type circle, .jos-art .va-type circle { animation: va-type 1.2s ease-in-out infinite; }
.card__art .va-type circle:nth-child(2), .jos-art .va-type circle:nth-child(2) { animation-delay: .15s; }
.card__art .va-type circle:nth-child(3), .jos-art .va-type circle:nth-child(3) { animation-delay: .3s; }
@keyframes va-type { 50% { opacity: .25; } }
.card__art .va-lines rect { transform-box: fill-box; transform-origin: 0 50%; animation: va-line 5s cubic-bezier(.65,0,.35,1) infinite; }
.card__art .va-lines rect:nth-child(2) { animation-delay: .25s; } .card__art .va-lines rect:nth-child(3) { animation-delay: .5s; } .card__art .va-lines rect:nth-child(4) { animation-delay: .75s; }
@keyframes va-line { 0%, 10% { transform: scaleX(0); } 35%, 85% { transform: scaleX(1); } 100% { transform: scaleX(0); } }
.card__art .va-ring { stroke-dasharray: 1; stroke-dashoffset: 1; animation: va-ring 6s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes va-ring { 0% { stroke-dashoffset: 1; } 60%, 88% { stroke-dashoffset: .02; } 100% { stroke-dashoffset: 1; } }
.jos-art .va-float { animation: va-float 6s ease-in-out infinite; }
@keyframes va-float { 50% { transform: translateY(-10px); } }
html.fx-rm .card__art *, html.fx-rm .jos-art * { animation: none !important; stroke-dashoffset: 0 !important; }
@media (prefers-reduced-motion: reduce) { .card__art *, .jos-art * { animation: none !important; stroke-dashoffset: 0 !important; } }

/* ---------- onedistri.ai: znak „AI”, karta Jagoda OS, lista modułów ---------- */
.nav__logo { display: inline-flex; align-items: center; gap: 10px; }
.nav__ai { font-family: var(--font-mono, 'JetBrains Mono', monospace); font-size: 10.5px; font-weight: 600; letter-spacing: .12em; line-height: 1; padding: 5px 7px 5px 8px; border-radius: 7px; color: var(--ink, #0A0E1A); background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E) border-box; border: 1.5px solid transparent; }
.intro__ai { font-weight: inherit; background: linear-gradient(135deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* telefony: logo + plakietka AI muszą zmieścić się obok przycisków (język, dźwięk, menu) */
@media (max-width:419px){ .nav__inner{gap:6px;padding-left:12px} .nav__logo{gap:6px} .nav__logo svg{height:20px} .nav__ai{font-size:9px;letter-spacing:.08em;padding:3px 4px 3px 5px;border-radius:5px;border-width:1.25px} }
@media (max-width:369px){ .nav__tools .sound{display:none} }
.shop__store.jos .shop__media { position: absolute; inset: 0; z-index: -1; }
.shop__store.jos .shop__media .jos-art { inset: 0 0 auto 0; height: auto; aspect-ratio: 1; transform: translateY(-6%) scale(1.02); transform-origin: 50% 0; }
@media (min-width:960px){ .shop__store.jos .shop__media .jos-art { -webkit-mask-image: linear-gradient(#000 84%, transparent 100%); mask-image: linear-gradient(#000 84%, transparent 100%); } }
/* telefony i tablety (karta na całą szerokość): ilustracja Jagoda OS nad tekstem karty (nie pod nim), żeby napisy nie nachodziły na wykres */
@media (max-width:959px){
  .shop__store.jos { min-height: 0; }
  .shop__store.jos .shop__media { position: relative; inset: auto; z-index: 0; order: -1; aspect-ratio: 600 / 460; overflow: hidden; margin: calc(-1 * clamp(22px,3vw,40px)) calc(-1 * clamp(22px,3vw,40px)) 4px; }
  .shop__store.jos .shop__media .jos-art { position: absolute; inset: 0 0 auto 0; height: auto; aspect-ratio: 1; transform: translateY(-9.5%); }
}
.shop__markets .jos-list { display: grid; border-top: 1px solid rgba(10,14,26,.12); margin-top: 12px; }
.shop__markets .jos-list li { display: flex; justify-content: space-between; align-items: center; padding: 16px 2px; border-bottom: 1px solid rgba(10,14,26,.12); font-size: var(--step-1); font-weight: 480; letter-spacing: -.01em; }
.shop__markets .jos-list i { width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E); }


/* ---------- onedistri.ai · Jagoda OS v2: moduły z opisem, karta przyklejona przy przewijaniu, integracje ---------- */
.shop__markets .jos-list li { display: grid; grid-template-columns: 8px minmax(0, 1fr); column-gap: 18px; align-items: start; justify-content: initial; padding: 18px 2px; font-size: inherit; font-weight: inherit; }
.shop__markets .jos-list li > i { margin-top: .62em; }
.jos-list b { display: block; font-size: var(--step-1); font-weight: 520; letter-spacing: -.01em; line-height: 1.25; }
.jos-list p { margin-top: 5px; color: var(--graphite); font-size: .95rem; line-height: 1.5; max-width: 54ch; }
@media (min-width:960px) {
  .shop__store.jos { position: sticky; top: calc(var(--nav-h, 72px) + 28px); align-self: start; aspect-ratio: .94; min-height: 0; max-height: calc(100vh - var(--nav-h, 72px) - 56px); }
}
.jos-int { grid-column: 1 / -1; position: relative; padding: clamp(22px, 3.2vw, 44px); border-radius: 30px; background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.56)); border: 1px solid rgba(216,219,224,.9); box-shadow: 0 1px 0 rgba(10,14,26,.04), 0 34px 70px -46px rgba(10,14,26,.32); -webkit-backdrop-filter: blur(14px) saturate(1.3); backdrop-filter: blur(14px) saturate(1.3); min-width: 0; }
.jos-int::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; background: linear-gradient(120deg, rgba(36,56,232,.38), rgba(123,92,255,.18) 35%, rgba(20,184,200,.26) 70%, rgba(255,126,110,.32)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); pointer-events: none; }
.jos-int__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 14px 32px; margin-bottom: clamp(18px, 2.4vw, 30px); }
.jos-int__head .label { margin: 0 0 .7rem; }
.jos-int__title { font-size: var(--step-2); font-weight: 380; letter-spacing: -.03em; line-height: 1.12; max-width: 26ch; }
.jos-int__legend { display: flex; flex-wrap: wrap; gap: 8px 18px; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--graphite); }
.jos-int__legend span { display: inline-flex; align-items: center; gap: 8px; }
.jos-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E); }
.jos-dot.is-next { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(10,14,26,.34); }
.jos-int__grid { display: grid; gap: 26px 40px; }
.jos-int__group { min-width: 0; padding-top: 18px; border-top: 1px solid rgba(10,14,26,.1); }
.jos-int__group h4 { font-size: 1.02rem; font-weight: 600; letter-spacing: -.01em; margin-bottom: 12px; }
.jos-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.jos-chip { display: inline-grid; grid-template-columns: 7px minmax(0, auto); column-gap: 9px; align-items: start; max-width: 100%; min-height: 40px; align-content: center; padding: 8px 14px 8px 12px; border-radius: 14px; background: rgba(255,255,255,.92); border: 1px solid rgba(216,219,224,.95); box-shadow: 0 1px 2px rgba(10,14,26,.04); transition: transform .45s var(--ease-out, cubic-bezier(.16,1,.3,1)), border-color .3s, box-shadow .45s; }
.jos-chip::before { content: ""; grid-row: 1 / span 2; width: 7px; height: 7px; margin-top: .5em; border-radius: 50%; background: linear-gradient(135deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E); }
.jos-chip b, .jos-chip small { grid-column: 2; min-width: 0; }
.jos-chip b { font-size: .95rem; font-weight: 560; letter-spacing: -.01em; line-height: 1.3; }
.jos-chip small { font-size: .78rem; line-height: 1.35; color: var(--graphite); }
.jos-chip:not(.is-next):hover { transform: translateY(-2px); border-color: rgba(123,92,255,.45); box-shadow: 0 12px 26px -16px rgba(36,56,232,.4); }
.jos-chip.is-next { background: transparent; border-style: dashed; border-color: rgba(10,14,26,.22); box-shadow: none; }
.jos-chip.is-next b { font-weight: 470; color: var(--graphite); }
.jos-chip.is-next::before { background: transparent; box-shadow: inset 0 0 0 1.5px rgba(10,14,26,.32); }
.jos-int__sub { font-family: var(--font-mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--graphite); margin: 16px 0 8px; }
.jos-chips--sm .jos-chip { min-height: 34px; padding: 6px 12px 6px 11px; border-radius: 12px; }
.jos-chips--sm .jos-chip b { font-size: .88rem; }
@media (min-width:760px) { .jos-int__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .jos-int__group--wide { grid-column: 1 / -1; } }
@media (min-width:1180px) { .jos-int__grid { grid-template-columns: 1.35fr 1fr 1fr 1fr; } }
@media (prefers-reduced-motion:reduce) { .jos-chip { transition: none; } .jos-chip:hover { transform: none !important; } }
html.fx-rm .jos-chip { transition: none; }
html.fx-rm .jos-chip:hover { transform: none !important; }
.shop__more { display: grid; gap: 28px; margin-top: clamp(40px, 5vw, 72px); }
.jos-int__foot { margin-top: clamp(18px, 2.2vw, 28px); padding-top: 14px; border-top: 1px solid rgba(10,14,26,.08); font-size: .82rem; color: var(--graphite); }

/* ---------- onedistri.ai · ilustracja „Analiza procesów” (przepływ danych przez AI) ---------- */
.biz__art { display: block; }
.biz__art--m { display: none; }
@media (max-width:699px) { .biz__visual { aspect-ratio: 1 / 1; } .biz__visual::after { background: linear-gradient(180deg, #fff0 82%, #ffffffd9); } .biz__art--d { display: none; } .biz__art--m { display: block; } }
.biz__art .ba-flow { animation: ba-flow 1.6s linear infinite; }
.biz__art .ba-wave { transform-box: fill-box; transform-origin: center; animation: ba-wave 3.2s cubic-bezier(.2,.7,.2,1) infinite; }
.biz__art .ba-wave2 { animation-delay: 1.6s; }
.biz__art .ba-spin { transform-box: fill-box; transform-origin: center; animation: ba-spin 18s linear infinite; }
.biz__art .ba-dot { transform-box: fill-box; transform-origin: center; animation: ba-dot 2.4s ease-in-out infinite; }
.biz__art .ba-node { animation: ba-float 6s ease-in-out infinite; }
.biz__art .ba-ok { transform-box: fill-box; transform-origin: center; animation: ba-ok 4.8s cubic-bezier(.34,1.56,.64,1) infinite; }
.biz__art .ba-d1 { animation-delay: -1.2s; } .biz__art .ba-d2 { animation-delay: -2.4s; }
@keyframes ba-flow { to { stroke-dashoffset: -24; } }
@keyframes ba-wave { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.55); opacity: 0; } }
@keyframes ba-spin { to { transform: rotate(360deg); } }
@keyframes ba-dot { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.35); } }
@keyframes ba-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes ba-ok { 0%, 18% { transform: scale(0); opacity: 0; } 28%, 82% { transform: scale(1); opacity: 1; } 92%, 100% { transform: scale(0); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .biz__art *, .biz__art { animation: none !important; } .biz__art .ba-pk { display: none; } .biz__art .ba-ok { transform: none; opacity: 1; } }
html.fx-rm .biz__art *, html.fx-rm .biz__art { animation: none !important; }
html.fx-rm .biz__art .ba-pk { display: none; }
html.fx-rm .biz__art .ba-ok { transform: none; opacity: 1; }

/* ---------- onedistri.ai · Jagoda OS v4: logotypy integracji ---------- */
.jos-logos { display: flex; flex-wrap: wrap; gap: 10px; }
.jos-logo { position: relative; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; min-width: 112px; min-height: 70px; padding: 12px 18px; border-radius: 16px; background: rgba(255,255,255,.94); border: 1px solid rgba(216,219,224,.95); box-shadow: 0 1px 2px rgba(10,14,26,.04); text-align: center; max-width: 100%; transition: transform .45s var(--ease-out, cubic-bezier(.16,1,.3,1)), border-color .3s, box-shadow .45s; }
.jos-logo::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; background: linear-gradient(120deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); opacity: 0; transition: opacity .35s; pointer-events: none; }
.jos-logo:hover { transform: translateY(-3px); box-shadow: 0 16px 30px -18px rgba(36,56,232,.45); }
.jos-logo:hover::after { opacity: 1; }
.jos-logo__mark { display: inline-flex; align-items: center; gap: 9px; }
.jos-logo__img { display: block; width: auto; max-width: 168px; object-fit: contain; }
.jos-logo b { font-size: .95rem; font-weight: 600; letter-spacing: -.01em; line-height: 1.25; color: var(--ink, #0A0E1A); }
.jos-logo small { display: block; font-size: .74rem; line-height: 1.35; color: var(--graphite); max-width: 230px; }
.jos-logo small .jos-sep { margin: 0 .35em; }
.jos-logo.is-text { min-width: 0; }
.jos-logo.is-text b { font-size: .92rem; }
@media (max-width:520px) { .jos-logos { gap: 8px; } .jos-logo { min-width: 0; min-height: 64px; padding: 12px 14px; flex: 1 1 calc(50% - 4px); } .jos-logo__img { max-width: 132px; } }
@media (prefers-reduced-motion: reduce) { .jos-logo { transition: none; } .jos-logo:hover { transform: none; } }
html.fx-rm .jos-logo { transition: none; }
html.fx-rm .jos-logo:hover { transform: none; }

/* ---------- onedistri.ai · Jagoda OS v5: wspólny opis marketplace'ów (fulfilment + własny magazyn) ---------- */
.jos-int__gh { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 12px; }
.jos-int__gh h4 { margin-bottom: 0; }
.jos-int__tags { display: flex; flex-wrap: wrap; gap: 6px 8px; list-style: none; margin: 0; padding: 0; }
.jos-int__tags li { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px 5px 10px; border-radius: 999px; font-size: .8rem; font-weight: 500; line-height: 1.3; color: var(--graphite, #3B4252); background: rgba(255,255,255,.75); border: 1px solid rgba(10,14,26,.1); }
.jos-int__tags li::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: linear-gradient(135deg, #2438E8, #7B5CFF 40%, #14B8C8 72%, #FF7E6E); }
@media (max-width:520px) { .jos-int__gh { gap: 8px; } .jos-int__tags li { font-size: .76rem; padding: 4px 10px 4px 9px; } }
@media (max-width:380px) { .jos-logo { padding: 12px 10px; } .jos-logo__mark { max-width: 100%; min-width: 0; } .jos-logo__img { min-width: 0; max-width: 100%; } }
/* Fulfillment: 4 programy (FBA, One Fulfillment by Allegro, eMAG, Pigu) w kafelkach równej szerokości — 1 lub 2 kolumny zależnie od miejsca, min. 140 px, żeby logo One Fulfillment było czytelne */
.jos-int__group--ful .jos-logos { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.jos-int__group--ful .jos-logo { min-width: 0; }
.jos-int__group--ful .jos-logo__mark { width: 100%; justify-content: center; min-width: 0; }
.jos-int__group--ful .jos-logo__img { min-width: 0; max-width: 100%; }