/*!**********************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/styles/index.scss ***!
  \**********************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Zalando+Sans:ital,wght@0,200..900;1,200..900&family=Zalando+Sans+SemiExpanded:ital,wght@0,200..900;1,200..900&display=swap);
/*!************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/styles/swiper-bundle.min.css ***!
  \************************************************************************************/
/**
 * Swiper 11.2.10
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 28, 2025
 */

@font-face{font-family:swiper-icons;src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-border-radius,10px);left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
/*!**************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/styles/index.scss (1) ***!
  \**************************************************************************************************************************************************************/
@charset "UTF-8";
/* ===========================
    Marafiki NEW Main Stylesheet
    Author: Pawel Lewandowicz
    Description: Main CSS file for Marafiki Wordpress Theme project.
    =========================== */
:root {
  --marafiki-yellow: rgba(255, 182, 0, 1);
  --marafiki-blue: rgba(0, 166, 219, 1);
  --marafiki-grey: rgba(239, 241, 242, 1);
  --marafiki-grey-text: rgba(121, 121, 121, 1);
  /* Maska dla zdjec w sekcji Like to talk na stronie głównej */
  --blob-url: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 577.4 540.2%27%3E%3Cpath d=%27M416.4 14.7C373.4-.9 324.8-13 242.6 26.6c-82.2 39.5-139 42.7-165.9 45s-57.5-3.2-73.5 50.6 54.5 293.1 154.8 384 220.4-27.7 229.9-38.7c9.5-11.1 78.2-58.5 116.9-63.2s89.3-61.6 67.2-190.4S431.2 20.1 416.4 14.7%27/%3E%3C/svg%3E"); }

/* CSS Reset */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

body {
  line-height: 1; }

html,
body {
  overflow-x: hidden; }

html {
  /* To jest kluczowe rozwiązanie na skaczącą grafikę. Pasek przewijania jest zawsze rezerwowany, co zapobiega przesuwaniu się zawartości podczas ładowania obrazów. */
  scrollbar-gutter: stable;
  /* Fallback dla starszych przeglądarek (wymusza pasek zawsze widoczny): */
  /* overflow-y: scroll; */ }

svg {
  display: block; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0; }

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none; }

/* Lenis */
html.lenis,
html.lenis body {
  height: auto; }

.lenis:not(.lenis-autoToggle).lenis-stopped {
  overflow: clip; }

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain; }

.lenis.lenis-smooth iframe {
  pointer-events: none; }

.lenis.lenis-autoToggle {
  transition-property: overflow;
  transition-duration: 1ms;
  transition-behavior: allow-discrete; }

/* End Lenis */
/* Reset dla inputów, ALE Z WYJĄTKIEM checkboxów i radio */
input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0; }

input[type="search"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0; }

/* Ukrywa systemowy przycisk "x" do czyszczenia pola w WebKit */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  display: none; }

a,
button {
  cursor: pointer;
  user-select: none;
  border: none;
  background: none; }
  a:visited,
  button:visited {
    color: inherit;
    text-decoration: none; }

a {
  color: inherit;
  text-decoration: none; }

/* Remove default margin in favour of better control in authored CSS */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin-block-end: 0; }

ul[role="list"],
ul,
ol,
ol[role="list"] {
  list-style: none;
  margin-bottom: 0; }

ol {
  list-style: decimal inside; }

/* Zostawiamy pasek przewijania (overflow-y: scroll),
   żeby szerokość strony się nie zmieniła i tło nie skoczyło. */
html.no-scroll {
  overflow: hidden !important;
  height: 100vh; }

body.no-scroll {
  overflow: hidden !important;
  height: 100vh; }

body {
  font-family: "Zalando Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "wdth" 100;
  background: white;
  color: black;
  line-height: 1.6;
  position: relative; }

body.with-pattern {
  background: url(3e090294b477b51be800.svg) top center;
  background-size: cover;
  background-attachment: fixed;
  z-index: -5; }

strong,
b {
  font-weight: 500; }

.loader-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--marafiki-yellow);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  /* transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; */
  /* &.hidden-loader {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    } */ }
  .loader-container img {
    width: 50px;
    height: 50px;
    animation: heart-beat 1.2s ease-in-out infinite;
    transform-origin: center center; }

@keyframes heart-beat {
  0% {
    transform: scale(1); }
  14% {
    transform: scale(1.3); }
  28% {
    transform: scale(1); }
  42% {
    transform: scale(1.3); }
  70% {
    transform: scale(1); }
  100% {
    transform: scale(1); } }

/* Kursor */
/* .cursor {
     display: none;
    pointer-events: none;
    position: fixed;
    opacity: .8;
    height: 32px;
    width: 32px;
    border-radius: 32px;
    background-color: var(--marafiki-blue);
    transform: translate(-50%, -50%);
    transform-origin: top left;
    z-index: 10000;
    transition: transform 0.4s ease-out, background-color 0.1s ease-out;
}  */
/* .click {
    scale: 0.8;
}

.pressable {
    background-color: var(--marafiki-yellow);
    transform: scale(2) translate(-50%, -50%);
    opacity: .4;
} */
/* Only display a message if the user can't hover (which would indicate they're using an input that doesn't have a cursor) */
/* @media (hover: hover) {
    .no-cursor {
        display: none;
    }
} */
.mobile-right-div {
  display: flex;
  align-items: center;
  gap: 16px;
  /* domyslnie ukryty */
  display: none;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease-in-out; }

.mobile-menu-button {
  cursor: pointer;
  width: 48px;
  height: 48px;
  /* display: flex; */
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  z-index: 100;
  transition: background-color 0.3s ease-in-out;
  outline: none;
  -webkit-tap-highlight-color: transparent; }
  .mobile-menu-button:active, .mobile-menu-button:focus {
    background-color: var(--marafiki-grey); }
  .mobile-menu-button svg {
    overflow: visible; }

.magnets {
  display: flex;
  align-items: center;
  justify-content: center; }

.yellow-accent {
  color: var(--marafiki-yellow);
  display: inline-block; }

.white-accent {
  color: white;
  display: inline-block; }

.blue-accent {
  color: var(--marafiki-blue);
  display: inline-block; }

.black-accent {
  color: black;
  display: inline-block; }

.yellow-accent-rect {
  color: black;
  background-color: var(--marafiki-yellow);
  padding: 2px 3px 0px;
  display: inline-block; }

.blue-accent-rect {
  color: black;
  background-color: var(--marafiki-blue);
  padding: 2px 3px 0px;
  display: inline-block; }

.black-accent-rect {
  color: white;
  background-color: black;
  padding: 2px 3px 0px;
  display: inline-block; }

.white-accent-rect {
  color: black;
  background-color: white;
  padding: 10px 10px;
  display: inline-block; }

.header-h1 {
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  font-variation-settings: "wdth" 112.5;
  font-weight: 600;
  font-size: 56px;
  line-height: 140%;
  letter-spacing: 0px;
  vertical-align: middle; }

.section-title {
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  font-variation-settings: "wdth" 112.5;
  font-weight: 600;
  font-size: 42px;
  line-height: 130%;
  letter-spacing: 0px;
  vertical-align: middle; }

.header-h3 {
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  font-variation-settings: "wdth" 112.5;
  font-weight: 600;
  font-size: 30px;
  line-height: 140%;
  letter-spacing: 0px;
  vertical-align: middle;
  margin-bottom: 24px; }

.header-h4 {
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  font-variation-settings: "wdth" 112.5;
  font-weight: 600;
  font-size: 24px;
  line-height: 135%; }

.header-h5 {
  font-family: "Zalando Sans SemiExpanded", sans-serif;
  font-variation-settings: "wdth" 112.5;
  font-weight: 600;
  font-size: 20px;
  line-height: 135%;
  display: block; }

.text-main {
  font-weight: 300;
  font-size: 16px;
  line-height: 156%; }

.text-20 {
  font-weight: 400;
  font-size: 20px;
  line-height: 28px; }

.extra-small {
  font-size: 10px;
  line-height: 100%;
  font-weight: 500; }

.only-visual {
  /* Niekliakalność - ignorowanie kliknięć i innych zdarzeń myszy */
  pointer-events: none;
  /* Niezaznaczalność - zapobieganie zaznaczeniu elementu przez użytkownika */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  outline: none; }

svg.step-by-step {
  margin: 0 auto;
  overflow: visible;
  width: 300px;
  height: auto; }
  svg.step-by-step path {
    opacity: 0; }

/* Social Icons */
.social-icons {
  display: flex;
  gap: 30px; }
  .social-icons .social-icon {
    width: 32px;
    height: 32px;
    fill: var(--inverted-color);
    transition: all 0.2s; }
    .social-icons .social-icon:is(:hover, :focus) {
      transform: scale(1.1);
      fill: var(--marafiki-main-color); }

.logo {
  display: inline-block;
  width: 174px;
  height: 48px;
  position: relative;
  z-index: 100;
  outline: none; }

.container {
  width: 1376px;
  max-width: calc(100% - 100px);
  margin: 0 auto; }

.container-narrow {
  width: 910px;
  max-width: calc(100% - 100px);
  margin: 0 auto; }

.marafiki-button {
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: 400;
  outline: none;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
  position: relative;
  transition: 0.2s transform cubic-bezier(0.3, 0.8, 0.3, 2.3);
  will-change: transform;
  z-index: 0;
  color: black;
  /* Domyślny kolor tekstu przycisku */
  -webkit-appearance: none;
  appearance: none; }
  .marafiki-button.btn-13 {
    font-size: 13px;
    font-weight: 500;
    padding: 5px 12px 5px; }
  .marafiki-button.btn-14 {
    font-size: 14px;
    font-weight: 400;
    padding: 13px 25px; }
  .marafiki-button.btn-radius-10 {
    border-radius: 10px; }
  .marafiki-button.btn-radius-50 {
    border-radius: 50px; }
  .marafiki-button.btn-color-black {
    background-color: black;
    color: white; }
    .marafiki-button.btn-color-black:visited {
      color: white; }
  .marafiki-button.btn-color-yellow {
    background-color: var(--marafiki-yellow);
    color: black; }
  .marafiki-button.btn-color-white {
    background-color: white;
    border: 1px solid white;
    color: black; }
  .marafiki-button.btn-only-border {
    border: 1px solid black;
    background-color: transparent; }
    .marafiki-button.btn-only-border::after {
      border: 1px solid black;
      background-color: black; }
    .marafiki-button.btn-only-border:hover::after {
      border: 1px solid black;
      background-color: black; }
  .marafiki-button.btn-only-border-white {
    border: 1px solid white;
    background-color: transparent;
    color: white; }
  .marafiki-button.button-with-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-flow: row-reverse; }
    .marafiki-button.button-with-chevron::before {
      content: '';
      display: inline-block;
      width: 8px;
      height: 14px;
      margin-left: 16px;
      background-color: currentColor;
      -webkit-mask-image: url("data:image/svg+xml,%3Csvg width=%278%27 height=%2714%27 viewBox=%270 0 8 14%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M0.21967 13.2803C-0.0732233 12.9874 -0.0732233 12.5126 0.21967 12.2197L5.68934 6.75L0.21967 1.28033C-0.0732232 0.987437 -0.0732232 0.512563 0.21967 0.21967C0.512563 -0.0732231 0.987437 -0.0732231 1.28033 0.21967L7.28033 6.21967C7.57322 6.51256 7.57322 6.98744 7.28033 7.28033L1.28033 13.2803C0.987437 13.5732 0.512563 13.5732 0.21967 13.2803Z%27 fill=%27black%27/%3E%3C/svg%3E");
      mask-image: url("data:image/svg+xml,%3Csvg width=%278%27 height=%2714%27 viewBox=%270 0 8 14%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M0.21967 13.2803C-0.0732233 12.9874 -0.0732233 12.5126 0.21967 12.2197L5.68934 6.75L0.21967 1.28033C-0.0732232 0.987437 -0.0732232 0.512563 0.21967 0.21967C0.512563 -0.0732231 0.987437 -0.0732231 1.28033 0.21967L7.28033 6.21967C7.57322 6.51256 7.57322 6.98744 7.28033 7.28033L1.28033 13.2803C0.987437 13.5732 0.512563 13.5732 0.21967 13.2803Z%27 fill=%27black%27/%3E%3C/svg%3E");
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat;
      -webkit-mask-position: center;
      mask-position: center;
      -webkit-mask-size: contain;
      mask-size: contain; }
  .marafiki-button:visited {
    color: inherit; }

.marafiki-button::after {
  box-sizing: border-box;
  background-color: var(--marafiki-yellow);
  border-radius: inherit;
  border: 1px solid var(--marafiki-yellow);
  content: '';
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(0%, 100%) rotate(-5deg);
  transform-origin: top right;
  transition: 0.3s ease-out;
  will-change: transform;
  z-index: -1; }

.marafiki-button:hover::after {
  transform: translate(0, 0); }

.marafiki-button:hover {
  color: white;
  border-color: transparent;
  background: transparent;
  /* transform: scale(1.1); */
  will-change: transform; }

/* POCZĄTEK MENU I TOP BAR  */
.menu-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.3);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 40;
  transition: opacity 0.3s ease, visibility 0s linear 0.3s; }

.menu-overlay.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 0.3s ease, visibility 0s linear 0s;
  backdrop-filter: blur(5px); }

/* Menu główne */
.top-bar {
  width: 1376px;
  max-width: calc(100% - 100px);
  margin: 0 auto;
  height: 96px;
  position: fixed;
  top: 30px;
  left: 50%;
  z-index: 1000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: white;
  padding: 24px 48px;
  border-radius: 30px;
  will-change: top, transform;
  transform: translateZ(0) translateX(-50%);
  transition: all 0.3s ease-out; }

.top-bar:has(+ .mega-menu.open) {
  border-radius: 30px 30px 0 0; }

.top-bar.top-bar--hidden {
  top: -150px; }

/* Menu - Main Nav */
.main-nav > ul {
  display: flex;
  align-items: center;
  gap: 40px;
  font-weight: 500; }
  .main-nav > ul li {
    display: flex;
    transition: color 0.3s ease-out; }
  .main-nav > ul .header-h4 {
    margin-bottom: 40px; }

@media (hover: hover) {
  .main-nav > ul li:hover {
    color: var(--marafiki-blue); } }

@media (max-width: 1299px) and (min-width: 1025px) {
  .main-nav > ul {
    gap: 15px; }
  .menu-section:not(.mobile-open) .top-bar .marafiki-button {
    display: none; } }

.mobile-open .marafiki-button {
  text-align: center; }

.first-level-menu-link-with-icon {
  display: inline-block;
  padding: 4px 35px 4px 0;
  position: relative;
  touch-action: manipulation; }
  .first-level-menu-link-with-icon.submenu-active-trigger {
    color: var(--marafiki-blue); }
  .first-level-menu-link-with-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 0;
    width: 24px;
    height: 24px;
    transform: translateY(-50%);
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z%27/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z%27/></svg>");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor;
    transition: transform 0.3s ease; }

@media (min-width: 1025px) {
  .first-level-menu-link-with-icon:hover::after,
  .first-level-menu-link-with-icon:focus::after,
  .first-level-menu-link-with-icon.submenu-active-trigger::after {
    transform: translateY(-50%) rotate(180deg); } }

/* Mega Menus */
.mega-menu {
  position: fixed;
  top: 126px;
  border-radius: 0 0 30px 30px;
  background: white;
  padding: 0 40px 40px;
  display: flex;
  gap: 16px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  left: 50%;
  transform: translate(-50%, -15px);
  transition: transform 0.3s ease-out, opacity 0.3s ease, visibility 0s linear 0.3s;
  z-index: 50;
  overflow-y: auto !important;
  touch-action: pan-y;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch; }

.mega-menu.open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate(-50%, 0);
  transition: transform 0.3s ease-out, opacity 0.3s ease, visibility 0s linear 0s; }

#submenu-uslugi {
  width: 1376px;
  max-width: calc(100% - 100px); }
  #submenu-uslugi .mega-column {
    width: 25%; }

#submenu-strategia {
  width: 344px;
  max-width: 100%; }

.mega-column {
  width: 100%;
  padding: 32px 24px;
  border-radius: 30px;
  position: relative;
  transition: transform 0.3s ease-out, filter 0.3s ease-out; }
  .mega-column::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    border-radius: 30px;
    opacity: 0.4;
    background-image: url(87c6f1d7fe521205ac86.webp);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: 0; }
  .mega-column .header-h4 {
    position: relative;
    z-index: 1;
    margin-bottom: 24px; }
    .mega-column .header-h4::after {
      content: '';
      position: absolute;
      top: 2px;
      right: 0;
      width: 24px;
      height: 24px;
      display: block;
      border: 1px solid currentColor;
      border-radius: 50%; }
    .mega-column .header-h4::before {
      content: '';
      position: absolute;
      transform: rotate(-45deg);
      top: 5px;
      right: 3px;
      width: 18px;
      height: 18px;
      -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06%27 clip-rule=%27evenodd%27/></svg>");
      mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06%27 clip-rule=%27evenodd%27/></svg>");
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat;
      -webkit-mask-size: 100% 100%;
      mask-size: 100% 100%;
      background-color: currentColor; }
  .mega-column ul li {
    margin-bottom: 16px; }
    .mega-column ul li:last-of-type {
      margin-bottom: 0; }

@media (hover: hover) {
  .mega-column:hover {
    transform: translateY(4px);
    filter: brightness(1.05); } }

.mega-column.bg-yellow {
  background-color: var(--marafiki-yellow); }

.mega-column.bg-black {
  background-color: black;
  color: white; }

.mega-column.bg-grey {
  background-color: #e7e7e7; }

.mega-column.bg-blue {
  background-color: var(--marafiki-blue);
  color: white; }

.menu-dropdown-link {
  display: block;
  color: inherit;
  font-size: 14px;
  font-weight: 400;
  padding-left: 32px;
  transition: transform 0.3s ease-out;
  position: relative; }
  .menu-dropdown-link::before {
    content: '';
    position: absolute;
    top: 1px;
    left: 0;
    width: 18px;
    height: 19px;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06%27 clip-rule=%27evenodd%27/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06%27 clip-rule=%27evenodd%27/></svg>");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    background-color: currentColor; }
  @media (hover: hover) {
    .menu-dropdown-link:hover, .menu-dropdown-link:focus {
      transform: translateX(12px); } }

.mobile-open .mega-menu.open .menu-dropdown-link {
  color: #484848; }
  .mobile-open .mega-menu.open .menu-dropdown-link::before {
    display: none; }

@media (min-width: 1031px) {
  .mobile-menu-header {
    display: none !important; } }

/* KONIEC MENU */
/* Case studies - custome post type */
header {
  padding: 126px 0 0 0; }

.header-case-studies {
  color: white;
  position: relative;
  width: 100%;
  min-height: 794px; }

.header-background-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: center center;
  z-index: -2;
  filter: brightness(0.6); }

.separator--yellow {
  display: block;
  align-self: stretch;
  width: 5px;
  border-radius: 5px;
  background: var(--marafiki-yellow);
  margin: 10px 100px; }

.separator hr {
  border: 1px solid #d9d9d9;
  margin: 32px 0; }

.header-case-studies .container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 100px 0; }
  .header-case-studies .container .header-h1 {
    flex: 0 1 600px; }

.black-on-white-content {
  flex: 0 0 229px; }
  .black-on-white-content .section-title {
    display: block;
    position: relative; }
    .black-on-white-content .section-title .span-on {
      font-size: 24px;
      line-height: 135%;
      top: 49px;
      left: 42px;
      position: absolute; }
    .black-on-white-content .section-title .span-white {
      position: absolute;
      top: 49px;
      left: 86px; }

.case-label {
  display: inline-block;
  vertical-align: middle;
  border-radius: 10px;
  padding: 5px 12px;
  font-weight: 600;
  font-size: 16px;
  line-height: 140%;
  background: var(--marafiki-yellow);
  margin-bottom: 6px;
  position: relative;
  z-index: 1; }

/* Next section */
.case-data-introduction .container {
  padding: 50px 0;
  display: flex;
  align-items: center;
  width: 1142px;
  max-width: calc(100% - 100px);
  gap: 48px;
  margin: 0 auto; }

.case-data-grid-container {
  width: 460px;
  flex: 0 0 460px;
  display: flex;
  flex-direction: column;
  gap: 32px; }
  .case-data-grid-container .row {
    display: grid;
    grid-template-columns: 60px 100px 1fr;
    align-items: center;
    gap: 24px; }
  .case-data-grid-container .icon {
    width: 48px;
    height: 48px; }
  .case-data-grid-container .text-1 {
    font-weight: 500;
    font-size: 12px;
    line-height: 135%;
    text-transform: uppercase;
    color: var(--marafiki-grey-text); }
  .case-data-grid-container .text-2 {
    font-weight: 600;
    font-size: 16px;
    line-height: 140%; }

.border-left-5 {
  position: relative;
  padding-left: 39px; }
  .border-left-5::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 5px;
    background-color: var(--marafiki-yellow);
    border-radius: 5px; }

.border-left-3 {
  position: relative;
  padding-left: 29px; }
  .border-left-3::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 3px;
    background-color: var(--marafiki-yellow);
    border-radius: 5px; }

.case-introduction-text {
  padding-left: 48px; }

/* Next section */
.cascading-boxes {
  padding: 64px 0;
  /* overflow-x: hidden; */ }
  .cascading-boxes .section-title {
    text-align: center;
    margin-bottom: 100px; }
  .cascading-boxes .boxy-shape-container {
    position: relative;
    display: flex;
    gap: 32px;
    align-items: start;
    justify-content: center;
    max-width: 1264px;
    width: calc(100% - 100px);
    margin: 0 auto; }
    .cascading-boxes .boxy-shape-container .step-by-step {
      width: 260px;
      position: absolute;
      top: -77px;
      left: 200px;
      z-index: -1; }

.boxy-shape {
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 21px;
  border-radius: 30px;
  padding: 62px 48px;
  transition: transform 0.3s ease-out, border-radius 0.3s ease-out;
  will-change: top, transform;
  /* Informuje przeglądarkę, że te właściwości będą zmieniane */
  transform: translateZ(0);
  /* Wymusza akcelerację sprzętową, tworząc nową warstwę kompozytową */
  /* &:hover .boxy-percentage {
        transform: translateY(5px);
    }

    &:hover .boxy-description {
        transform: translateY(-5px);
    } */ }
  .boxy-shape .boxy-percentage {
    font-weight: 600;
    font-size: 100px;
    line-height: 140%;
    color: white;
    transition: transform 0.3s ease-out; }
  .boxy-shape .boxy-description {
    font-weight: 500;
    font-size: 16px;
    line-height: 135%;
    text-transform: uppercase;
    transition: transform 0.3s ease-out; }
  .boxy-shape:hover {
    transform: scale(1.05); }

.firtst-boxy-shape {
  background: var(--marafiki-yellow); }

.second-boxy-shape {
  margin-top: 48px;
  background: var(--marafiki-grey); }
  .second-boxy-shape .boxy-percentage {
    color: var(--marafiki-yellow); }

.third-boxy-shape {
  color: white;
  margin-top: 96px;
  background: black; }

/* Accordion */
.case-accordion .container {
  width: 1264px;
  max-width: calc(100% - 100px);
  padding: 0; }

.case-accordion .section-title {
  margin-bottom: 50px; }

.case-accordion .acc-container {
  display: flex;
  justify-content: space-between;
  gap: 50px; }

.case-accordion .accordion {
  flex: 0 1 657px; }

