/* Generated bundle. Edit source files listed in includes/front-asset-map.php, then rebuild. */ /* SOURCE: assets/css/home-flow.css */ .mzs-hero { position: relative; min-height: max(760px, 100svh); display: grid; align-items: center; padding: calc(var(--mzs-nav-visual-start, var(--mzs-nav-height-start)) + 70px) 0 90px; } .mzs-hero-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(360px, .88fr); align-items: center; gap: clamp(44px, 8vw, 118px); } .mzs-hero-copy h1 { margin: 0; max-width: 900px; font-size:var(--mzs-h1-size); font-weight: 570; line-height: .98; letter-spacing: -.07em; text-wrap: balance; } .mzs-hero-copy h1 span { display: block; color: var(--mzs-title-accent); } .mzs-hero-copy .mzs-lead { max-width: 720px; margin: 30px 0 0; color: var(--mzs-text-soft); font-size: var(--mzs-lead); line-height: 1.7; } .mzs-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; } .mzs-hero-object { position: relative; width: min(100%, 510px); aspect-ratio: 1; display: grid; place-items: center; justify-self: end; } .mzs-hero-rings { position: absolute; inset: 0; animation: mzs-turn 25s linear infinite; } .mzs-hero-rings i { position: absolute; inset: 50%; border: 1px solid color-mix(in srgb, var(--mzs-aqua) 24%, transparent); border-radius: 50%; transform: translate(-50%, -50%); } .mzs-hero-rings i:nth-child(1) { width: 95%; height: 95%; } .mzs-hero-rings i:nth-child(2) { width: 72%; height: 72%; border-color: color-mix(in srgb, var(--mzs-gold) 28%, transparent); } .mzs-hero-rings i:nth-child(3) { width: 49%; height: 49%; } .mzs-hero-rings i:nth-child(4) { width: 22%; height: 22%; background: color-mix(in srgb, var(--mzs-aqua) 5%, transparent); } .mzs-hero-rings i::before { content: ""; position: absolute; width: 8px; height: 8px; top: -4px; left: 50%; border-radius: 50%; background: var(--mzs-gold); box-shadow: 0 0 24px color-mix(in srgb, var(--mzs-gold) 65%, transparent); } .mzs-hero-object-core { position: relative; z-index: 2; width: 54%; text-align: center; } .mzs-hero-object-core small { color: var(--mzs-gold); font-size:var(--mzs-micro); font-weight: 850; letter-spacing: .13em; text-transform: uppercase; } .mzs-hero-object-core strong { display: block; margin: 12px 0; font-size: clamp(34px, 4vw, 58px); font-weight: 530; line-height: .92; letter-spacing: -.06em; text-transform: uppercase; } .mzs-hero-object-core span { display: block; color: var(--mzs-text-soft); font-size:var(--mzs-micro); line-height: 1.65; text-transform: uppercase; letter-spacing: .08em; } .mzs-hero-code { position: absolute; inset: auto 0 4%; display: flex; justify-content: space-between; color: color-mix(in srgb, var(--mzs-text-soft) 86%, transparent); font-size:var(--mzs-micro); letter-spacing: .12em; text-transform: uppercase; } .mzs-scroll-cue { position: absolute; left: 50%; bottom: 28px; display: inline-flex; align-items: center; gap: 14px; padding: 8px 12px; border: 1px solid transparent; border-radius: 999px; transform: translateX(-50%); color: var(--mzs-text-soft); font-size:var(--mzs-micro); font-weight: 850; letter-spacing: .12em; text-transform: uppercase; transition: color .22s var(--mzs-ease), background-color .22s var(--mzs-ease), border-color .22s var(--mzs-ease), transform .22s var(--mzs-ease), box-shadow .22s var(--mzs-ease); } .mzs-scroll-cue i { width: 36px; height: 1px; background: linear-gradient(90deg, color-mix(in srgb, var(--mzs-gold) 86%, transparent), color-mix(in srgb, var(--mzs-aqua) 78%, transparent)); animation: mzs-pulse-line 1.8s ease-in-out infinite; } @keyframes mzs-turn { to { transform: rotate(360deg); } } @keyframes mzs-pulse-line { 0%,100% { transform: scaleX(.4); opacity: .55; } 50% { transform: scaleX(1); opacity: 1; } } @media(max-width:960px) { .mzs-hero { min-height:auto; padding:calc(var(--mzs-nav-visual-start,var(--mzs-nav-height-mobile)) + 44px) 0 70px; } .mzs-hero-grid { grid-template-columns:minmax(0,1fr); gap:34px; width:100%; } .mzs-hero-grid>* { min-width:0; width:100%; max-width:100%; } .mzs-hero-copy { min-width:0; text-align:center; } .mzs-hero-copy h1 { max-width:13ch; margin-inline:auto; font-size:var(--mzs-h1-size); line-height:1.02; letter-spacing:-.052em; overflow-wrap:normal; word-break:normal; } .mzs-hero-copy .mzs-lead { max-width:36ch; margin:20px auto 0; font-size:17px; line-height:1.64; overflow-wrap:normal; word-break:normal; } .mzs-hero-actions { justify-content:center; margin-top:26px; } .mzs-hero-object { width:min(100%,360px); justify-self:center; margin-inline:auto; } .mzs-scroll-cue { display:none; } } /* SOURCE: assets/css/capabilities.css */ /* Z Serca Mazur — capability map owner. */ .mzs-capability-map{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.42fr);gap:clamp(28px,5vw,72px);align-items:center;min-height:680px;margin-top:clamp(40px,6vw,86px)} .mzs-capability-lines{position:absolute;inset:0;width:calc(68% - 20px);height:100%;pointer-events:none;overflow:visible} .mzs-capability-lines path{fill:none;stroke:color-mix(in srgb,var(--mzs-line) 58%,transparent);stroke-width:1;transition:stroke .28s,opacity .28s,stroke-width .28s} .mzs-capability-lines path.is-selected{stroke:var(--mzs-aqua);stroke-width:1.8;filter:drop-shadow(0 0 7px color-mix(in srgb,var(--mzs-aqua) 54%,transparent));stroke-dasharray:7 8;animation:mzs-dash-flow 1.1s linear infinite}.mzs-capability-lines path.is-related{stroke:var(--mzs-gold);stroke-width:1.45;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--mzs-gold) 38%,transparent));stroke-dasharray:4 10;animation:mzs-dash-flow 1.45s linear infinite} .mzs-capability-nodes{position:relative;min-height:620px} .mzs-capability-core{position:absolute;left:50%;top:50%;width:190px;height:190px;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;text-align:center;padding:28px;background:radial-gradient(circle at 32% 26%,color-mix(in srgb,var(--mzs-aqua) 18%,transparent),transparent 40%),linear-gradient(145deg,var(--mzs-surface-soft),var(--mzs-bg-bottom));border:1px solid color-mix(in srgb,var(--mzs-aqua) 44%,transparent);box-shadow:0 0 0 18px color-mix(in srgb,var(--mzs-aqua) 2%,transparent),0 32px 80px rgba(0,8,10,.25);z-index:3} .mzs-capability-core::after{content:"";position:absolute;inset:-20px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--mzs-gold) 24%,transparent);animation:mzs-orbit-spin 28s linear infinite} .mzs-capability-core strong{font-size:20px;line-height:1.1;color:#fff}.mzs-capability-core span{display:block;margin-top:8px;font-size:var(--mzs-micro);color:var(--mzs-aqua)} .mzs-capability-node{--mzs-cap-node-bg:color-mix(in srgb,var(--mzs-surface) 26%,transparent);position:absolute;width:clamp(136px,10.8vw,166px);min-height:64px;display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:9px;padding:12px 14px;border:0;border-radius:var(--mzs-radius-soft,18px);background:var(--mzs-cap-node-bg);background-color:var(--mzs-cap-node-bg);background-image:none;color:var(--mzs-text);text-align:left;cursor:pointer;box-shadow:none;transform:translate(-50%,-50%);transition:background-color .22s var(--mzs-ease),color .22s var(--mzs-ease)} .mzs-capability-node small{display:grid;place-items:center;width:28px;height:28px;margin:0;border-radius:50%;border:1px solid color-mix(in srgb,var(--mzs-gold) 45%,transparent);background:transparent;color:var(--mzs-gold);font-size:var(--mzs-micro);font-weight:850;letter-spacing:.04em}.mzs-capability-node strong{position:relative;display:block;color:#fff;font-size:var(--mzs-small);line-height:1.18;text-decoration:none}.mzs-capability-node strong::after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:var(--mzs-aqua);transition:right .22s var(--mzs-ease)}.mzs-capability-node span{display:none} .mzs-page.mzs-page .mzs-capability-node:focus-visible strong::after{right:0}.mzs-capability-node.is-related{--mzs-cap-node-bg:color-mix(in srgb,var(--mzs-surface) 34%,transparent)} .mzs-page.mzs-page .mzs-capability-node.is-selected{--mzs-cap-node-bg:color-mix(in srgb,var(--mzs-surface-soft) 48%,var(--mzs-bg-bottom));background:var(--mzs-cap-node-bg);background-color:var(--mzs-cap-node-bg);background-image:none;border:0;box-shadow:none}.mzs-capability-node.is-selected strong::after{right:0}.mzs-capability-node.is-selected small{background:transparent;border-color:color-mix(in srgb,var(--mzs-gold) 58%,transparent);color:var(--mzs-gold)} .mzs-capability-node.is-dimmed{--mzs-cap-node-bg:color-mix(in srgb,var(--mzs-surface) 14%,transparent);opacity:.7} .mzs-capability-selection{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,4vw,48px);border-left:1px solid color-mix(in srgb,var(--mzs-line) 62%,transparent)} .mzs-capability-selection>small{color:var(--mzs-gold);font-size:var(--mzs-eyebrow);font-weight:850;letter-spacing:.12em;text-transform:uppercase} .mzs-capability-selection h3{margin:14px 0 0;color:#fff;font-size:var(--mzs-h3-size);line-height:1.04;letter-spacing:-.035em}.mzs-capability-selection p{margin:17px 0 0;color:var(--mzs-text-soft);line-height:1.7} .mzs-capability-selection [data-capability-selection]{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0} .mzs-capability-selection-chip{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:7px 8px 7px 11px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 36%,transparent);border-radius:var(--mzs-radius-pill,999px);background:color-mix(in srgb,var(--mzs-aqua) 9%,transparent);color:#fff;font:inherit;font-size:var(--mzs-micro);font-weight:700;cursor:pointer}.mzs-capability-selection-chip>span{min-width:0}.mzs-capability-selection-chip>i{width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--mzs-gold) 12%,transparent);color:var(--mzs-gold);font:900 15px/1 Arial,sans-serif}.mzs-capability-selection-chip:focus-visible{outline:2px solid color-mix(in srgb,var(--mzs-aqua) 68%,transparent);outline-offset:2px} .mzs-individual-note{margin-top:22px;padding-top:20px;border-top:1px solid color-mix(in srgb,var(--mzs-line) 56%,transparent);color:var(--mzs-text-soft);font-size:var(--mzs-small);line-height:1.65} /* Current renderer alignment */ .mzs-capability-stage{position:relative;min-height:680px} .mzs-capability-stage .mzs-capability-lines{inset:0;width:100%;height:100%} .mzs-capability-stage .mzs-capability-nodes{position:absolute;inset:0;min-height:0} .mzs-capability-stage .mzs-capability-core{z-index:4} .mzs-capability-core>span,.mzs-capability-core>i{position:absolute;border-radius:50%;border:1px solid color-mix(in srgb,var(--mzs-aqua) 28%,transparent)} .mzs-capability-core>span{inset:21px}.mzs-capability-core>i{inset:42px;border-color:color-mix(in srgb,var(--mzs-gold) 38%,transparent)} .mzs-capability-core>strong{position:relative;z-index:2;max-width:8ch;font-size:17px;line-height:1.05} @media (min-width:761px) and (max-width:1100px){ .mzs-capability-map{grid-template-columns:minmax(0,1fr);gap:30px;align-items:start} .mzs-capability-selection{align-self:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.72fr);column-gap:32px;row-gap:10px;justify-content:stretch;padding:28px 0 0;border-left:0;border-top:1px solid color-mix(in srgb,var(--mzs-line) 62%,transparent)} .mzs-capability-selection>small,.mzs-capability-selection h3,.mzs-capability-selection p,.mzs-capability-selection [data-capability-selection]{grid-column:1} .mzs-capability-selection .mzs-action,.mzs-capability-selection .mzs-individual-note{grid-column:2} .mzs-capability-selection .mzs-action{grid-row:2 / span 2;align-self:end;justify-self:stretch;margin-top:0} .mzs-capability-selection .mzs-individual-note{grid-row:4 / span 2;margin-top:0;padding-top:14px} } @media (hover:hover) and (pointer:fine){ .mzs-page.mzs-page .mzs-capability-node:hover strong::after{right:0} } /* Home mobile is a horizontal-card product; desktop geometry is not scaled down. */ @media(max-width:760px), (max-width:900px) and (max-height:520px){ .mzs-capabilities-section .mzs-section-intro h2{width:100%;max-width:100%;font-size:clamp(36px,10vw,44px);line-height:1.02;text-wrap:pretty} .mzs-capability-map{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;min-height:0;margin-top:32px} .mzs-capability-stage{min-height:0} .mzs-capability-lines,.mzs-capability-core{display:none} .mzs-capability-nodes-shell{display:block;width:100%;min-width:0;max-width:100%;--mzs-mobile-rail-card:calc(100% - 34px)} .mzs-capability-stage .mzs-capability-nodes{position:static;inset:auto;width:100%;min-width:0;max-width:100%;min-height:0} .mzs-capability-stage .mzs-capability-node{min-width:var(--mzs-mobile-rail-card);max-width:var(--mzs-mobile-rail-card)} .mzs-capability-node,.mzs-page.mzs-page .mzs-capability-node{position:relative;left:auto;top:auto;min-height:286px;display:grid;grid-template-columns:1fr;grid-template-rows:auto auto 1fr auto;align-content:center;justify-items:center;gap:12px;padding:30px 24px 26px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 22%,transparent);border-radius:28px;background:radial-gradient(circle at 50% 18%,color-mix(in srgb,var(--mzs-aqua) 9%,transparent),transparent 38%),linear-gradient(160deg,color-mix(in srgb,var(--mzs-surface-soft) 46%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 82%,transparent));color:var(--mzs-text);text-align:center;transform:none;opacity:1;pointer-events:auto;box-shadow:0 20px 54px rgba(0,10,12,.16)} .mzs-capability-node::after{content:"Wybierz";align-self:end;margin-top:6px;color:var(--mzs-aqua);font-size:12px;font-weight:820;letter-spacing:.08em;text-transform:uppercase} .mzs-capability-node small{width:38px;height:38px;font-size:12px} .mzs-capability-node strong{width:100%;max-width:17ch;min-width:0;font-size:24px;line-height:1.08;letter-spacing:-.025em} .mzs-capability-node span{display:block;width:100%;max-width:29ch;min-width:0;color:var(--mzs-text-soft);font-size:15px;line-height:1.58} .mzs-capability-node strong::after{display:none} .mzs-capability-node.is-selected,.mzs-page.mzs-page .mzs-capability-node.is-selected{border:1px solid color-mix(in srgb,var(--mzs-aqua) 58%,transparent);background:radial-gradient(circle at 50% 18%,color-mix(in srgb,var(--mzs-aqua) 16%,transparent),transparent 42%),linear-gradient(160deg,color-mix(in srgb,var(--mzs-surface-soft) 64%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 78%,transparent));box-shadow:0 0 0 4px color-mix(in srgb,var(--mzs-aqua) 5%,transparent),0 22px 58px rgba(0,10,12,.2)} .mzs-capability-node.is-selected::after{content:"Wybrano";color:var(--mzs-gold)} .mzs-capability-node.is-dimmed{opacity:1} .mzs-capability-selection{display:flex;align-self:auto;align-items:center;min-height:0;margin-top:2px;padding:24px 22px;text-align:center;border:1px solid color-mix(in srgb,var(--mzs-line) 64%,transparent);border-radius:24px;background:linear-gradient(160deg,color-mix(in srgb,var(--mzs-surface-soft) 38%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 72%,transparent));box-shadow:0 18px 50px rgba(0,10,12,.12)} .mzs-capability-selection>small{font-size:11px} .mzs-capability-selection h3{max-width:18ch;margin-top:10px;font-size:28px;line-height:1.03} .mzs-capability-selection p{max-width:32ch;margin:13px auto 0;font-size:15px;line-height:1.58} .mzs-capability-selection [data-capability-selection]{justify-content:center;margin:16px 0 2px;gap:7px} .mzs-capability-selection [data-capability-selection] span{padding:7px 10px;font-size:11px} .mzs-capability-selection .mzs-action{width:100%;margin-top:18px;justify-content:center} .mzs-individual-note{width:100%;margin-top:18px;padding-top:17px;font-size:13px;line-height:1.55;text-align:center} } @keyframes mzs-dash-flow{to{stroke-dashoffset:-30}} @keyframes mzs-orbit-spin{to{transform:rotate(360deg)}} /* SOURCE: assets/css/ecosystem-evidence.css */ /* Owned media + facts — one public owner for project identity, metrics and proof. */ .mzs-ecosystem-evidence{position:relative;padding:clamp(72px,7vw,108px) 0;border-block:1px solid color-mix(in srgb,var(--mzs-line) 24%,transparent);overflow:hidden} .mzs-ecosystem-evidence::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% 8%,color-mix(in srgb,var(--mzs-aqua) 8%,transparent),transparent 30%),radial-gradient(circle at 8% 70%,color-mix(in srgb,var(--mzs-gold) 4%,transparent),transparent 28%);pointer-events:none} .mzs-ecosystem-evidence>.mzs-shell{position:relative;z-index:1} .mzs-ecosystem-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px clamp(34px,5vw,72px);align-items:end} .mzs-ecosystem-head-copy{min-width:0}.mzs-ecosystem-head-copy>.mzs-eyebrow{margin:0 0 13px}.mzs-ecosystem-head-copy h2{max-width:15ch;margin:0;font-size:var(--mzs-h2-size);line-height:.98;letter-spacing:-.055em}.mzs-ecosystem-head-copy>p:last-child{max-width:60ch;margin:18px 0 0;color:var(--mzs-text-soft);font-size:16px;line-height:1.62} .mzs-ecosystem-head-status{display:grid;justify-items:end;padding-bottom:3px} .mzs-ecosystem-update{display:grid;grid-template-columns:12px auto 1fr;align-items:center;gap:4px 8px;max-width:100%;padding:8px 11px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 18%,transparent);border-radius:16px;background:color-mix(in srgb,var(--mzs-surface) 20%,transparent);font-size:10px;line-height:1.2}.mzs-ecosystem-update>span{width:7px;height:7px;border-radius:50%;background:var(--mzs-aqua);box-shadow:0 0 0 4px color-mix(in srgb,var(--mzs-aqua) 9%,transparent)}.mzs-ecosystem-update>strong{color:var(--mzs-text-soft);font-size:9px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.mzs-ecosystem-update>time{color:var(--mzs-aqua);font-weight:800;white-space:nowrap}.mzs-ecosystem-update>em{grid-column:2/-1;color:var(--mzs-text-soft);font-size:9px;font-style:normal} .mzs-ecosystem-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:clamp(28px,3.6vw,42px)} .mzs-ecosystem-summary-item{position:relative;min-width:0;min-height:105px;display:grid;align-content:center;gap:5px;padding:17px 20px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 18%,transparent);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--mzs-surface) 24%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 12%,transparent));overflow:hidden}.mzs-ecosystem-summary-item::after{content:"";position:absolute;right:-46px;bottom:-62px;width:122px;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--mzs-aqua) 9%,transparent);border-radius:50%}.mzs-ecosystem-summary-item.is-audio::after{border-color:color-mix(in srgb,var(--mzs-gold) 15%,transparent)} .mzs-ecosystem-summary-item>strong{position:relative;z-index:1;color:var(--mzs-aqua);font-size:clamp(28px,2.6vw,40px);font-weight:950;line-height:.96;letter-spacing:-.05em;font-variant-numeric:tabular-nums}.mzs-ecosystem-summary-value-mobile{display:none}.mzs-ecosystem-summary-item>span{position:relative;z-index:1;color:var(--mzs-text);font-size:12px;font-weight:760;line-height:1.28}.mzs-ecosystem-summary-short{display:none} .mzs-ecosystem-projects-shell{margin-top:clamp(28px,3.8vw,46px);--mzs-mobile-rail-card:calc(100% - 42px)} .mzs-ecosystem-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} .mzs-ecosystem-project-card{position:relative;min-width:0;min-height:520px;display:grid;grid-template-rows:190px 1fr;border:1px solid color-mix(in srgb,var(--mzs-aqua) 20%,transparent);border-radius:28px;background:linear-gradient(160deg,color-mix(in srgb,var(--mzs-surface) 42%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 28%,transparent));overflow:hidden;isolation:isolate} .mzs-ecosystem-project-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--mzs-aqua) 4%,transparent),transparent 34%),radial-gradient(circle at 78% 8%,color-mix(in srgb,var(--mzs-aqua) 8%,transparent),transparent 34%);pointer-events:none;z-index:0} .mzs-ecosystem-project-card::after{content:"";position:absolute;right:-82px;top:-72px;width:230px;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--mzs-aqua) 10%,transparent);border-radius:50%;pointer-events:none;z-index:0} .mzs-ecosystem-project-visual{position:relative;z-index:1;display:grid;place-items:center;min-height:0;overflow:hidden;border-bottom:1px solid color-mix(in srgb,var(--mzs-line) 19%,transparent)} .mzs-ecosystem-project-visual::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--mzs-aqua) 8%,transparent),transparent 62%);pointer-events:none} .mzs-ecosystem-project-logo{position:relative;display:grid;place-items:center;width:min(72%,210px);height:82%;overflow:hidden;isolation:isolate;opacity:.96;-webkit-mask-image:radial-gradient(ellipse at center,#000 48%,rgba(0,0,0,.88) 62%,transparent 86%);mask-image:radial-gradient(ellipse at center,#000 48%,rgba(0,0,0,.88) 62%,transparent 86%)} .mzs-ecosystem-project-logo img,.mzs-ecosystem-project-logo .mzs-project-logo-plain{display:block;width:100%;height:100%;max-width:none;max-height:none;padding:8px;object-fit:contain;object-position:center;border:0;background:transparent;box-shadow:none;filter:saturate(.98) contrast(1.03)} .mzs-ecosystem-project-logo .mzs-project-mark-plain{display:grid;place-items:center;width:100%;height:100%;color:var(--mzs-aqua);font-size:34px;font-weight:950;letter-spacing:.03em} .mzs-ecosystem-project-body{position:relative;z-index:1;display:grid;grid-template-rows:auto auto 1fr auto;align-content:start;min-height:0;padding:20px 22px 21px} .mzs-ecosystem-project-identity{text-align:center}.mzs-ecosystem-project-identity small{display:block;color:var(--mzs-gold);font-size:9px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;line-height:1.35}.mzs-ecosystem-project-identity h3{margin:7px 0 0;color:var(--mzs-text);font-size:clamp(22px,1.75vw,28px);line-height:1.06;letter-spacing:-.035em} .mzs-ecosystem-project-copy{max-width:40ch;margin:11px auto 0;color:color-mix(in srgb,var(--mzs-text) 82%,var(--mzs-text-soft));font-size:12.5px;line-height:1.5;text-align:center} .mzs-ecosystem-proof-list{display:grid;align-content:start;gap:0;margin:15px 0 0;padding:0;border-top:1px solid color-mix(in srgb,var(--mzs-line) 25%,transparent)}.mzs-ecosystem-proof-list>div{min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:4px;align-items:start;padding:11px 0;border-bottom:1px solid color-mix(in srgb,var(--mzs-line) 18%,transparent)}.mzs-ecosystem-proof-list dt{min-width:0;display:flex;align-items:flex-start;gap:8px;margin:0}.mzs-ecosystem-proof-list dt>strong{min-width:0;color:var(--mzs-aqua);font-size:15px;font-weight:950;line-height:1.12;letter-spacing:-.02em;white-space:normal;overflow-wrap:anywhere}.mzs-ecosystem-proof-list dd{min-width:0;display:grid;gap:2px;margin:0;padding-left:31px;color:var(--mzs-text-soft);font-size:10.5px;font-weight:650;line-height:1.35;overflow-wrap:anywhere}.mzs-ecosystem-proof-list dd>small{color:color-mix(in srgb,var(--mzs-text-soft) 68%,transparent);font-size:9px;line-height:1.3} .mzs-evidence-google-mark,.mzs-proof-symbol{flex:0 0 auto;width:23px;height:23px;display:grid;place-items:center;border-radius:50%;line-height:1}.mzs-evidence-google-mark svg{display:block;width:15px;height:15px}.mzs-proof-symbol{border:1px solid color-mix(in srgb,var(--mzs-aqua) 24%,transparent);background:color-mix(in srgb,var(--mzs-aqua) 8%,transparent);color:var(--mzs-aqua);font-size:11px;font-weight:950}.mzs-ecosystem-proof-list .is-social .mzs-proof-symbol{font-family:Arial,sans-serif;font-size:13px}.mzs-ecosystem-proof-list .is-google dt>strong{color:var(--mzs-text)}.mzs-ecosystem-proof-list .is-seo dt>strong{color:var(--mzs-gold)} /* Parent/group card: it represents the ecosystem itself, so it uses space for identity instead of empty proof rows. */ .mzs-ecosystem-project-card.is-group-root{grid-template-rows:236px minmax(0,1fr)} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-logo{width:min(88%,268px);height:94%;opacity:1;-webkit-mask-image:radial-gradient(ellipse at center,#000 55%,rgba(0,0,0,.92) 69%,transparent 92%);mask-image:radial-gradient(ellipse at center,#000 55%,rgba(0,0,0,.92) 69%,transparent 92%)} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-logo img,.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-logo .mzs-project-logo-plain{padding:2px} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-body{display:flex;flex-direction:column;align-items:center;min-height:0;padding:22px 24px 20px;text-align:center} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-identity h3{margin-top:0;font-size:clamp(25px,2vw,31px)} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-copy{max-width:35ch;margin:18px auto 0;font-size:13px;line-height:1.58} .mzs-ecosystem-project-root-meta{width:100%;margin-top:auto;padding-top:18px;text-align:center} .mzs-ecosystem-project-root-meta small{display:inline-block;color:var(--mzs-gold);font-size:9px;font-weight:900;line-height:1.35;letter-spacing:.12em;text-transform:uppercase} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-actions{margin-top:12px;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--mzs-line) 20%,transparent)} .mzs-ecosystem-project-actions{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;margin-top:15px}.mzs-ecosystem-project-actions>.mzs-ecosystem-project-link{margin-left:auto}.mzs-project-socials{justify-content:flex-start}.mzs-project-socials .mzs-social-link{width:29px;height:29px}.mzs-project-socials .mzs-social-link svg{width:14px;height:14px}.mzs-ecosystem-project-link{display:inline-flex;width:max-content;max-width:100%;align-items:center;gap:8px;margin:0;color:var(--mzs-aqua);font-size:11px;font-weight:850;letter-spacing:.02em;text-decoration:none}.mzs-ecosystem-project-link span{color:var(--mzs-gold)} .mzs-ecosystem-development{margin-top:clamp(28px,3.5vw,42px);padding-top:21px;border-top:1px solid color-mix(in srgb,var(--mzs-line) 25%,transparent)} .mzs-ecosystem-development-head{display:flex;align-items:baseline;gap:10px 16px;flex-wrap:wrap;margin-bottom:14px}.mzs-ecosystem-development-head>small{color:var(--mzs-gold);font-size:9px;font-weight:900;letter-spacing:.13em}.mzs-ecosystem-development-head>strong{color:var(--mzs-text);font-size:15px;line-height:1.3} .mzs-ecosystem-development-shell{--mzs-mobile-rail-card:calc(100% - 42px)} .mzs-ecosystem-development-track{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px} .mzs-ecosystem-development-card{position:relative;min-width:0;min-height:150px;display:grid;grid-template-columns:152px minmax(0,1fr);align-items:stretch;border:1px solid color-mix(in srgb,var(--mzs-gold) 15%,transparent);border-radius:22px;background:linear-gradient(145deg,color-mix(in srgb,var(--mzs-surface) 20%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 11%,transparent));overflow:hidden;isolation:isolate} .mzs-ecosystem-development-card::after{content:"";position:absolute;right:-54px;bottom:-72px;width:164px;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--mzs-gold) 9%,transparent);border-radius:50%;pointer-events:none} .mzs-ecosystem-development-visual{position:relative;z-index:1;display:grid;place-items:center;min-width:0;border-right:1px solid color-mix(in srgb,var(--mzs-line) 18%,transparent);overflow:hidden}.mzs-ecosystem-development-visual::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--mzs-aqua) 8%,transparent),transparent 68%)} .mzs-ecosystem-development-logo{position:relative;z-index:1;display:grid;place-items:center;width:82%;height:82%;opacity:.95;-webkit-mask-image:radial-gradient(ellipse at center,#000 50%,rgba(0,0,0,.88) 64%,transparent 88%);mask-image:radial-gradient(ellipse at center,#000 50%,rgba(0,0,0,.88) 64%,transparent 88%)} .mzs-ecosystem-development-logo img,.mzs-ecosystem-development-logo .mzs-project-logo-plain{display:block;width:100%;height:100%;padding:8px;object-fit:contain;object-position:center;background:transparent;border:0;box-shadow:none}.mzs-ecosystem-development-logo .mzs-project-mark-plain{display:grid;place-items:center;color:var(--mzs-aqua);font-size:24px;font-weight:950} .mzs-ecosystem-development-body{position:relative;z-index:1;min-width:0;display:grid;align-content:center;gap:7px;padding:17px 18px}.mzs-ecosystem-development-body>small{color:var(--mzs-gold);font-size:8.5px;font-weight:900;letter-spacing:.12em}.mzs-ecosystem-development-title,.mzs-ecosystem-development-body>h3{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;margin:0;color:var(--mzs-text);font-size:20px;font-weight:820;line-height:1.1;letter-spacing:-.03em;text-decoration:none}.mzs-ecosystem-development-title span{color:var(--mzs-aqua);font-size:12px} .mzs-ecosystem-development-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}.mzs-ecosystem-development-chips>span{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:5px 9px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 18%,transparent);border-radius:999px;color:var(--mzs-text-soft);font-size:10px;line-height:1.15}.mzs-ecosystem-development-chips .mzs-evidence-google-mark{width:18px;height:18px;padding:3px}.mzs-ecosystem-development-chips i{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:color-mix(in srgb,var(--mzs-aqua) 10%,transparent);color:var(--mzs-aqua);font:800 11px/1 Arial,sans-serif}.mzs-ecosystem-development-chips b{font-weight:730} .mzs-ecosystem-source-note{max-width:94ch;margin:16px 0 0;color:color-mix(in srgb,var(--mzs-text-soft) 67%,transparent);font-size:9.5px;line-height:1.5}.mzs-ecosystem-evidence .mzs-view-bridge-archive{margin-top:clamp(30px,4vw,48px)} @media(hover:hover) and (pointer:fine){.mzs-ecosystem-project-card,.mzs-ecosystem-development-card{transition:transform .2s,border-color .2s,background-color .2s}.mzs-ecosystem-project-card:hover,.mzs-ecosystem-development-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--mzs-aqua) 30%,transparent)}.mzs-ecosystem-project-link:hover,.mzs-ecosystem-development-title:hover{color:var(--mzs-gold)}} .mzs-ecosystem-project-link:focus-visible,.mzs-ecosystem-development-title:focus-visible{outline:2px solid color-mix(in srgb,var(--mzs-aqua) 70%,transparent);outline-offset:3px} @media(min-width:1121px){.mzs-ecosystem-projects{display:flex;flex-wrap:wrap;justify-content:center}.mzs-ecosystem-project-card{flex:0 1 calc((100% - 28px)/3);width:calc((100% - 28px)/3);max-width:calc((100% - 28px)/3)}} @media(max-width:1120px) and (min-width:761px){.mzs-ecosystem-projects{grid-template-columns:repeat(2,minmax(0,1fr))}.mzs-ecosystem-project-card{min-height:500px}} @media(max-width:900px) and (min-width:761px){.mzs-ecosystem-development-track{grid-template-columns:1fr}.mzs-ecosystem-development-card{grid-template-columns:136px minmax(0,1fr)}} @media(max-width:760px), (max-width:900px) and (max-height:520px){ .mzs-ecosystem-evidence{padding:62px 0 72px} .mzs-ecosystem-head{grid-template-columns:1fr;gap:16px}.mzs-ecosystem-head-copy h2{max-width:13ch;font-size:36px}.mzs-ecosystem-head-copy>p:last-child{max-width:33ch;margin-top:14px;font-size:15px;line-height:1.58}.mzs-ecosystem-head-status{justify-items:start}.mzs-ecosystem-update{grid-template-columns:10px auto;gap:5px 7px;padding:7px 10px}.mzs-ecosystem-update>time{grid-column:2;white-space:normal}.mzs-ecosystem-update>em{grid-column:2} .mzs-ecosystem-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:24px}.mzs-ecosystem-summary-item{min-height:78px;padding:12px 10px;border-radius:17px;text-align:center}.mzs-ecosystem-summary-item>strong{font-size:19px;white-space:nowrap}.mzs-ecosystem-summary-value-full{display:none}.mzs-ecosystem-summary-value-mobile{display:inline}.mzs-ecosystem-summary-label{display:none}.mzs-ecosystem-summary-item>.mzs-ecosystem-summary-short{display:block;font-size:9.5px;font-weight:720;line-height:1.15} .mzs-ecosystem-projects-shell{margin-top:24px;--mzs-mobile-rail-card:calc(100% - 30px)} .mzs-ecosystem-projects{display:flex;grid-template-columns:none;gap:13px}.mzs-ecosystem-project-card{min-height:610px;grid-template-rows:50% 50%;padding:0;border-radius:26px;scroll-snap-align:start}.mzs-ecosystem-project-visual{min-height:0}.mzs-ecosystem-project-logo{width:86%;height:88%;opacity:.96}.mzs-ecosystem-project-logo img,.mzs-ecosystem-project-logo .mzs-project-logo-plain{padding:10px}.mzs-ecosystem-project-logo .mzs-project-mark-plain{font-size:42px} .mzs-ecosystem-project-body{padding:18px 18px 19px}.mzs-ecosystem-project-identity h3{font-size:25px}.mzs-ecosystem-project-identity small{font-size:8.5px}.mzs-ecosystem-project-copy{max-width:31ch;margin-top:9px;font-size:11.5px;line-height:1.45}.mzs-ecosystem-project-card.is-group-root{grid-template-rows:54% 46%}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-logo{width:96%;height:95%;max-width:290px}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-body{padding:16px 18px 18px}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-identity h3{font-size:28px}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-copy{max-width:32ch;margin-top:14px;font-size:12px;line-height:1.5}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-root-meta{padding-top:12px}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-root-meta small{font-size:8.5px}.mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-actions{margin-top:10px;padding-top:12px}.mzs-ecosystem-proof-list{margin-top:12px}.mzs-ecosystem-proof-list>div{grid-template-columns:minmax(0,1fr);gap:4px;padding:9px 0}.mzs-ecosystem-proof-list dt>strong{font-size:14px}.mzs-ecosystem-proof-list dd{padding-left:31px;font-size:10px}.mzs-ecosystem-proof-list dd>small{font-size:8.5px}.mzs-ecosystem-project-actions{margin-top:12px}.mzs-project-socials .mzs-social-link{width:32px;height:32px}.mzs-ecosystem-project-link{font-size:11px} .mzs-ecosystem-development{margin-top:28px;padding-top:19px}.mzs-ecosystem-development-head{display:grid;gap:4px;margin-bottom:12px}.mzs-ecosystem-development-head>strong{font-size:14px}.mzs-ecosystem-development-shell{--mzs-mobile-rail-card:calc(100% - 54px)}.mzs-ecosystem-development-track{display:flex;grid-template-columns:none;gap:11px}.mzs-ecosystem-development-card{flex:0 0 var(--mzs-mobile-rail-card);min-height:166px;grid-template-columns:98px minmax(0,1fr);border-radius:21px;scroll-snap-align:start}.mzs-ecosystem-development-body{padding:12px 12px}.mzs-ecosystem-development-title,.mzs-ecosystem-development-body>h3{font-size:16px}.mzs-ecosystem-development-chips{gap:5px}.mzs-ecosystem-development-chips>span{min-height:27px;padding:4px 7px;font-size:9px} .mzs-ecosystem-source-note{font-size:9px;line-height:1.45} } @media(max-width:380px){.mzs-ecosystem-head-copy h2{font-size:33px}.mzs-ecosystem-projects-shell{--mzs-mobile-rail-card:calc(100% - 24px)}.mzs-ecosystem-project-card{min-height:596px}.mzs-ecosystem-development-shell{--mzs-mobile-rail-card:calc(100% - 40px)}.mzs-ecosystem-development-card{grid-template-columns:92px minmax(0,1fr)}} /* 3.72.1 — lżejsza hierarchia na komputerze: podsumowanie jako pasek statystyk * (inna forma niż karty marek), niższe karty, mniejsze logo, tytuł i dane. */ @media(min-width:761px){ .mzs-ecosystem-summary{gap:0;margin-top:clamp(22px,2.6vw,32px);border-block:1px solid color-mix(in srgb,var(--mzs-aqua) 16%,transparent)} .mzs-ecosystem-summary-item{min-height:0;gap:4px;padding:16px 26px;border:0;border-radius:0;background:none} .mzs-ecosystem-summary-item+.mzs-ecosystem-summary-item{border-left:1px solid color-mix(in srgb,var(--mzs-aqua) 14%,transparent)} .mzs-ecosystem-summary-item:first-child{padding-left:4px} .mzs-ecosystem-summary-item::after{display:none} .mzs-ecosystem-summary-item>strong{font-size:clamp(22px,1.9vw,28px);font-weight:900;letter-spacing:-.035em;line-height:1.05} .mzs-ecosystem-summary-item>span{color:var(--mzs-text-soft);font-size:12.5px;font-weight:650} .mzs-ecosystem-project-card{min-height:440px;grid-template-rows:150px 1fr;border-radius:24px} .mzs-ecosystem-project-card.is-group-root{grid-template-rows:180px minmax(0,1fr)} .mzs-ecosystem-project-logo{width:min(58%,164px);height:78%} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-logo{width:min(68%,200px);height:88%} .mzs-ecosystem-project-body{padding:16px 20px 18px} .mzs-ecosystem-project-identity h3{font-size:clamp(19px,1.45vw,22px);letter-spacing:-.025em} .mzs-ecosystem-project-card.is-group-root .mzs-ecosystem-project-identity h3{font-size:clamp(21px,1.6vw,25px)} .mzs-ecosystem-project-copy{font-size:12.5px;line-height:1.5} .mzs-ecosystem-proof-list dt>strong{font-size:14px} } @media(prefers-reduced-motion:reduce){.mzs-ecosystem-project-card,.mzs-ecosystem-development-card{transition:none}} /* 3.77.0 — Desktop: media w siatce 2×2, Z Serca Mazur jako nadrzędna „trasa” z prawej przez całą wysokość, połączona z mediami świetlnymi liniami w tle. Tablet i telefon bez zmian. */ @media(min-width:1121px){ .mzs-ecosystem-projects.has-root{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) 46px minmax(290px,.78fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:16px 16px;justify-content:stretch} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card{position:relative;z-index:1;flex:none;width:auto;max-width:none} .mzs-ecosystem-projects.has-root>.is-group-root{grid-column:4;grid-row:1/span 2;min-height:0; background: linear-gradient(180deg,var(--mzs-gold),var(--mzs-aqua) 55%,transparent) no-repeat left top/2px 100%, radial-gradient(circle at 0 25%,rgba(240,198,111,.35),transparent 60px), radial-gradient(circle at 0 75%,rgba(174,239,229,.32),transparent 60px), linear-gradient(160deg,rgba(174,239,229,.08),rgba(7,56,58,.34) 45%,rgba(2,27,30,.22)); box-shadow:0 0 0 1px rgba(174,239,229,.06),0 30px 80px -40px rgba(174,239,229,.35)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root){min-height:0;grid-template-rows:none;grid-template-columns:112px minmax(0,1fr);border-radius:22px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root):nth-child(even){grid-column:1} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root):nth-child(odd){grid-column:2} .mzs-ecosystem-projects.has-root>.is-group-root{grid-template-rows:150px minmax(0,1fr)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-visual{border-bottom:0;border-right:1px solid color-mix(in srgb,var(--mzs-line) 19%,transparent)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-logo{width:84px;height:84px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-body{padding:16px 18px 16px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-identity{text-align:left} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-copy{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;max-width:none;margin:6px 0 0;text-align:left} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-proof-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px;margin-top:10px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-proof-list>div{padding:8px 0;border-bottom:0} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-actions{justify-content:flex-start;margin-top:8px} } /* 3.84.0 — Klienci i partnerzy: te same karty co „W rozwoju”, link do realizacji w nagłówku. */ .mzs-ecosystem-partners-all{margin-left:auto;display:inline-flex;align-items:center;gap:6px;color:var(--mzs-aqua);font-size:12.5px;font-weight:850;text-decoration:none} .mzs-ecosystem-development-card.is-partner .mzs-ecosystem-development-title{font-size:18px} .mzs-ecosystem-development-card.is-partner .mzs-ecosystem-development-chips>span b{font-weight:700} @media(max-width:760px){.mzs-ecosystem-partners-all{margin-left:0}} /* 3.85.0 — Klienci i partnerzy: 4 losowe karty na desktopie, 2 na telefonie (kolejność tasuje core.js). */ .mzs-ecosystem-partners .mzs-ecosystem-development-track>.mzs-ecosystem-development-card:nth-child(n+5){display:none} @media(max-width:760px){.mzs-ecosystem-partners .mzs-ecosystem-development-track>.mzs-ecosystem-development-card:nth-child(n+3){display:none}} /* 3.87.0 — karta nadrzędna Z Serca Mazur: treść na środku, całe logo; karty mediów uporządkowane; łączniki tylko w odstępie przed trasą. */ @media(min-width:1121px){ .mzs-ecosystem-projects.has-root>.is-group-root{grid-template-rows:none;align-content:center;justify-items:center;padding:28px 0} .mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-visual{border-bottom:0;padding:0 24px 6px;min-height:0;width:100%} .mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-logo{width:min(86%,250px);height:auto;aspect-ratio:auto;overflow:visible;-webkit-mask-image:none;mask-image:none} .mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-logo img,.mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-logo .mzs-project-logo-plain{width:100%;height:auto;max-height:190px;padding:0;object-fit:contain} .mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-body{align-content:center;justify-items:center;padding:12px 28px 0} .mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-copy{max-width:30ch;font-size:14px;line-height:1.6} .mzs-ecosystem-projects.has-root>.is-group-root .mzs-ecosystem-project-actions{justify-content:center} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root){grid-template-columns:88px minmax(0,1fr)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-visual{align-items:center;padding-top:0;border-right:0} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-logo{width:68px;height:68px;border-radius:16px;overflow:hidden;opacity:1;-webkit-mask-image:none;mask-image:none;background:color-mix(in srgb,var(--mzs-bg-bottom) 55%,transparent)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-logo img,.mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-logo .mzs-project-logo-plain{padding:4px;object-fit:contain} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-logo .mzs-project-mark-plain{font-size:19px;letter-spacing:.02em} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-body{display:flex;flex-direction:column;padding:20px 22px 18px 4px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-copy{display:block;-webkit-line-clamp:unset;overflow:visible;font-size:13.5px;line-height:1.55} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-proof-list{grid-template-columns:1fr;gap:0;margin-top:12px;border-top:1px solid color-mix(in srgb,var(--mzs-line) 22%,transparent)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-proof-list>div{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid color-mix(in srgb,var(--mzs-line) 14%,transparent)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-proof-list dt>strong{white-space:nowrap;font-size:15px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-proof-list dd{padding-left:0;font-size:11.5px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-project-card:not(.is-group-root) .mzs-ecosystem-project-actions{margin-top:auto;padding-top:14px} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-link{grid-column:3;position:relative;z-index:0;align-self:center;height:1px;background:linear-gradient(90deg,rgba(174,239,229,.35),var(--mzs-gold))} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-link.is-row-1{grid-row:1} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-link.is-row-2{grid-row:2} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-link::before,.mzs-ecosystem-projects.has-root>.mzs-ecosystem-link::after{content:"";position:absolute;top:-3px;width:7px;height:7px;border-radius:50%} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-link::before{left:-4px;background:var(--mzs-aqua);box-shadow:0 0 12px var(--mzs-aqua)} .mzs-ecosystem-projects.has-root>.mzs-ecosystem-link::after{right:-4px;background:var(--mzs-gold);box-shadow:0 0 12px var(--mzs-gold)} } .mzs-ecosystem-link{display:none} @media(min-width:1121px){.mzs-ecosystem-projects.has-root>.mzs-ecosystem-link{display:block}} /* 3.90.0 — logo w kartach „W rozwoju” i „Klienci i partnerzy”: jeden rozmiar i proste dopasowanie (kwadrat 104 px, zaokrąglony, obraz wypełnia pole; monogram w tym samym kwadracie). */ .mzs-ecosystem-development-logo{width:104px;height:104px;border-radius:18px;overflow:hidden;opacity:1;-webkit-mask-image:none;mask-image:none;background:color-mix(in srgb,var(--mzs-bg-bottom,#021b1e) 60%,var(--mzs-surface,#07383a) 40%);box-shadow:0 0 0 1px color-mix(in srgb,var(--mzs-aqua) 14%,transparent)} .mzs-ecosystem-development-logo img,.mzs-ecosystem-development-logo .mzs-project-logo-plain{width:100%;height:100%;padding:0;object-fit:cover;object-position:center} .mzs-ecosystem-development-logo .mzs-project-mark-plain{width:100%;height:100%;font-size:28px} @media(max-width:760px){.mzs-ecosystem-development-logo{width:84px;height:84px;border-radius:16px}.mzs-ecosystem-development-logo .mzs-project-mark-plain{font-size:22px}} /* 3.98.0 — Klienci i partnerzy: dopisek o losowym wyborze, długie nazwy zawijają się w karcie. */ .mzs-ecosystem-partners-note{flex:1 1 100%;margin:0;color:var(--mzs-text-soft);font-size:13px;line-height:1.45} .mzs-ecosystem-partners .mzs-ecosystem-development-title{display:block;width:auto;overflow-wrap:anywhere;hyphens:auto} .mzs-ecosystem-partners .mzs-ecosystem-development-title span{display:inline-block;margin-left:6px} @media(max-width:760px){.mzs-ecosystem-partners .mzs-ecosystem-development-card.is-partner .mzs-ecosystem-development-title{font-size:16px;line-height:1.2}.mzs-ecosystem-partners-note{font-size:12.5px}} /* 3.99.0 — „Nasze media i fakty” na telefonie: tekst na całą szerokość, znacznik w jednej linii, wyniki jako lista w jednej karcie. */ @media(max-width:760px){ .mzs-ecosystem-head-copy>p:last-child{max-width:none} .mzs-ecosystem-update{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px} .mzs-ecosystem-update>time{white-space:nowrap;font-size:12px} .mzs-ecosystem-summary{grid-template-columns:minmax(0,1fr);gap:0;margin-top:20px;padding:4px 16px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 18%,transparent);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--mzs-surface) 24%,transparent),color-mix(in srgb,var(--mzs-bg-bottom) 12%,transparent))} .mzs-ecosystem-summary-item{min-height:0;display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:13px 0;border:0;border-radius:0;background:none;text-align:left} .mzs-ecosystem-summary-item+.mzs-ecosystem-summary-item{border-top:1px solid color-mix(in srgb,var(--mzs-aqua) 14%,transparent)} .mzs-ecosystem-summary-item::after{display:none} .mzs-ecosystem-summary-item>strong{font-size:24px;white-space:nowrap} .mzs-ecosystem-summary-item>.mzs-ecosystem-summary-short{color:var(--mzs-text-soft);font-size:13px;font-weight:700;text-align:right} } /* 4.0.0 — wyniki na telefonie: jeden rytm wierszy — ikona kanału, wartość, podpis pod spodem; karta z delikatną poświatą. */ .mzs-ecosystem-summary-icon{display:none} @media(max-width:760px){ .mzs-ecosystem-summary{position:relative;overflow:hidden;padding:6px 16px;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--mzs-aqua) 22%,transparent),0 18px 44px -30px color-mix(in srgb,var(--mzs-aqua) 55%,transparent)} .mzs-ecosystem-summary::before{content:"";position:absolute;top:-40%;right:-30%;width:70%;height:120%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--mzs-aqua) 14%,transparent),transparent 70%);pointer-events:none} .mzs-ecosystem-summary-item{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:14px;row-gap:3px;padding:14px 0} .mzs-ecosystem-summary-icon{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 30%,transparent);border-radius:14px;background:color-mix(in srgb,var(--mzs-aqua) 8%,transparent);color:var(--mzs-aqua);font-style:normal} .mzs-ecosystem-summary-icon svg{width:20px;height:20px} .mzs-ecosystem-summary-item>strong{grid-column:2;align-self:end;font-size:25px;line-height:1;letter-spacing:-.04em} .mzs-ecosystem-summary-item>.mzs-ecosystem-summary-short{grid-column:2;align-self:start;color:var(--mzs-text-soft);font-size:11px;font-weight:800;letter-spacing:.1em;text-align:left;text-transform:uppercase} .mzs-ecosystem-summary-item+.mzs-ecosystem-summary-item{border-top:1px solid transparent;border-image:linear-gradient(90deg,transparent,color-mix(in srgb,var(--mzs-aqua) 26%,transparent),transparent) 1} } /* 4.1.0 — wyniki na telefonie wyśrodkowane: ikona i wartość w jednej linii na środku, podpis pod spodem, świecąca kropka między wierszami. */ @media(max-width:760px){ .mzs-ecosystem-summary{padding:8px 18px} .mzs-ecosystem-summary::before{top:-30%;left:50%;right:auto;width:110%;height:90%;transform:translateX(-50%);background:radial-gradient(ellipse at center,color-mix(in srgb,var(--mzs-aqua) 13%,transparent),transparent 68%)} .mzs-ecosystem-summary-item{display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;justify-content:center;justify-items:center;align-items:center;column-gap:12px;row-gap:6px;padding:18px 0;text-align:center} .mzs-ecosystem-summary-icon{grid-row:1;grid-column:1;width:38px;height:38px;border-radius:50%;box-shadow:0 0 22px -6px color-mix(in srgb,var(--mzs-aqua) 70%,transparent)} .mzs-ecosystem-summary-icon svg{width:18px;height:18px} .mzs-ecosystem-summary-item>strong{grid-row:1;grid-column:2;align-self:center;font-size:30px;text-shadow:0 0 26px color-mix(in srgb,var(--mzs-aqua) 35%,transparent)} .mzs-ecosystem-summary-item>.mzs-ecosystem-summary-short{grid-row:2;grid-column:1/-1;align-self:center;text-align:center} .mzs-ecosystem-summary-item+.mzs-ecosystem-summary-item::before{content:"";position:absolute;top:-3px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--mzs-aqua);box-shadow:0 0 10px var(--mzs-aqua);opacity:.8} } /* SOURCE: assets/css/mobile-native.css */ /* Z Serca Mazur — native mobile swipe utility. * Scope: mechanics generated by mobile-native.js only. * View layout, typography, navigation, footer and backgrounds belong to their component owners. */ .mzs-mobile-native-only{display:none} .mzs-native-swipe-shell{min-width:0;max-width:100%} @media (max-width:760px), (max-width:900px) and (max-height:520px){ .mzs-mobile-native-only{display:block} .mzs-native-swipe-shell{position:relative;width:100%;overflow:hidden} .mzs-native-swipe-shell [data-mzs-native-swipe-track], .mzs-proof-rail-track{ display:flex; flex-wrap:nowrap; align-items:stretch; width:100%; max-width:100%; gap:14px; margin:0; padding:0 0 4px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; scroll-padding-inline:0; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; scrollbar-width:none; } .mzs-native-swipe-shell [data-mzs-native-swipe-track]::-webkit-scrollbar, .mzs-proof-rail-track::-webkit-scrollbar{display:none} .mzs-native-swipe-shell [data-mzs-native-swipe-track]>*{scroll-snap-align:start;scroll-snap-stop:normal} .mzs-native-swipe-shell [data-mzs-native-swipe-track]>*, .mzs-mobile-full-rail>*{ flex:0 0 var(--mzs-mobile-rail-card,calc(100% - 28px)); width:var(--mzs-mobile-rail-card,calc(100% - 28px)); min-width:var(--mzs-mobile-rail-card,calc(100% - 28px)); max-width:var(--mzs-mobile-rail-card,calc(100% - 28px)); } .mzs-view-offer{--mzs-mobile-rail-card:calc(100% - 34px)} .mzs-view-events{--mzs-mobile-rail-card:calc(100% - 24px)} .mzs-view-history{--mzs-mobile-rail-card:calc(100% - 26px)} .mzs-view-regions,.mzs-view-region{--mzs-mobile-rail-card:calc(100% - 34px)} .mzs-view-offer .mzs-mobile-peek-shell::after, .mzs-view-history .mzs-mobile-peek-shell::after{ content:""; position:absolute; z-index:3; right:0; top:10%; bottom:10%; width:1px; background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--mzs-aqua) 35%,transparent),transparent); pointer-events:none; opacity:.55; } .mzs-mobile-rail-controls{ width:100%; display:grid; grid-template-columns:minmax(96px,1fr) auto minmax(96px,1fr); align-items:center; gap:10px; margin:14px auto 0; } .mzs-mobile-rail-prev,.mzs-mobile-rail-next,.mzs-mobile-simple-next{ min-height:46px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 14px; border:1px solid color-mix(in srgb,var(--mzs-aqua) 28%,transparent); border-radius:999px; background:color-mix(in srgb,var(--mzs-bg-bottom) 78%,var(--mzs-surface) 22%); color:var(--mzs-aqua); font:inherit; font-size:14.5px; font-weight:850; cursor:pointer; } .mzs-mobile-rail-prev{justify-self:start} .mzs-mobile-rail-next{justify-self:end} .mzs-mobile-rail-count{min-width:48px;color:var(--mzs-text-soft);font-size:12px;font-weight:800;text-align:center;font-variant-numeric:tabular-nums} .mzs-mobile-rail-controls.is-compact{width:max-content;grid-template-columns:42px auto 42px;gap:9px;margin:12px auto 0} .mzs-mobile-rail-controls.is-compact :is(.mzs-mobile-rail-prev,.mzs-mobile-rail-next){width:42px;min-width:42px;height:42px;min-height:42px;justify-self:center;padding:0;border-radius:50%} .mzs-mobile-rail-controls.is-compact .mzs-mobile-rail-count{min-width:52px} :is(.mzs-mobile-rail-prev,.mzs-mobile-rail-next):disabled{opacity:.38;cursor:default} .mzs-mobile-simple-controls{width:100%;display:flex;justify-content:center;margin-top:14px} .mzs-mobile-simple-next i{font-style:normal;font-size:19px} .mzs-mobile-card-arrows{display:none;position:absolute;z-index:6;left:9px;right:9px;top:42%;align-items:center;justify-content:space-between;pointer-events:none} :is(.mzs-ecosystem-projects-shell,.mzs-offer-cards-shell,.mzs-trust-zone-swipe,.mzs-history-chapters-shell,.mzs-process-route-shell,.mzs-capability-nodes-shell,.mzs-region-rail)>.mzs-mobile-card-arrows{display:flex} .mzs-mobile-card-arrow{width:42px;height:42px;display:grid;place-items:center;padding:0;border:1px solid color-mix(in srgb,var(--mzs-aqua) 36%,transparent);border-radius:50%;background:color-mix(in srgb,var(--mzs-bg-top) 91%,transparent);color:var(--mzs-aqua);box-shadow:0 12px 28px rgba(0,10,12,.22);font:inherit;font-size:19px;cursor:pointer;pointer-events:auto} .mzs-mobile-card-arrow:disabled{opacity:.18;pointer-events:none} /* 3.70.0 — pasek postępu karuzeli: kreska z płynnym wypełnieniem + licznik. */ .mzs-rail-meter{min-width:0;display:grid;justify-items:center;gap:7px} .mzs-rail-progress{position:relative;width:min(132px,32vw);height:3px;overflow:hidden;border-radius:3px;background:color-mix(in srgb,var(--mzs-text) 14%,transparent)} .mzs-rail-progress i{position:absolute;inset:0 auto 0 0;width:20%;border-radius:inherit;background:var(--mzs-aqua);will-change:transform} .mzs-mobile-rail-controls.is-compact .mzs-rail-progress{width:min(96px,26vw)} .mzs-rail-meter .mzs-mobile-rail-count{min-width:0;font-size:12.5px;line-height:1} /* Podpowiedź gestu: dłoń przesuwa w lewo, raz na sesję. */ .mzs-native-swipe-shell.is-hinting{position:relative} .mzs-swipe-hint{position:absolute;z-index:7;right:18px;top:38%;display:grid;justify-items:center;gap:4px;padding:10px 12px 8px;border-radius:18px;background:color-mix(in srgb,var(--mzs-bg-bottom,#021b1e) 82%,transparent);color:#f7fcfa;box-shadow:0 14px 34px rgba(0,10,12,.28);pointer-events:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:mzs-hint-in .25s ease-out both,mzs-hint-out .35s ease-in 2.5s forwards} .mzs-swipe-hint svg{width:34px;height:34px;animation:mzs-hint-swipe 1.1s cubic-bezier(.5,0,.3,1) .15s 2 both} .mzs-swipe-hint b{font-size:11px;font-weight:850;letter-spacing:.1em;text-transform:uppercase} @keyframes mzs-hint-swipe{0%{transform:translateX(12px) rotate(-8deg);opacity:.2}35%{opacity:1}100%{transform:translateX(-26px) rotate(-18deg);opacity:0}} @keyframes mzs-hint-in{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}} @keyframes mzs-hint-out{to{opacity:0;transform:scale(.96)}} } @media (prefers-reduced-motion:reduce){ .mzs-mobile-rail-prev,.mzs-mobile-rail-next,.mzs-mobile-simple-next,.mzs-mobile-card-arrow{transition:none} .mzs-swipe-hint,.mzs-swipe-hint svg{animation:none} } /* 3.70.0 — „Czytaj dalej / Pokaż wszystkie” na telefonie (mobile-native.js). */ @media (max-width:760px), (max-width:900px) and (max-height:520px){ .mzs-readmore-text.is-collapsed{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden;-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)} .mzs-readmore-list.is-collapsed>.mzs-readmore-extra{display:none} .mzs-readmore-toggle{min-height:44px;display:inline-flex;align-items:center;gap:8px;margin:6px 0 0;padding:0 16px;border:1px solid color-mix(in srgb,var(--mzs-aqua) 30%,transparent);border-radius:999px;background:transparent;color:var(--mzs-aqua);font:inherit;font-size:14.5px;font-weight:850;cursor:pointer} .mzs-readmore-toggle i{font-style:normal;transition:transform .2s ease} .mzs-readmore-toggle[aria-expanded="true"] i{transform:rotate(180deg)} } @media (prefers-reduced-motion:reduce){.mzs-readmore-toggle i{transition:none}} /* 3.97.0 — lekki wskaźnik karuzeli: dłoń sugerująca gest + pasek przesunięcia (zamiast „Wróć / Przesuń” i strzałek). */ .mzs-rail-indicator{display:none} @media (max-width:760px), (max-width:900px) and (max-height:520px){ .mzs-rail-indicator{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin:14px auto 0;color:var(--mzs-aqua)} .mzs-rail-indicator.is-compact{margin-top:12px} .mzs-mobile-simple-controls{margin-top:0} .mzs-rail-finger{display:grid;place-items:center;width:26px;height:26px;flex:0 0 auto;opacity:.9;transition:opacity .4s ease} .mzs-rail-finger svg{width:22px;height:22px;transform-origin:60% 90%;animation:mzs-rail-finger 2.4s ease-in-out .6s infinite} .mzs-rail-indicator.is-touched .mzs-rail-finger{opacity:.45} .mzs-rail-indicator.is-touched .mzs-rail-finger svg{animation:none} .mzs-native-swipe-shell.is-hinting .mzs-rail-finger svg{animation-duration:1.1s} .mzs-rail-bar{position:relative;display:flex;align-items:center;gap:5px;min-width:0} .mzs-rail-bar.is-flow{width:min(150px,40vw);height:4px;overflow:hidden;border-radius:4px;background:color-mix(in srgb,var(--mzs-text) 14%,transparent)} .mzs-rail-bar.is-flow i{position:absolute;inset:0 auto 0 0;width:20%;border-radius:inherit;background:var(--mzs-aqua);will-change:transform} .mzs-rail-step{position:relative;width:clamp(12px,calc(150px / var(--mzs-steps,6)),26px);height:24px;flex:0 0 auto;padding:0;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent} .mzs-rail-step::before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;border-radius:4px;background:color-mix(in srgb,var(--mzs-text) 20%,transparent);transition:background .25s ease,height .25s ease,box-shadow .25s ease} .mzs-rail-step.is-past::before{background:color-mix(in srgb,var(--mzs-aqua) 62%,transparent)} .mzs-rail-step.is-current::before{height:5px;margin-top:-2.5px;background:var(--mzs-aqua);box-shadow:0 0 12px -2px var(--mzs-aqua)} .mzs-rail-step:focus-visible{outline:2px solid var(--mzs-aqua);outline-offset:2px;border-radius:4px} .mzs-rail-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .mzs-mobile-rail-controls,.mzs-mobile-card-arrows,.mzs-swipe-hint{display:none!important} } @keyframes mzs-rail-finger{0%,55%,100%{transform:translateX(0) rotate(0)}20%{transform:translateX(-7px) rotate(-10deg)}38%{transform:translateX(2px) rotate(2deg)}} @media (prefers-reduced-motion:reduce){.mzs-rail-finger svg{animation:none!important}.mzs-rail-step::before{transition:none}} /* 3.98.0 — przewijane rzędy przycisków (tematy bazy wiedzy): wygaszone brzegi, cienka linia postępu, dłoń. */ .mzs-chip-finger,.mzs-chip-progress{display:none} @media (max-width:760px), (max-width:900px) and (max-height:520px){ .mzs-chip-rail-host{position:relative} .mzs-chip-rail{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 40px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 calc(100% - 40px),transparent 100%)} .is-chip-start>.mzs-chip-rail{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 40px),transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 40px),transparent 100%)} .is-chip-end>.mzs-chip-rail{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16px,#000 100%)} .mzs-chip-progress{position:absolute;bottom:-7px;display:block;height:2px;overflow:hidden;border-radius:2px;background:color-mix(in srgb,var(--mzs-text) 12%,transparent);pointer-events:none} .mzs-chip-progress i{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:var(--mzs-aqua);will-change:transform} .mzs-chip-finger{position:absolute;top:50%;display:grid;place-items:center;width:24px;height:24px;margin-top:-12px;color:var(--mzs-aqua);pointer-events:none;transition:opacity .35s ease} .mzs-chip-finger svg{width:20px;height:20px;filter:drop-shadow(0 2px 6px rgba(0,10,12,.6));animation:mzs-rail-finger 2.4s ease-in-out .6s infinite} .is-chip-touched>.mzs-chip-finger,.is-chip-end>.mzs-chip-finger{opacity:0} } @media (prefers-reduced-motion:reduce){.mzs-chip-finger svg{animation:none}}