.case-accordion img {
  margin-top: -95px;
  max-width: 386px;
  width: calc(100% - 100px);
  object-fit: cover; }

.accordion {
  width: 100%; }

.accordion-item {
  border-top: 1px solid black;
  padding: 40px 10px 30px;
  cursor: pointer; }

.accordion-section-title {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-right: 30px; }

.accordion-section-title h3 {
  margin: 0; }

/* Base styles for the plus icon */
.accordion-section-title::before,
.accordion-section-title::after {
  content: '';
  width: 16px;
  height: 2px;
  border-radius: 2px;
  position: absolute;
  background-color: black;
  transition: transform 0.3s ease;
  right: 0;
  top: 50%; }

/* Vertical bar of the plus sign */
.accordion-section-title::before {
  transform: rotate(90deg); }

/* Horizontal bar of the plus sign */
.accordion-item-is-open .accordion-section-title::after {
  transform: rotate(180deg); }

/* When the accordion item is open, transform the vertical bar to effectively hide it, leaving the horizontal bar as a minus */
.accordion-item-is-open .accordion-section-title::before {
  transform: translateY(-50%) rotate(90deg) scaleX(0);
  /* Rotate and scale to zero width */ }

/* Accordion Content styles */
.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.3s ease;
  opacity: 0;
  padding: 10px 0 0 0; }

/* When accordion item is open, set max-height, opacity, and padding */
.accordion-item-is-open .accordion-content {
  opacity: 1; }

.accordeon-on-black {
  color: white; }
  .accordeon-on-black .accordion-item:not(:first-child) {
    border-top: 1px solid white; }
  .accordeon-on-black .accordion-section-title::before,
  .accordeon-on-black .accordion-section-title::after {
    background-color: white; }

/* Next section */
.wavebackground {
  color: white;
  overflow: visible;
  margin-top: -300px; }

.black-rect-content {
  background-color: black;
  margin-top: -3px;
  position: relative;
  z-index: 1; }

.wave-top svg,
.wave-bottom svg {
  display: block;
  width: 100%;
  height: auto; }

.wave-top svg {
  transform-origin: center bottom; }

.wave-bottom svg {
  transform-origin: center top;
  margin-top: -2px; }

.step-by-step-wrapper {
  position: relative;
  margin: 0 auto;
  width: 1376px;
  max-width: calc(100% - 100px);
  gap: clamp(20px, 13vw, 250px);
  display: flex;
  align-items: center;
  justify-content: left; }
  .step-by-step-wrapper .section-title {
    margin-bottom: 60px; }

.step-by-step-list-container {
  padding: 130px 0 0 74px; }

.step-by-step-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 25px; }

.step-by-step-list a {
  position: relative;
  display: block;
  height: 52px;
  line-height: 52px;
  color: var(--marafiki-grey-text);
  font-size: 20px;
  font-weight: 500;
  transition: all 0.5s ease-in-out;
  white-space: nowrap; }
  .step-by-step-list a::after {
    position: absolute;
    content: "";
    top: 96%;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--marafiki-blue);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.5s; }
  @media (hover: hover) {
    .step-by-step-list a:hover::after {
      transform: scaleX(1);
      transform-origin: left; }
    .step-by-step-list a:hover, .step-by-step-list a:focus {
      color: var(--marafiki-yellow); } }

.step-by-step-list a.active-step {
  color: white; }
  .step-by-step-list a.active-step::after {
    background: var(--marafiki-blue);
    transform: scaleX(1); }

.content-display {
  width: 592px;
  max-width: 100%;
  position: relative; }
  .content-display .border-left-3::before {
    background-color: white; }

.content-item {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transform: translateY(-50px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
  pointer-events: none;
  visibility: hidden; }

.content-item.is-visible {
  opacity: 1;
  display: block;
  transform: translateY(0);
  pointer-events: auto;
  visibility: visible; }

.background-step-number {
  position: absolute;
  top: 72%;
  right: 0%;
  transform: translate(20%, -50%);
  font-size: 800px;
  font-weight: 600;
  color: var(--marafiki-blue);
  opacity: 0;
  z-index: 0;
  transition: opacity .5s ease-out, transform .5s ease-out;
  pointer-events: none; }
  .background-step-number.bg-nr-is-visible {
    opacity: .15;
    transform: translate(0, -50%); }

.tropical-leaf {
  width: 395px;
  height: 263px;
  position: absolute;
  top: 0;
  z-index: -2;
  transform-origin: center bottom;
  --base-rotation: 0deg;
  --base-scale-x: 1; }

/* Sekcja case-work-results */
.case-work-results-container {
  padding: 220px 0 100px 0;
  position: relative; }
  .case-work-results-container .tropical-leaf-edge {
    top: 0;
    right: -300px;
    width: 714px;
    height: auto;
    --base-scale-x: -1; }

.results-presentation-wrapper {
  position: relative;
  margin-top: -220px;
  transform: translateY(220px); }

.section-title-flex {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 0 0 110px 0; }
  .section-title-flex .section-title {
    margin: 0; }
  .section-title-flex .header-h5 {
    position: relative;
    padding: 0 0 0 35px;
    margin: 0 0 0 35px;
    width: 445px; }
    .section-title-flex .header-h5::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      width: 5px;
      height: 66px;
      border-radius: 5px;
      background-color: var(--marafiki-blue);
      transform: translateY(-50%); }

.blob-big {
  position: relative;
  aspect-ratio: 1 / 1;
  width: 750px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  margin-left: 100px; }
  .blob-big:hover .case-results-percentage {
    transform: scale(1.07);
    filter: brightness(1.2); }
  .blob-big .tropical-leaf-1 {
    top: 40px;
    left: -190px;
    transform: rotate(90deg);
    --base-rotation: 90deg;
    --base-scale-x: -1; }
  .blob-big .tropical-leaf-2 {
    top: 0px;
    left: -180px;
    transform: rotate(-120deg);
    --base-rotation: -120deg;
    animation-duration: 3.5s; }

.blob-1 {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100%;
  height: auto; }

.blob-2 {
  position: absolute;
  width: 1150px;
  height: auto;
  top: -75%;
  left: -50%;
  z-index: -1; }

.case-results-percentage {
  font-weight: 500;
  font-size: 164px;
  line-height: 1.2;
  color: white;
  transition: transform 0.3s cubic-bezier(0.33, 0.19, 0.56, 1.67), filter 0.3s cubic-bezier(0.33, 0.19, 0.56, 1.67); }

.blob-small {
  position: absolute;
  width: 332px; }
  .blob-small::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 20%;
    transform: translate(-50%, -50%);
    z-index: 0;
    background-size: contain;
    opacity: .15;
    transition: transform 0.3s cubic-bezier(0.33, 0.19, 0.56, 1.67), opacity 0.3s cubic-bezier(0.33, 0.19, 0.56, 1.67); }
  .blob-small:hover .case-results-amount-small {
    transform: scale(1.07);
    filter: brightness(1.2); }

.blob-small-1 {
  top: 182px;
  right: 0px; }
  .blob-small-1::before {
    background: url(009cf35ef9a73c3e05c2.svg) no-repeat center center;
    width: 137px;
    height: 195px; }

.blob-small-2 {
  top: 421px;
  right: 60px; }
  .blob-small-2::before {
    background: url(b7c8012410e510a5095c.svg) no-repeat center center;
    width: 137px;
    height: 195px; }

.blob-small-3 {
  top: 623px;
  right: 220px; }
  .blob-small-3::before {
    background: url(2d2f4c0ae67da618f615.svg) no-repeat center center;
    width: 179px;
    height: 106px; }

.blob-small-4 {
  top: 767px;
  right: 480px; }
  .blob-small-4::before {
    background: url(5e28efc696b79a310afc.svg) no-repeat center center;
    width: 197px;
    height: 210px; }

/* Responsywność dla blobów */
@media (max-width: 1399px) {
  .results-presentation-wrapper {
    padding-bottom: 350px; }
  .blob-big {
    width: 600px;
    margin-left: 50px; } }

.case-results-amount-small {
  font-weight: 600;
  font-size: 56px;
  line-height: 140%;
  color: var(--marafiki-blue);
  transition: transform 0.3s cubic-bezier(0.33, 0.19, 0.56, 1.67), filter 0.3s cubic-bezier(0.33, 0.19, 0.56, 1.67); }

/* Call to action */
.cta-section {
  text-align: center;
  position: relative;
  margin: 250px 0 180px;
  color: white; }
  .cta-section .section-title {
    margin: 0 0 24px; }
  .cta-section .marafiki-button {
    margin-top: 24px; }
  .cta-section.yellow-cta-section {
    color: black;
    padding: 230px 0 180px;
    margin: 100px auto; }
    .cta-section.yellow-cta-section::before {
      display: none; }
    .cta-section.yellow-cta-section .marafiki-button::after {
      background: #333;
      border-color: #333; }
  .cta-section .yellow-blob-cta {
    position: absolute;
    pointer-events: none;
    max-width: none;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-size: cover;
    z-index: -1;
    width: 100%;
    height: auto; }
    .cta-section .yellow-blob-cta.blob-desktop {
      max-width: 829px;
      display: none; }
      @media (min-width: 700px) {
        .cta-section .yellow-blob-cta.blob-desktop {
          display: block; } }
    .cta-section .yellow-blob-cta.blob-mobile {
      max-width: 100%;
      display: block; }
      @media (min-width: 700px) {
        .cta-section .yellow-blob-cta.blob-mobile {
          display: none; } }
  .cta-section.without-background-cta {
    color: black;
    margin: 0 auto;
    padding: 150px 0 150px; }
    .cta-section.without-background-cta::before {
      display: none; }

.cta-section-single-blog {
  margin: 16px 0; }
  .cta-section-single-blog .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 96px 110px 76px;
    /* Ustawienia tła */
    background-color: transparent;
    /* Reset koloru, bo używamy obrazka */
    background-repeat: no-repeat;
    background-position: center;
    /* Kluczowe: rozciągnij tło na 100% szerokości i wysokości */
    background-size: 100% 100%;
    /* SVG jako Data URI z dodanym preserveAspectRatio="none" */
    background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27895%27 height=%27249%27 fill=%27none%27 viewBox=%270 0 895 249%27 preserveAspectRatio=%27none%27%3E%3Cmask id=%27a%27 width=%27895%27 height=%27249%27 x=%270%27 y=%270%27 maskUnits=%27userSpaceOnUse%27 style=%27mask-type:alpha%27%3E%3Cpath fill=%27%23000%27 d=%27M643.385 13.142c267.187-38.794 268.167 11.821 237.331 105.561-31.533 95.863 25.948 157.227-302.909 118.279S-42.655 308.229 5.164 199.479-75.816-6.621 137.53 13.142s271.579 34.015 505.854 0%27/%3E%3C/mask%3E%3Cg mask=%27url%28%23a%29%27%3E%3Cpath fill=%27%23ffb600%27 d=%27M-36.855-650.517h1920v1208h-1920z%27/%3E%3C/g%3E%3C/svg%3E"); }
    .cta-section-single-blog .container .marafiki-button {
      flex: 0 0 auto; }
      .cta-section-single-blog .container .marafiki-button::after {
        background: #333;
        border-color: #333; }

/* Sekcja nasz komentarz */
.descriptive-section {
  padding: 100px 0; }
  .descriptive-section .container {
    padding: 0; }
  .descriptive-section .section-title {
    margin: 100px 0 100px 469px; }

.descriptive-content {
  display: flex;
  gap: 24px;
  margin-bottom: 100px; }
  .descriptive-content:last-of-type {
    margin-bottom: 0; }
  .descriptive-content .header-h3 {
    flex: 0 0 445px; }

/* Gray section */
.gray-section {
  background-color: var(--marafiki-grey);
  position: relative; }
  .gray-section .container {
    width: 1200px;
    max-width: calc(100% - 100px);
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    padding: 100px 0;
    display: flex;
    align-items: center;
    justify-content: center; }

.gray-section-40 {
  background-color: var(--marafiki-grey);
  padding: 40px 0;
  margin: 32px 0; }
  .gray-section-40 img {
    max-width: 100%;
    margin: 10px auto;
    object-fit: cover;
    height: auto;
    display: block;
    border-radius: 30px;
    border: 1px solid #E7e7e7; }

.image-scrollable {
  width: 100%;
  object-fit: cover;
  height: auto;
  max-height: none;
  margin: 0 auto;
  display: block;
  transition: transform 0.3s ease-in-out; }

/* Customer Comment */
.customer-comment-section {
  padding: 260px 0 0; }
  .customer-comment-section .container {
    width: 1120px;
    display: flex;
    align-items: center;
    justify-content: space-between; }
  .customer-comment-section .section-title {
    margin: 0;
    text-align: right; }
    .customer-comment-section .section-title .blue-accent {
      display: block; }

.customer-comment {
  width: 616px;
  position: relative; }
  .customer-comment::before {
    content: '';
    position: absolute;
    top: -150px;
    left: -100px;
    width: 153px;
    height: 141px;
    background: url(24b7009cac9206e5bf51.svg) no-repeat center center;
    background-size: cover; }
  .customer-comment p.border-left-5::before {
    background-color: var(--marafiki-blue); }

.body-small-12 {
  font-weight: 400;
  font-size: 12px;
  line-height: 1.5; }

.small-12 {
  font-weight: 500;
  font-size: 12px;
  line-height: 1.6;
  margin-top: 16px; }

/* team-member-cards-section */
.team-member-cards-section {
  padding: 160px 0;
  overflow: hidden; }
  .team-member-cards-section .section-title {
    margin-bottom: 50px;
    text-align: center; }

.team-member-cards-wrapper {
  width: 1122px;
  max-width: 100%;
  padding-top: 30px;
  margin-top: -30px;
  overflow: hidden; }

.team-member-card {
  background-color: white;
  text-align: center;
  border-radius: 30px;
  padding: 24px 16px;
  transition: transform 0.3s ease-in-out;
  width: 100%;
  height: 100%; }

.member-photo {
  width: 100%;
  height: auto;
  margin-bottom: 24px;
  border-radius: 20px;
  overflow: hidden;
  transition: transform 0.3s ease-out, background-color 0.3s ease-out, border-radius 0.3s ease-out; }
  .member-photo img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.3s ease-out; }

.member-name {
  font-weight: 500;
  font-size: 20px;
  line-height: 28px;
  transition: font-size 0.3s ease-out; }

.team-member-role {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 2%; }

.less-than-3-slides .swiper-wrapper {
  display: flex;
  justify-content: center;
  gap: 24px;
  flex-wrap: wrap; }

.less-than-3-slides .swiper-slide {
  width: 358px; }

/* Summary section */
.summary-section {
  padding: 200px 0 450px 0; }
  .summary-section .section-title {
    text-align: right;
    margin: 0;
    position: relative;
    z-index: 1; }
  .summary-section .container {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
    gap: 32px; }

.summary-content {
  max-width: 605px;
  color: white;
  position: relative; }
  .summary-content .yellow-accent {
    font-weight: 500; }

/* other-content-to-watch */
.other-content-to-watch {
  padding: 100px 0 0 0; }
  .other-content-to-watch .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-flow: row wrap; }
  .other-content-to-watch .section-title {
    display: block;
    width: 322px; }

.other-content-swiper {
  padding: 20px 0 60px;
  /* padding dodany do contanera na swiper, aby zniwelowac overflow: hidden */
  flex: 0 1 1026px; }
  .other-content-swiper .swiper-slide {
    width: 100%;
    transition: transform 0.3s ease-in-out, background-color 0.3s ease-out; }
    .other-content-swiper .swiper-slide:hover {
      transform: translateY(-15px); }
  .other-content-swiper a {
    display: block; }

article.other-content-card {
  width: 100%;
  min-height: 364px;
  padding: 8px;
  border-radius: 30px;
  overflow: hidden;
  border: 1px solid rgba(209, 209, 209, 0.5);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative; }
  article.other-content-card:hover .arrow-up {
    transform: scale(1); }
    article.other-content-card:hover .arrow-up::before {
      transform: scale(1.3); }
    article.other-content-card:hover .arrow-up svg {
      fill: black; }
  article.other-content-card:hover img.cards-bg-img {
    transform: scale(1.1);
    filter: brightness(1.2); }

article.archive-item {
  width: 100%;
  min-height: 580px;
  padding: 16px;
  border-radius: 30px;
  overflow: hidden;
  border: 1px solid rgba(209, 209, 209, 0.5);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative; }
  article.archive-item:hover .arrow-up {
    transform: scale(1); }
    article.archive-item:hover .arrow-up::before {
      transform: scale(1.3); }
    article.archive-item:hover .arrow-up svg {
      fill: black; }
  article.archive-item:hover img.cards-bg-img {
    transform: scale(1.1);
    filter: brightness(1.2); }

img.cards-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease-out, filter 0.3s ease-out;
  transform-origin: center center;
  will-change: transform; }

.aos-fade-and-scale {
  overflow: hidden;
  transform: translateZ(0); }

.case-category-sticker {
  position: absolute;
  background-color: white;
  color: black;
  font-weight: 500;
  font-size: 13px;
  line-height: 130%;
  border-radius: 16px; }

.arrow-up {
  position: absolute;
  border: 1px solid black;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.3s ease-out, filter 0.3s ease-out; }
  .arrow-up:hover {
    filter: saturate(1.8); }
  .arrow-up::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--marafiki-yellow);
    border-radius: 50%;
    z-index: -1;
    transform: scale(0);
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55); }
  .arrow-up svg {
    position: relative;
    z-index: 0;
    transition: fill 0.3s ease-out; }

.cs-card-content {
  display: flex;
  align-items: center;
  position: relative;
  background: white; }

.results-sticker {
  position: absolute;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  text-align: center; }
  .results-sticker.r-s-yellow {
    background-color: var(--marafiki-yellow);
    color: black; }
  .results-sticker.r-s-blue {
    background-color: var(--marafiki-blue);
    color: white; }
  .results-sticker.r-s-black {
    background-color: black;
    color: white; }

/* style specyficzne dla kart w sliderze */
.other-content-card .case-category-sticker {
  top: 21px;
  left: 16px;
  padding: 5px 16px 5px; }

.other-content-card .arrow-up {
  top: 16px;
  right: 16px;
  width: 30px;
  height: 30px; }

.other-content-card .cs-card-content {
  border-radius: 25px;
  padding: 20px 16px; }

.other-content-card .results-sticker {
  width: 88px;
  height: 88px;
  top: -76px;
  left: 16px; }
  .other-content-card .results-sticker .extra-small {
    font-size: 10px;
    line-height: 100%;
    font-weight: 500; }
  .other-content-card .results-sticker .results-p-small {
    font-size: 24px;
    line-height: 135%;
    font-weight: 600;
    margin-top: 4px; }

/* Style specyficzne dla kart w archiwum */
.archive-item .case-category-sticker {
  top: 24px;
  left: 24px;
  padding: 7px 16px 7px; }

.archive-item .arrow-up {
  top: 24px;
  right: 19px;
  width: 40px;
  height: 40px; }

.archive-item .cs-card-content {
  border-radius: 25px;
  padding: 40px 32px; }

.archive-item .results-sticker {
  width: 128px;
  height: 128px;
  top: -111px;
  left: 32px; }
  .archive-item .results-sticker .extra-small {
    font-size: 12px;
    line-height: 150%;
    font-weight: 600; }
  .archive-item .results-sticker .header-h3 {
    margin: 0;
    padding: 0; }

/* FIX dla Safari/iOS - wymuszenie widoczności elementów wewnętrznych */
.other-content-card .case-category-sticker,
.other-content-card .arrow-up,
.other-content-card .cs-card-content,
.other-content-card .results-sticker {
  /* Wymuś, by te elementy też "żyły" w GPU */
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  /* Zapobiegaj miganiu */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }

/* Footer */
.footer {
  position: relative;
  z-index: 5 !important;
  isolation: isolate;
  transform: translate3d(0, 0, 10px);
  will-change: transform;
  overflow: hidden;
  color: white;
  width: 100%;
  min-height: auto;
  padding-top: 250px;
  margin-top: 100px;
  background: url(260f2337e3be859cae27.webp) no-repeat top center;
  background-size: cover; }
  .footer .section-title {
    margin: 0 0 35px 0;
    font-size: 48px;
    line-height: 135%;
    font-weight: 500; }
    .footer .section-title span {
      font-size: 32px;
      font-weight: 300;
      display: block; }
  .footer.footer-contact {
    background: black;
    padding-top: 0px; }
    .footer.footer-contact .footer-bottom {
      padding: 93px 0 93px; }
  .footer.footer-offer-section {
    background: url(e81db5be1d14f025ab9e.webp) no-repeat top center;
    background-size: cover; }

.footer-top {
  padding: 150px 0 0 0;
  display: flex;
  align-items: flex-start;
  gap: 100px;
  width: 1264px;
  max-width: calc(100% - 100px);
  margin: 0 auto; }
  .footer-top picture img {
    margin-top: -30px; }

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 1264px;
  max-width: calc(100% - 100px);
  margin: 0 auto;
  padding: 150px 0 100px; }

/* style specyficzne dla footera na stronie ofert */
.footer-offer-section .footer-top {
  padding: 0; }

.footer-offer-section h4 {
  font-weight: 300;
  font-size: 20px;
  line-height: 135%;
  margin-bottom: 40px;
  padding: 0 50px; }

.contact-data {
  display: flex;
  flex-flow: raw wrap;
  gap: 50px;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 500; }

.social-icons {
  display: flex;
  gap: 24px; }
  .social-icons a {
    width: 24px;
    height: 24px; }

.social-icons li a svg {
  transition: fill 0.3s ease, transform 0.3s ease; }

/* LinkedIn */
.social-icons li a[aria-label="linkedin"]:hover svg {
  fill: #0077B5;
  transform: scale(1.2); }

/* Facebook */
.social-icons li a[aria-label="facebook"]:hover svg {
  fill: #1877F2;
  transform: scale(1.2); }

/* Instagram */
.social-icons li a[aria-label="instagram"]:hover svg {
  fill: #E1306C;
  transform: scale(1.2); }

.copyrights {
  display: flex;
  gap: 10px;
  font-size: 10px;
  line-height: 1;
  font-weight: 400; }
  .copyrights a {
    text-decoration: underline;
    transition: color 0.3s ease; }
    .copyrights a:hover {
      color: var(--marafiki-yellow); }

/* Formularz Contact Form 7 */
/* --- Ogólne style formularza --- */
.wpcf7 {
  max-width: 634px;
  background-color: transparent;
  border: none;
  border-radius: none; }

.wpcf7-form {
  display: block; }

/* Etykiety pól ogólne (dla checkboxa itp.) */
.wpcf7 label {
  display: block;
  margin-bottom: 8px;
  font-weight: bold;
  color: white; }

/* Style dla formularza na białym tle */
.wpcf7.form-on-white-bg label {
  color: black; }

.wpcf7.form-on-white-bg .form-group .wpcf7-form-control:not(.wpcf7-submit) {
  color: black;
  border-bottom: 2px solid black; }

/* --- Sekcja układu dla pól Numer telefonu i Adres e-mail (Flexbox) --- */
.form-row-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0 24px;
  margin-bottom: 0;
  /* Usunięty margines, bo `form-group` ma swój */ }

.form-row-group .form-group {
  flex: 1;
  min-width: 250px;
  /* Minimalna szerokość dla każdego pola w grupie */ }

@media (max-width: 600px) {
  .form-row-group {
    flex-direction: column;
    gap: 0; } }

/* --- Style dla pól z Floating Label (kontener) --- */
.form-group {
  position: relative;
  /* Ważne dla pozycjonowania etykiety */
  margin-bottom: 24px;
  /* Zapewnia miejsce na uniesioną etykietę */ }

/* Style dla inputów i textarea (bazowe) */
.form-group .wpcf7-form-control:not(.wpcf7-submit) {
  width: 100%;
  /* Każdy element ma szerokość 100% kontenera */
  padding: 16px 0 6px;
  /* Większy padding góra/dół dla etykiety */
  border: none;
  border-bottom: 2px solid white;
  border-radius: none;
  box-sizing: border-box;
  /* Ważne, by padding nie zwiększał szerokości */
  font-size: 16px;
  line-height: 1.5;
  transition: border-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
  background-color: transparent;
  color: white; }

.form-group .wpcf7-form-control:not(.wpcf7-submit):focus {
  border-color: var(--marafiki-yellow);
  /* box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.2); */
  outline: none; }

/* Styl dla etykiety wewnątrz form-group (początkowy stan "placeholder") */
.form-group label {
  position: absolute;
  top: 12px;
  left: 0;
  color: white;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  pointer-events: none;
  transition: all 0.2s ease-out;
  transform-origin: left top;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 24px);
  z-index: 1;
  margin-bottom: 0; }

/* Klasa dodawana przez JS dla uniesionej etykiety */
.form-group.has-content label,
.form-group.is-focused label {
  top: -6px;
  font-size: 12px;
  /* transform: scale(0.85); */
  color: var(--marafiki-grey-text); }

/* Specyficzne poprawki dla textarea */
.form-group textarea.wpcf7-textarea {
  padding-top: 24px;
  height: 115px; }

.form-group.has-content textarea.wpcf7-textarea + label,
.form-group.is-focused textarea.wpcf7-textarea + label {
  top: 4px; }

/* --- Przycisk submit --- */
.wpcf7-submit.marafiki-button {
  width: 100%;
  font-size: 15px;
  font-weight: 400;
  padding: 0;
  line-height: 56px;
  height: 56px;
  border: none;
  border-radius: 10px !important;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out, transform 0.3s ease-in-out; }
  .wpcf7-submit.marafiki-button:hover {
    background-color: var(--marafiki-yellow);
    color: black;
    transform: translateY(-4px);
    cursor: pointer; }

/* --- Sekcja dla pola akceptacji --- */
.acceptance-field {
  margin-bottom: 45px;
  font-size: 14px;
  line-height: 1.4;
  color: white; }

.acceptance-field label {
  display: flex;
  align-items: flex-start;
  font-weight: normal;
  cursor: pointer;
  margin-bottom: 0; }

.acceptance-field .consent-checkbox {
  flex-shrink: 0;
  margin-top: 2px;
  margin-right: 10px;
  width: 18px;
  height: 18px;
  accent-color: #15cf15; }

.acceptance-field .wpcf7-list-item-label a {
  color: white;
  text-decoration: underline; }

.acceptance-field .wpcf7-list-item-label a:hover {
  text-decoration: none;
  color: var(--marafiki-yellow); }

/* Wiadomości o sukcesie/błędzie */
div.wpcf7-response-output {
  margin-top: 20px;
  padding: 10px;
  border-radius: 5px;
  font-weight: bold;
  text-align: center;
  transition: all 0.3s ease-in-out; }

div.wpcf7-response-output.wpcf7-display-none {
  display: none;
  opacity: 0;
  visibility: hidden; }

div.wpcf7-response-output.wpcf7-mail-sent-ok {
  background-color: #d4edda;
  color: #155724;
  border-color: #c3e6cb;
  opacity: 1;
  visibility: visible; }

div.wpcf7-response-output.wpcf7-validation-errors,
div.wpcf7-response-output.wpcf7-mail-sent-ng,
div.wpcf7-response-output.wpcf7-acceptance-missing {
  background-color: #f8d7da;
  color: #721c24;
  border-color: #f5c6cb;
  opacity: 1;
  visibility: visible; }

/* Style dla błędów walidacji pojedynczych pól */
.wpcf7-not-valid-tip {
  color: #dc3545;
  font-size: 13px;
  margin-top: 5px;
  margin-bottom: 10px;
  display: block; }

.wpcf7-form-control.wpcf7-not-valid {
  border-color: #dc3545 !important;
  box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2) !important; }

/* Archive - Case list */
.header-archive-case-studies {
  background: black url(792a3af5979884d6d800.webp) center 70% no-repeat;
  color: white;
  position: relative; }
  .header-archive-case-studies .container {
    padding: 105px 0 230px;
    display: flex;
    align-items: center;
    justify-content: center; }
  .header-archive-case-studies .separator--yellow {
    height: 93px; }

@media (min-width: 1600px) {
  .archive-case-list-section {
    margin-top: -130px; } }

.archive-list {
  display: flex;
  gap: 16px;
  flex-flow: row wrap; }

.archive-list li {
  line-height: 1.2;
  font-size: 0; }

.archive-case-list-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 72px;
  grid-auto-rows: min-content;
  row-gap: 64px;
  position: relative; }

.archive-case-item:nth-child(even) {
  transform: translateY(100px); }

.filter-content-case-study {
  padding: 0 70px 40px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end; }
  .filter-content-case-study .header-h3 {
    padding-left: 68px;
    background: url(8a3948783989d151b880.svg) top left no-repeat;
    background-size: contain; }

/* Podstrona Kontakt */
.header-contact {
  text-align: center;
  padding: 192px 0 40px; }

/* Persons data on contact page */
.contact-person-data a {
  font-size: 16px;
  font-weight: 500;
  display: block;
  margin-top: 10px; }

.section-form-on-contact-page {
  padding: 50px 0 100px; }
  .section-form-on-contact-page .container {
    display: flex;
    justify-content: center;
    gap: 100px; }
  .section-form-on-contact-page .text-main {
    margin-bottom: 32px; }

.contact-site-person-data {
  display: flex; }

.contact-site-person-image {
  position: relative;
  width: 100%;
  margin-left: -100px; }
  .contact-site-person-image img {
    width: 100%;
    object-fit: cover; }

/* Form on Contact Page */
.form-on-contact-page {
  width: 559px;
  max-width: 100%; }
  .form-on-contact-page .section-title {
    margin: 0 0 24px 0; }

/* Sekcja z danymi kontaktowymi */
.contact-data-section {
  margin: 65px 0 100px 0; }

.contact-data-section .container {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  gap: 30px; }

.data-address {
  margin-top: 168px;
  min-width: 250px; }

.contact-data-socials {
  margin-top: 168px;
  min-width: 250px; }

.contact-data-insignts {
  max-width: 564px;
  width: 100%;
  background: orange url(84b8c79e6cca96efdbc1.webp) center/cover no-repeat;
  background-size: cover;
  border-radius: 30px;
  padding: 165px 64px;
  text-align: center; }

.center-divider {
  width: 138px;
  height: 5px;
  background: black;
  border: none;
  border-radius: 10px;
  margin: 25px auto; }

ul.contact-info,
ul.social-links {
  margin: 45px 0 0 48px; }
  ul.contact-info li,
  ul.social-links li {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: flex-start;
    padding-left: 48px;
    margin-bottom: 35px;
    font-size: 13px;
    line-height: 130%;
    font-weight: 500;
    white-space: nowrap; }

.contact-info i {
  position: absolute;
  left: 0;
  top: calc(50% - 12px);
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat; }
  .contact-info i.icon-location {
    background-image: url(bd1979da9277bcc86235.svg); }
  .contact-info i.icon-phone {
    background-image: url(d659c7e4b7b1ea90644c.svg); }
  .contact-info i.icon-mail {
    background-image: url(40c9f2565516ba94420f.svg); }
  .contact-info i.icon-office {
    background-image: url(918aba973eda836f896f.svg); }

.social-links i {
  position: absolute;
  left: 0;
  top: calc(50% - 12px);
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat; }
  .social-links i.icon-fb {
    background-image: url(d6ca9c4d49de8dc641cf.svg); }
  .social-links i.icon-in {
    background-image: url(9b4ad6fb91244999e649.svg); }
  .social-links i.icon-ig {
    background-image: url(8e0d773b532627e80942.svg); }
  .social-links i.icon-yt {
    background-image: url(b2dc1ac93123b3201be6.svg); }

.accordeon-contact-page-section {
  padding-bottom: 100px;
  margin: 300px 0 0;
  color: white;
  background-size: cover; }
  .accordeon-contact-page-section .container {
    position: relative; }
  .accordeon-contact-page-section .section-title {
    margin: 0 0 50px 0; }

.blob-contact-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -67%);
  min-width: 1920px;
  width: 100%;
  object-fit: cover; }

.blob-with-stripes {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 1500px;
  width: 100%;
  object-fit: cover; }

.accordeon-flex-contact {
  position: relative;
  display: flex;
  justify-content: flex-start;
  gap: clamp(50px, calc(0.135 * 100vw - 90px), 170px);
  min-height: 600px; }
  .accordeon-flex-contact .accordion {
    max-width: 657px; }

.our-clients-contact-page {
  position: relative;
  margin-top: -300px;
  flex: 0 0 450px; }

.client-logo {
  position: absolute;
  width: 150px;
  height: 100px;
  background: white;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center; }
  .client-logo img {
    max-width: 90%; }
  .client-logo:nth-child(1) {
    left: 0;
    top: 78px; }
  .client-logo:nth-child(2) {
    left: 273px;
    top: 7px; }
  .client-logo:nth-child(3) {
    left: 10px;
    top: 300px; }
  .client-logo:nth-child(4) {
    left: 203px;
    top: 180px; }
  .client-logo:nth-child(5) {
    left: 86px;
    top: 494px; }
  .client-logo:nth-child(6) {
    left: 296px;
    top: 361px; }

/* Search bar */
.search-bar-article {
  margin: 125px 0 150px;
  text-align: center; }
  .search-bar-article .header-h3 {
    margin-bottom: 40px; }

.custom-search-form {
  width: 800px;
  max-width: 100%;
  margin: 0 auto; }

.search-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  height: 60px;
  border-radius: 50px;
  overflow: hidden;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px; }

.icon-left {
  position: absolute;
  left: 20px;
  display: flex;
  align-items: center;
  justify-content: center; }

.search-field {
  flex: 1;
  height: 100%;
  border: none;
  padding: 0 134px 0 60px;
  font-size: 24px;
  border-radius: 50px;
  outline: none; }

.search-actions {
  position: absolute;
  right: 20px;
  display: flex;
  gap: 10px; }

.search-actions button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center; }
  .search-actions button:first-child {
    border-right: 1px solid #ccc;
    padding-right: 10px; }

/* Ukrywanie domyślnego iksa w przeglądarkach WebKit (Chrome, Safari, Edge) */
.search-field::-webkit-search-decoration,
.search-field::-webkit-search-cancel-button,
.search-field::-webkit-search-results-button,
.search-field::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none; }

/* Podstrona bloga - archiwum */
.header-blog .container {
  padding: 44px 0 0 0; }

.blog-search-form {
  width: 343px;
  margin: 0;
  padding: 0;
  border: none;
  background: none; }

.blog-search-label {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0; }

.blog-search-input {
  all: unset;
  box-sizing: border-box;
  width: 100%;
  height: 48px;
  border-bottom: 2px solid black;
  padding: 0 46px 0 16px;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1; }

.blog-search-input::placeholder {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.02em;
  color: #797979;
  opacity: 1; }

.blog-search-button {
  all: unset;
  cursor: pointer;
  position: absolute;
  right: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease-in-out; }
  .blog-search-button:hover {
    transform: scale(1.1) translateY(-45%); }

/* Blog wyszukiwanie */
.blog-search-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 40px; }

/* Blog kategorie */
.blog-category-list {
  margin-top: 44px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px; }
  .blog-category-list li {
    list-style: none;
    line-height: 1.2; }

/* blog list */
.blog-main-section {
  padding: 64px 0 0 0;
  margin-bottom: 150px; }
  .blog-main-section .container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 100px; }

/* ASIDE CTA */
.flex-second-column {
  flex: 0 0 358px;
  height: 326px; }

.cta-aside {
  background: url(13d1c0d9226325ac5d81.webp) center/cover no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column; }
  .cta-aside h3 {
    font-size: 24px;
    line-height: 135%;
    font-weight: 600;
    text-align: center;
    margin-bottom: 10px; }
  .cta-aside h2 {
    font-size: 30px;
    line-height: 140%;
    font-weight: 600;
    margin-bottom: 10px; }
  .cta-aside button {
    margin-top: 10px; }

.pin-inner-content {
  width: 100%; }

/* post-item */
.blog-posts-wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px; }

.blog-post-item {
  max-width: 908px;
  width: 100%;
  background: white;
  border-radius: 30px;
  border: 1px solid #e7e7e7;
  overflow: hidden;
  transition: all 0.3s ease-in-out; }
  .blog-post-item:hover {
    transform: translateX(20px); }
    .blog-post-item:hover .post-arrow {
      filter: saturate(1.5);
      /* .arrow-up::before {
                transform: scale(1.3);
            } */ }

.post-content {
  display: flex;
  flex-wrap: nowrap; }

.post-main {
  padding: 40px 35px 40px 40px;
  display: flex;
  flex-direction: column;
  gap: 32px; }
  .post-main .header-h3 {
    margin: 0; }

.post-meta {
  display: flex;
  gap: 24px;
  justify-content: space-between;
  align-items: center; }

.post-tags {
  display: flex;
  gap: 8px;
  justify-content: flex-start; }
  .post-tags .tag {
    cursor: pointer; }

.post-author-date {
  display: flex;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 400;
  gap: 10px; }

.post-arrow {
  flex: 0 0 110px;
  position: relative;
  transition: filter 0.3s ease-out; }
  .post-arrow.post-arrow-yellow {
    background: var(--marafiki-yellow); }
  .post-arrow.post-arrow-blue {
    background: var(--marafiki-blue); }
    .post-arrow.post-arrow-blue .arrow-up {
      border: 1px solid white; }
    .post-arrow.post-arrow-blue .arrow-up svg path {
      fill: white; }
  .post-arrow.post-arrow-black {
    background: black; }
    .post-arrow.post-arrow-black .arrow-up {
      border: 1px solid white; }
    .post-arrow.post-arrow-black .arrow-up svg path {
      fill: white; }
  .post-arrow .arrow-up {
    position: absolute;
    top: 40px;
    right: 35px;
    width: 40px;
    height: 40px; }

.blog-posts-wrapper .cta-aside {
  width: 350px;
  height: 317px;
  margin: 0 auto;
  display: none; }

/* Breadcrumbs */
.breadcrumbs {
  margin-top: 30px; }
  .breadcrumbs a {
    transition: opacity 0.3s ease;
    text-decoration: none;
    color: inherit; }
    .breadcrumbs a:hover {
      opacity: .8; }

.breadcrumbs__list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0; }

.breadcrumbs__item {
  display: flex;
  align-items: center; }
  .breadcrumbs__item a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: inherit;
    transition: opacity 0.3s ease; }
    .breadcrumbs__item a:hover {
      opacity: 0.8; }
  .breadcrumbs__item:not(:last-child) a::after {
    content: '';
    display: inline-block;
    width: 9px;
    height: 7px;
    margin-left: 12px;
    margin-right: 12px;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width=%2718%27 height=%2714%27 viewBox=%270 0 18 14%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M10.2197 0.21967C10.5126 -0.0732233 10.9874 -0.0732233 11.2803 0.21967L17.2803 6.21967C17.5732 6.51256 17.5732 6.98744 17.2803 7.28033L11.2803 13.2803C10.9874 13.5732 10.5126 13.5732 10.2197 13.2803C9.92678 12.9874 9.92678 12.5126 10.2197 12.2197L14.9393 7.5L0.75 7.5C0.335786 7.5 0 7.16421 0 6.75C0 6.33579 0.335786 6 0.75 6L14.9393 6L10.2197 1.28033C9.92678 0.987437 9.92678 0.512563 10.2197 0.21967Z%27 fill=%27black%27/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg width=%2718%27 height=%2714%27 viewBox=%270 0 18 14%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M10.2197 0.21967C10.5126 -0.0732233 10.9874 -0.0732233 11.2803 0.21967L17.2803 6.21967C17.5732 6.51256 17.5732 6.98744 17.2803 7.28033L11.2803 13.2803C10.9874 13.5732 10.5126 13.5732 10.2197 13.2803C9.92678 12.9874 9.92678 12.5126 10.2197 12.2197L14.9393 7.5L0.75 7.5C0.335786 7.5 0 7.16421 0 6.75C0 6.33579 0.335786 6 0.75 6L14.9393 6L10.2197 1.28033C9.92678 0.987437 9.92678 0.512563 10.2197 0.21967Z%27 fill=%27black%27/%3E%3C/svg%3E");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center; }

/* Strona posta */
.header-blog-post .header-h1 {
  margin: 40px 0 24px 0; }

.header-blog-post p.text-main {
  margin: 0 0 24px 0; }

.post-table-of-contents {
  margin: 32px 0; }
  .post-table-of-contents .container {
    padding: 32px 40px;
    border-radius: 30px;
    background: white; }
  .post-table-of-contents .header-h4 {
    margin: 0 0 16px 0; }

.toc {
  padding-left: 20px;
  font-size: 14px;
  line-height: 2;
  list-style-position: outside; }
  .toc li {
    position: relative;
    transition: transform 0.3s ease-in-out, color 0.3s ease-in-out;
    cursor: pointer; }
    .toc li:hover {
      transform: translateX(10px);
      color: var(--marafiki-blue); }
    .toc li::before {
      content: '›';
      position: absolute;
      left: -35px;
      top: 50%;
      transform: translateY(-50%);
      opacity: 0;
      transition: opacity 0.3s ease-out, left 0.3s ease-out; }
    .toc li:hover::before {
      opacity: 1;
      left: -33px; }

.anim-text {
  visibility: hidden;
  opacity: 0;
  will-change: transform, opacity, filter; }

.post-content .section-title {
  margin: 32px 0; }

.post-content .text-main {
  margin: 32px 0; }

.post-content img {
  max-width: 100%;
  margin: 10px auto;
  object-fit: cover;
  height: auto;
  display: block;
  border-radius: 30px;
  border: 1px solid #E7e7e7; }

.dotted-list {
  list-style-type: disc;
  padding-left: 20px; }

.more-posts .container {
  padding-top: 50px; }

.more-posts .blog-posts-wrapper {
  gap: 16px; }

.more-posts .arrow-up {
  top: calc(50% - 20px); }

/* Post Bio */
.post-author-bio {
  margin: 10px 0 36px; }
  .post-author-bio .border-left-3 {
    padding-left: 19px; }

.author-info {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 38px;
  margin-top: 50px;
  padding-top: 50px;
  border-top: 1px solid #E7E7E7; }
  .author-info .author-avatar {
    display: flex;
    align-items: center;
    justify-content: flex-start; }
    .author-info .author-avatar img {
      max-width: 200px;
      height: auto;
      object-fit: cover;
      margin-right: 50px; }

/* Strona O nas */
.header-about-us .container {
  padding: 92px 0 157px;
  text-align: center;
  position: relative; }
  .header-about-us .container .tropical-leaf {
    width: 180px;
    height: auto; }

.header-about-us .header-h1 {
  margin: 0 0 56px 0; }

.header-about-us .section-title {
  margin: 0 0 12px 0; }

.header-about-us p.text-20 {
  margin-bottom: 24px; }

.header-about-us p.text-main {
  max-width: 600px;
  margin: 0 auto; }

.header-about-us .tropical-leaf-1 {
  top: 70px;
  left: 50px;
  --base-rotation: -125deg; }

.header-about-us .tropical-leaf-2 {
  top: 100px;
  left: 30px;
  --base-scale-x: -1;
  --base-rotation: 60deg; }

.header-about-us .tropical-leaf-edge {
  top: 200px;
  right: -410px;
  width: 680px;
  height: auto;
  --base-scale-x: -1; }

@media (max-width: 1500px) {
  .header-about-us {
    position: relative; }
    .header-about-us .container {
      position: static; }
      .header-about-us .container .tropical-leaf-1 {
        top: 130px;
        left: auto;
        --base-rotation: -155deg;
        right: -100px; }
      .header-about-us .container .tropical-leaf-2 {
        top: 200px;
        left: auto;
        right: -40px;
        --base-rotation: 10deg; }
    .header-about-us .tropical-leaf-edge {
      width: 205px;
      height: auto;
      top: 180px;
      right: auto;
      left: -70px;
      --base-scale-x: 1;
      --base-rotation: 50deg; } }

/* Next section */
.section-about-us-after-top {
  position: relative;
  color: white; }
  .section-about-us-after-top .container {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 64px; }
    .section-about-us-after-top .container div:first-of-type {
      padding-bottom: 85px;
      width: 520px; }
    .section-about-us-after-top .container .section-title {
      margin-bottom: 16px; }

.blob-black-bg {
  position: absolute;
  top: 92%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 1920px;
  width: 100%;
  object-fit: cover;
  z-index: -1; }

.zebra-catchy {
  text-align: center; }
  .zebra-catchy video {
    max-width: 700px;
    width: 100%;
    padding: 0 45px;
    height: auto;
    display: block;
    border-radius: 30px;
    background: white;
    margin: 0 0 32px 0; }

/* Next section */
.about-us-lower-part {
  position: relative;
  z-index: 3; }
  .about-us-lower-part ul {
    display: flex;
    justify-content: space-between;
    padding: 154px 36px 0;
    gap: 30px; }
    .about-us-lower-part ul li {
      text-align: center;
      max-width: 326px;
      width: 100%; }

.about-us-lower-part-item {
  max-width: 326px;
  width: 100%;
  aspect-ratio: 1 / 1;
  background: white;
  border-radius: 30px;
  overflow: hidden;
  margin-bottom: 25px; }
  .about-us-lower-part-item .header-h4 {
    margin-bottom: 8px; }
  .about-us-lower-part-item img {
    width: 100%;
    object-fit: cover;
    transition: transform 0.3s ease-out; }
  .about-us-lower-part-item:hover img {
    transform: scale(1.05); }

/* Next section */
.about-us-people-slider-section {
  padding: 190px 0 150px; }

.section-title-plus-custom-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 35px;
  margin-bottom: 50px; }
  .section-title-plus-custom-nav .section-title {
    margin-bottom: 8px;
    text-align: center; }
  .section-title-plus-custom-nav .text-20 {
    text-align: center; }

.custom-prev-btn,
.custom-next-btn {
  cursor: pointer;
  transition: transform 0.3s ease, opacity 0.3s ease; }
  .custom-prev-btn:hover,
  .custom-next-btn:hover {
    transform: scale(1.2);
    opacity: 0.5; }

/* Swiper team members */
#aboutPeopleSwiper {
  padding: 20px 20px; }
  #aboutPeopleSwiper .swiper-slide {
    flex-shrink: 0;
    width: 213px !important;
    transition: width 0.3s ease, transform 0.3s ease; }
    @media (hover: hover) {
      #aboutPeopleSwiper .swiper-slide:not(.active):hover {
        transform: translateY(-10px); } }
    #aboutPeopleSwiper .swiper-slide.active {
      width: 426px !important;
      transform: translateY(0); }
      #aboutPeopleSwiper .swiper-slide.active .team-member-bio p {
        transform: translateX(0);
        opacity: 1;
        transition: transform 0.3s 0.3s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 0.3s 0.3s ease; }
      #aboutPeopleSwiper .swiper-slide.active .info-icon {
        fill: var(--marafiki-blue); }

.team-member-container {
  display: flex;
  align-items: center;
  background: white;
  border-radius: 20px;
  position: relative;
  height: 323px;
  /*  Po kliknięciu w slajd bio się otwiera */ }
  .team-member-container figure {
    width: 213px;
    height: 323px;
    text-align: center;
    padding-top: 10px; }
    .team-member-container figure figcaption {
      text-align: center;
      padding: 35px 0 0 0; }
  .team-member-container .team-member-photo {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    position: relative;
    width: 100%;
    height: 213px;
    padding: 20px 20px 0 20px;
    position: relative; }
    .team-member-container .team-member-photo svg {
      position: absolute;
      bottom: -10px;
      left: 0;
      width: 100%;
      height: auto;
      z-index: 1; }
    .team-member-container .team-member-photo img {
      object-fit: contain;
      max-width: 95%;
      max-height: 95%; }
  .team-member-container .team-member-bio {
    opacity: 0;
    max-width: 0;
    overflow: hidden;
    padding: 0;
    transition: all 0.3s ease; }
    .team-member-container .team-member-bio p {
      transform: translateX(-150px);
      opacity: 0; }
  .swiper-slide.active .team-member-container .team-member-bio {
    opacity: 1;
    max-width: 213px;
    padding: 0 32px 0 8px; }
  .team-member-container svg.info-icon {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 22px;
    height: 22px;
    fill: black;
    transition: transform 0.3s ease-out, fill 0.3s ease-out; }
    .team-member-container svg.info-icon:hover {
      transform: scale(1.2); }

.elite-partners-section {
  background-color: var(--marafiki-blue);
  color: white;
  padding: 160px 0 100px;
  margin-top: -125px; }
  .elite-partners-section .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 50px; }
  .elite-partners-section .section-title {
    margin-bottom: 16px; }

.elite-description {
  max-width: 620px;
  width: 100%; }

.elite-partners-logos {
  display: flex;
  gap: 32px;
  align-items: center;
  position: relative; }
  .elite-partners-logos img {
    max-width: 100%; }
  .elite-partners-logos::before, .elite-partners-logos::after {
    content: '';
    height: 1px;
    width: 70px;
    background-color: white; }

/* Next section */
.revealing-cards-section {
  text-align: center; }

.revealing-cards-grid-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  max-width: 1042px;
  margin: 65px auto;
  /* padding: 0 20px; */ }

.revealing-card {
  aspect-ratio: 1 / 1;
  perspective: 1000px;
  cursor: pointer; }

.card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
  border-radius: 20px; }

/* Style dla obu stron (bez zmian) */
.card-front,
.card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: center;
  border-radius: 20px; }

/* Przód karty (bez zmian) */
.card-front {
  background-color: var(--marafiki-blue);
  color: white; }

.icon-front {
  width: 50%;
  height: 50%; }

.question-mark {
  font-weight: 600;
  font-size: 150px;
  line-height: 140%; }

/* Tył karty (bez zmian) */
.card-back {
  background-color: white;
  transform: rotateY(180deg); }

/* klasa aktywująca obrót */
.card-is-revealed {
  transform: rotateY(180deg) !important; }

/* next section */
.about-the-founders {
  margin: 300px 0 100px;
  position: relative;
  z-index: 2; }
  .about-the-founders .upperwave,
  .about-the-founders .lowerwave {
    position: relative;
    z-index: -1;
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover; }
  .about-the-founders .lowerwave {
    margin-top: -3px; }

.black-background {
  background-color: black;
  color: white;
  margin-top: -2px; }

.about-founders-upper {
  display: flex;
  justify-content: space-between;
  gap: 40px; }

.about-the-founders-text {
  max-width: 550px;
  width: 100%; }
  .about-the-founders-text .section-title {
    margin-bottom: 40px; }

.about-the-founders-blue-blob {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  max-width: 562px;
  height: auto;
  aspect-ratio: 563/391; }
  .about-the-founders-blue-blob svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    z-index: 1;
    display: block; }
  .about-the-founders-blue-blob h3 {
    position: relative;
    z-index: 2;
    font-size: 42px;
    line-height: 130%;
    font-weight: 600;
    transform: translateY(-20px); }
    .about-the-founders-blue-blob h3 span {
      font-size: 20px; }
      .about-the-founders-blue-blob h3 span span {
        padding-left: 40px; }

.about-founders-lower {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  margin-top: -330px;
  transform: translateY(380px);
  align-items: flex-start; }
  @media (min-width: 1030px) and (max-width: 1920px) {
    .about-founders-lower {
      padding-bottom: 200px; } }
  .about-founders-lower img {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    max-width: 640px;
    height: auto;
    display: block;
    object-fit: contain; }

.founders-few-words {
  flex: 0 0 550px;
  width: 550px;
  margin-top: 60px; }
  .founders-few-words .header-h5 {
    font-size: 18px;
    margin-bottom: 16px; }

/* Next section */
.about-us-movies-section {
  padding: 100px 0 300px; }
  .about-us-movies-section .section-title {
    text-align: center;
    margin-bottom: 80px; }

.about-us-movies-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 90px;
  /* Zmniejszyłem gap, żeby szybciej się nie łamało */ }

/* --- SEKCJA WIDEO --- */
.about-us-the-movie {
  flex: 1 1 auto;
  width: 100%;
  max-width: 731px;
  position: relative;
  aspect-ratio: 731 / 571;
  /* Tło (Blob) */ }
  .about-us-the-movie::after {
    content: '';
    position: absolute;
    top: 12%;
    left: 5%;
    width: 100%;
    height: 100%;
    background: url(74c604a7f34237698909.svg) center/contain no-repeat;
    pointer-events: none;
    z-index: -1; }

.clipped-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Maska */
  clip-path: url(#myClip);
  -webkit-clip-path: url(#myClip);
  display: block;
  opacity: 1;
  transition: opacity 0.5s ease-in-out; }
  .clipped-video.is-fading {
    opacity: 0; }

/* --- SEKCJA AKORDEONU --- */
.toggle-list-accordion {
  flex: 0 0 555px;
  width: 555px; }

.toggle-list-item {
  position: relative;
  padding: 0 0 0 31px;
  cursor: pointer;
  margin: 32px 0; }
  .toggle-list-item p {
    height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: height 0.4s ease-in-out, opacity 0.4s ease-in-out, transform 0.4s ease-in-out; }
  .toggle-list-item::after {
    content: '';
    position: absolute;
    width: 7px;
    height: 100%;
    border-radius: 50px;
    left: 0;
    top: 50%;
    background-color: #e7e7e7;
    transform: translateY(-50%);
    transition: background-color 0.3s ease-in-out, height 0.3s ease-in-out; }

.toggle-item-title {
  font-size: 20px;
  line-height: 135%;
  font-weight: 600;
  color: #a1a1a1;
  transition: all 0.3s ease-in-out; }

.toggle-list-item.active-toggle-item .toggle-item-title {
  color: black;
  font-size: 30px;
  line-height: 140%;
  margin-bottom: 10px; }

.toggle-list-item.active-toggle-item p {
  height: auto;
  opacity: 1;
  transform: translateY(0);
  transition-delay: .2s; }

.toggle-list-item.active-toggle-item::after {
  background-color: var(--marafiki-yellow); }

/* Next section */
.about-us-gallery-section {
  height: 100vh;
  height: 100svh;
  width: 100%;
  overflow: hidden;
  position: relative; }
  .about-us-gallery-section .section-title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    text-align: center;
    white-space: nowrap;
    /* Efekt szkła (Desktop) */ }
    .about-us-gallery-section .section-title::after {
      content: '';
      position: absolute;
      top: -20px;
      left: -30px;
      right: -30px;
      bottom: -20px;
      background: rgba(255, 255, 255, 0.25);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border-radius: 30px;
      border: 1px solid rgba(255, 255, 255, 0.4);
      z-index: -1; }
  .about-us-gallery-section img {
    padding: 75px;
    height: 100%;
    width: auto;
    object-fit: cover;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    will-change: transform;
    transform: translate3d(0, 0, 0); }

/* Next section */
@keyframes scrollLogos {
  from {
    transform: translate3d(0, 0, 0); }
  to {
    transform: translate3d(calc(-1 * var(--scroll-width, 0)), 0, 0); } }

.logo-marquee {
  position: relative;
  margin: 350px 0;
  width: 100%;
  color: white;
  text-align: center; }
  .logo-marquee p {
    max-width: 540px;
    width: 100%;
    margin: 0 auto 45px; }

.black-blob-underneath {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto; }

.track-list {
  overflow: hidden;
  height: 150px;
  background: white;
  margin: 45px 0;
  position: relative; }
  @media (hover: hover) {
    .track-list:hover .logo-list {
      animation-play-state: paused; } }

.logo-list {
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  height: 150px;
  animation: scrollLogos 15s linear infinite;
  width: auto;
  will-change: transform; }

.logo-list li {
  margin-right: 65px;
  flex-shrink: 0;
  list-style: none; }

/* Next section */
.where-we-work-section {
  position: relative;
  padding: 50px 0 200px; }
  .where-we-work-section .section-title {
    margin-bottom: 24px; }

.city-image {
  width: 200%;
  height: auto;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none; }

.www-upper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px; }
  .www-upper img {
    max-width: 100%;
    height: auto;
    flex-shrink: 1; }
  .www-upper div {
    width: 510px;
    max-width: 100%;
    flex-shrink: 0; }

.www-lower {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 70px;
  margin-top: 175px; }
  .www-lower .text-20 {
    max-width: 480px; }

.list-of-conferences {
  display: flex;
  gap: 31px; }

/* Next section */
.about-us-slider-hobbys-section {
  padding: 100px 0 150px; }
  .about-us-slider-hobbys-section .section-title {
    margin-bottom: 80px; }
  .about-us-slider-hobbys-section .container {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 100px;
    margin-bottom: 50px; }
    @media (max-width: 1700px) {
      .about-us-slider-hobbys-section .container {
        gap: 60px; } }
    @media (max-width: 1400px) {
      .about-us-slider-hobbys-section .container {
        gap: 30px; } }
  .about-us-slider-hobbys-section .steps-more {
    display: none; }

.about-us-with-image {
  max-width: 560px;
  width: 100%;
  flex-shrink: 0;
  text-align: center;
  position: relative;
  z-index: 2; }
  .about-us-with-image img {
    pointer-events: none; }
  .about-us-with-image .section-title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-wrap: nowrap; }

.slider-buttons-flex-container {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 40px;
  margin-top: 160px; }

.about-us-slider-wrapper {
  position: relative;
  overflow: visible; }

.about-us-slide {
  width: auto;
  height: auto;
  flex-shrink: 0; }
  .about-us-slide.odd {
    margin-top: 220px; }
  .about-us-slide.special-margin {
    margin-top: 120px; }

.about-us-slide img {
  display: block;
  height: auto;
  width: auto;
  object-fit: contain;
  max-width: 350px; }

/* tooltip */
.tooltip {
  position: absolute;
  background: var(--marafiki-yellow);
  max-width: 216px;
  text-align: center;
  color: black;
  padding: 16px;
  border-radius: 10px;
  font-size: 16px;
  line-height: 150%;
  font-weight: 500;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -120%);
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.4s ease; }
  .tooltip::before {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 50px;
    transform: translateX(-50%);
    width: 57px;
    height: 40px;
    background: url(773c05b091f7d8c9ce69.svg) center/contain no-repeat; }

.tooltip.show {
  opacity: 1;
  transform: translate(-50%, -80%); }

/* Next section */
.marafiki-in-social-media {
  margin: 400px 0 80px;
  text-align: center; }
  .marafiki-in-social-media .section-title {
    margin-bottom: 24px; }

.social-media-links .social-icons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 61px;
  margin-bottom: 85px; }
  .social-media-links .social-icons svg {
    fill: black;
    width: 48px;
    height: 48px;
    object-fit: cover;
    display: block; }

.social-media-feed-list {
  display: flex;
  align-items: stretch;
  gap: 16px;
  margin: 0;
  justify-content: space-between;
  overflow-x: visible;
  padding: 0; }
  .social-media-feed-list li {
    width: 300px;
    flex-shrink: 1;
    padding: 0; }
    .social-media-feed-list li a {
      display: block;
      height: 100%; }
  .social-media-feed-list img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease-out, filter 0.3s ease-out; }
    .social-media-feed-list img:hover {
      transform: scale(1.07);
      filter: brightness(1.08); }

/* Next section */
.additional-info-section {
  text-align: center;
  padding-top: 140px; }
  .additional-info-section .section-title {
    transform: translateX(-285px); }
  .additional-info-section h3 {
    margin-top: 40px;
    font-size: 56px;
    line-height: 140%;
    font-weight: 600; }
    .additional-info-section h3 .blue-accent-rect {
      color: white; }

/* Home page */
.header-front-page {
  min-height: 790px;
  display: flex;
  flex-direction: column;
  background-color: var(--marafiki-yellow);
  overflow: hidden; }
  .header-front-page img {
    position: relative;
    pointer-events: none;
    align-self: flex-end;
    max-width: 100%;
    min-width: 0;
    height: auto;
    flex-shrink: 1;
    object-fit: contain; }
  .header-front-page .container {
    display: flex;
    flex-grow: 1;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    max-width: 100%;
    will-change: transform; }

.slogan {
  margin: -100px 0 0 65px;
  flex-shrink: 0; }
  .slogan .white-accent-rect {
    transform: translate(30px, -5px); }
  .slogan .text-20 {
    margin: 20px 0 0 65px; }

.masked {
  /* --- USTAWIENIA MASKI --- */
  --mask-url: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1920 4239.5%27%3E%3Cpath d=%27M1920 0H0v4228c168.8-44.7 353.8-104.8 587-109.1 290.7-5.3 821.2 127.1 1333 103.8z%27 fill=%27black%27/%3E%3C/svg%3E");
  -webkit-mask-image: var(--mask-url);
  mask-image: var(--mask-url);
  -webkit-mask-size: cover;
  mask-size: cover;
  -webkit-mask-position: bottom center;
  mask-position: bottom center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  /* --- KONIEC MASKI --- */ }

.masked-inverted {
  /* --- USTAWIENIA MASKI --- */
  --mask-url-flipped: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1920 4239.5%27%3E%3Cpath transform=%27translate%281920, 0%29 scale%28-1, 1%29%27 d=%27M1920 0H0v4228c168.8-44.7 353.8-104.8 587-109.1 290.7-5.3 821.2 127.1 1333 103.8z%27 fill=%27black%27/%3E%3C/svg%3E");
  -webkit-mask-image: var(--mask-url-flipped);
  mask-image: var(--mask-url-flipped);
  -webkit-mask-size: cover;
  mask-size: cover;
  -webkit-mask-position: bottom center;
  mask-position: bottom center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat; }

.with-pattern-bg {
  position: relative;
  /* z-index: -1; */
  will-change: transform;
  transform: translate3d(0, 0, 0); }
  .with-pattern-bg::before, .with-pattern-bg::after {
    content: '';
    position: absolute;
    width: 100%;
    min-width: 1600px;
    height: 100%;
    background-image: url(71f2c6f06a1e18e454ea.webp);
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
    mix-blend-mode: overlay; }
  .with-pattern-bg::before {
    background-position: top right;
    right: 0;
    top: 0; }
  .with-pattern-bg::after {
    left: 0%;
    bottom: -20%;
    background-position: top right;
    transform: scale(-1); }

/* Next section */
.latest-posts {
  padding: 50px 0 0 0; }
  .latest-posts .arrow-up {
    top: calc(50% - 20px); }
  .latest-posts .container {
    display: flex;
    justify-content: center;
    gap: 24px; }
  .latest-posts .section-title {
    margin-top: 90px; }

/* Next section */
.general-info-section {
  margin: 100px 0 150px; }
  .general-info-section .container {
    width: 1120px;
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 40px; }
  .general-info-section p.text-main {
    max-width: 523px; }

.branches-of-activity-list {
  display: flex;
  gap: 16px;
  color: #797979;
  margin: 32px 0;
  flex-wrap: wrap; }
  .branches-of-activity-list a {
    white-space: nowrap;
    transition: color .3s ease, transform .3s ease-out;
    font-size: 16px;
    font-weight: 500; }
    .branches-of-activity-list a:hover {
      color: black;
      transform: translateY(-10px); }

/* General info section */
.boxes-in-a-row .container {
  display: flex;
  align-items: flex-start;
  gap: 24px; }

.expandable-box {
  flex: 1;
  min-width: 200px;
  height: 320px;
  border-radius: 20px;
  background-color: black;
  color: white;
  padding: 32px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: all 0.4s ease-in-out;
  -webkit-tap-highlight-color: transparent;
  outline: none; }
  .expandable-box:nth-child(even) {
    transform: translateY(64px); }
  .expandable-box .arrow-up {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 32px;
    right: 32px;
    border: 1px solid white; }
    .expandable-box .arrow-up svg path {
      fill: white; }
  .expandable-box:hover .arrow-up {
    transform: scale(1); }
    .expandable-box:hover .arrow-up::before {
      transform: scale(1.3); }
    .expandable-box:hover .arrow-up svg {
      fill: black; }
  .expandable-box .box-name {
    font-size: 30px;
    line-height: 140%;
    font-weight: 600;
    position: absolute;
    top: calc(50% - 15px);
    transition: top 0.3s ease-in-out; }
  .expandable-box p,
  .expandable-box .marafiki-button {
    opacity: 0;
    visibility: hidden;
    transform: translateY(30px);
    /* Zmieniamy przejście: Natychmiastowe zniknięcie */
    transition: opacity 0s, visibility 0s, transform 0s; }
  .expandable-box.box-is-expanded {
    transform: translateY(-20px);
    min-height: 436px;
    flex-basis: 436px;
    flex-grow: 0;
    justify-content: space-between !important; }
    .expandable-box.box-is-expanded:nth-of-type(1) {
      background-color: var(--marafiki-yellow);
      color: black; }
      .expandable-box.box-is-expanded:nth-of-type(1) .arrow-up {
        border: 1px solid black; }
        .expandable-box.box-is-expanded:nth-of-type(1) .arrow-up::before {
          background-color: white; }
        .expandable-box.box-is-expanded:nth-of-type(1) .arrow-up svg path {
          fill: black; }
    .expandable-box.box-is-expanded:nth-of-type(3) {
      background-color: var(--marafiki-grey);
      color: black; }
      .expandable-box.box-is-expanded:nth-of-type(3) .arrow-up {
        border: 1px solid black; }
        .expandable-box.box-is-expanded:nth-of-type(3) .arrow-up svg path {
          fill: black; }
    .expandable-box.box-is-expanded:nth-of-type(4) {
      background-color: var(--marafiki-blue);
      color: white; }
    .expandable-box.box-is-expanded:nth-of-type(5) {
      background-color: white;
      color: black;
      border: 1px solid #e7e7e7; }
      .expandable-box.box-is-expanded:nth-of-type(5) .arrow-up {
        border: 1px solid black; }
        .expandable-box.box-is-expanded:nth-of-type(5) .arrow-up svg path {
          fill: black; }
    .expandable-box.box-is-expanded .box-name {
      top: 0;
      position: relative; }
    .expandable-box.box-is-expanded p {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      transition: opacity 0.6s ease-in-out 0.2s,
 visibility 0.6s linear 0.2s,
 transform 0.3s ease-in-out 0.2s; }
    .expandable-box.box-is-expanded .marafiki-button {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      transition: opacity 0.3s ease-in-out 0.3s,
 visibility 0.3s linear 0.3s,
 transform 0.3s ease-in-out 0.3s; }

/* Reset dla desktopu: sprawia, że nowe divy są przezroczyste dla layoutu */
.expandable-content,
.inner-content {
  display: contents; }

/* Poprawka dla Laptopów i mniejszych ekranów desktopowych */
@media (min-width: 1201px) and (max-width: 1550px) {
  .expandable-box {
    min-width: 150px; } }

/* Media queries */
@media (max-width: 1200px) {
  .boxes-in-a-row .container {
    flex-direction: column;
    align-items: stretch;
    gap: 16px; }
  .expandable-box {
    width: 100%;
    min-width: unset;
    flex: none;
    height: auto;
    min-height: auto;
    transform: none !important;
    padding: 20px;
    display: block;
    transition: background-color 0.3s ease, border-color 0.3s ease;
    /* STAN ROZWINIĘTY (Akordeon otwarty) */ }
    .expandable-box .arrow-up {
      top: 24px;
      right: 24px; }
    .expandable-box .box-name {
      position: relative;
      top: auto;
      transform: none;
      margin: 0;
      padding-right: 40px; }
    .expandable-box .expandable-content {
      display: grid;
      /* Nadpisujemy display: contents */
      grid-template-rows: 0fr;
      transition: grid-template-rows 0.5s ease-in-out;
      height: auto;
      flex: none;
      /* Reset flexa z desktopu */ }
    .expandable-box .inner-content {
      display: block;
      /* Nadpisujemy display: contents */
      overflow: hidden;
      opacity: 0;
      transition: opacity 0.5s ease-in-out; }
    .expandable-box p {
      margin-top: 24px;
      margin-bottom: 24px; }
    .expandable-box .marafiki-button {
      opacity: 1;
      visibility: visible;
      transform: none; }
    .expandable-box.box-is-expanded {
      transform: none;
      min-height: auto;
      flex-basis: auto; }
      .expandable-box.box-is-expanded .box-name {
        margin-bottom: 0; }
      .expandable-box.box-is-expanded .expandable-content {
        grid-template-rows: 1fr; }
        .expandable-box.box-is-expanded .expandable-content .inner-content {
          opacity: 1; } }

/* Media queries */
.piano-pin-container {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center; }

.like-piano {
  padding: 165px 0 0 0;
  position: relative;
  width: 100%;
  /* overflow: hidden; */ }
  .like-piano::before, .like-piano::after {
    content: '';
    position: absolute;
    width: 60%;
    height: 120%;
    background: url(bcb4d8e49e07e72eb2d2.svg) center/contain no-repeat;
    z-index: -1;
    pointer-events: none;
    transform: rotate(125deg);
    filter: blur(5px);
    opacity: .1; }
  .like-piano::before {
    left: 50%;
    bottom: 100px; }
  .like-piano::after {
    right: 60%;
    top: 180px;
    transform: rotate(115deg); }
  .like-piano .section-title {
    text-align: center;
    margin-bottom: 65px; }

.wrapper-piano-keys {
  display: flex;
  justify-content: flex-start;
  position: relative;
  margin: 0;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
  width: max-content;
  flex-wrap: nowrap;
  -ms-overflow-style: none;
  scrollbar-width: none; }
  .wrapper-piano-keys::-webkit-scrollbar {
    display: none; }

.piano-key {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 32px 32px 32px 62px;
  background: black;
  color: white;
  width: 318px;
  min-width: 318px;
  flex-shrink: 0;
  min-height: 300px;
  border: 2px solid white;
  border-radius: 0 30px 30px 0;
  position: relative; }
  .piano-key.piano-key-1 {
    padding: 32px;
    width: 288px;
    min-width: 288px;
    background: var(--marafiki-yellow);
    color: black; }
  .piano-key:after {
    content: '';
    position: absolute;
    bottom: 30px;
    right: -15px;
    width: 32px;
    height: 32px;
    background: black url(d43fc2e63b2397b2f89c.svg) center/contain no-repeat;
    background-size: 20px 20px;
    border-radius: 5px 0 0 5px;
    pointer-events: none; }
  .piano-key:last-of-type:after {
    display: none; }
  .piano-key p {
    font-size: 13px;
    line-height: 140%;
    font-weight: 400; }

/* Home brand slider */
.home-brand-slider-section {
  color: white; }
  .home-brand-slider-section .section-title {
    text-align: center;
    margin-bottom: 65px; }

.flex-cnt {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 100px;
  padding: 50px 0 0; }
  .flex-cnt .section-title {
    text-align: left;
    margin: 40px 0 0 0; }
  .flex-cnt .flex-child-wrapper {
    width: 100%;
    max-width: 613px; }

/* Stylowanie swipera dla komentarzy na stronie głównej */
.clients-review-swiper {
  min-height: 220px;
  width: 100%; }

.clients-review-swiper-button-prev,
.clients-review-swiper-button-next {
  position: static !important;
  transform: none !important;
  color: transparent !important;
  font-size: 0 !important;
  width: 24px;
  height: 24px;
  cursor: pointer;
  margin: 0; }

/* Ważne: usuń wygenerowaną treść pseudoelementu Swipera */
.clients-review-swiper-button-prev::after,
.clients-review-swiper-button-next::after {
  content: '' !important; }

/* Dopasowanie svg do koloru i rozmiaru wewnątrz przycisku */
.clients-review-swiper-button-prev svg,
.clients-review-swiper-button-next svg {
  display: block;
  width: 100%;
  height: 100%; }

.swiper-with-opinions {
  /* Kontener dla poprawnego układu nawigacji */ }
  .swiper-with-opinions .swiper-button-disabled .clients-review-swiper-button-prev svg path,
  .swiper-with-opinions .swiper-button-disabled .clients-review-swiper-button-next svg path {
    fill: white !important; }
  .swiper-with-opinions .swiper-pagination-bullet {
    background-color: transparent;
    border: 1px solid white;
    width: 10px;
    height: 10px;
    opacity: 1;
    border-radius: 20px;
    transition: width 0.3s ease; }
  .swiper-with-opinions .swiper-pagination-bullet-active {
    background: var(--marafiki-yellow);
    border: none;
    width: 20px; }
  .swiper-with-opinions .swiper-navigation-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 20px;
    position: relative;
    margin-left: auto;
    margin-right: auto; }
  .swiper-with-opinions .swiper-pagination {
    position: static !important;
    /* Usuń domyślne pozycjonowanie Swipera */
    text-align: center;
    margin: 0 24px;
    width: auto !important;
    /* Odstęp od strzałek */ }

.review-slide .review-author {
  display: block;
  font-weight: 500;
  margin-top: 24px; }

.review-slide .border-left-3 {
  padding-left: 29px; }

/* Next section */
.front-page-achievement-section {
  padding: 300px 0 100px; }
  .front-page-achievement-section .container {
    display: flex;
    align-items: center;
    gap: 50px; }
    .front-page-achievement-section .container img {
      max-width: 100%;
      height: auto; }

.section-title-wrapper {
  text-align: center; }
  .section-title-wrapper p {
    font-weight: 500; }

.achievements-in-percentage-div {
  position: relative; }

.achievement-item {
  position: absolute;
  background-color: black;
  color: white;
  border-radius: 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  padding-top: calc(var(--size) / 2 - 40px);
  width: var(--size);
  min-height: var(--size);
  transition: background-color 0.3s ease-in-out,
 color 0.3s ease-in-out,
 width 0.3s ease-in-out,
 padding 0.3s ease-in-out,
 gap 0.3s ease-in-out,
 min-height 0.3s ease-in-out;
  will-change: transform, background-color, color, width, padding;
  overflow: hidden; }
  .achievement-item .expandable-wrapper {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease-in-out;
    width: 100%; }
  .achievement-item .expandable-inner {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    opacity: 0;
    transform: translateY(100px);
    transition: all 0.2s ease-in-out; }
  .achievement-item .case-key-value-grid {
    display: flex;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 24px; }
  .achievement-item .marafiki-button {
    display: inline-block; }
  .achievement-item:nth-of-type(1) {
    --size: 261px;
    top: -363px;
    left: 80px; }
  .achievement-item:nth-of-type(2) {
    --size: 233px;
    top: -217px;
    left: 396px; }
  .achievement-item:nth-of-type(3) {
    --size: 202px;
    top: 100px;
    left: 460px; }
  .achievement-item:nth-of-type(4) {
    --size: 184px;
    top: 270px;
    left: 195px; }

@media (max-width: 1300px) {
  .front-page-achievement-section {
    padding: 200px 0 0;
    overflow: hidden; }
    .front-page-achievement-section .container {
      flex-direction: column;
      align-items: center;
      gap: 50px; }
    .front-page-achievement-section .section-title-wrapper {
      order: 1; }
  .achievements-in-percentage-div {
    display: contents; }
  .front-page-achievement-section .container img {
    order: 2; }
  .achievements-list {
    display: flex;
    flex-wrap: nowrap;
    gap: 32px;
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    order: 3;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none; }
  /* Ukrycie paska dla Webkit (Chrome, Safari, Opera) */
  .achievements-list::-webkit-scrollbar {
    display: none; }
  .achievement-item {
    position: static;
    /* position: relative;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important; */
    flex: 0 0 auto;
    width: 300px !important;
    min-height: 300px !important;
    padding: 40px 20px;
    justify-content: center;
    --size: auto;
    scroll-snap-align: start; }
  .achievement-item-active {
    background-color: var(--marafiki-yellow);
    color: black;
    height: auto;
    padding: 20px; }
  /* Zmniejszenie czcionki procentów na mobilu, żeby nie rozpychało */
  .achievement-percentage {
    font-size: 42px; } }

.achievement-item-active {
  background-color: var(--marafiki-yellow);
  color: black;
  padding: 40px 0;
  width: 320px !important;
  aspect-ratio: unset !important; }
  .achievement-item-active .expandable-wrapper {
    grid-template-rows: 1fr; }
  .achievement-item-active .expandable-inner {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.3s ease-in-out 0.1s; }
  .achievement-item-active .achievement-percentage {
    font-size: 42px;
    line-height: 110%; }

.achievement-description {
  display: block;
  font-size: 12px;
  line-height: 150%;
  font-weight: 400; }

.achievement-percentage {
  font-size: 56px;
  line-height: 120%;
  font-weight: 600;
  transition: font-size 0.3s ease-in-out; }

.case-key-value-grid {
  display: flex;
  justify-content: center;
  gap: 10px;
  font-size: 13px;
  line-height: 140%; }
  .case-key-value-grid .key-left {
    text-align: right;
    font-weight: 400; }
  .case-key-value-grid .value-right {
    text-align: left;
    font-weight: 500; }

/* Next section */
.like-to-talk-section {
  padding: 300px 0 100px; }
  .like-to-talk-section .container {
    display: flex;
    align-items: center;
    gap: 50px; }

.like-carousel {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 70px;
  width: 100%; }

/* Główny wrapper zdjęć - musi mieć wymiary, żeby reszta strony się nie zapadła */
.like-image-wrapper {
  position: relative;
  width: 100%;
  max-width: 577px;
  /* Maksymalna szerokość oryginału */
  /* Automatyczne zachowanie proporcji */
  aspect-ratio: 577.4 / 540.2;
  margin: 0 auto;
  isolation: isolate; }

/* Pojedynczy slajd (kontener z kształtem) */
.shape-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* Domyślnie ukryte, GSAP to obsłuży */
  opacity: 0; }

/* Stylizacja obrazka wewnątrz i cienia (Maska) */
.like-slide-img,
.shape-container::before {
  -webkit-mask-image: var(--blob-url);
  mask-image: var(--blob-url);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center; }

/* Obrazek */
.like-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  position: relative;
  z-index: 2; }

/* Cień */
.shape-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 94%;
  background-color: var(--marafiki-yellow);
  z-index: 1;
  transform: translate(5px, 70px); }

.like-content-wrapper {
  flex: 1;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center; }

.like-slider-row {
  display: flex;
  align-items: flex-start;
  margin: 160px 0 0 -153px;
  position: relative; }

.static-label {
  margin-right: 25px;
  white-space: nowrap;
  z-index: 10; }

.like-text-carousel {
  position: relative;
  width: 100%;
  /* Minimalna wysokość, żeby zmieścić 2 linie tekstu i podgląd */
  min-height: 140px;
  margin-top: 5px; }

.static-bottom .section-title {
  margin-bottom: 18px;
  padding-bottom: 20px;
  position: relative; }
  .static-bottom .section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 90px;
    height: 5px;
    background-color: var(--marafiki-yellow);
    border-radius: 5px; }

.slide-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  will-change: transform, opacity;
  opacity: 0;
  transform-origin: left top; }

.cta-button {
  font-size: 15px;
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  transition: transform 0.3s ease-out, opacity 0.3s ease-out; }
  .cta-button svg {
    margin-left: 16px;
    fill: currentColor;
    transition: transform 0.3s 0.2s ease-out; }
  .cta-button:hover {
    transform: translateX(8px);
    opacity: .7; }
    .cta-button:hover svg {
      transform: translateX(4px); }

/* Oferta matka */
.header-oferta-parent {
  min-height: 330px;
  position: relative;
  z-index: 2; }
  .header-oferta-parent .breadcrumbs {
    color: white;
    margin: 21px 0 0 45px;
    font-size: 13px;
    font-weight: 400;
    line-height: 140%; }

/* Zdefiniowane kolory dla roznych typow danych */
.header-blue-bg {
  background: var(--marafiki-blue);
  color: white; }
  .header-blue-bg .breadcrumbs {
    color: white !important; }
  .header-blue-bg.with-pattern-bg::before {
    opacity: .7; }
  .header-blue-bg.with-pattern-bg::after {
    bottom: -30%; }

.header-yellow-bg {
  background: var(--marafiki-yellow);
  color: black; }
  .header-yellow-bg .breadcrumbs {
    color: black !important; }
  .header-yellow-bg .header-separator--yellow {
    background: white; }
  .header-yellow-bg .border-left-5::before {
    background-color: white; }

.header-black-bg {
  background: black;
  color: white; }
  .header-black-bg .breadcrumbs {
    color: white !important; }
  .header-black-bg .header-separator--yellow {
    background: var(--marafiki-blue); }
  .header-black-bg.with-pattern-bg::before, .header-black-bg.with-pattern-bg::after {
    mix-blend-mode: normal; }

.header-grey-bg {
  background: #f3f3f3; }
  .header-grey-bg .breadcrumbs {
    color: black !important; }
  .header-grey-bg.with-pattern-bg::before {
    mix-blend-mode: normal;
    opacity: .3; }
  .header-grey-bg.with-pattern-bg::after {
    background-image: url(7231e4f774df6087eceb.svg);
    left: 0%;
    bottom: -2%;
    background-position: bottom center;
    transform: scale(1);
    mix-blend-mode: normal;
    opacity: .05; }

.header-white-bg {
  background: white;
  color: black; }
  .header-white-bg .breadcrumbs {
    color: black !important; }
  .header-white-bg.with-pattern-bg::before {
    mix-blend-mode: normal;
    opacity: .4; }
  .header-white-bg.with-pattern-bg::after {
    background-image: url(7231e4f774df6087eceb.svg);
    left: 0%;
    bottom: -2%;
    background-position: bottom center;
    transform: scale(1);
    mix-blend-mode: normal; }

.oferta-parent-main-content {
  text-align: center; }
  .oferta-parent-main-content .header-h1 {
    margin-bottom: 50px; }
  .oferta-parent-main-content p {
    max-width: 760px;
    margin: 0 auto; }

.industries-list {
  display: flex;
  max-width: 1140px;
  margin: 0 auto;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  padding-top: 50px; }
  .industries-list li {
    transition: transform 0.3s ease-out; }
    .industries-list li:hover {
      transform: translateY(-5px) scale(1.05); }
  .industries-list .marafiki-button {
    width: 250px;
    min-height: 100px;
    gap: 50px;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between; }
    .industries-list .marafiki-button .arrow-up::before {
      background-color: white; }
    .industries-list .marafiki-button:hover .arrow-up {
      transform: scale(1.1); }
      .industries-list .marafiki-button:hover .arrow-up::before {
        transform: scale(1.3);
        background-color: white; }
      .industries-list .marafiki-button:hover .arrow-up svg path {
        fill: black; }
  .industries-list .arrow-up {
    position: static;
    transform: scale(1); }

.paragraph-yellow-bottom-border {
  position: relative;
  padding: 0 0 50px 0; }
  .paragraph-yellow-bottom-border::after {
    position: absolute;
    bottom: 0;
    left: calc(50% - 72px);
    content: '';
    display: block;
    width: 144px;
    height: 5px;
    background-color: var(--marafiki-yellow);
    border-radius: 5px; }

/* PODSTRONA WIEDZA */
.header-knolowledge-page .container {
  padding: 44px 0 0 0; }
  .header-knolowledge-page .container .text-main {
    color: #484848;
    max-width: 760px;
    margin: 24px 0 0 0; }

.knolowledge-main-section {
  margin: 100px 0 0 0; }

.knolowledge-listening-wrapper {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 50px; }

.knolegledge-branch {
  width: 100%;
  background: white;
  border-radius: 30px;
  border: 1px solid #e7e7e7;
  overflow: hidden;
  transition: all 0.3s ease-in-out;
  display: flex;
  justify-content: space-between;
  min-height: 100px; }
  .knolegledge-branch:hover {
    transform: translateX(20px); }

.knolegledge-branch-left {
  padding: 40px; }
  .knolegledge-branch-left .double-chevron-list {
    margin-top: 33px;
    display: block;
    column-count: 3;
    column-gap: 40px;
    column-fill: balance; }
  .knolegledge-branch-left .double-chevron-list__item {
    /* Zapobiegamy ucinaniu elementu w połowie */
    break-inside: avoid;
    page-break-inside: avoid;
    margin-bottom: 19px;
    display: inline-block;
    width: 100%; }
    .knolegledge-branch-left .double-chevron-list__item a {
      display: inline-block;
      width: 100%;
      transition: transform 0.3s ease-out; }
    .knolegledge-branch-left .double-chevron-list__item:hover a {
      transform: translateX(5px); }

/* podstrona usługi */
.header-service {
  padding: 126px 0 100px 0;
  position: relative; }
  .header-service .container {
    z-index: 3;
    position: relative; }
  .header-service .breadcrumbs {
    color: white;
    margin: 21px 0 0 0;
    font-size: 13px;
    font-weight: 400;
    line-height: 140%; }

.hero-headings {
  display: flex;
  flex-direction: column;
  min-height: 420px;
  align-items: flex-start;
  justify-content: center;
  gap: 40px;
  width: 50%;
  margin: 32px 0; }
  .hero-headings .header-h1 {
    margin: 0;
    text-align: left;
    flex-shrink: 1; }
  .hero-headings p.text-main {
    margin-left: 90px; }

.header-separator--yellow {
  display: block;
  width: 5px;
  height: 98px;
  border-radius: 5px;
  background: var(--marafiki-yellow);
  margin: 10px 0; }

/* 1. Kontener zdjęcia trzymający proporcje i układ */
.organic-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 45%;
  max-width: 100%;
  /* aspect-ratio: 576.1 / 540.1; */
  z-index: 1; }

/* 2. Zdjęcie z maską (przycinanie) */
.organic-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* Maska SVG */
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 847.9 752%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M847.9 752h-721c-128-285-142-560-116-632s67-70 105-73 115-16 193-47h539z%27/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 847.9 752%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M847.9 752h-721c-128-285-142-560-116-632s67-70 105-73 115-16 193-47h539z%27/%3E%3C/svg%3E");
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center; }

.f-w-thin {
  /* font-family: "Zalando Sans", sans-serif; */
  font-size: 32px;
  font-weight: 300; }

.form-on-service-page {
  display: flex;
  gap: 30px;
  justify-content: space-between;
  align-items: center;
  background: black;
  padding: 80px 142px 50px;
  border-radius: 30px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  color: white !important;
  /* tlo-pattern pod formularzem */ }
  .form-on-service-page::before {
    content: '';
    position: absolute;
    width: 100%;
    min-width: 1600px;
    height: 100%;
    background-image: url(71f2c6f06a1e18e454ea.webp);
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: 2;
    background-position: top right;
    right: 0;
    top: 0;
    /* mix-blend-mode: overlay; */ }
  .form-on-service-page .header-h3 {
    /* white-space: nowrap; */
    font-size: 48px;
    line-height: 135%;
    margin-bottom: 40px; }
  .form-on-service-page .wpcf7 {
    width: 476px; }
  .form-on-service-page .acceptance-field {
    margin-bottom: 25px; }
  .form-on-service-page .wpcf7-list-item-label {
    font-size: 10px;
    font-weight: 400;
    margin: 5px; }

@media (max-width: 1300px) {
  .form-on-service-page {
    flex-direction: column;
    /* gap: 30px; */
    /* justify-content: space-between;
            align-items: center; */ }
    .form-on-service-page .wpcf7 {
      width: 100%; }
    .form-on-service-page .header-h3,
    .form-on-service-page h4 {
      text-align: center; } }

/* Next section */
.single-service-clients-loop-section {
  text-align: center;
  padding: 100px 0 0; }
  .single-service-clients-loop-section .track-list {
    margin: 70px 0; }

.services-additional-informations {
  padding-bottom: 100px;
  text-align: center; }
  .services-additional-informations .container {
    width: 780px; }
  .services-additional-informations .header-h4 {
    margin-bottom: 24px; }

.what-can-u-achieve-section {
  padding: 100px 0; }
  .what-can-u-achieve-section .section-title {
    text-align: center;
    margin-bottom: 16px; }
  .what-can-u-achieve-section .text-main {
    text-align: center; }

.lists-set {
  display: flex;
  gap: 40px;
  margin-top: 100px;
  justify-content: space-between; }

.double-chevron-list {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 19px; }

.double-chevron-list__item {
  padding-left: 40px;
  background: url(2cef5b8e37f4ec514114.svg) no-repeat left top;
  background-size: 24px 24px; }

.arrow-list {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 19px; }

.arrow-list__item {
  padding-left: 40px;
  background: url(819bd8e9fc779fc74b30.svg) no-repeat left top;
  background-size: 24px 24px; }

/* Next section */
.single-service-process-steps-section {
  padding: 100px 0; }
  .single-service-process-steps-section .container {
    text-align: center; }
  .single-service-process-steps-section::after, .single-service-process-steps-section::before {
    display: none; }
  .single-service-process-steps-section .header-h3 {
    margin-bottom: 16px;
    text-align: center; }
  .single-service-process-steps-section .section-title {
    text-align: center;
    margin-bottom: 80px; }
  .single-service-process-steps-section .piano-key {
    min-height: 400px;
    justify-content: flex-start; }
    .single-service-process-steps-section .piano-key.piano-key-1 {
      background: black;
      color: white; }
    .single-service-process-steps-section .piano-key .header-h5 {
      margin-bottom: 24px; }
    .single-service-process-steps-section .piano-key .header-h4 {
      margin-top: auto; }

/* Team members na stronie oferty */
.team-offer-section {
  padding: 100px 0; }
  .team-offer-section .container {
    display: flex;
    /* flex-wrap: wrap; */
    gap: 100px;
    justify-content: space-between; }

@media (max-width: 1300px) {
  .team-offer-section .container {
    flex-direction: column;
    align-items: center;
    gap: 50px; }
  .t-o-desc {
    text-align: center; } }

.t-o-desc {
  max-width: 605px; }
  .t-o-desc .section-title {
    margin-bottom: 32px; }

.boxes-on-offer-section {
  padding: 100px 0; }
  .boxes-on-offer-section .boxy-shape .boxy-percentage {
    font-size: 80px; }

/* Faq section */
.single-service-faq-section {
  padding: 100px 0; }
  .single-service-faq-section .container {
    display: flex;
    align-items: center;
    gap: 100px; }

.faq-heading {
  text-align: right;
  flex: 0 0 293px; }
  .faq-heading h2 {
    white-space: nowrap;
    margin-bottom: 10px; }
  .faq-heading .header-h4 {
    color: #797979; }

.yellow-separator-vertical {
  width: 4px;
  align-self: stretch;
  border-radius: 5px;
  background: var(--marafiki-yellow);
  flex-shrink: 0; }

.faq-accordeon .accordion-item:first-of-type {
  border: none; }

/* Case Studies Swiper na stronie oferty */
.case-studies-to-watch-section {
  padding: 100px 0; }
  .case-studies-to-watch-section .section-title {
    text-align: center;
    margin-bottom: 80px; }
  .case-studies-to-watch-section .other-content-swiper {
    max-width: 1048px; }

/* Sekcja z opiniami na stronie uslug */
.single-service-testimonials-section {
  padding: 100px 0; }
  .single-service-testimonials-section .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 100px; }
  .single-service-testimonials-section .section-title {
    flex: 1;
    text-align: center; }

/* BOX ze swiperem */
.box-with-testimonials {
  display: flex;
  flex-direction: column;
  flex: 0 0 480px;
  width: 480px;
  max-width: 100%;
  min-width: 0;
  min-height: 500px;
  color: white;
  border-radius: 30px;
  padding: 60px 48px;
  position: relative;
  z-index: 1;
  isolation: isolate; }
  .box-with-testimonials::before {
    content: '';
    position: absolute;
    inset: 0;
    background: black url(87c6f1d7fe521205ac86.webp) bottom center no-repeat;
    background-size: cover;
    border-radius: 30px;
    z-index: -1;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); }

.testimonials-swiper {
  flex: 1;
  width: 100%;
  position: relative;
  padding-bottom: 40px; }
  .testimonials-swiper .swiper-button-disabled .clients-review-swiper-button-prev svg path,
  .testimonials-swiper .swiper-button-disabled .clients-review-swiper-button-next svg path {
    fill: white !important; }
  .testimonials-swiper .swiper-pagination {
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    display: flex;
    justify-content: center;
    /* Wyśrodkowanie kropek */
    margin: 0;
    z-index: 10; }
  .testimonials-swiper .swiper-pagination-bullet {
    background-color: transparent;
    border: 1px solid white;
    width: 10px;
    height: 10px;
    opacity: 1;
    border-radius: 20px;
    transition: width 0.3s ease; }
  .testimonials-swiper .swiper-pagination-bullet-active {
    background: white;
    border: none;
    width: 20px; }

/* --- STRZAŁKI (PLAMY) --- */
.testimonials-swiper-button-prev,
.testimonials-swiper-button-next {
  position: absolute;
  width: 160px;
  height: 120px;
  z-index: -2;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
  transition: transform 0.3s ease-out;
  /* Wyłączamy domyślne style Swipera */
  margin-top: 0;
  top: auto;
  /* Ikonka strzałki wewnątrz plamy */ }
  .testimonials-swiper-button-prev::after,
  .testimonials-swiper-button-next::after {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    /* Biała strzałka SVG */
    background-image: url("data:image/svg+xml,%3Csvg width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M10.5303 5.46967C10.2374 5.17678 9.76256 5.17678 9.46967 5.46967L3.46967 11.4697C3.17678 11.7626 3.17678 12.2374 3.46967 12.5303L9.46967 18.5303C9.76256 18.8232 10.2374 18.8232 10.5303 18.5303C10.8232 18.2374 10.8232 17.7626 10.5303 17.4697L5.81066 12.75L20 12.75C20.4142 12.75 20.75 12.4142 20.75 12C20.75 11.5858 20.4142 11.25 20 11.25L5.81066 11.25L10.5303 6.53033C10.8232 6.23744 10.8232 5.76256 10.5303 5.46967Z%27 fill=%27white%27/%3E%3C/svg%3E");
    background-repeat: no-repeat; }

/* LEWA STRZAŁKA (NIEBIESKA) */
.testimonials-swiper-button-prev {
  /* Pozycjonowanie względem .box-with-testimonials */
  left: -77px;
  bottom: 135px;
  /* Niebieska plama */
  background-image: url("data:image/svg+xml,%3Csvg width=%27157%27 height=%27125%27 viewBox=%270 0 157 125%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M11.3315 15.2788C-12.3065 40.3932 2.40806 70.9519 42.7334 84.1892C72.9592 92.8808 114.144 142.376 137.782 117.262C145.183 109.398 156.603 89.6661 156.189 68.7399C155.774 47.8136 150.266 26.3605 131.328 8.53615C113.377 -8.35954 104.801 5.06763 84.7458 4.92271C68.787 4.80738 29.9765 -6.13927 11.3315 15.2788Z%27 fill=%27%2300A6DB%27/%3E%3C/svg%3E"); }
  .testimonials-swiper-button-prev::after {
    transform: translate(-160%, -120%);
    /* Centrowanie strzałki */ }

/* PRAWA STRZAŁKA (ŻÓŁTA) */
.testimonials-swiper-button-next {
  /* Pozycjonowanie względem .box-with-testimonials */
  right: -77px;
  bottom: 230px;
  /* Żółta plama */
  background-image: url("data:image/svg+xml,%3Csvg width=%27164%27 height=%27114%27 viewBox=%270 0 164 114%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M161.154 50.7342C170.777 17.615 143.771 -2.90297 101.838 3.6561C70.9674 9.66813 11.7731 -15.6701 2.14985 17.4491C-0.863218 27.8188 -2.05557 50.5866 7.83435 69.033C17.7243 87.4794 32.3903 104.077 57.364 111.334C81.0366 118.212 82.5645 102.353 100.49 93.3579C114.754 86.1997 154.295 78.29 161.154 50.7342Z%27 fill=%27%23FFB600%27/%3E%3C/svg%3E");
  /* Obracamy strzałkę o 180st */ }
  .testimonials-swiper-button-next::after {
    transform: translate(120%, -100%) rotate(180deg);
    background-image: url("data:image/svg+xml,%3Csvg width=%2724%27 height=%2724%27 viewBox=%270 0 24 24%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath fill-rule=%27evenodd%27 clip-rule=%27evenodd%27 d=%27M10.5303 5.46967C10.2374 5.17678 9.76256 5.17678 9.46967 5.46967L3.46967 11.4697C3.17678 11.7626 3.17678 12.2374 3.46967 12.5303L9.46967 18.5303C9.76256 18.8232 10.2374 18.8232 10.5303 18.5303C10.8232 18.2374 10.8232 17.7626 10.5303 17.4697L5.81066 12.75L20 12.75C20.4142 12.75 20.75 12.4142 20.75 12C20.75 11.5858 20.4142 11.25 20 11.25L5.81066 11.25L10.5303 6.53033C10.8232 6.23744 10.8232 5.76256 10.5303 5.46967Z%27 fill=%27black%27/%3E%3C/svg%3E"); }

/* EFEKT HOVER NA STRZAŁKACH */
/* Kiedy najedziesz myszką na przycisk, wysuwa się on bardziej */
.testimonials-swiper-button-prev:hover {
  transform: translateX(-10px) translateY(5px); }

.testimonials-swiper-button-next:hover {
  transform: translateX(10px) translateY(5px); }

.testimonials-card__author {
  margin-bottom: 24px;
  font-weight: 500;
  font-size: 20px;
  line-height: 28px;
  text-align: center; }

.testimonials-card__quote {
  text-align: justify; }

/* Call to action obok opinii na stronie uslug */
.offer-c2a {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center; }
  .offer-c2a .header-h5 {
    font-weight: 600;
    font-size: 20px;
    line-height: 135%;
    margin-bottom: 24px;
    text-align: center; }
  .offer-c2a .marafiki-button {
    width: 100%; }

@media (max-width: 1300px) {
  .single-service-testimonials-section .container {
    flex-direction: column;
    gap: 48px; }
  .box-with-testimonials {
    width: 100%;
    min-height: auto;
    flex: 1 1 auto; }
  .testimonials-swiper-button-prev {
    display: none; }
  .testimonials-swiper-button-next {
    display: none; } }

.awards-and-recognitions-section {
  padding: 100px 0; }
  .awards-and-recognitions-section .container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 100px; }

.awards-recognitions-wrapper {
  display: flex;
  align-items: center;
  gap: 32px;
  height: 92px; }
  .awards-recognitions-wrapper figure {
    display: block; }

/* Propozycja współpracy */
.cooperation-proposal-section {
  padding: 100px 0; }
  .cooperation-proposal-section .header-h3 {
    margin: 0; }
  .cooperation-proposal-section .container {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 16px; }

/* Sekcja w punktach czym sie zajmujemuy */
.single-service-detailed-scope-section {
  margin: 200px 0 100px;
  padding: 200px 0;
  color: white;
  position: relative;
  z-index: 2;
  overflow: visible; }
  .single-service-detailed-scope-section .bg-shape-overlay {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: auto;
    min-height: 100%;
    z-index: -1; }
    .single-service-detailed-scope-section .bg-shape-overlay image {
      opacity: .5; }
  .single-service-detailed-scope-section .c2a-text-and-btn {
    margin: 64px 0 0 170px; }

.c2a-text-and-btn {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  .c2a-text-and-btn .marafiki-button {
    margin-top: 24px; }

/* Next section */
.who-we-work-with-section {
  padding: 170px 0 100px; }
  .who-we-work-with-section .container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 150px; }

.marafiki-collage {
  position: relative;
  width: 100%;
  max-width: 570px;
  aspect-ratio: 16 / 13;
  isolation: isolate; }

.collage-item {
  position: absolute;
  aspect-ratio: 1 / 1; }

.collage-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  -webkit-mask-image: var(--mask-shape);
  mask-image: var(--mask-shape);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: relative;
  z-index: 2; }

/* Pseudo-element robiący za cień */
.collage-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-mask-image: var(--mask-shape);
  mask-image: var(--mask-shape);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  z-index: 1; }

.collage-item-1 {
  top: 3%;
  left: 0;
  width: 48%;
  z-index: 2;
  aspect-ratio: 10/9;
  --mask-shape: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 270.5 257.8%27%3E%3Cpath d=%27M194.1 8.1c-23.4-13-49.7-9.7-78.8 5.1S65.2 34 40.2 35.4 3.4 40.2.3 68s20.8 97 43.9 132.8 59.6 85.5 117 36.6c32.3-27.6 45.3-35.7 63.6-42.2s34-5.1 41.1-31.8c7-26.7 18.8-104.9-71.7-155.3Z%27/%3E%3C/svg%3E"); }
  .collage-item-1::before {
    background: var(--marafiki-yellow);
    transform: translate(0%, 13%) scale(0.8); }

.collage-item-2 {
  top: 0;
  right: 0;
  width: 64%;
  z-index: 1;
  aspect-ratio: 10/8;
  --mask-shape: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 371.7 303%27%3E%3Cpath d=%27M298.9 14.7c-20.3-15-36.3-19.6-71.3-9S148.3 46.6 68.7 25.3c-29.8-8-49.3 4.5-61.5 40.3S-3.5 208.7 27.5 257.2s93.3 54.2 145.1 36.7 76.2-11.4 104.3-11.4c43.6 0 67.9-6.1 83.1-53s29.3-147.9-61.1-214.8%27/%3E%3C/svg%3E"); }
  .collage-item-2::before {
    background: var(--marafiki-blue);
    transform: translate(-7%, 15%) scale(0.8) rotate(5deg); }

.collage-item-3 {
  bottom: 0;
  left: 21%;
  width: 48%;
  z-index: 3;
  aspect-ratio: 10/8;
  --mask-shape: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 307.2 259%27%3E%3Cpath d=%27M199.4 11.9c-18.9-12.4-44.5-18.9-76.1 0S64.5 61.1 40.6 62.7 5.7 85.9 2.4 107.5s-7.3 46.2 18.6 93.7 86 72.4 132.5 48.8 105-27.9 114.6-28.6 52.8-12.3 34.5-70.4S226.2 29.4 199.3 11.8Z%27/%3E%3C/svg%3E"); }
  .collage-item-3::before {
    background: #a1a1a1;
    transform: translate(2%, 13%) scale(0.8) rotate(-5deg); }

.who-we-work-with .section-title {
  margin-bottom: 50px; }

.who-we-work-with .arrow-list {
  margin: 0 0 0 32px; }

.who-we-work-with .c2a-text-and-btn {
  align-items: flex-start;
  margin-top: 50px; }
  .who-we-work-with .c2a-text-and-btn .text-20 {
    font-weight: 600; }

/* Next section */
.what-we-offer-div {
  display: flex;
  align-items: center;
  gap: 100px; }
  .what-we-offer-div .section-title {
    flex: 1 0 450px; }

.custom-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* Dwie równe kolumny */
  /* Musimy zdefiniować 7 rzędów.
         Dlaczego 7? Bo prawa kolumna ma 5 elementów,
         ale zaczyna się od 3. rzędu (3, 4, 5, 6, 7). */
  grid-template-rows: repeat(7, min-content);
  /* Wypełnianie kolumnami: najpierw lewa dół, potem prawa */
  grid-auto-flow: column;
  column-gap: 80px;
  row-gap: 25px;
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: my-counter; }

/* Pojedynczy element listy */
.custom-list li {
  position: relative;
  padding-left: 38px;
  align-self: start;
  /* Inkrementacja licznika */
  counter-increment: my-counter;
  font-size: 20px;
  line-height: 28px;
  font-weight: 500; }

/* Stylizacja numerków (pseudoelement) */
.custom-list li::before {
  /* Tworzenie numeru z zerem wiodącym (01, 02...) */
  content: counter(my-counter, decimal-leading-zero) ".";
  /* Pozycjonowanie numeru */
  position: absolute;
  left: 0;
  top: 0;
  color: var(--marafiki-yellow);
  font-size: 16px; }

/* Wymuszamy, aby 7 element (start prawej kolumny)
   zaczynał się w 3. rzędzie (obok 03.) */
.custom-list li:nth-child(7) {
  grid-row-start: 3; }

@media (max-width: 700px) {
  header {
    padding: 48px 0 0 0; }
  .container {
    max-width: calc(100% - 32px) !important; }
  /* Wielkosc naglowkow */
  .header-h1 {
    font-size: 36px;
    line-height: 120%; }
  .section-title {
    font-size: 30px;
    line-height: 140%; }
  .header-h4 {
    font-size: 20px;
    line-height: 135%; }
  .header-h5 {
    font-size: 18px;
    line-height: 140%; }
  .text-main {
    font-size: 14px;
    line-height: 150%; }
  /* LOGO */
  .logo {
    width: 86px;
    height: 24px; }
  .border-left-5 {
    padding-left: 29px; }
  .header-case-studies .container {
    padding: 40px 0 100px; }
    .header-case-studies .container .header-h1 {
      padding: 0 0; }
    .header-case-studies .container .separator--yellow {
      margin: -13px auto 44px; }
  /* top-bar */
  .top-bar {
    top: 8px;
    max-width: calc(100% - 32px);
    padding: 4px 4px 4px 16px;
    border-radius: 10px;
    height: 40px; }
  /* Wyglad buttona w stanie menu zamknietego */
  .menu-section:not(.mobile-open) .top-bar .marafiki-button {
    font-size: 12px;
    height: 32px; }
    .menu-section:not(.mobile-open) .top-bar .marafiki-button.btn-14 {
      padding: 8px 16px; }
  /* menu is open */
  .menu-section.mobile-open .top-bar {
    height: 56px;
    padding: 4px 8px 4px 24px; }
  .main-nav {
    top: 56px;
    gap: 8px; }
  /* hamburger menu */
  .mobile-menu-button {
    width: 32px;
    height: 32px; }
  .mega-menu {
    top: 56px;
    height: calc(100dvh - 56px) !important;
    padding-bottom: 100px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch; }
  .header-background-image {
    object-position: 70% center; }
  .case-data-introduction .container {
    flex-wrap: wrap; }
  .black-on-white-content .section-title {
    font-size: 18px; }
    .black-on-white-content .section-title .span-on {
      font-size: 12px;
      line-height: 135%;
      top: 21px;
      left: 16px; }
    .black-on-white-content .section-title .span-white {
      font-size: 18px;
      top: 21px;
      left: 40px; }
  .black-on-white-content .case-label {
    padding: 5px 8px;
    font-size: 14px;
    line-height: 100%;
    margin: 45px 0 0 0; }
  .cascading-boxes .section-title {
    margin-bottom: 48px; }
  .cascading-boxes .boxy-shape-container {
    width: calc(100% - 32px);
    gap: 16px; }
    .cascading-boxes .boxy-shape-container .step-by-step {
      width: 150px;
      position: absolute;
      top: 50px;
      left: 180px;
      transform: rotate(45deg); }
  .boxy-shape {
    max-width: 213px;
    padding: 30px 30px; }
    .boxy-shape .header-h3 {
      font-size: 14px;
      line-height: 150%;
      margin-bottom: 15px; }
    .boxy-shape .boxy-percentage {
      font-size: 56px;
      line-height: 140%; }
    .boxy-shape .boxy-description {
      font-size: 12px;
      line-height: 150%; }
  .accordion-item .header-h3 {
    font-size: 20px;
    line-height: 135%; }
  .step-by-step-wrapper {
    max-width: calc(100% - 32px);
    gap: 30px; }
    .step-by-step-wrapper .section-title {
      margin-bottom: 32px; }
  .step-by-step-list a {
    height: 48px;
    line-height: 48px;
    font-size: 16px;
    font-weight: 400; }
  .content-display .header-h3 {
    display: none; }
  .section-title-flex {
    display: block;
    padding: 0 0 110px 0; }
    .section-title-flex .section-title {
      margin: 0 0 16px 0; }
    .section-title-flex .header-h5 {
      padding: 20px 0 0 0;
      margin: 0 0 16px 0;
      width: auto; }
      .section-title-flex .header-h5::before {
        top: 0;
        left: 0;
        width: 66px;
        height: 5px;
        transform: translateY(0); }
  .results-presentation-wrapper {
    gap: 50px; }
  .blob-big {
    margin-left: 0; }
    .blob-big .tropical-leaf-1 {
      width: 118px;
      height: auto;
      top: 10%;
      left: 10%;
      --base-rotation: 40deg; }
    .blob-big .tropical-leaf-2 {
      width: 118px;
      height: auto;
      top: auto;
      bottom: 30%;
      left: 60%;
      --base-rotation: -160deg;
      --base-scale-x: -1; }
  .blob-small::before {
    top: 10%;
    transform: scale(60%) translate(-70%, -50%); }
  .case-results-percentage {
    font-size: 96px;
    font-weight: 600; }
  .case-results-amount-small {
    font-size: 36px;
    line-height: 120%; }
  .blob-small {
    width: 100%; }
  /* Call to action */
  .cta-section {
    margin: 150px auto 50px;
    width: 270px; }
    .cta-section .section-title {
      display: flex;
      flex-direction: column;
      align-items: center; }
    .cta-section.yellow-cta-section {
      width: 323px;
      padding: 0 30px; }
  .cta-section-single-blog {
    /* margin: 16px 0; */ }
    .cta-section-single-blog .container {
      background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27325%27 height=%27307%27 fill=%27none%27 viewBox=%270 0 325 307%27 preserveAspectRatio=%27none%27%3E%3Cmask id=%27a%27 width=%27325%27 height=%27307%27 x=%270%27 y=%270%27 maskUnits=%27userSpaceOnUse%27 style=%27mask-type:alpha%27%3E%3Cpath fill=%27%23000%27 d=%27M216.114 4.233c88.385-24.573 86.811 62.732 100.038 135.67 20.468 112.869 10.027 202.181-105.631 152.124s-244.588 90.162-202.3-48.309S-29.819 4.233 54.775 4.233c84.595 0 79.655 22.71 161.339 0%27/%3E%3C/mask%3E%3Cg mask=%27url%28%23a%29%27%3E%3Cpath fill=%27%23ffb600%27 d=%27M-327.576-647.815H1592.42v1208H-327.576z%27/%3E%3C/g%3E%3C/svg%3E"); }
  /* Sekcja nasz komentarz */
  .descriptive-section {
    padding: 48px 0; }
    .descriptive-section .section-title {
      margin: 50px 0 32px; }
  .customer-comment::before {
    right: 30px; }
  /* Summary section */
  /* .summary-section {
      padding: 100px 0 200px 0;
  }

  @media screen and (max-width: 500px) {
      .blob-2 {
          top: -50%;
          left: -135%;
      }
  } */
  .other-content-to-watch .section-title {
    text-align: center;
    margin: 0 auto; }
  /* Footer */
  .footer .section-title {
    font-size: 32px; }
  .footer-top {
    max-width: calc(100% - 32px);
    padding: 20px 0 0 0;
    gap: 10px; }
    .footer-top picture images {
      margin-top: 10px; }
  .footer-bottom {
    flex-direction: column;
    gap: 32px;
    max-width: calc(100% - 32px);
    padding: 50px 0 30px; }
  .contact-data {
    align-items: center; }
  .copyrights {
    align-items: center;
    text-align: center; }
  /* ARCHIVE CASE STUDIES */
  .header-archive-case-studies {
    min-height: auto; }
    .header-archive-case-studies .container {
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 45px 0 105px; }
      .header-archive-case-studies .container .header-h1 {
        flex: 0 1 100%;
        text-align: center;
        padding: 0 50px; }
      .header-archive-case-studies .container .separator--yellow {
        /* align-self: stretch; */
        width: 100px;
        height: 3px;
        margin: 16px auto; }
  .archive-case-list-container {
    grid-template-columns: 1fr; }
  .filter-content-case-study {
    grid-column: auto; }
    .filter-content-case-study .header-h3 {
      line-height: 155%; }
  .archive-list {
    gap: 16px 10px; }
  .archive-case-item:nth-child(even) {
    transform: translateY(0); }
  /* Page CONTACT */
  /* Podstrona Kontakt */
  .header-contact {
    padding: 80px 0 10px; }
  .contact-person-data .header-h3 {
    margin-bottom: 15px; }
  .contact-person-data a {
    font-size: 14px; }
  .contact-site-person-image {
    margin: -20px 0 0 -50px; }
  .accordeon-contact-page-section {
    margin: 0 0 130px 0; }
  .section-form-on-contact-page {
    padding: 50px 0 70px; }
  /* Dodatkowa klasa dla sekcji, ktoraa dodaj fale na krawedziach gornej i dolnej sekcji */
  .wave-edge-top-bottom::before, .wave-edge-top-bottom::after {
    height: 61px; }
  .wave-edge-top-bottom::before {
    top: -59px; }
  .wave-edge-top-bottom::after {
    bottom: -59px; }
  .our-clients-contact-page {
    grid-template-columns: repeat(3, 80px);
    grid-auto-rows: 60px;
    justify-content: center; }
  .client-logo {
    width: 80px;
    height: 60px; }
  .contact-data-section .container {
    flex-direction: column; }
  .contact-data-insignts {
    margin-top: 30px;
    padding: 32px 16px;
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: space-between;
    justify-content: center; }
  .search-bar-article {
    margin: 72px 0 120px; }
  .search-field {
    font-size: 14px; }
  .footer.footer-contact .footer-bottom {
    padding: 93px 0 30px; }
  /* ARCHIVE BLOG */
  /* Blog wyszukiwanie */
  .blog-search-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px; }
    .blog-search-wrapper h1 {
      text-align: center; }
  /* Blog kategorie */
  .blog-category-list {
    margin-top: 24px; }
  .blog-search-form {
    width: 100%; }
  .blog-main-section {
    margin-bottom: 24px;
    padding: 24px 0 0 0; }
  .blog-post-item {
    border-radius: 20px; }
  .post-main {
    padding: 20px;
    gap: 16px; }
  .post-meta {
    flex-direction: column;
    gap: 16px;
    justify-content: flex-start;
    align-items: flex-start; }
  .post-author-date {
    font-size: 12px; }
  .breadcrumbs {
    display: none; }
  .post-table-of-contents .container {
    padding: 20px; }
  .gray-section-40 {
    padding: 24px 0;
    margin: 32px 0; }
    .gray-section-40 images {
      border-radius: 20px; }
  .post-content images {
    border-radius: 20px; }
  .dotted-list {
    font-size: 14px;
    line-height: 150%; }
  .author-info {
    flex-direction: column;
    justify-content: center;
    gap: 16px; }
    .author-info .author-avatar {
      justify-content: center; }
      .author-info .author-avatar images {
        margin-right: 35px; }
  /* FRONT PAGE */
  .header-front-page .container {
    padding: 55px 0 0 0;
    gap: 20px; }
  .slogan {
    flex-shrink: 1; }
    .slogan .white-accent-rect {
      transform: translate(0, 0); }
  /* Next section */
  .general-info-section {
    margin: 50px 0 50px; }
  .branches-of-activity-list {
    margin: 24px 0 0 0;
    gap: 6px 12px; }
    .branches-of-activity-list a {
      font-size: 14px; }
  .boxes-in-a-row .container {
    gap: 8px; }
  .expandable-box .marafiki-button {
    width: 100%; }
  .expandable-box .box-name {
    font-size: 20px;
    line-height: 135%; }
  .expandable-box .arrow-up {
    top: 20px;
    right: 20px;
    width: 24px;
    height: 24px; }
  .cta-section.without-background-cta {
    width: 100% !important;
    padding: 56px 0 150px; }
    .cta-section.without-background-cta .text-20 {
      font-size: 16px;
      line-height: 150%; }
  /* Home brand slider */
  .home-brand-slider-section {
    padding: 50px 0 0 0; }
    .home-brand-slider-section .section-title {
      margin-bottom: 32px; }
  .track-list {
    height: 100px;
    border-radius: 30px;
    width: calc(100% - 32px);
    margin: 32px auto; }
  .logo-list {
    height: 100px; }
  /* Next section */
  .front-page-achievement-section {
    padding: 130px 0 0 0; }
    .front-page-achievement-section .container images {
      width: 70%; }
  .achievements-list {
    gap: 24px; }
  .achievement-item {
    width: 250px !important;
    min-height: 250px !important;
    padding: 20px; }
    .achievement-item .marafiki-button {
      width: 100%; }
  .achievement-item-active {
    width: 270px !important; }
  .static-label {
    margin-right: 8px; }
  /* Oferta matka */
  .oferta-parent-main-content {
    padding: 30px 0 0 0; }
    .oferta-parent-main-content .header-h1 {
      margin-bottom: 30px; }
  .header-oferta-parent {
    min-height: 125px; }
    .header-oferta-parent .breadcrumbs {
      display: flex;
      margin: 21px 0 0 0; }
  /* Next section */
  .industries-list {
    display: flex;
    flex-direction: column;
    /* margin: 0 auto; */
    gap: 8px;
    /* padding-top: 50px; */ }
    .industries-list li {
      transition: transform 0.3s ease-out; }
      .industries-list li:hover {
        transform: translateY(0) scale(0); }
    .industries-list .marafiki-button {
      width: 100%;
      gap: 15px; }
  .paragraph-yellow-bottom-border {
    padding: 0 0 0 29px;
    text-align: left; }
    .paragraph-yellow-bottom-border::after {
      position: absolute;
      bottom: 0;
      left: 0;
      content: '';
      display: block;
      width: 5px;
      height: 100%;
      background-color: var(--marafiki-yellow);
      border-radius: 5px; }
  .with-pattern-bg:after {
    display: none; }
  /* PODSTRONA WIEDZA */
  .knolowledge-main-section {
    margin: 24px 0 0 0; }
  .knolowledge-listening-wrapper {
    gap: 32px;
    /* .post-arrow {
        .arrow-up {
            display: flex;
            top: 26px;
            right: 17px;
            width: 32px;
            height: 32px;
        }
    } */ }
  .knolegledge-branch-left {
    padding: 20px 48px 20px 20px; }
    .knolegledge-branch-left .double-chevron-list {
      column-count: 1; }
      li .knolegledge-branch-left .double-chevron-list:last-of-type {
        margin-bottom: 0; }
  /* PODSTRONA SINGLE USLUGI */
  .header-service {
    min-height: auto;
    padding: 48px 0 20px 0; }
    .header-service .breadcrumbs {
      display: block;
      margin: 15px 0 0 16px; }
  .organic-wrapper {
    height: 190px; }
  .hero-headings {
    min-height: auto;
    padding: 0 10px;
    margin: 122px auto 35px; }
    .hero-headings .header-h1 {
      text-align: center;
      margin: 0 auto; }
    .hero-headings p.text-main {
      margin-left: 0; }
  .header-separator--yellow {
    width: 100px;
    height: 3px;
    margin: 0; }
  .service-after-top-div {
    padding: 0 30px; }
  .form-on-service-page {
    flex: 1 1 100%;
    padding: 40px 32px 0px; }
    .form-on-service-page .header-h3 {
      font-size: 24px;
      line-height: 135%;
      margin-bottom: 10px; }
    .form-on-service-page h4 {
      font-size: 16px;
      line-height: 150%; }
    .form-on-service-page .f-w-thin {
      font-size: 24px;
      line-height: 135%;
      font-weight: 600; }
  .lists-set {
    flex-wrap: nowrap;
    flex-direction: column;
    justify-content: flex-start; }
  .double-chevron-list {
    margin-top: 16px;
    gap: 16px; }
  .boxes-on-offer-section .boxy-shape .boxy-percentage {
    font-size: 42px;
    line-height: 130%; }
  .boxes-on-offer-section .header-h4 {
    font-size: 14px;
    line-height: 140%; }
  .single-service-testimonials-section {
    padding: 64px 0; }
  .box-with-testimonials {
    padding: 24px; }
  .testimonials-card__quote {
    text-align: left; }
  /* Nagrody i wyrónienia */
  .awards-recognitions-wrapper {
    flex-direction: column;
    gap: 40px;
    height: auto; }
  /* Propozycja współpracy */
  .cooperation-proposal-section {
    padding: 64px 0; }
    .cooperation-proposal-section .container {
      gap: 24px; }
  .footer-offer-section .footer-top {
    gap: 40px; }
  .single-service-detailed-scope-section {
    margin: 64px 0; }
  .custom-list {
    row-gap: 12px; }
  .what-we-offer-div {
    flex-direction: column;
    gap: 50px; }
    .what-we-offer-div .section-title {
      text-align: center;
      flex: 1 1 auto; }
  .c2a-text-and-btn .text-20 {
    font-size: 16px; }
  .who-we-work-with-section {
    padding: 64px 0; }
  .marafiki-collage {
    max-width: 100%; }
  .arrow-list {
    align-self: start; }
  /* PODSTRONA O NAS */
  .header-about-us .container {
    padding: 64px 0 138px; }
    .header-about-us .container .tropical-leaf {
      width: 140px; }
    .header-about-us .container .tropical-leaf-1 {
      top: 150px;
      right: -76px; }
    .header-about-us .container .tropical-leaf-2 {
      top: 215px; }
  .header-about-us .section-title {
    margin: 0 0 24px 0; }
  .header-about-us .header-h1 {
    margin: 0 0 188px 0; }
  .section-about-us-after-top::before {
    height: 61px; }
  .section-about-us-after-top::before {
    top: -59px; }
  /* Next-section */
  .about-us-lower-part {
    margin-bottom: 60px; }
    .about-us-lower-part::after {
      height: 61px; }
    .about-us-lower-part::after {
      bottom: -59px; }
    .about-us-lower-part ul {
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      gap: 64px; }
      .about-us-lower-part ul li {
        max-width: 100%; }
  .about-us-lower-part-item {
    max-width: 70%;
    margin: 0 auto 16px; }
  /* Next section */
  .about-us-people-slider-section {
    padding: 40px 0 30px; }
  .section-title-plus-custom-nav {
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 16px; }
    .section-title-plus-custom-nav > div:nth-child(2) {
      order: -1;
      flex-basis: 100%;
      /* margin-bottom: 10px;  */ }
  /* Swiper */
  #aboutPeopleSwiper .swiper-slide {
    transition: none; }
    #aboutPeopleSwiper .swiper-slide:hover {
      transform: none; }
    #aboutPeopleSwiper .swiper-slide.active {
      width: 213px !important; }
  .team-member-container {
    flex-direction: column;
    height: auto;
    min-height: 323px; }
    .team-member-container .team-member-bio {
      max-width: 100% !important;
      padding: 0;
      max-height: 0;
      opacity: 0;
      overflow: hidden;
      transition: max-height 0.3s ease, opacity 0.3s ease; }
      .team-member-container .team-member-bio p {
        transform: translateY(20px);
        transition: transform 0.3s ease;
        padding: 0 20px 20px 20px;
        margin: 0; }
    .swiper-slide.active .team-member-container .team-member-bio {
      max-width: 100% !important;
      max-height: 500px;
      opacity: 1;
      padding: 0; }
      .swiper-slide.active .team-member-container .team-member-bio p {
        transform: translateY(0);
        opacity: 1;
        transition: transform 0.3s 0.1s ease, opacity 0.3s 0.1s ease; }
  .elite-partners-logos::before, .elite-partners-logos::after {
    display: none; }
  /* Sekcja zakrytych kart na stronie O nas */
  .revealing-cards-grid-container {
    gap: 16px;
    scroll-padding-left: 16px; }
  .revealing-cards-grid-container {
    padding: 24px 24px;
    margin: 0 -20px 20px; }
  /* next section */
  .about-the-founders {
    margin: 200px 0 100px; }
  /* Next section */
  .about-us-movies-section {
    padding: 40px 0 40px; }
  .toggle-list-item {
    margin: 24px 0; }
  .toggle-list-item.active-toggle-item .toggle-item-title {
    font-size: 23px;
    line-height: 135%; }
  /* Next section */
  .about-us-gallery-section {
    touch-action: pan-y; }
    .about-us-gallery-section .section-title::after {
      display: none; }
    .about-us-gallery-section images {
      padding: 20px 16px 20px; }
  /* Next section */
  .logo-marquee {
    margin: 40px 0; }
    .logo-marquee .section-title:first-of-type {
      padding: 30px 30px 0; }
    .logo-marquee p {
      margin: 0 auto 16px;
      font-size: 16px; }
    .logo-marquee .section-title:last-of-type {
      padding: 0 0 30px; }
  .shape-container::before {
    transform: translate(2px, 35px); }
  /* Next section */
  .where-we-work-section {
    padding: 100px 0 50px; }
  .www-lower {
    margin-top: 32px;
    padding-top: 32px;
    border-top: 1px solid #e7e7e7; }
  .list-of-conferences {
    justify-content: space-between; }
  .about-us-slider-hobbys-section {
    padding: 50px 0 100px; }
    .about-us-slider-hobbys-section .steps-more {
      margin-bottom: 24px;
      width: 75%; }
  .about-us-with-image images {
    width: 213px; }
  .about-us-with-image .section-title {
    font-size: 24px;
    line-height: 135%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  /* style dla swipera z Hobby z tooltipami na stronie O nas */
  .about-us-slide {
    margin-left: -25px;
    margin-right: -25px; }
  .about-us-slide.odd {
    margin-top: 80px; }
  /* Feedy z instagrama na storbie O nas */
  .social-media-feed-list li {
    width: 206px; }
  .additional-info-section .section-title {
    transform: translateX(0);
    font-size: 20px;
    line-height: 135%; }
  .additional-info-section h3 {
    margin-top: 20px;
    font-size: 24px;
    line-height: 135%; } }

@media (max-width: 1024px) {
  .container {
    max-width: calc(100% - 60px) !important; }
  /* Wielkosc naglowkow */
  .header-h1 {
    font-size: 42px;
    line-height: 130%; }
  .section-title {
    font-size: 35px;
    line-height: 135%; }
  .header-h3 {
    font-size: 24px;
    line-height: 135%; }
  .mobile-right-div {
    display: flex;
    opacity: 1;
    visibility: visible; }
  /* hamburger menu */
  .mobile-menu-button {
    opacity: 1;
    visibility: visible;
    display: flex; }
  .top-bar {
    max-width: calc(100% - 60px);
    padding: 20px 20px 20px 40px; }
  /* menu is open */
  .menu-section.mobile-open .top-bar {
    pointer-events: auto;
    border-bottom: 1px solid #e7e7e7;
    max-width: 100%;
    border-radius: 0;
    top: 0; }
    .menu-section.mobile-open .top-bar .main-nav {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0) scale(1);
      transition-delay: 0s; }
    .menu-section.mobile-open .top-bar .mobile-right-div .marafiki-button {
      display: none; }
  .menu-section.mobile-open .first-level-menu-link-with-icon {
    /* padding: 4px 35px 4px 0; */ }
    .menu-section.mobile-open .first-level-menu-link-with-icon::after {
      width: 18px;
      height: 19px;
      -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06%27 clip-rule=%27evenodd%27/></svg>");
      mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M13.47 5.47a.75.75 0 0 1 1.06 0l6 6a.75.75 0 0 1 0 1.06l-6 6a.75.75 0 1 1-1.06-1.06l4.72-4.72H4a.75.75 0 0 1 0-1.5h14.19l-4.72-4.72a.75.75 0 0 1 0-1.06%27 clip-rule=%27evenodd%27/></svg>"); }
  /* --- STYLE NAGŁÓWKA --- */
  .mobile-menu-header {
    display: none;
    /* Domyślnie ukryty, pokazuje go JS */
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    margin: 0 -16px 16px -16px;
    background-color: #f7f7f7;
    font-weight: 600;
    font-size: 16px;
    position: sticky;
    top: 0;
    z-index: 20;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05); }
  /* Warianty kolorystyczne (dla headerów wewnątrz kolumn) */
  .mobile-menu-header.bg-yellow {
    background-color: var(--marafiki-yellow);
    color: black; }
  .mobile-menu-header.bg-black {
    background-color: black;
    color: white; }
  .mobile-menu-header.bg-blue {
    background-color: var(--marafiki-blue);
    color: white; }
  .mobile-menu-header.bg-grey {
    background-color: #e7e7e7;
    color: black; }
  .main-nav {
    flex-direction: column;
    height: 100vh;
    justify-content: flex-start;
    align-items: flex-start;
    background-color: white;
    width: 100%;
    position: absolute;
    top: 96px;
    left: 0;
    gap: 16px;
    padding: 16px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(20px) scale(0.98);
    transition: opacity 0.3s ease,
 transform 0.3s ease,
 visibility 0s linear 0.3s;
    will-change: transform, opacity; }
  .main-nav > ul {
    margin: 0 auto;
    flex-direction: column;
    align-items: unset;
    gap: 16px;
    max-width: 100%; }
    .main-nav > ul li a {
      text-align: left;
      border: 1px solid #e7e7e7;
      border-radius: 10px;
      padding: 0 20px;
      height: 48px;
      line-height: 48px;
      display: block;
      width: 100%;
      font-size: 14px;
      font-weight: 500; }
      .main-nav > ul li a.btn-14 {
        padding: 0; }
  .first-level-menu-link-with-icon::after {
    right: 18px; }
  /* wyłącz hover-owe pokazywanie submenu na mobile */
  .has-submenu:not(.open):hover > .submenu {
    transform: none;
    opacity: 0;
    visibility: hidden;
    pointer-events: none; }
  .mega-menu {
    width: 100%;
    max-width: 100%;
    border-radius: none;
    flex-direction: column;
    top: 96px;
    gap: 16px;
    padding: 16px;
    transform: translate(50%, 0);
    z-index: 10001; }
  #submenu-uslugi {
    width: 100%;
    max-width: 100%; }
    #submenu-uslugi .mega-column {
      width: 100%; }
  #submenu-strategia {
    width: 100%;
    max-width: 100%; }
  /* =========================================
         LOGIKA DRILL-DOWN (Menu Wsuwane)
  ========================================= */
  /* 1. KONTENER MEGA MENU */
  .mega-menu {
    display: block;
    position: fixed;
    top: 96px;
    left: 0;
    width: 100%;
    height: calc(100vh - 96px);
    height: calc(100dvh - 96px);
    background: white;
    padding: 0 16px 40px 16px;
    overflow-y: auto !important;
    overflow-x: hidden;
    z-index: 10001;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    /* Animacja wjazdu */
    transform: translateX(100%);
    opacity: 0;
    visibility: hidden;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease, visibility 0s linear 0.3s; }
  .mega-menu.open {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
    transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease, visibility 0s linear 0s; }
  /* 2. NAGŁÓWEK MOBILNY (Zawsze widoczny w otwartym menu) */
  .mobile-menu-header {
    display: none;
    align-items: center;
    justify-content: space-between;
    padding: 8px 6px 8px 20px;
    margin: 0 -16px 16px -16px;
    background-color: #f3f3f3;
    font-weight: 600;
    font-size: 16px;
    position: sticky;
    top: 0;
    z-index: 20;
    border-bottom: 1px solid #e7e7e7;
    transition: background-color 0.3s ease, color 0.3s ease; }
  /* Warianty kolorystyczne nagłówka - to steruje kolorem tekstu i ikon */
  .mobile-menu-header.bg-yellow {
    background-color: var(--marafiki-yellow);
    color: black; }
  .mobile-menu-header.bg-black {
    background-color: black;
    color: white; }
  .mobile-menu-header.bg-blue {
    background-color: var(--marafiki-blue);
    color: white; }
  .mobile-menu-header.bg-grey {
    background-color: #f3f3f3;
    color: black; }
  /* LEWA STRONA: Przycisk Wstecz */
  .mobile-back-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    color: inherit;
    font-size: 16px;
    font-weight: 600;
    gap: 12px; }
  .mobile-back-btn svg path {
    fill: currentColor; }
  /* PRAWA STRONA: Link do archiwum */
  .mobile-header-icon-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: inherit;
    text-decoration: none; }
  /* Zmiana dla nowej ikony: ustawiamy wypełnienie na kolor bieżący */
  .mobile-header-icon-container svg {
    fill: currentColor;
    stroke: none; }
  /* SCENARIUSZ A: Jesteśmy na liście głównej (Level 1 - np. lista kategorii w Usługach)
 Warunek: Menu otwarte (.open) ORAZ brak klasy .drill-down-active
 Akcja: Pokaż TYLKO nagłówek główny (.main-header) */
  .mega-menu.open:not(.drill-down-active) .mobile-menu-header.main-header {
    display: flex; }
  /* SCENARIUSZ B: Weszliśmy w szczegóły (Level 2 - np. "Cel")
 Warunek: Menu ma klasę .drill-down-active ORAZ kolumna jest aktywna
 Akcja: Pokaż nagłówek WEWNĄTRZ tej kolumny */
  .mega-menu.drill-down-active .mega-column.active-category .mobile-menu-header {
    display: flex; }
  /* ZABEZPIECZENIE:
 Upewniamy się, że w trybie szczegółów główny nagłówek na pewno znika */
  .mega-menu.drill-down-active .mobile-menu-header.main-header {
    display: none; }
  /* 3. KOLUMNY (Kategorie) */
  .mega-column {
    width: 100% !important;
    cursor: pointer;
    margin-bottom: 12px;
    padding: 0 20px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 10px;
    border: none;
    transition: transform 0.2s ease; }
  /* Kolory przycisków w Level 1 */
  .mega-column.bg-yellow {
    background-color: var(--marafiki-yellow) !important;
    color: black !important; }
  .mega-column.bg-black {
    background-color: black !important;
    color: white !important; }
  .mega-column.bg-blue {
    background-color: var(--marafiki-blue) !important;
    color: white !important; }
  .mega-column.bg-grey {
    background-color: #f4f4f4 !important;
    color: black !important; }
  /* Strzałka w prawo na kategoriach */
  .mega-column::after {
    content: '';
    width: 24px;
    height: 24px;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z%27/></svg>");
    mask-image: url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27><path fill-rule=%27evenodd%27 d=%27M5.46967 8.46967C5.76256 8.17678 6.23744 8.17678 6.53033 8.46967L12 13.9393L17.4697 8.46967C17.7626 8.17678 18.2374 8.17678 18.5303 8.46967C18.8232 8.76256 18.8232 9.23744 18.5303 9.53033L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L5.46967 9.53033C5.17678 9.23744 5.17678 8.76256 5.46967 8.46967Z%27/></svg>");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    transform: rotate(-90deg);
    display: block; }
  .mega-column ul {
    display: none; }
  .mega-column .header-h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 600; }
    .mega-column .header-h4::after, .mega-column .header-h4::before {
      display: none; }
  /* 4. STAN "DRILL-DOWN" (Szczegóły) */
  /* Ukrywamy inne kategorie */
  .mega-menu.drill-down-active .mega-column:not(.active-category) {
    display: none; }
  /* Styl aktywnej kategorii (kontener linków) */
  .mega-menu.drill-down-active .mega-column.active-category {
    height: auto;
    border: none;
    padding: 0;
    margin: 0;
    background: transparent !important;
    cursor: default;
    display: block; }
  .mega-menu.drill-down-active .mega-column.active-category::after {
    display: none; }
  .mega-menu.drill-down-active .mega-column.active-category::before {
    display: none; }
  .mega-menu.drill-down-active .mega-column.active-category .header-h4 {
    display: none; }
  .mega-menu.drill-down-active {
    overflow: hidden !important; }
  .mega-menu.drill-down-active .mega-column.active-category ul {
    flex-direction: column;
    padding-top: 0;
    display: flex !important;
    animation: slideInRight 0.3s ease-out forwards;
    /* proba scrolla */
    max-height: calc(100dvh - 96px - 56px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain; }
  /* Definicja animacji wjazdu */
  @keyframes slideInRight {
    from {
      opacity: 0;
      transform: translateX(30px); }
    to {
      opacity: 1;
      transform: translateX(0); } }
  .mega-menu.drill-down-active .mega-column.active-category ul li a {
    display: flex;
    align-items: center;
    background: white;
    border: 1px solid #e7e7e7;
    padding: 0 20px;
    height: 48px;
    border-radius: 10px;
    font-weight: 500;
    font-size: 14px;
    color: black;
    text-decoration: none; }
  /* header-case-study */
  .header-case-studies {
    min-height: auto; }
    .header-case-studies .container {
      flex-direction: column-reverse;
      justify-content: center;
      align-items: center;
      padding: 100px 0 200px; }
      .header-case-studies .container .header-h1 {
        flex: 0 1 100%;
        text-align: center;
        padding: 0 50px; }
      .header-case-studies .container .separator--yellow {
        /* align-self: stretch; */
        width: 75%;
        height: 3px;
        margin: -17px auto 60px; }
  .black-on-white-content {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column-reverse;
    align-items: center; }
    .black-on-white-content .case-label {
      margin: 60px 0 0; }
  /* Case data grid */
  .case-data-grid-container {
    width: 100%;
    flex: 0 1 100%; }
    .case-data-grid-container .row {
      grid-template-columns: 60px 1fr;
      /* 1 kolumna = ikona, 2 kolumna = teksty */
      align-items: center;
      /* wyśrodkowanie ikony względem całej kolumny tekstowej */
      gap: 0; }
      .case-data-grid-container .row .text-1,
      .case-data-grid-container .row .text-2 {
        grid-column: 2;
        /* przenosimy do drugiej kolumny */ }
  .case-introduction-text {
    padding-left: 29px; }
  /* Next section */
  .cascading-boxes .section-title {
    margin-bottom: 70px; }
  .cascading-boxes .boxy-shape-container {
    flex-wrap: wrap;
    width: calc(100% - 60px);
    flex-direction: column;
    justify-content: center;
    align-items: flex-start; }
    .cascading-boxes .boxy-shape-container .step-by-step {
      top: 30px;
      left: 470px; }
  .boxy-shape {
    margin-top: 0 !important;
    max-width: 70%; }
  .firtst-boxy-shape {
    align-self: flex-start; }
  .second-boxy-shape {
    align-self: center; }
  .third-boxy-shape {
    align-self: flex-end; }
  /* Accordion */
  .case-accordion .acc-container {
    flex-wrap: wrap;
    gap: 20px; }
  .case-accordion .accordion {
    flex: 1 1 657px; }
  .case-accordion img {
    margin: 0 auto; }
  .step-by-step-wrapper {
    flex-direction: column;
    align-items: flex-start;
    max-width: calc(100% - 60px);
    gap: 70px;
    margin-bottom: 50px; }
  .step-by-step-list-container {
    padding: 130px 0 0 0;
    overflow-x: hidden; }
  .step-by-step-list {
    width: calc(100vw - 60px);
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 32px;
    scroll-snap-type: x mandatory;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    cursor: grab;
    scrollbar-width: none;
    padding-right: 300px; }
    .step-by-step-list li {
      scroll-snap-align: start; }
  .background-step-number {
    display: none; }
  .content-display {
    min-height: 220px; }
    .content-display .border-left-3 {
      padding-left: 0; }
      .content-display .border-left-3::before {
        display: none; }
  .content-item.is-visible {
    position: relative;
    opacity: 1;
    display: block;
    transform: translateY(0);
    pointer-events: auto;
    visibility: visible; }
  /* Next section */
  .case-work-results-container {
    padding: 120px 0 100px 0; }
    .case-work-results-container .tropical-leaf-edge {
      /* top: 0; */
      right: -75px;
      width: 212px; }
  .results-presentation-wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 100px;
    padding-bottom: 200px; }
  .blob-big .tropical-leaf-2 {
    top: auto;
    bottom: 35%;
    left: 50%;
    --base-rotation: -160deg;
    --base-scale-x: -1; }
  .blob-small {
    position: static;
    width: calc(50% - 50px); }
  /* Sekcja nasz komentarz */
  .descriptive-section .section-title {
    margin: 100px 0 100px 0;
    text-align: center; }
  .descriptive-content {
    display: block;
    margin-bottom: 48px; }
  /* Gray section */
  .gray-section .container {
    /* Włączamy przewijanie TYLKO w poziomie */
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    /* Zmieniamy wyświetlanie, aby elementy mogły przekraczać szerokość */
    display: block;
    padding: 60px 0; }
    .gray-section .container::before, .gray-section .container::after {
      display: none; }
  .image-scrollable {
    /* Przyleganie do lewej: Usuwamy margin auto */
    margin: 0;
    /* Szerokość auto, aby obrazek miał swoje naturalne wymiary i wymusił przewijanie */
    width: auto;
    max-height: 100vh;
    display: inline-block;
    object-fit: contain; }
  /* Customer Comment */
  .customer-comment-section {
    padding: 175px 0 0; }
    .customer-comment-section .container {
      display: block; }
    .customer-comment-section .section-title {
      margin: 0 0 32px 0;
      text-align: left; }
      .customer-comment-section .section-title .blue-accent {
        display: inline-block; }
  .customer-comment {
    width: 100%; }
    .customer-comment::before {
      top: -200px;
      left: auto;
      right: 60px;
      width: 110px;
      height: 106px;
      transform: rotate(35deg); }
  /* Summary section */
  .summary-section {
    padding: 70px 0 0 0;
    margin: 0 0 85px;
    background: black;
    position: relative; }
    .summary-section::before, .summary-section::after {
      content: '';
      position: absolute;
      width: 101vw;
      left: 50%;
      transform: translateX(-50%);
      /* height: 100%; */
      background-repeat: no-repeat;
      background-size: contain; }
    .summary-section::before {
      top: -30px;
      height: 30px;
      background-image: url(b174a43efa5d4fbf7385.svg);
      background-position: bottom; }
    .summary-section::after {
      height: 120px;
      bottom: -120px;
      background-image: url(d33f75c99cd941ec8e76.svg);
      background-position: top; }
    .summary-section .blob-2 {
      display: none; }
    .summary-section .section-title {
      text-align: left;
      color: white; }
    .summary-section .container {
      flex-direction: column;
      justify-content: flex-start;
      align-items: flex-start; }
  .summary-content {
    max-width: 100%; }
  /* Footer */
  .footer {
    padding-top: 59px;
    background: url(cf446e4f9a67b7bb372d.png) no-repeat top center !important;
    background-size: cover !important; }
    .footer .section-title {
      text-align: center; }
    .footer.footer-contact .footer-bottom {
      padding: 123px 0 93px; }
  .footer-pattern-bg {
    -webkit-mask-position: 60% top;
    mask-position: 60% top; }
  .footer-top {
    /* padding: 100px 0 0 0; */
    flex-direction: column;
    align-items: center;
    max-width: calc(100% - 60px);
    /* gap: 100px; */ }
  .footer-bottom {
    padding: 70px 0 70px; }
  .contact-data {
    flex-flow: column nowrap;
    gap: 0; }
  .copyrights {
    flex-flow: column nowrap;
    gap: 0;
    text-align: right; }
    .copyrights span {
      display: none; }
  /* ARCHIVE CASE STUDIES */
  .filter-content-case-study {
    grid-column: 1 / -1;
    padding: 40px 0 40px; }
  .archive-case-list-container {
    column-gap: 32px;
    row-gap: 32px; }
  article.archive-item {
    min-height: 364px; }
    article.archive-item .case-category-sticker {
      top: 21px;
      left: 16px;
      padding: 5px 16px 5px; }
    article.archive-item .arrow-up {
      top: 16px;
      right: 16px;
      width: 30px;
      height: 30px; }
    article.archive-item .cs-card-content {
      border-radius: 25px;
      padding: 20px 16px; }
    article.archive-item .results-sticker {
      width: 88px;
      height: 88px;
      top: -76px;
      left: 16px; }
      article.archive-item .results-sticker .extra-small {
        font-size: 10px;
        line-height: 100%;
        font-weight: 500; }
      article.archive-item .results-sticker .results-p-small {
        font-size: 24px;
        line-height: 135%;
        font-weight: 600;
        margin-top: 4px; }
    article.archive-item .header-h4 {
      font-size: 20px;
      line-height: 135%; }
  /*  CONTACT PAGE */
  .section-form-on-contact-page {
    padding: 50px 0 150px; }
    .section-form-on-contact-page .container {
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      gap: 24px; }
  .contact-site-person-data {
    justify-content: center; }
  /* Dodatkowa klasa dla sekcji, ktoraa dodaj fale na krawedziach gornej i dolnej sekcji */
  .wave-edge-top-bottom {
    position: relative;
    background-color: #000; }
    .wave-edge-top-bottom::before, .wave-edge-top-bottom::after {
      content: "";
      position: absolute;
      left: -1px;
      width: 101%;
      height: 151px;
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 preserveAspectRatio=%27none%27 viewBox=%270 0 360 61%27%3E%3Cpath fill=%27%23000%27 d=%27m360.005 60.04-360 .047L0 25.995c18.503-.374 37.967.544 58.27 2.842C139.678 41.12 262.836 3.217 359.997 0z%27/%3E%3C/svg%3E");
      z-index: 1;
      pointer-events: none; }
    .wave-edge-top-bottom::before {
      top: -147px; }
    .wave-edge-top-bottom::after {
      bottom: -147px;
      transform: rotate(180deg); }
  .accordeon-contact-page-section {
    padding: 24px 0;
    margin: 0 0 170px 0; }
  .accordeon-flex-contact {
    flex-direction: column;
    gap: 24px;
    align-items: center; }
  .blob-contact-bg {
    display: none; }
  .our-clients-contact-page {
    margin-top: 0;
    display: grid;
    grid-template-columns: repeat(3, 150px);
    grid-auto-rows: 100px;
    gap: 24px;
    justify-content: start;
    flex: initial; }
  .client-logo {
    position: static; }
  /* Sekcja dane kontaktowe */
  .contact-data-section .container {
    display: flex;
    flex-wrap: wrap;
    /* Pozwala elementom spadać do nowej linii */
    justify-content: space-between;
    gap: 30px;
    align-items: flex-start; }
  /* 1. Lewa kolumna (Adres) */
  .data-address {
    order: 1;
    width: calc(50% - 15px);
    /* Połowa szerokości minus połowa odstępu */
    margin-top: 0; }
  /* 3. Prawa kolumna (Sociale) */
  .contact-data-socials {
    order: 2;
    width: calc(50% - 15px);
    margin-top: 0; }
  /* Układ 2-kolumnowy WEWNĄTRZ list adresu i sociali */
  .data-address ul,
  .contact-data-socials ul {
    font-size: 12px;
    line-height: 150%;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(159px, 1fr));
    gap: 1rem 2rem;
    /* Odstęp między elementami listy */ }
    .data-address ul li,
    .contact-data-socials ul li {
      padding-left: 40px; }
  ul.contact-info li,
  ul.social-links li {
    margin-bottom: 10px; }
  /* 2. Środkowa sekcja (Insights) - ląduje na dole */
  .contact-data-insignts {
    order: 3;
    width: 100%;
    max-width: 100%;
    margin-top: 30px;
    padding: 60px; }
  .search-bar-article {
    margin: 100px 0; }
  .search-field {
    font-size: 20px; }
  /* Archive Blog */
  .blog-main-section {
    margin-bottom: 80px; }
  /* Blog kategorie */
  .blog-category-list {
    /* margin-top: 44px; */
    gap: 16px 8px; }
    .blog-category-list li {
      list-style: none;
      line-height: 1.2; }
  .flex-second-column {
    display: none; }
  .blog-posts-wrapper .cta-aside {
    display: flex; }
  .post-arrow {
    flex: 0 0 10px; }
    .post-arrow .arrow-up {
      display: none; }
  /* FRONT PAGE */
  .header-front-page {
    min-height: auto;
    /* Resetujemy ustawienia zdjęcia */ }
    .header-front-page .container {
      padding: 100px 0 0 0;
      flex-direction: column;
      gap: 60px; }
    .header-front-page img {
      align-self: center;
      margin-bottom: 0; }
  .slogan {
    margin: 0;
    text-align: center;
    width: 100%; }
    .slogan .white-accent-rect {
      transform: translate(0, -5px);
      margin: 8px auto 0 auto; }
    .slogan .text-20 {
      margin: 10px 0 0 0; }
  /* Next section */
  .general-info-section {
    /* margin: 100px 0 150px; */ }
    .general-info-section .container {
      flex-direction: column;
      /* justify-content: space-between;
      align-items: stretch; */
      gap: 24px; }
    .general-info-section p.text-main {
      max-width: 100%; }
  .cta-section.without-background-cta {
    padding: 56px 0 200px; }
  .cta-section-single-blog {
    margin: 16px 0; }
    .cta-section-single-blog .cta-headings {
      display: contents; }
    .cta-section-single-blog .header-h3 {
      margin: 0; }
    .cta-section-single-blog .container {
      flex-direction: column;
      gap: 16px;
      text-align: center;
      /* justify-content: space-between;
          align-items: center; */
      padding: 57px 60px;
      /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='325' height='307' fill='none' viewBox='0 0 325 307' preserveAspectRatio='none'%3E%3Cmask id='a' width='325' height='307' x='0' y='0' maskUnits='userSpaceOnUse' style='mask-type:alpha'%3E%3Cpath fill='%23000' d='M216.114 4.233c88.385-24.573 86.811 62.732 100.038 135.67 20.468 112.869 10.027 202.181-105.631 152.124s-244.588 90.162-202.3-48.309S-29.819 4.233 54.775 4.233c84.595 0 79.655 22.71 161.339 0'/%3E%3C/mask%3E%3Cg mask='url(%23a)'%3E%3Cpath fill='%23ffb600' d='M-327.576-647.815H1592.42v1208H-327.576z'/%3E%3C/g%3E%3C/svg%3E"); */ }
  .home-brand-slider-section .wave-top,
  .home-brand-slider-section .bottom-wave {
    display: none; }
  .flex-cnt {
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
    padding: 0; }
    .flex-cnt .section-title {
      text-align: center;
      margin: 0; }
    .flex-cnt .flex-child-wrapper {
      max-width: 100%; }
  .swiper-with-opinions .swiper-navigation-container {
    justify-content: space-between;
    margin-bottom: 24px; }
  .clients-review-swiper {
    min-height: auto; }
  /* Next section */
  .like-to-talk-section {
    padding: 56px 0 56px;
    margin: 56px 0 0 0;
    /* .container {
        flex-direction: column;
        gap: 50px;
    } */ }
  .like-carousel {
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    gap: 50px; }
  .like-slider-row {
    align-items: flex-start;
    justify-content: center;
    margin: 0; }
  .like-image-wrapper {
    width: 100%;
    max-width: 450px;
    height: auto;
    margin: 0 auto;
    aspect-ratio: 577.4 / 540.2; }
  .like-slide-img {
    margin: 0; }
  .shape-container::before {
    transform: translate(2px, 50px); }
  .static-bottom {
    text-align: center; }
    .static-bottom .section-title::after {
      left: calc(50% - 45px); }
  .like-text-carousel {
    min-height: 160px; }
  /* Like Piano */
  .like-piano {
    padding: 50px 0 0 0; }
    .like-piano::before, .like-piano::after {
      display: none; }
  /* Next section */
  .latest-posts .section-title {
    margin: 0; }
  .latest-posts .container {
    flex-direction: column;
    align-items: center;
    gap: 16px; }
  /* Next section */
  .oferta-parent-main-content {
    padding: 75px 0 0 0; }
  .header-oferta-parent {
    min-height: 250px; }
  /* PODSTRONA WIEDZA */
  .knolegledge-branch-left {
    padding: 40px; }
    .knolegledge-branch-left .double-chevron-list {
      column-count: 2; }
  /* PODSTRONA SINGLE USLUGI */
  .header-service {
    padding: 126px 0 30px 0; }
    .header-service .breadcrumbs li a {
      text-shadow: 0px 0px 7.5px rgba(0, 0, 0, 0.6); }
  .hero-headings {
    min-height: auto;
    gap: 30px;
    width: 100%;
    margin: 270px 0 60px; }
  .organic-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px; }
  .organic-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 360 190%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 170.6c19.5 9.6 68.8 22.4 147.2 10.3s91.2-4.8 113.9 2.1 62.3 19.2 98.9-29.1c0-41.9 0 0 0 0V0H0z%27/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 360 190%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 170.6c19.5 9.6 68.8 22.4 147.2 10.3s91.2-4.8 113.9 2.1 62.3 19.2 98.9-29.1c0-41.9 0 0 0 0V0H0z%27/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat; }
  .form-on-service-page {
    padding: 50px 80px 20px; }
  .service-after-top-section {
    padding-bottom: 64px; }
  .single-service-clients-loop-section {
    padding: 64px 0 0; }
    .single-service-clients-loop-section .track-list {
      margin: 48px auto; }
  .services-additional-informations {
    padding-bottom: 64px; }
  /* Next */
  .what-can-u-achieve-section {
    padding: 64px 0; }
  .lists-set {
    flex-wrap: wrap;
    margin-top: 48px;
    justify-content: center; }
  .boxes-on-offer-section {
    padding: 64px 0; }
  .single-service-process-steps-section {
    padding: 64px 0; }
  .team-offer-section .container {
    flex-direction: column;
    align-items: flex-start; }
  .t-o-desc {
    max-width: 100%;
    text-align: left; }
  /* FAQ Section */
  .single-service-faq-section {
    padding: 64px 0; }
    .single-service-faq-section .container {
      flex-direction: column;
      gap: 48px;
      justify-content: flex-start;
      align-items: flex-start; }
  .yellow-separator-vertical {
    width: 100%;
    height: 4px;
    align-self: stretch;
    border-radius: 5px;
    background: var(--marafiki-yellow);
    flex-shrink: 1; }
  .faq-heading {
    text-align: left;
    flex: 1 1 auto; }
  .faq-accordeon .accordion-item:first-of-type {
    padding: 10px 10px 30px; }
  /* Case Studies Swiper na stronie oferty */
  .case-studies-to-watch-section {
    padding: 64px 0 0; }
    .case-studies-to-watch-section .section-title {
      margin-bottom: 28px; }
  /* Nagrody i wyrónienia */
  .awards-and-recognitions-section {
    padding: 64px 0; }
    .awards-and-recognitions-section .container {
      flex-direction: column;
      align-items: center;
      gap: 48px; }
  .footer-offer-section h4 {
    font-size: 18px;
    text-align: center; }
  .footer-offer-section .footer-top {
    gap: 40px;
    padding-top: 80px; }
  /* Sekcja co oferujemy */
  .single-service-detailed-scope-section {
    margin: 200px 0;
    padding: 50px 0; }
    .single-service-detailed-scope-section .c2a-text-and-btn {
      margin: 64px auto 0; }
  .custom-list {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-auto-flow: row; }
  /* Resetujemy przesunięcie na telefonie */
  .custom-list li:nth-child(7) {
    grid-row-start: auto; }
  .bg-shape-overlay {
    display: none; }
  .c2a-text-and-btn {
    display: flex;
    text-align: center; }
  /* Next section */
  .who-we-work-with-section {
    padding: 100px 0; }
    .who-we-work-with-section .container {
      display: flex;
      flex-direction: column;
      gap: 50px; }
  .marafiki-collage {
    max-width: 85%; }
  /* To jest klucz Metody 2: kontener z tekstem "znika" dla struktury,
 a jego dzieci (h2, ul, div) wpadają bezpośrednio do .container */
  .who-we-work-with {
    display: contents;
    gap: 48px; }
    .who-we-work-with .c2a-text-and-btn {
      margin-top: 0; }
  /* 1. Tytuł na samej górze */
  .who-we-work-with .section-title {
    order: 1;
    margin: 0; }
  /* 2. Zdjęcie w środku */
  .marafiki-collage {
    order: 2;
    /* display: flex;
    justify-content: center;
    max-width: 100%; */ }
  /* 3. Lista pod zdjęciem */
  .who-we-work-with .arrow-list {
    order: 3;
    margin: 0; }
  /* 4. Sekcja CTA na samym dole */
  .who-we-work-with .c2a-text-and-btn {
    order: 4; }
  /* PODSTRONA O NAS */
  .header-about-us .container {
    padding: 92px 0 197px; }
  .header-about-us .header-h1 {
    margin: 0 0 100px 0; }
  /* Next section */
  .section-about-us-after-top {
    background: black; }
    .section-about-us-after-top .blob-black-bg {
      display: none; }
    .section-about-us-after-top .container {
      flex-direction: column;
      justify-content: center;
      align-items: flex-start; }
      .section-about-us-after-top .container div:first-of-type {
        padding-bottom: 0;
        width: 100%; }
    .section-about-us-after-top::before {
      content: "";
      position: absolute;
      left: -1px;
      width: 101%;
      height: 151px;
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 preserveAspectRatio=%27none%27 viewBox=%270 0 360 61%27%3E%3Cpath fill=%27%23000%27 d=%27m360.005 60.04-360 .047L0 25.995c18.503-.374 37.967.544 58.27 2.842C139.678 41.12 262.836 3.217 359.997 0z%27/%3E%3C/svg%3E");
      z-index: 1;
      pointer-events: none; }
    .section-about-us-after-top::before {
      top: -147px; }
  .zebra-catchy {
    margin: 0 auto; }
  /* Next-section */
  .about-us-lower-part {
    background: black;
    color: white;
    margin-bottom: 100px; }
    .about-us-lower-part ul {
      padding: 64px 0 0; }
    .about-us-lower-part::after {
      content: "";
      position: absolute;
      left: -1px;
      width: 101%;
      height: 151px;
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 preserveAspectRatio=%27none%27 viewBox=%270 0 360 61%27%3E%3Cpath fill=%27%23000%27 d=%27m360.005 60.04-360 .047L0 25.995c18.503-.374 37.967.544 58.27 2.842C139.678 41.12 262.836 3.217 359.997 0z%27/%3E%3C/svg%3E");
      z-index: 1;
      pointer-events: none; }
    .about-us-lower-part::after {
      bottom: -147px;
      transform: rotate(180deg); }
  /* Next section */
  .about-us-people-slider-section {
    padding: 60px 0 40px; }
  .elite-partners-section {
    padding: 160px 0 80px; }
    .elite-partners-section .container {
      flex-direction: column;
      /* justify-content: space-between;
      align-items: center; */ }
  .elite-description {
    max-width: 100%; }
  .elite-partners-logos {
    gap: 24px; }
  /* Sekcja zakrytych kart na stronie O nas */
  .revealing-cards-section {
    margin-top: 20px; }
  .revealing-cards-grid-container {
    /* Zmiana z Grid na Flexbox dla scrollowania */
    display: flex;
    grid-template-columns: none;
    gap: 24px;
    /* Ustawienia scrollowania */
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 24px;
    scroll-snap-align: left;
    padding: 20px 24px;
    margin: 40px -20px;
    width: calc(100% + 40px);
    -ms-overflow-style: none;
    scrollbar-width: none; }
  .revealing-cards-grid-container::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera */ }
  .revealing-card {
    flex: 0 0 280px;
    width: 280px;
    scroll-snap-align: start;
    pointer-events: none; }
  /* WYMUSZENIE ODKRYCIA KARTY */
  .card-inner {
    transform: rotateY(180deg) !important; }
  /* next section */
  .about-the-founders {
    margin: 250px 0 100px; }
    .about-the-founders .upperwave,
    .about-the-founders .lowerwave {
      display: none; }
    .about-the-founders .section-title {
      order: 1;
      margin-bottom: 0; }
  /* Ustawienie kontenera jako Flex Column */
  .black-background .container {
    display: flex;
    flex-direction: column;
    gap: 36px; }
  .about-founders-upper,
  .about-founders-lower,
  .about-the-founders-text {
    display: contents; }
  /*  Zdjęcie z dolnej sekcji */
  .about-founders-lower img {
    order: 2;
    margin: 0 auto; }
  /* Tekst główny (wyciągnięty z about-the-founders-text) */
  .about-the-founders-text .text-main {
    order: 3; }
  /* 4. Niebieski Blob */
  .about-the-founders-blue-blob {
    order: 4;
    margin: 0 auto; }
  /* Korekta fontu w blobie na mniejszym ekranie */
  .about-the-founders-blue-blob h3 {
    font-size: 32px;
    text-align: center; }
  /* 5. Dolny blok tekstu */
  .founders-few-words {
    flex: 1 1 auto;
    order: 5;
    margin-top: 0;
    width: 100%;
    max-width: 100%; }
  /* Reset transformacji, mimo że display: contents je ukrywa, warto zresetować dla czystości */
  .about-founders-lower {
    margin-top: 0;
    transform: none; }
    .about-founders-lower img {
      width: 100%;
      max-width: 100%; }
  /* Next section */
  .about-us-movies-section {
    padding: 100px 0 100px; }
    .about-us-movies-section .section-title {
      text-align: left;
      margin-bottom: 16px; }
  .about-us-movies-wrapper {
    flex-direction: column;
    gap: 16px;
    align-items: center; }
  .about-us-the-movie {
    flex: 0 0 auto;
    width: 100%;
    /* Pozwalamy mu zająć całą szerokość kontenera (możesz też dać 100vw, jeśli chcesz wyjść poza container) */
    max-width: 100%; }
    .about-us-the-movie::after {
      height: 87%; }
  .toggle-list-accordion {
    width: 100%;
    flex: 0 0 auto;
    /* padding: 0 20px; */
    /* Dodatkowy margines bezpieczeństwa na bokach */ }
  /* Sekcja z karuzela z logami na stronie O nas */
  .black-blob-underneath {
    display: none; }
  /* Sekcja ze zdjeciem stanowiacym galerie przesuwaną "O nas" */
  .about-us-gallery-section {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: hidden; }
    .about-us-gallery-section .section-title {
      position: relative;
      top: auto;
      left: auto;
      transform: none;
      width: 100%;
      padding: 40px 0 10px;
      flex: 0 0 auto;
      z-index: 5; }
      .about-us-gallery-section .section-title::after {
        display: none; }
    .about-us-gallery-section img {
      position: relative;
      top: auto;
      left: auto;
      padding: 20px 30px 40px;
      margin: 0;
      flex: 1 1 auto;
      min-height: 0;
      height: 100%;
      width: auto;
      max-width: none !important;
      object-fit: cover; }
  /* Where we work na stronie O nas */
  .where-we-work-section {
    padding: 100px 0 100px; }
  .www-upper {
    flex-direction: column; }
    .www-upper img {
      width: 100%;
      margin-bottom: 80px; }
    .www-upper div {
      width: 100%; }
  .www-lower {
    flex-direction: column;
    gap: 24px;
    margin-top: 32px;
    padding-top: 32px;
    border-top: 1px solid #e7e7e7; }
    .www-lower .text-20 {
      max-width: 100%; }
  .list-of-conferences {
    flex-wrap: wrap;
    gap: 16px; }
  .city-image {
    width: 500%; }
  /* Sekcja ze swiperem o hobby na stronie O nas */
  .about-us-slider-hobbys-section {
    /* padding: 100px 0 150px; */ }
    .about-us-slider-hobbys-section .steps-more {
      display: block;
      width: 50%;
      margin-bottom: 60px; }
    .about-us-slider-hobbys-section .section-title {
      margin-bottom: 16px; }
    .about-us-slider-hobbys-section .container {
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      /* margin-bottom: 50px; */
      gap: 60px; }
  .about-us-slider-wrapper .blob-with-stripes {
    display: none; }
  .slider-buttons-flex-container {
    display: none; }
  .about-us-with-image {
    z-index: 1;
    margin-bottom: -120px; }
  /* Style dla swipera z hobby */
  .about-us-slide {
    transform: scale(0.75) !important;
    transform-origin: center center; }
  .about-us-slide.odd {
    margin-top: 100px; }
  .about-us-slide.special-margin {
    margin-top: 80px; }
  /* Next-section */
  .marafiki-in-social-media {
    margin-top: 40px; }
  /* next section */
  .social-media-links .social-icons {
    gap: 50px;
    margin-bottom: 60px; }
    .social-media-links .social-icons svg {
      width: 32px;
      height: 32px; }
  /* Feedy z instagrama na storbie O nas */
  .social-media-feed-list {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    padding-left: 16px;
    padding-right: 16px;
    scrollbar-width: none; }
    .social-media-feed-list::-webkit-scrollbar {
      display: none; }
    .social-media-feed-list li {
      flex-shrink: 0;
      scroll-snap-align: start; }
  .additional-info-section {
    padding-top: 40px; }
    .additional-info-section .section-title {
      transform: none; } }


/*# sourceMappingURL=main.css.map*/