/* ==========================================================================
   Hydrophob — базові стилі (десктоп)
   Складено з трьох джерел, порядок важливий:
   1) Swiper 11 (вендор), 2) styles.css Lovable, 3) базова тема style.css.
   ========================================================================== */

/* ==========================================================================
   1. Swiper 11 (вендор)
   node_modules/swiper/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}

/* ==========================================================================
   2. Стилі Lovable
   src/styles.css + tailwind-препроцес зі збірки Lovable
   ========================================================================== */

/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial;--tw-content:"";--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-blur:0;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-blur:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@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{z-index:1;margin-left:auto;margin-right:auto;display:block;position:relative}.swiper{z-index:1;margin-left:auto;margin-right:auto;padding:0;list-style:none;display:block;position:relative;overflow:hidden}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{z-index:1;width:100%;height:100%;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box;display:flex;position:relative}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate(0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;transition-property:transform;display:block;position:relative}.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{backface-visibility:hidden;transform:translateZ(0)}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-slide,.swiper-3d .swiper-cube-shadow{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{scrollbar-width:none;-ms-overflow-style:none;overflow:auto}.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-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-slide-shadow-bottom{pointer-events:none;z-index:10;width:100%;height:100%;position:absolute;top:0;left:0}.swiper-3d .swiper-slide-shadow{background:#00000026}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(270deg,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(90deg,#00000080,#0000)}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(#0000,#00000080)}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(#00000080,#0000)}.swiper-lazy-preloader{z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-top-color:#0000;border-radius:50%;width:42px;height:42px;margin-top:-21px;margin-left:-21px;position:absolute;top:50%;left:50%}.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader,.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader{animation:1s linear infinite swiper-preloader-spin}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper:after{content:"";pointer-events:none;position:absolute;top:0;left:0}.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-prev,.swiper-button-next{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;color:var(--swiper-navigation-color,var(--swiper-theme-color));justify-content:center;align-items:center;display:flex;position:absolute}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev.swiper-button-hidden,.swiper-button-next.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-prev,.swiper-navigation-disabled .swiper-button-next{display:none!important}.swiper-button-prev svg,.swiper-button-next svg{object-fit:contain;transform-origin:50%;width:100%;height:100%}.swiper-rtl .swiper-button-prev svg,.swiper-rtl .swiper-button-next svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-lock{display:none}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);letter-spacing:0;font-variant:initial;line-height:1;text-transform:none!important}.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{text-align:center;z-index:10;transition:opacity .3s;position:absolute;transform:translate(0)}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);width:100%;left:0}.swiper-pagination-bullets-dynamic{font-size:0;overflow:hidden}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{position:relative;transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.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));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);display:inline-block}button.swiper-pagination-bullet{box-shadow:none;appearance:none;border:none;margin:0;padding:0}.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-vertical>.swiper-pagination-bullets,.swiper-pagination-vertical.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translateY(-50%)}.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{width:8px;top:50%;transform:translateY(-50%)}.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:transform .2s,top .2s;display:inline-block}.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{white-space:nowrap;left:50%;transform:translate(-50%)}.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:transform .2s,left .2s}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:transform .2s,right .2s}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,#00000040);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));transform-origin:0 0;width:100%;height:100%;position:absolute;top:0;left:0;transform:scale(0)}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:100% 0}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);top:0;left:0}.swiper-vertical>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite{width:var(--swiper-pagination-progressbar-size,4px);height:100%;top:0;left:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);touch-action:none;background:var(--swiper-scrollbar-bg-color,#0000001a);position:relative}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{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%));position:absolute}.swiper-vertical>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-vertical{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%));position:absolute}.swiper-scrollbar-drag{background:var(--swiper-scrollbar-drag-bg-color,#00000080);border-radius:var(--swiper-scrollbar-border-radius,10px);width:100%;height:100%;position:relative;top:0;left:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{text-align:center;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.swiper-zoom-container>img,.swiper-zoom-container>svg,.swiper-zoom-container>canvas{object-fit:contain;max-width:100%;max-height:100%}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{pointer-events:none;opacity:0;z-index:-1000;position:absolute;top:0;left:0}.swiper-free-mode>.swiper-wrapper{margin:0 auto;transition-timing-function:ease-out}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-flow:column wrap}.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,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;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{opacity:.6;z-index:0;width:100%;height:100%;position:absolute;bottom:0;left:0}.swiper-cube .swiper-cube-shadow:before{content:"";filter:blur(50px);background:#000;position:absolute;inset:0}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top,.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{z-index:0;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;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-top,.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{z-index:0;backface-visibility:hidden}.swiper-creative .swiper-slide{backface-visibility:hidden;transition-property:transform,opacity,height;overflow:hidden}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:bottom;backface-visibility:hidden;overflow:hidden}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-black:#000;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--text-8xl:6rem;--text-8xl--line-height:1;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-black:900;--tracking-tight:-.025em;--tracking-wide:.025em;--tracking-widest:.1em;--leading-relaxed:1.625;--ease-in-out:cubic-bezier(.4, 0, .2, 1);--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--aspect-video:16 / 9;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--font-display:"Montserrat", ui-sans-serif, system-ui, sans-serif;--color-background:var(--background);--color-foreground:var(--foreground);--color-border:var(--border)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring:where(:not(iframe)){outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}*{border-color:var(--color-border)}body{background-color:var(--color-background);color:var(--color-foreground)}}@layer components;@layer utilities{.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:0}.inset-x-0{inset-inline:0}.inset-y-0{inset-block:0}.-top-12{top:calc(var(--spacing) * -12)}.top-0{top:0}.top-1\.5{top:calc(var(--spacing) * 1.5)}.top-1\/2{top:50%}.top-3\.5{top:calc(var(--spacing) * 3.5)}.top-4{top:calc(var(--spacing) * 4)}.top-\[1px\]{top:1px}.top-\[50\%\]{top:50%}.top-\[60\%\]{top:60%}.top-full{top:100%}.-right-12{right:calc(var(--spacing) * -12)}.right-0{right:0}.right-1{right:var(--spacing)}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-4{right:calc(var(--spacing) * 4)}.-bottom-12{bottom:calc(var(--spacing) * -12)}.bottom-0{bottom:0}.-left-12{left:calc(var(--spacing) * -12)}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.left-\[50\%\]{left:50%}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.z-\[1\]{z-index:1}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.-mx-1{margin-inline:calc(var(--spacing) * -1)}.mx-2{margin-inline:calc(var(--spacing) * 2)}.mx-3\.5{margin-inline:calc(var(--spacing) * 3.5)}.mx-auto{margin-inline:auto}.my-0\.5{margin-block:calc(var(--spacing) * .5)}.my-1{margin-block:var(--spacing)}.-mt-4{margin-top:calc(var(--spacing) * -4)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-9{margin-top:calc(var(--spacing) * 9)}.mt-24{margin-top:calc(var(--spacing) * 24)}.mt-auto{margin-top:auto}.mr-2{margin-right:calc(var(--spacing) * 2)}.mb-1{margin-bottom:var(--spacing)}.-ml-4{margin-left:calc(var(--spacing) * -4)}.ml-1{margin-left:var(--spacing)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.table{display:table}.aspect-square{aspect-ratio:1}.aspect-video{aspect-ratio:var(--aspect-video)}.size-\(--cell-size\){width:var(--cell-size);height:var(--cell-size)}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-5{width:calc(var(--spacing) * 5);height:calc(var(--spacing) * 5)}.h-\(--cell-size\){height:var(--cell-size)}.h-1\.5{height:calc(var(--spacing) * 1.5)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-12{height:calc(var(--spacing) * 12)}.h-\[1px\]{height:1px}.h-\[var\(--radix-navigation-menu-viewport-height\)\]{height:var(--radix-navigation-menu-viewport-height)}.h-\[var\(--radix-select-trigger-height\)\]{height:var(--radix-select-trigger-height)}.h-auto{height:auto}.h-full{height:100%}.h-px{height:1px}.h-svh{height:100svh}.max-h-\(--radix-context-menu-content-available-height\){max-height:var(--radix-context-menu-content-available-height)}.max-h-\(--radix-select-content-available-height\){max-height:var(--radix-select-content-available-height)}.max-h-\[300px\]{max-height:300px}.max-h-\[var\(--radix-dropdown-menu-content-available-height\)\]{max-height:var(--radix-dropdown-menu-content-available-height)}.min-h-0{min-height:0}.min-h-\[60px\]{min-height:60px}.min-h-screen{min-height:100vh}.min-h-svh{min-height:100svh}.w-\(--cell-size\){width:var(--cell-size)}.w-\(--sidebar-width\){width:var(--sidebar-width)}.w-0{width:0}.w-1{width:var(--spacing)}.w-2{width:calc(var(--spacing) * 2)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-3\/4{width:75%}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-64{width:calc(var(--spacing) * 64)}.w-72{width:calc(var(--spacing) * 72)}.w-\[1px\]{width:1px}.w-\[100px\]{width:100px}.w-\[calc\(100\%-60px\)\]{width:calc(100% - 60px)}.w-auto{width:auto}.w-fit{width:fit-content}.w-full{width:100%}.w-max{width:max-content}.w-px{width:1px}.max-w-\(--skeleton-width\){max-width:var(--skeleton-width)}.max-w-\[460px\]{max-width:460px}.max-w-\[1600px\]{max-width:1600px}.max-w-lg{max-width:var(--container-lg)}.max-w-max{max-width:max-content}.max-w-md{max-width:var(--container-md)}.max-w-xl{max-width:var(--container-xl)}.min-w-\(--cell-size\){min-width:var(--cell-size)}.min-w-0{min-width:0}.min-w-5{min-width:calc(var(--spacing) * 5)}.min-w-8{min-width:calc(var(--spacing) * 8)}.min-w-9{min-width:calc(var(--spacing) * 9)}.min-w-10{min-width:calc(var(--spacing) * 10)}.min-w-\[8rem\]{min-width:8rem}.min-w-\[12rem\]{min-width:12rem}.min-w-\[var\(--radix-select-trigger-width\)\]{min-width:var(--radix-select-trigger-width)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.grow-0{flex-grow:0}.basis-full{flex-basis:100%}.caption-bottom{caption-side:bottom}.border-collapse{border-collapse:collapse}.origin-\(--radix-context-menu-content-transform-origin\){transform-origin:var(--radix-context-menu-content-transform-origin)}.origin-\(--radix-dropdown-menu-content-transform-origin\){transform-origin:var(--radix-dropdown-menu-content-transform-origin)}.origin-\(--radix-hover-card-content-transform-origin\){transform-origin:var(--radix-hover-card-content-transform-origin)}.origin-\(--radix-menubar-content-transform-origin\){transform-origin:var(--radix-menubar-content-transform-origin)}.origin-\(--radix-popover-content-transform-origin\){transform-origin:var(--radix-popover-content-transform-origin)}.origin-\(--radix-select-content-transform-origin\){transform-origin:var(--radix-select-content-transform-origin)}.origin-\(--radix-tooltip-content-transform-origin\){transform-origin:var(--radix-tooltip-content-transform-origin)}.-translate-x-1\/2{--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-x-px{--tw-translate-x:-1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-\[-50\%\]{--tw-translate-x:-50%;translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-x-px{--tw-translate-x:1px;translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.translate-y-\[-50\%\]{--tw-translate-y:-50%;translate:var(--tw-translate-x) var(--tw-translate-y)}.rotate-45{rotate:45deg}.rotate-90{rotate:90deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-caret-blink{animation:1.25s ease-out infinite caret-blink}.animate-in{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.animate-pulse{animation:var(--animate-pulse)}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.list-none{list-style-type:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.place-content-center{place-content:center}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-12{gap:calc(var(--spacing) * 12)}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-6{column-gap:calc(var(--spacing) * 6)}:where(.space-x-1>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(var(--spacing) * var(--tw-space-x-reverse));margin-inline-end:calc(var(--spacing) * calc(1 - var(--tw-space-x-reverse)))}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.hydro-panel{background-color:var(--hydro-card);border:1px solid var(--hydro-line);border-radius:2rem;transition:border-color .25s,transform .25s}.hydro-panel:hover{border-color:var(--hydro-accent)}@supports (color:color-mix(in lab, red, red)){.hydro-panel:hover{border-color:color-mix(in oklab, var(--hydro-accent) 55%, transparent)}}.rounded-\[2\.5rem\]{border-radius:2.5rem}.rounded-\[2px\]{border-radius:2px}.rounded-\[inherit\]{border-radius:inherit}.rounded-full{border-radius:2147483647px}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-none{border-radius:0}.rounded-sm{border-radius:calc(var(--radius) - 4px)}.rounded-xl{border-radius:calc(var(--radius) + 4px)}.rounded-t-\[10px\]{border-top-left-radius:10px;border-top-right-radius:10px}.rounded-l-md{border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.rounded-tl-sm{border-top-left-radius:calc(var(--radius) - 4px)}.rounded-r-md{border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-\[1\.5px\]{border-style:var(--tw-border-style);border-width:1.5px}.border-y{border-block-style:var(--tw-border-style);border-block-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-\(--color-border\){border-color:var(--color-border)}.border-border\/50{border-color:var(--border)}@supports (color:color-mix(in lab, red, red)){.border-border\/50{border-color:color-mix(in oklab, var(--border) 50%, transparent)}}.border-destructive\/50{border-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.border-destructive\/50{border-color:color-mix(in oklab, var(--destructive) 50%, transparent)}}.border-hydro-line{border-color:var(--hydro-line)}.border-input{border-color:var(--input)}.border-primary,.border-primary\/50{border-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.border-primary\/50{border-color:color-mix(in oklab, var(--primary) 50%, transparent)}}.border-sidebar-border{border-color:var(--sidebar-border)}.border-transparent{border-color:#0000}.border-t-transparent{border-top-color:#0000}.border-l-transparent{border-left-color:#0000}.bg-\(--color-bg\){background-color:var(--color-bg)}.bg-accent{background-color:var(--accent)}.bg-background{background-color:var(--background)}.bg-black\/80{background-color:#000c}@supports (color:color-mix(in lab, red, red)){.bg-black\/80{background-color:color-mix(in oklab, var(--color-black) 80%, transparent)}}.bg-border{background-color:var(--border)}.bg-card{background-color:var(--card)}.bg-destructive{background-color:var(--destructive)}.bg-foreground{background-color:var(--foreground)}.bg-hydro-accent{background-color:var(--hydro-accent)}.bg-muted,.bg-muted\/50{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.bg-muted\/50{background-color:color-mix(in oklab, var(--muted) 50%, transparent)}}.bg-popover{background-color:var(--popover)}.bg-primary,.bg-primary\/10{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/10{background-color:color-mix(in oklab, var(--primary) 10%, transparent)}}.bg-primary\/20{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.bg-primary\/20{background-color:color-mix(in oklab, var(--primary) 20%, transparent)}}.bg-secondary{background-color:var(--secondary)}.bg-sidebar{background-color:var(--sidebar)}.bg-sidebar-border{background-color:var(--sidebar-border)}.bg-transparent{background-color:#0000}.fill-current{fill:currentColor}.fill-primary{fill:var(--primary)}.p-0{padding:0}.p-1{padding:var(--spacing)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.p-10{padding:calc(var(--spacing) * 10)}.p-\[1px\]{padding:1px}.px-\(--cell-size\){padding-inline:var(--cell-size)}.px-0{padding-inline:0}.px-1{padding-inline:var(--spacing)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-8{padding-inline:calc(var(--spacing) * 8)}.px-9{padding-inline:calc(var(--spacing) * 9)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-20{padding-block:calc(var(--spacing) * 20)}.pt-0{padding-top:0}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pr-1{padding-right:var(--spacing)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-2\.5{padding-right:calc(var(--spacing) * 2.5)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pr-12{padding-right:calc(var(--spacing) * 12)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-2\.5{padding-left:calc(var(--spacing) * 2.5)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.align-middle{vertical-align:middle}.hydro-eyebrow{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.32em;color:var(--hydro-accent);font-size:.6875rem;font-weight:700}.hydro-heading{font-family:var(--font-display);text-transform:uppercase;letter-spacing:-.02em;color:var(--hydro-fg);font-weight:900;line-height:.92}.font-display{font-family:Montserrat,ui-sans-serif,system-ui,sans-serif}.font-mono{font-family:var(--font-mono)}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[0\.8rem\]{font-size:.8rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[140px\]{font-size:140px}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-black{--tw-font-weight:var(--font-weight-black);font-weight:var(--font-weight-black)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[-0\.07em\]{--tw-tracking:-.07em;letter-spacing:-.07em}.tracking-\[0\.2em\]{--tw-tracking:.2em;letter-spacing:.2em}.tracking-\[0\.12em\]{--tw-tracking:.12em;letter-spacing:.12em}.tracking-\[0\.18em\]{--tw-tracking:.18em;letter-spacing:.18em}.tracking-\[0\.25em\]{--tw-tracking:.25em;letter-spacing:.25em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-widest{--tw-tracking:var(--tracking-widest);letter-spacing:var(--tracking-widest)}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.text-accent-foreground{color:var(--accent-foreground)}.text-card-foreground{color:var(--card-foreground)}.text-current{color:currentColor}.text-destructive{color:var(--destructive)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground{color:var(--foreground)}.text-hydro-accent{color:var(--hydro-accent)}.text-hydro-fg,.text-hydro-fg\/10{color:var(--hydro-fg)}@supports (color:color-mix(in lab, red, red)){.text-hydro-fg\/10{color:color-mix(in oklab, var(--hydro-fg) 10%, transparent)}}.text-hydro-ink{color:var(--hydro-ink)}.text-hydro-muted{color:var(--hydro-muted)}.text-muted-foreground{color:var(--muted-foreground)}.text-popover-foreground{color:var(--popover-foreground)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-sidebar-foreground,.text-sidebar-foreground\/70{color:var(--sidebar-foreground)}@supports (color:color-mix(in lab, red, red)){.text-sidebar-foreground\/70{color:color-mix(in oklab, var(--sidebar-foreground) 70%, transparent)}}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.underline-offset-4{text-underline-offset:4px}.accent-\[var\(--hydro-accent\)\]{accent-color:var(--hydro-accent)}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-\[0_0_0_1px_var\(--sidebar-border\)\]{--tw-shadow:0 0 0 1px var(--tw-shadow-color,var(--sidebar-border));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-ring{--tw-ring-color:var(--ring)}.ring-sidebar-ring{--tw-ring-color:var(--sidebar-ring)}.ring-offset-background{--tw-ring-offset-color:var(--background)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[left\,right\,width\]{transition-property:left,right,width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[margin\,opacity\]{transition-property:margin,opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[width\,height\,padding\]{transition-property:width,height,padding;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[width\]{transition-property:width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.duration-1000{--tw-duration:1s;transition-duration:1s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.ease-linear{--tw-ease:linear;transition-timing-function:linear}.fade-in-0{--tw-enter-opacity:0}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.zoom-in-95{--tw-enter-scale:.95}.\[--cell-size\:2rem\]{--cell-size:2rem}.group-focus-within\/menu-item\:opacity-100:is(:where(.group\/menu-item):focus-within *){opacity:1}@media (hover:hover){.group-hover\/menu-item\:opacity-100:is(:where(.group\/menu-item):hover *){opacity:1}}.group-has-\[\[data-sidebar\=menu-action\]\]\/menu-item\:pr-8:is(:where(.group\/menu-item):has([data-sidebar=menu-action]) *){padding-right:calc(var(--spacing) * 8)}.group-data-\[collapsible\=icon\]\:-mt-8:is(:where(.group)[data-collapsible=icon] *){margin-top:calc(var(--spacing) * -8)}.group-data-\[collapsible\=icon\]\:hidden:is(:where(.group)[data-collapsible=icon] *){display:none}.group-data-\[collapsible\=icon\]\:\!size-8:is(:where(.group)[data-collapsible=icon] *){width:calc(var(--spacing) * 8)!important;height:calc(var(--spacing) * 8)!important}.group-data-\[collapsible\=icon\]\:w-\(--sidebar-width-icon\):is(:where(.group)[data-collapsible=icon] *){width:var(--sidebar-width-icon)}.group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)_\+_theme\(spacing\.4\)\)\]:is(:where(.group)[data-collapsible=icon] *){width:calc(var(--sidebar-width-icon) + 1rem)}.group-data-\[collapsible\=icon\]\:w-\[calc\(var\(--sidebar-width-icon\)_\+_theme\(spacing\.4\)_\+2px\)\]:is(:where(.group)[data-collapsible=icon] *){width:calc(var(--sidebar-width-icon) + 1rem + 2px)}.group-data-\[collapsible\=icon\]\:overflow-hidden:is(:where(.group)[data-collapsible=icon] *){overflow:hidden}.group-data-\[collapsible\=icon\]\:\!p-0:is(:where(.group)[data-collapsible=icon] *){padding:0!important}.group-data-\[collapsible\=icon\]\:\!p-2:is(:where(.group)[data-collapsible=icon] *){padding:calc(var(--spacing) * 2)!important}.group-data-\[collapsible\=icon\]\:opacity-0:is(:where(.group)[data-collapsible=icon] *){opacity:0}.group-data-\[collapsible\=offcanvas\]\:right-\[calc\(var\(--sidebar-width\)\*-1\)\]:is(:where(.group)[data-collapsible=offcanvas] *){right:calc(var(--sidebar-width) * -1)}.group-data-\[collapsible\=offcanvas\]\:left-\[calc\(var\(--sidebar-width\)\*-1\)\]:is(:where(.group)[data-collapsible=offcanvas] *){left:calc(var(--sidebar-width) * -1)}.group-data-\[collapsible\=offcanvas\]\:w-0:is(:where(.group)[data-collapsible=offcanvas] *){width:0}.group-data-\[collapsible\=offcanvas\]\:translate-x-0:is(:where(.group)[data-collapsible=offcanvas] *){--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.group-data-\[focused\=true\]\/day\:relative:is(:where(.group\/day)[data-focused=true] *){position:relative}.group-data-\[focused\=true\]\/day\:z-10:is(:where(.group\/day)[data-focused=true] *){z-index:10}.group-data-\[focused\=true\]\/day\:border-ring:is(:where(.group\/day)[data-focused=true] *){border-color:var(--ring)}.group-data-\[focused\=true\]\/day\:ring-\[3px\]:is(:where(.group\/day)[data-focused=true] *){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.group-data-\[focused\=true\]\/day\:ring-ring\/50:is(:where(.group\/day)[data-focused=true] *){--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.group-data-\[focused\=true\]\/day\:ring-ring\/50:is(:where(.group\/day)[data-focused=true] *){--tw-ring-color:color-mix(in oklab, var(--ring) 50%, transparent)}}.group-data-\[side\=left\]\:-right-4:is(:where(.group)[data-side=left] *){right:calc(var(--spacing) * -4)}.group-data-\[side\=left\]\:border-r:is(:where(.group)[data-side=left] *){border-right-style:var(--tw-border-style);border-right-width:1px}.group-data-\[side\=right\]\:left-0:is(:where(.group)[data-side=right] *){left:0}.group-data-\[side\=right\]\:rotate-180:is(:where(.group)[data-side=right] *){rotate:180deg}.group-data-\[side\=right\]\:border-l:is(:where(.group)[data-side=right] *){border-left-style:var(--tw-border-style);border-left-width:1px}.group-data-\[state\=open\]\:rotate-180:is(:where(.group)[data-state=open] *){rotate:180deg}.group-data-\[variant\=floating\]\:rounded-lg:is(:where(.group)[data-variant=floating] *){border-radius:var(--radius)}.group-data-\[variant\=floating\]\:border:is(:where(.group)[data-variant=floating] *){border-style:var(--tw-border-style);border-width:1px}.group-data-\[variant\=floating\]\:border-sidebar-border:is(:where(.group)[data-variant=floating] *){border-color:var(--sidebar-border)}.group-data-\[variant\=floating\]\:shadow:is(:where(.group)[data-variant=floating] *){--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.group-\[\.toast\]\:bg-muted:is(:where(.group).toast *){background-color:var(--muted)}.group-\[\.toast\]\:bg-primary:is(:where(.group).toast *){background-color:var(--primary)}.group-\[\.toast\]\:text-muted-foreground:is(:where(.group).toast *){color:var(--muted-foreground)}.group-\[\.toast\]\:text-primary-foreground:is(:where(.group).toast *){color:var(--primary-foreground)}.group-\[\.toaster\]\:border-border:is(:where(.group).toaster *){border-color:var(--border)}.group-\[\.toaster\]\:bg-background:is(:where(.group).toaster *){background-color:var(--background)}.group-\[\.toaster\]\:text-foreground:is(:where(.group).toaster *){color:var(--foreground)}.group-\[\.toaster\]\:shadow-lg:is(:where(.group).toaster *){--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}@media (hover:hover){.peer-hover\/menu-button\:text-sidebar-accent-foreground:is(:where(.peer\/menu-button):hover~*){color:var(--sidebar-accent-foreground)}}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-70:is(:where(.peer):disabled~*){opacity:.7}.peer-data-\[active\=true\]\/menu-button\:text-sidebar-accent-foreground:is(:where(.peer\/menu-button)[data-active=true]~*){color:var(--sidebar-accent-foreground)}.peer-data-\[size\=default\]\/menu-button\:top-1\.5:is(:where(.peer\/menu-button)[data-size=default]~*){top:calc(var(--spacing) * 1.5)}.peer-data-\[size\=lg\]\/menu-button\:top-2\.5:is(:where(.peer\/menu-button)[data-size=lg]~*){top:calc(var(--spacing) * 2.5)}.peer-data-\[size\=sm\]\/menu-button\:top-1:is(:where(.peer\/menu-button)[data-size=sm]~*){top:var(--spacing)}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-medium::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.file\:text-foreground::file-selector-button{color:var(--foreground)}.placeholder\:text-hydro-muted::placeholder{color:var(--hydro-muted)}.placeholder\:text-muted-foreground::placeholder{color:var(--muted-foreground)}.after\:absolute:after{content:var(--tw-content);position:absolute}.after\:-inset-2:after{content:var(--tw-content);inset:calc(var(--spacing) * -2)}.after\:inset-y-0:after{content:var(--tw-content);inset-block:0}.after\:left-1\/2:after{content:var(--tw-content);left:50%}.after\:w-1:after{content:var(--tw-content);width:var(--spacing)}.after\:w-\[2px\]:after{content:var(--tw-content);width:2px}.after\:-translate-x-1\/2:after{content:var(--tw-content);--tw-translate-x:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.group-data-\[collapsible\=offcanvas\]\:after\:left-full:is(:where(.group)[data-collapsible=offcanvas] *):after{content:var(--tw-content);left:100%}.first\:rounded-l-md:first-child{border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.first\:border-l:first-child{border-left-style:var(--tw-border-style);border-left-width:1px}.last\:rounded-r-md:last-child{border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}@media (hover:hover){.hover\:border-hydro-accent:hover{border-color:var(--hydro-accent)}.hover\:bg-accent:hover{background-color:var(--accent)}.hover\:bg-destructive\/80:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/80:hover{background-color:color-mix(in oklab, var(--destructive) 80%, transparent)}}.hover\:bg-destructive\/90:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--destructive) 90%, transparent)}}.hover\:bg-muted:hover,.hover\:bg-muted\/50:hover{background-color:var(--muted)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-muted\/50:hover{background-color:color-mix(in oklab, var(--muted) 50%, transparent)}}.hover\:bg-primary\/80:hover{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/80:hover{background-color:color-mix(in oklab, var(--primary) 80%, transparent)}}.hover\:bg-primary\/90:hover{background-color:var(--primary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--primary) 90%, transparent)}}.hover\:bg-secondary\/80:hover{background-color:var(--secondary)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab, var(--secondary) 80%, transparent)}}.hover\:bg-sidebar-accent:hover{background-color:var(--sidebar-accent)}.hover\:bg-transparent:hover{background-color:#0000}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:text-foreground:hover{color:var(--foreground)}.hover\:text-hydro-accent:hover{color:var(--hydro-accent)}.hover\:text-hydro-fg:hover{color:var(--hydro-fg)}.hover\:text-muted-foreground:hover{color:var(--muted-foreground)}.hover\:text-sidebar-accent-foreground:hover{color:var(--sidebar-accent-foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-100:hover{opacity:1}.hover\:shadow-\[0_0_0_1px_var\(--sidebar-accent\)\]:hover{--tw-shadow:0 0 0 1px var(--tw-shadow-color,var(--sidebar-accent));box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.hover\:outline:hover,.hover\:outline-1:hover{outline-style:var(--tw-outline-style);outline-width:1px}.hover\:outline-hydro-accent:hover{outline-color:var(--hydro-accent)}.group-data-\[collapsible\=offcanvas\]\:hover\:bg-sidebar:is(:where(.group)[data-collapsible=offcanvas] *):hover{background-color:var(--sidebar)}.hover\:after\:bg-sidebar-border:hover:after{content:var(--tw-content);background-color:var(--sidebar-border)}}.focus\:border-hydro-accent:focus{border-color:var(--hydro-accent)}.focus\:bg-accent:focus{background-color:var(--accent)}.focus\:text-accent-foreground:focus{color:var(--accent-foreground)}.focus\:ring-1:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus\:ring-ring:focus{--tw-ring-color:var(--ring)}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-ring:focus-visible{--tw-ring-color:var(--ring)}.focus-visible\:ring-sidebar-ring:focus-visible{--tw-ring-color:var(--sidebar-ring)}.focus-visible\:ring-offset-1:focus-visible{--tw-ring-offset-width:1px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:ring-offset-background:focus-visible{--tw-ring-offset-color:var(--background)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.active\:bg-sidebar-accent:active{background-color:var(--sidebar-accent)}.active\:text-sidebar-accent-foreground:active{color:var(--sidebar-accent-foreground)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.has-focus\:border-ring:has(:focus){border-color:var(--ring)}.has-focus\:ring-\[3px\]:has(:focus){--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.has-focus\:ring-ring\/50:has(:focus){--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab, red, red)){.has-focus\:ring-ring\/50:has(:focus){--tw-ring-color:color-mix(in oklab, var(--ring) 50%, transparent)}}.has-\[\:disabled\]\:opacity-50:has(:disabled){opacity:.5}.has-\[\[data-variant\=inset\]\]\:bg-sidebar:has([data-variant=inset]){background-color:var(--sidebar)}.aria-disabled\:pointer-events-none[aria-disabled=true]{pointer-events:none}.aria-disabled\:opacity-50[aria-disabled=true]{opacity:.5}.aria-selected\:text-muted-foreground[aria-selected=true]{color:var(--muted-foreground)}.data-\[active\=true\]\:bg-sidebar-accent[data-active=true]{background-color:var(--sidebar-accent)}.data-\[active\=true\]\:font-medium[data-active=true]{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.data-\[active\=true\]\:text-sidebar-accent-foreground[data-active=true]{color:var(--sidebar-accent-foreground)}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[disabled\=true\]\:pointer-events-none[data-disabled=true]{pointer-events:none}.data-\[disabled\=true\]\:opacity-50[data-disabled=true]{opacity:.5}.data-\[motion\=from-end\]\:slide-in-from-right-52[data-motion=from-end]{--tw-enter-translate-x:calc(52*var(--spacing))}.data-\[motion\=from-start\]\:slide-in-from-left-52[data-motion=from-start]{--tw-enter-translate-x:calc(52*var(--spacing)*-1)}.data-\[motion\=to-end\]\:slide-out-to-right-52[data-motion=to-end]{--tw-exit-translate-x:calc(52*var(--spacing))}.data-\[motion\=to-start\]\:slide-out-to-left-52[data-motion=to-start]{--tw-exit-translate-x:calc(52*var(--spacing)*-1)}.data-\[motion\^\=from-\]\:animate-in[data-motion^=from-]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[motion\^\=from-\]\:fade-in[data-motion^=from-]{--tw-enter-opacity:0}.data-\[motion\^\=to-\]\:animate-out[data-motion^=to-]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[motion\^\=to-\]\:fade-out[data-motion^=to-]{--tw-exit-opacity:0}.data-\[panel-group-direction\=vertical\]\:h-px[data-panel-group-direction=vertical]{height:1px}.data-\[panel-group-direction\=vertical\]\:w-full[data-panel-group-direction=vertical]{width:100%}.data-\[panel-group-direction\=vertical\]\:flex-col[data-panel-group-direction=vertical]{flex-direction:column}.data-\[panel-group-direction\=vertical\]\:after\:left-0[data-panel-group-direction=vertical]:after{content:var(--tw-content);left:0}.data-\[panel-group-direction\=vertical\]\:after\:h-1[data-panel-group-direction=vertical]:after{content:var(--tw-content);height:var(--spacing)}.data-\[panel-group-direction\=vertical\]\:after\:w-full[data-panel-group-direction=vertical]:after{content:var(--tw-content);width:100%}.data-\[panel-group-direction\=vertical\]\:after\:translate-x-0[data-panel-group-direction=vertical]:after{content:var(--tw-content);--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[panel-group-direction\=vertical\]\:after\:-translate-y-1\/2[data-panel-group-direction=vertical]:after{content:var(--tw-content);--tw-translate-y:calc(calc(1 / 2 * 100%) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[placeholder\]\:text-muted-foreground[data-placeholder]{color:var(--muted-foreground)}.data-\[range-end\=true\]\:rounded-md[data-range-end=true]{border-radius:calc(var(--radius) - 2px)}.data-\[range-end\=true\]\:bg-primary[data-range-end=true]{background-color:var(--primary)}.data-\[range-end\=true\]\:text-primary-foreground[data-range-end=true]{color:var(--primary-foreground)}.data-\[range-middle\=true\]\:rounded-none[data-range-middle=true]{border-radius:0}.data-\[range-middle\=true\]\:bg-accent[data-range-middle=true]{background-color:var(--accent)}.data-\[range-middle\=true\]\:text-accent-foreground[data-range-middle=true]{color:var(--accent-foreground)}.data-\[range-start\=true\]\:rounded-md[data-range-start=true]{border-radius:calc(var(--radius) - 2px)}.data-\[range-start\=true\]\:bg-primary[data-range-start=true]{background-color:var(--primary)}.data-\[range-start\=true\]\:text-primary-foreground[data-range-start=true]{color:var(--primary-foreground)}.data-\[selected-single\=true\]\:bg-primary[data-selected-single=true]{background-color:var(--primary)}.data-\[selected-single\=true\]\:text-primary-foreground[data-selected-single=true]{color:var(--primary-foreground)}.data-\[selected\=true\]\:rounded-none[data-selected=true]{border-radius:0}.data-\[selected\=true\]\:bg-accent[data-selected=true]{background-color:var(--accent)}.data-\[selected\=true\]\:text-accent-foreground[data-selected=true]{color:var(--accent-foreground)}.data-\[side\=bottom\]\:translate-y-1[data-side=bottom]{--tw-translate-y:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:calc(2*var(--spacing)*-1)}.data-\[side\=left\]\:-translate-x-1[data-side=left]{--tw-translate-x:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:calc(2*var(--spacing))}.data-\[side\=right\]\:translate-x-1[data-side=right]{--tw-translate-x:var(--spacing);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:calc(2*var(--spacing)*-1)}.data-\[side\=top\]\:-translate-y-1[data-side=top]{--tw-translate-y:calc(var(--spacing) * -1);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:calc(2*var(--spacing))}.data-\[state\=active\]\:bg-background[data-state=active]{background-color:var(--background)}.data-\[state\=active\]\:text-foreground[data-state=active]{color:var(--foreground)}.data-\[state\=active\]\:shadow[data-state=active]{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=checked\]\:translate-x-4[data-state=checked]{--tw-translate-x:calc(var(--spacing) * 4);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:var(--primary)}.data-\[state\=checked\]\:text-primary-foreground[data-state=checked]{color:var(--primary-foreground)}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up var(--tw-animation-duration,var(--tw-duration,.2s))var(--tw-ease,ease-out)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=closed\]\:animate-out[data-state=closed]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=closed\]\:duration-300[data-state=closed]{--tw-duration:.3s;transition-duration:.3s}.data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.data-\[state\=closed\]\:slide-out-to-bottom[data-state=closed]{--tw-exit-translate-y:100%}.data-\[state\=closed\]\:slide-out-to-left[data-state=closed]{--tw-exit-translate-x:-100%}.data-\[state\=closed\]\:slide-out-to-right[data-state=closed]{--tw-exit-translate-x:100%}.data-\[state\=closed\]\:slide-out-to-top[data-state=closed]{--tw-exit-translate-y:-100%}.data-\[state\=hidden\]\:animate-out[data-state=hidden]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=hidden\]\:fade-out[data-state=hidden]{--tw-exit-opacity:0}.data-\[state\=on\]\:bg-accent[data-state=on]{background-color:var(--accent)}.data-\[state\=on\]\:text-accent-foreground[data-state=on]{color:var(--accent-foreground)}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down var(--tw-animation-duration,var(--tw-duration,.2s))var(--tw-ease,ease-out)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=open\]\:animate-in[data-state=open]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=open\]\:bg-accent[data-state=open],.data-\[state\=open\]\:bg-accent\/50[data-state=open]{background-color:var(--accent)}@supports (color:color-mix(in lab, red, red)){.data-\[state\=open\]\:bg-accent\/50[data-state=open]{background-color:color-mix(in oklab, var(--accent) 50%, transparent)}}.data-\[state\=open\]\:bg-secondary[data-state=open]{background-color:var(--secondary)}.data-\[state\=open\]\:text-accent-foreground[data-state=open]{color:var(--accent-foreground)}.data-\[state\=open\]\:text-muted-foreground[data-state=open]{color:var(--muted-foreground)}.data-\[state\=open\]\:opacity-100[data-state=open]{opacity:1}.data-\[state\=open\]\:duration-500[data-state=open]{--tw-duration:.5s;transition-duration:.5s}.data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.data-\[state\=open\]\:zoom-in-90[data-state=open]{--tw-enter-scale:.9}.data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.data-\[state\=open\]\:slide-in-from-bottom[data-state=open]{--tw-enter-translate-y:100%}.data-\[state\=open\]\:slide-in-from-left[data-state=open]{--tw-enter-translate-x:-100%}.data-\[state\=open\]\:slide-in-from-right[data-state=open]{--tw-enter-translate-x:100%}.data-\[state\=open\]\:slide-in-from-top[data-state=open]{--tw-enter-translate-y:-100%}@media (hover:hover){.data-\[state\=open\]\:hover\:bg-accent[data-state=open]:hover{background-color:var(--accent)}.data-\[state\=open\]\:hover\:bg-sidebar-accent[data-state=open]:hover{background-color:var(--sidebar-accent)}.data-\[state\=open\]\:hover\:text-sidebar-accent-foreground[data-state=open]:hover{color:var(--sidebar-accent-foreground)}}.data-\[state\=open\]\:focus\:bg-accent[data-state=open]:focus{background-color:var(--accent)}.data-\[state\=selected\]\:bg-muted[data-state=selected]{background-color:var(--muted)}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-input[data-state=unchecked]{background-color:var(--input)}.data-\[state\=visible\]\:animate-in[data-state=visible]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=visible\]\:fade-in[data-state=visible]{--tw-enter-opacity:0}@media (width>=40rem){.sm\:mt-0{margin-top:0}.sm\:flex{display:flex}.sm\:max-w-sm{max-width:var(--container-sm)}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:justify-end{justify-content:flex-end}.sm\:gap-2\.5{gap:calc(var(--spacing) * 2.5)}:where(.sm\:space-x-2>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)))}.sm\:rounded-lg{border-radius:var(--radius)}.sm\:p-9{padding:calc(var(--spacing) * 9)}.sm\:text-left{text-align:left}}@media (width>=48rem){.md\:absolute{position:absolute}.md\:block{display:block}.md\:flex{display:flex}.md\:w-\[var\(--radix-navigation-menu-viewport-width\)\]{width:var(--radix-navigation-menu-viewport-width)}.md\:w-auto{width:auto}.md\:flex-row{flex-direction:row}.md\:px-10{padding-inline:calc(var(--spacing) * 10)}.md\:py-28{padding-block:calc(var(--spacing) * 28)}.md\:text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}.md\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.md\:text-\[220px\]{font-size:220px}.md\:opacity-0{opacity:0}.md\:peer-data-\[variant\=inset\]\:m-2:is(:where(.peer)[data-variant=inset]~*){margin:calc(var(--spacing) * 2)}.md\:peer-data-\[variant\=inset\]\:ml-0:is(:where(.peer)[data-variant=inset]~*){margin-left:0}.md\:peer-data-\[variant\=inset\]\:rounded-xl:is(:where(.peer)[data-variant=inset]~*){border-radius:calc(var(--radius) + 4px)}.md\:peer-data-\[variant\=inset\]\:shadow:is(:where(.peer)[data-variant=inset]~*){--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.md\:peer-data-\[state\=collapsed\]\:peer-data-\[variant\=inset\]\:ml-2:is(:where(.peer)[data-state=collapsed]~*):is(:where(.peer)[data-variant=inset]~*){margin-left:calc(var(--spacing) * 2)}}.after\:md\:hidden:after{content:var(--tw-content)}@media (width>=48rem){.after\:md\:hidden:after{display:none}}@media (width>=64rem){.lg\:aspect-auto{aspect-ratio:auto}.lg\:h-full{height:100%}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:items-center{align-items:center}.lg\:text-8xl{font-size:var(--text-8xl);line-height:var(--tw-leading,var(--text-8xl--line-height))}}.dark\:border-destructive:is(.dark *){border-color:var(--destructive)}.\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground .recharts-cartesian-axis-tick text{fill:var(--muted-foreground)}.\[\&_\.recharts-cartesian-grid_line\[stroke\=\'\#ccc\'\]\]\:stroke-border\/50 .recharts-cartesian-grid line[stroke=\#ccc]{stroke:var(--border)}@supports (color:color-mix(in lab, red, red)){.\[\&_\.recharts-cartesian-grid_line\[stroke\=\'\#ccc\'\]\]\:stroke-border\/50 .recharts-cartesian-grid line[stroke=\#ccc]{stroke:color-mix(in oklab, var(--border) 50%, transparent)}}.\[\&_\.recharts-curve\.recharts-tooltip-cursor\]\:stroke-border .recharts-curve.recharts-tooltip-cursor{stroke:var(--border)}.\[\&_\.recharts-dot\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-dot[stroke=\#fff]{stroke:#0000}.\[\&_\.recharts-layer\]\:outline-none .recharts-layer{--tw-outline-style:none;outline-style:none}.\[\&_\.recharts-polar-grid_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-polar-grid [stroke=\#ccc]{stroke:var(--border)}.\[\&_\.recharts-radial-bar-background-sector\]\:fill-muted .recharts-radial-bar-background-sector,.\[\&_\.recharts-rectangle\.recharts-tooltip-cursor\]\:fill-muted .recharts-rectangle.recharts-tooltip-cursor{fill:var(--muted)}.\[\&_\.recharts-reference-line_\[stroke\=\'\#ccc\'\]\]\:stroke-border .recharts-reference-line [stroke=\#ccc]{stroke:var(--border)}.\[\&_\.recharts-sector\]\:outline-none .recharts-sector{--tw-outline-style:none;outline-style:none}.\[\&_\.recharts-sector\[stroke\=\'\#fff\'\]\]\:stroke-transparent .recharts-sector[stroke=\#fff]{stroke:#0000}.\[\&_\.recharts-surface\]\:outline-none .recharts-surface{--tw-outline-style:none;outline-style:none}.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading]{padding-block:calc(var(--spacing) * 1.5)}.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading]{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading]{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.\[\&_\[cmdk-group-heading\]\]\:text-muted-foreground [cmdk-group-heading]{color:var(--muted-foreground)}.\[\&_\[cmdk-group\]\]\:px-2 [cmdk-group]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-group\]\:not\(\[hidden\]\)_\~\[cmdk-group\]\]\:pt-0 [cmdk-group]:not([hidden])~[cmdk-group]{padding-top:0}.\[\&_\[cmdk-input-wrapper\]_svg\]\:h-5 [cmdk-input-wrapper] svg{height:calc(var(--spacing) * 5)}.\[\&_\[cmdk-input-wrapper\]_svg\]\:w-5 [cmdk-input-wrapper] svg{width:calc(var(--spacing) * 5)}.\[\&_\[cmdk-input\]\]\:h-12 [cmdk-input]{height:calc(var(--spacing) * 12)}.\[\&_\[cmdk-item\]\]\:px-2 [cmdk-item]{padding-inline:calc(var(--spacing) * 2)}.\[\&_\[cmdk-item\]\]\:py-3 [cmdk-item]{padding-block:calc(var(--spacing) * 3)}.\[\&_\[cmdk-item\]_svg\]\:h-5 [cmdk-item] svg{height:calc(var(--spacing) * 5)}.\[\&_\[cmdk-item\]_svg\]\:w-5 [cmdk-item] svg{width:calc(var(--spacing) * 5)}.\[\&_p\]\:leading-relaxed p{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_tr\]\:border-b tr{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.\[\&_tr\:last-child\]\:border-0 tr:last-child{border-style:var(--tw-border-style);border-width:0}.\[\&\:first-child\[data-selected\=true\]_button\]\:rounded-l-md:first-child[data-selected=true] button{border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]){padding-right:0}:is(.rtl\:\*\*\:\[\.rdp-button\\_next\>svg\]\:rotate-180:where(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),[dir=rtl],[dir=rtl] *) *):is(.rdp-button_next>svg),:is(.rtl\:\*\*\:\[\.rdp-button\\_previous\>svg\]\:rotate-180:where(:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)),[dir=rtl],[dir=rtl] *) *):is(.rdp-button_previous>svg){rotate:180deg}.\[\&\:last-child\[data-selected\=true\]_button\]\:rounded-r-md:last-child[data-selected=true] button{border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.\[\&\>\[role\=checkbox\]\]\:translate-y-\[2px\]>[role=checkbox]{--tw-translate-y:2px;translate:var(--tw-translate-x) var(--tw-translate-y)}.\[\&\>button\]\:hidden>button{display:none}.\[\&\>span\]\:line-clamp-1>span{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.\[\&\>span\]\:text-xs>span{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.\[\&\>span\]\:opacity-70>span{opacity:.7}.\[\&\>span\:last-child\]\:truncate>span:last-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.\[\&\>svg\]\:absolute>svg{position:absolute}.\[\&\>svg\]\:top-4>svg{top:calc(var(--spacing) * 4)}.\[\&\>svg\]\:left-4>svg{left:calc(var(--spacing) * 4)}.\[\&\>svg\]\:size-3\.5>svg{width:calc(var(--spacing) * 3.5);height:calc(var(--spacing) * 3.5)}.\[\&\>svg\]\:size-4>svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&\>svg\]\:h-2\.5>svg{height:calc(var(--spacing) * 2.5)}.\[\&\>svg\]\:h-3>svg{height:calc(var(--spacing) * 3)}.\[\&\>svg\]\:h-3\.5>svg{height:calc(var(--spacing) * 3.5)}.\[\&\>svg\]\:w-2\.5>svg{width:calc(var(--spacing) * 2.5)}.\[\&\>svg\]\:w-3>svg{width:calc(var(--spacing) * 3)}.\[\&\>svg\]\:w-3\.5>svg{width:calc(var(--spacing) * 3.5)}.\[\&\>svg\]\:shrink-0>svg{flex-shrink:0}.\[\&\>svg\]\:text-destructive>svg{color:var(--destructive)}.\[\&\>svg\]\:text-foreground>svg{color:var(--foreground)}.\[\&\>svg\]\:text-muted-foreground>svg{color:var(--muted-foreground)}.\[\&\>svg\]\:text-sidebar-accent-foreground>svg{color:var(--sidebar-accent-foreground)}.\[\&\>svg\+div\]\:translate-y-\[-3px\]>svg+div{--tw-translate-y:-3px;translate:var(--tw-translate-x) var(--tw-translate-y)}.\[\&\>svg\~\*\]\:pl-7>svg~*{padding-left:calc(var(--spacing) * 7)}.\[\&\>tr\]\:last\:border-b-0>tr:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.\[\&\[data-panel-group-direction\=vertical\]\>div\]\:rotate-90[data-panel-group-direction=vertical]>div{rotate:90deg}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{rotate:180deg}[data-side=left] .\[\[data-side\=left\]_\&\]\:cursor-w-resize{cursor:w-resize}[data-side=left][data-collapsible=offcanvas] .\[\[data-side\=left\]\[data-collapsible\=offcanvas\]_\&\]\:-right-2{right:calc(var(--spacing) * -2)}[data-side=left][data-state=collapsed] .\[\[data-side\=left\]\[data-state\=collapsed\]_\&\]\:cursor-e-resize,[data-side=right] .\[\[data-side\=right\]_\&\]\:cursor-e-resize{cursor:e-resize}[data-side=right][data-collapsible=offcanvas] .\[\[data-side\=right\]\[data-collapsible\=offcanvas\]_\&\]\:-left-2{left:calc(var(--spacing) * -2)}[data-side=right][data-state=collapsed] .\[\[data-side\=right\]\[data-state\=collapsed\]_\&\]\:cursor-w-resize{cursor:w-resize}[data-slot=card-content] .\[\[data-slot\=card-content\]_\&\]\:bg-transparent,[data-slot=popover-content] .\[\[data-slot\=popover-content\]_\&\]\:bg-transparent{background-color:#0000}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-blur{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}:root{--hydro-bg:oklch(14.5% 0 0);--hydro-card:oklch(19.5% 0 0);--hydro-ink:oklch(11.5% 0 0);--hydro-fg:oklch(100% 0 0);--hydro-muted:oklch(72% .008 250);--hydro-line:oklch(100% 0 0/.14);--hydro-accent:oklch(77.1% .128 226.5);--radius:.625rem;--background:oklch(100% 0 0);--foreground:oklch(12.9% .042 264.695);--card:oklch(100% 0 0);--card-foreground:oklch(12.9% .042 264.695);--popover:oklch(100% 0 0);--popover-foreground:oklch(12.9% .042 264.695);--primary:oklch(20.8% .042 265.755);--primary-foreground:oklch(98.4% .003 247.858);--secondary:oklch(96.8% .007 247.896);--secondary-foreground:oklch(20.8% .042 265.755);--muted:oklch(96.8% .007 247.896);--muted-foreground:oklch(55.4% .046 257.417);--accent:oklch(96.8% .007 247.896);--accent-foreground:oklch(20.8% .042 265.755);--destructive:oklch(57.7% .245 27.325);--destructive-foreground:oklch(98.4% .003 247.858);--border:oklch(92.9% .013 255.508);--input:oklch(92.9% .013 255.508);--ring:oklch(70.4% .04 256.788);--chart-1:oklch(64.6% .222 41.116);--chart-2:oklch(60% .118 184.704);--chart-3:oklch(39.8% .07 227.392);--chart-4:oklch(82.8% .189 84.429);--chart-5:oklch(76.9% .188 70.08);--sidebar:oklch(98.4% .003 247.858);--sidebar-foreground:oklch(12.9% .042 264.695);--sidebar-primary:oklch(20.8% .042 265.755);--sidebar-primary-foreground:oklch(98.4% .003 247.858);--sidebar-accent:oklch(96.8% .007 247.896);--sidebar-accent-foreground:oklch(20.8% .042 265.755);--sidebar-border:oklch(92.9% .013 255.508);--sidebar-ring:oklch(70.4% .04 256.788)}.dark{--background:oklch(12.9% .042 264.695);--foreground:oklch(98.4% .003 247.858);--card:oklch(20.8% .042 265.755);--card-foreground:oklch(98.4% .003 247.858);--popover:oklch(20.8% .042 265.755);--popover-foreground:oklch(98.4% .003 247.858);--primary:oklch(92.9% .013 255.508);--primary-foreground:oklch(20.8% .042 265.755);--secondary:oklch(27.9% .041 260.031);--secondary-foreground:oklch(98.4% .003 247.858);--muted:oklch(27.9% .041 260.031);--muted-foreground:oklch(70.4% .04 256.788);--accent:oklch(27.9% .041 260.031);--accent-foreground:oklch(98.4% .003 247.858);--destructive:oklch(70.4% .191 22.216);--destructive-foreground:oklch(98.4% .003 247.858);--border:oklch(100% 0 0/.1);--input:oklch(100% 0 0/.15);--ring:oklch(55.1% .027 264.364);--chart-1:oklch(48.8% .243 264.376);--chart-2:oklch(69.6% .17 162.48);--chart-3:oklch(76.9% .188 70.08);--chart-4:oklch(62.7% .265 303.9);--chart-5:oklch(64.5% .246 16.439);--sidebar:oklch(20.8% .042 265.755);--sidebar-foreground:oklch(98.4% .003 247.858);--sidebar-primary:oklch(48.8% .243 264.376);--sidebar-primary-foreground:oklch(98.4% .003 247.858);--sidebar-accent:oklch(27.9% .041 260.031);--sidebar-accent-foreground:oklch(98.4% .003 247.858);--sidebar-border:oklch(100% 0 0/.1);--sidebar-ring:oklch(55.1% .027 264.364)}.hp-intro{--blue:#32c6f4;--container:1760px;color:#fff;font-family:var(--font-display);background:#1b1b1b}.hp-pre{z-index:90;background:#0d0d0d;place-items:center;transition:opacity .6s,visibility .6s;display:grid;position:fixed;inset:0}.hp-pre.is-done{opacity:0;visibility:hidden;pointer-events:none}.hp-pre__inner{flex-direction:column;align-items:center;gap:18px;width:280px;display:flex}.hp-pre__bar{background:#ffffff29;width:100%;height:2px}.hp-pre__bar i{background:var(--blue);height:100%;transition:width .2s ease-out;display:block}.hp-pre__pct{color:#fff9;letter-spacing:.28em;font-size:12px;font-weight:900}.hp-hero{background:#000;place-items:center;height:100vh;min-height:620px;display:grid;position:relative;overflow:hidden}.hp-hero video{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.hp-hero__overlay{background:linear-gradient(#0000008c 0%,#00000040 40%,#0d0d0df2 100%);position:absolute;inset:0}.hp-hero__content{z-index:2;text-align:center;padding:0 24px;position:relative}.hp-hero__eyebrow{color:var(--blue);letter-spacing:.32em;text-transform:uppercase;margin:0;font-size:12px;font-weight:800}.hp-hero__title{letter-spacing:-.04em;text-transform:uppercase;margin:14px 0 0;font-size:clamp(48px,11vw,180px);font-weight:900;line-height:.9}.hp-hero__descr{color:#ffffffb8;max-width:640px;margin:18px auto 0;font-size:clamp(14px,1.4vw,20px);line-height:1.45}.hp-hero__sound{z-index:3;color:#fff;cursor:pointer;background:#00000059;border:1px solid #ffffff59;border-radius:50%;place-items:center;width:48px;height:48px;display:grid;position:absolute;bottom:48px;right:40px}.hp-hero__scroll{z-index:3;color:#ffffffb3;cursor:pointer;background:0 0;border:0;flex-direction:column;align-items:center;gap:10px;display:flex;position:absolute;bottom:44px;left:50%;transform:translate(-50%)}.hp-hero__scroll span.track{background:#ffffff47;width:1px;height:54px;display:block;overflow:hidden}.hp-hero__scroll span.track i{background:var(--blue);width:100%;height:20px;animation:1.8s ease-in-out infinite hp-scroll;display:block}.hp-hero__scroll span.txt{letter-spacing:.28em;text-transform:uppercase;font-size:11px;font-weight:800}@keyframes hp-scroll{0%{transform:translateY(-100%)}to{transform:translateY(280%)}}.intro-screen{--intro-wrapper-w:min(calc(100% - 160px), 1760px);--intro-wrapper-left:calc((100% - var(--intro-wrapper-w)) / 2);--intro-col-w:calc((var(--intro-wrapper-w) - 50px) / 3);--intro-auto-left:calc(var(--intro-wrapper-left) + var(--intro-col-w) + 25px);--intro-heading-left:max(4.17%, calc((100% - 1760px) / 2));color:#fff;background:#1b1b1b;width:100%;height:100vh;min-height:720px;max-height:1080px;position:relative;overflow:hidden}.intro-screen__heading{z-index:3;top:22.78%;left:var(--intro-heading-left);max-width:calc((var(--intro-auto-left) - var(--intro-heading-left)) / .7444);position:absolute}.intro-screen__heading h1{letter-spacing:-.035em;text-transform:uppercase;margin:0;font-size:clamp(48px,3.49vw,67px);font-weight:900;line-height:1}.intro-screen__heading h1 strong{color:var(--blue);font-weight:inherit}.intro-screen__heading p{text-transform:uppercase;margin:18px 0 0;font-size:clamp(10px,.84vw,16px);font-weight:700;line-height:1.2}.intro-screen__cards-wrapper{z-index:2;height:74.4%;width:min(calc(100% - 160px), var(--container));top:12.2%;grid-template-rows:56fr 44fr;grid-template-columns:repeat(3,1fr);gap:25px;margin-inline:auto;display:grid;position:absolute;inset-inline:0}.intro-card{z-index:2;color:#171717;background:var(--blue);border-radius:40px;display:block;position:relative;overflow:hidden;container-type:inline-size}.intro-card>img{object-fit:cover;width:100%;height:100%;transition:transform .55s;position:absolute;inset:0}.intro-card:hover>img{transform:scale(1.025)}.intro-card__copy{z-index:2;text-transform:uppercase;flex-direction:column;font-weight:900;line-height:1;display:flex;position:absolute}.intro-card__copy b,.intro-card__copy small{font:inherit;display:block}.intro-card--textile{color:var(--blue);background:#111;border:1px solid #fff;grid-area:2/1}.intro-card--textile:after,.intro-card--nano:after{z-index:1;content:"";pointer-events:none;background:#00000057;position:absolute;inset:0}.intro-card--textile>img{object-position:center 45%}.intro-card--textile .intro-card__copy{bottom:46px;left:38px;right:38px}.intro-card--textile .intro-card__copy b{font-size:clamp(14px,9.12cqw,52px)}.intro-card--textile .intro-card__copy small{margin-top:9px;font-size:clamp(8px,4.39cqw,25px)}.intro-card__seal{z-index:3;place-items:center;width:clamp(60px,18.2cqw,104px);height:clamp(60px,18.2cqw,104px);display:grid;position:absolute;top:clamp(14px,4.2cqw,24px);right:clamp(13px,4cqw,23px)}.intro-card__seal svg{width:100%;height:100%;animation:14s linear infinite seal-spin;position:absolute;inset:0}.intro-card__seal text{fill:#fff;letter-spacing:1px;font-size:11px;font-weight:900}.intro-card__seal i{background:#fff;border-radius:50%;width:clamp(18px,4.9cqw,28px);height:clamp(18px,4.9cqw,28px)}.intro-card--automobile{grid-area:1/2/span 2}.intro-card--automobile>img{opacity:.68;filter:grayscale()contrast(1.2);mix-blend-mode:screen;object-position:center}.intro-card--automobile .intro-card__copy{align-items:flex-end;bottom:76px;left:42px;right:42px}.intro-card--automobile .intro-card__copy b,.intro-card--automobile .intro-card__copy small{font-size:clamp(16px,10.53cqw,60px)}.intro-card--automobile .intro-card__copy small{text-align:right;margin-top:clamp(8px,6.67cqw,38px);line-height:1.7}.intro-card__arrow{z-index:4;border-top:clamp(8px,2.5cqw,14px) solid;border-right:clamp(8px,2.5cqw,14px) solid;width:clamp(48px,14.6cqw,83px);height:clamp(48px,14.6cqw,83px);position:absolute}.intro-card__arrow:after{content:"";transform-origin:100%;background:currentColor;width:clamp(48px,14.4cqw,82px);height:clamp(8px,2.5cqw,14px);position:absolute;top:clamp(-8px,-1.4cqw,-5px);right:clamp(-4px,-.7cqw,-3px);transform:rotate(-45deg)}.intro-card--automobile>.intro-card__arrow{top:clamp(35px,15.4cqw,88px);right:clamp(35px,12.1cqw,69px)}.intro-card--nano{background:#070b03;border:1px solid #fff;grid-area:1/3}.intro-card--nano>img{filter:grayscale()sepia()hue-rotate(38deg)saturate(5)brightness(.58)}.intro-card--nano:after{background:#00000047}.intro-card__nano-label{z-index:3;width:clamp(140px,43.7cqw,249px);height:clamp(140px,43.7cqw,249px);color:var(--blue);position:absolute;top:clamp(40px,12.98cqw,74px);left:50%;transform:translate(-50%)}.intro-card__nano-label svg{width:100%;height:100%;animation:18s linear infinite reverse seal-spin}.intro-card__nano-label text{fill:currentColor;letter-spacing:2px;font-size:21px;font-weight:900}.intro-card--nano>.intro-card__arrow{color:var(--blue);top:clamp(95px,32.46cqw,185px);left:50%;transform:translate(-50%,-50%)}.intro-card--building{grid-area:2/3}.intro-card--building .intro-card__copy{top:43px;left:40px;right:40px}.intro-card--building .intro-card__copy b{font-size:clamp(14px,10.53cqw,60px)}.intro-card--building .intro-card__copy small{margin-top:7px;font-size:clamp(8px,4.39cqw,25px)}.intro-card__line{background:#171717;height:clamp(8px,2.46cqw,14px);position:absolute;bottom:clamp(40px,12.63cqw,72px);left:clamp(22px,7.02cqw,40px);right:clamp(130px,41.75cqw,238px)}.intro-card--building>.intro-card__arrow{bottom:clamp(27px,6.84cqw,39px);right:clamp(31px,9.65cqw,55px)}.intro-screen__socials,.intro-screen__copyright,.intro-screen__credit,.intro-screen__wordmark{z-index:3;position:absolute}.intro-screen__socials{gap:16px;display:flex;bottom:48px;right:80px}.intro-screen__socials a,.intro-screen__socials svg{width:32px;height:32px;display:block}.intro-screen__socials svg{fill:none;stroke:#ffffff7a;stroke-width:2px}.intro-screen__socials .is-fill{fill:#ffffff7a;stroke:none}.intro-screen__copyright,.intro-screen__credit{margin:0;font-size:14px;bottom:49px}.intro-screen__copyright{color:#ffffff59;left:80px}.intro-screen__credit{left:50%;transform:translate(-50%)}.intro-screen__credit a{color:var(--blue);text-decoration:underline}.intro-screen__wordmark{z-index:0;color:#0000001c;text-align:center;white-space:nowrap;font-size:clamp(120px,13.8vw,265px);font-weight:900;line-height:.75;bottom:-43px;left:0;right:0;overflow:hidden}@keyframes seal-spin{to{transform:rotate(360deg)}}@media (width<=1080px){.intro-screen__cards-wrapper{height:60%;width:min(calc(100% - 60px), var(--container))}.intro-screen__socials{right:30px}.intro-screen__copyright{left:30px}}@media (width<=767px){.intro-screen{height:auto;min-height:0;max-height:none;padding:120px 0 140px}.intro-screen__heading{max-width:none;padding:0 30px;position:static}.intro-screen__cards-wrapper{grid-template-rows:none;grid-template-columns:1fr;gap:16px;width:calc(100% - 60px);height:auto;margin:32px auto 0;position:static}.intro-card{min-height:260px}.intro-card--textile,.intro-card--automobile,.intro-card--nano,.intro-card--building{grid-area:auto/1}}.auth-page{background:#0d0d0d;padding:120px 0 130px;position:relative;overflow:hidden}.auth-page:before{content:"";pointer-events:none;background:radial-gradient(circle,#4ec3f729 0%,#4ec3f700 65%);width:900px;height:900px;position:absolute;top:-240px;left:50%;transform:translate(-50%)}.auth-page__inner{z-index:1;grid-template-columns:1.05fr .95fr;align-items:stretch;gap:46px;max-width:1080px;margin:0 auto;display:grid;position:relative}.auth-page__aside{background:linear-gradient(160deg,#141414 0%,#0f0f0f 60%,#101a1f 100%);border:1px solid #1f1f1f;border-radius:34px;flex-direction:column;justify-content:center;padding:52px 48px;display:flex}.auth-page__eyebrow{color:var(--blue,#4ec3f7);text-transform:uppercase;letter-spacing:.22em;margin:0;font-size:12px;font-weight:800}.auth-page__heading{color:#fff;text-transform:uppercase;margin:18px 0 0;font-size:40px;font-weight:900;line-height:1.08}.auth-page__heading span{color:var(--blue,#4ec3f7)}.auth-page__text{color:#9a9a9a;max-width:420px;margin:18px 0 0;font-size:15px;line-height:1.7}.auth-page__list{gap:14px;margin:32px 0 0;padding:0;list-style:none;display:grid}.auth-page__list li{color:#ddd;text-transform:uppercase;letter-spacing:.08em;align-items:center;gap:12px;font-size:13px;font-weight:700;display:flex}.auth-page__list li:before{content:"";background:var(--blue,#4ec3f7);border-radius:50%;flex:none;width:8px;height:8px;box-shadow:0 0 0 4px #4ec3f729}.auth-page__aside-note{color:#777;letter-spacing:.06em;text-transform:uppercase;border-top:1px solid #232323;margin:36px 0 0;padding-top:22px;font-size:12px}.auth-page__form-col{display:flex}.auth-modal__panel--page{width:100%;max-width:none;transform:none;box-shadow:0 40px 90px #0000008c}.auth-modal__panel--page .auth-modal__tab{text-align:center;text-decoration:none;display:block}.auth-modal__panel--page .auth-modal__note{color:#6f6f6f;letter-spacing:.1em;text-transform:uppercase;text-align:center;margin:22px 0 0;font-size:11px;font-weight:700}.auth-page__switch{color:#8a8a8a;text-align:center;letter-spacing:.06em;text-transform:uppercase;margin:14px 0 0;font-size:12px}.auth-page__switch a{color:var(--blue,#4ec3f7);font-weight:800;text-decoration:none}.auth-page__switch a:hover{text-decoration:underline}@media (width<=900px){.auth-page{padding:80px 0 90px}.auth-page__inner{grid-template-columns:1fr;gap:26px}.auth-page__aside{border-radius:28px;padding:36px 28px}.auth-page__heading{font-size:30px}.auth-modal__panel--page{border-radius:28px;padding:32px 26px}}.header .header__controls{gap:8px;width:auto}.header .header__divider{margin:0}.header .menu-toggle{margin-left:0}@media (width<=430px){.header .header__controls{gap:0;width:auto;height:40px;padding-inline:4px}.header .icon-button,.header .menu-toggle{width:30px;height:30px}.header .icon-button svg{width:19px;height:19px}.header .header__divider{height:22px;margin-inline:2px}.header .logo{width:104px}.header .menu-toggle:before,.header .menu-toggle:after,.header .menu-toggle span{width:20px}}.currency-switch__toggle{color:inherit}.currency-switch__toggle svg{fill:none;stroke:currentColor;stroke-width:1.6px}.currency-switch__toggle svg text{paint-order:stroke;font-family:inherit}@media (prefers-reduced-motion:no-preference){@keyframes hpFadeUp{0%{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}[data-reveal]{opacity:0;will-change:opacity, transform;transform:translateY(26px)}[data-reveal].is-inview{animation:.8s cubic-bezier(.2,.8,.3,1) forwards hpFadeUp}.icon-button,.menu-toggle,.account-page__nav a,.account-page__signout,.account-favorites__card,.account-orders__item,.review-card,.blog-card,.footer__nav a,.menu-panel__nav a{transition:color .28s,background .28s,border-color .28s,transform .38s cubic-bezier(.2,.8,.3,1),box-shadow .38s}.icon-button:hover{transform:translateY(-2px)scale(1.07)}.menu-toggle:hover{transform:scale(1.06)}.account-favorites__card:hover,.blog-card:hover,.review-card:hover{border-color:#4ec3f773;transform:translateY(-6px);box-shadow:0 26px 60px #00000080,0 0 0 1px #4ec3f72e}.account-orders__item:hover{border-color:#4ec3f759}.account-page__nav a:hover:not(.is-active),.account-page__signout:hover{color:#fff;transform:translate(4px)}.account-form__submit,.account-page__login-btn,.account-favorites__cart-btn,.auth-modal__submit{transition:transform .3s cubic-bezier(.2,.8,.3,1),box-shadow .3s,background .3s,color .3s}.account-form__submit:hover,.account-page__login-btn:hover,.account-favorites__cart-btn:not(:disabled):hover,.auth-modal__submit:hover{transform:translateY(-3px);box-shadow:0 16px 34px #4ec3f752}.account-form__submit:active,.account-page__login-btn:active,.auth-modal__submit:active{transform:translateY(-1px)scale(.985)}.menu-panel__nav a{position:relative}.menu-panel__nav a:after{content:"";background:var(--blue,#4ec3f7);transform-origin:100%;width:100%;height:1px;transition:transform .38s cubic-bezier(.2,.8,.3,1);position:absolute;bottom:-4px;left:0;transform:scaleX(0)}.menu-panel__nav a:hover:after{transform-origin:0;transform:scaleX(1)}.account-form__field input:focus,.auth-modal__field input:focus{border-color:var(--blue,#4ec3f7);box-shadow:0 6px 20px -14px #4ec3f7e6}}.pd{padding:clamp(120px,16vw,170px) 0 clamp(40px,6vw,70px)}.pd__crumbs{letter-spacing:.04em;color:#ffffff73;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 clamp(24px,4vw,40px);font-size:13px;display:flex}.pd__crumbs a{color:#ffffffa6;text-decoration:none;transition:color .25s}.pd__crumbs a:hover{color:var(--blue,#4ec3f7)}.pd__crumbs b{color:#fff;font-weight:600}.pd__grid{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start;gap:clamp(28px,5vw,64px);display:grid}.pd__main{aspect-ratio:1;background:#ffffff08;border:1px solid #ffffff12;border-radius:24px;position:relative;overflow:hidden}.pd__main img{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.2,.8,.3,1);display:block}.pd__main:hover img{transform:scale(1.04)}.pd__badge{letter-spacing:.06em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--blue,#4ec3f7);background:#0d0d0db8;border:1px solid #ffffff1f;border-radius:999px;padding:7px 14px;font-size:12px;position:absolute;top:16px;left:16px}.pd__thumbs{flex-wrap:wrap;gap:12px;margin-top:14px;display:flex}.pd__thumbs button{cursor:pointer;opacity:.6;background:#ffffff08;border:1px solid #ffffff14;border-radius:16px;width:78px;height:78px;padding:0;transition:opacity .25s,border-color .25s,transform .25s;overflow:hidden}.pd__thumbs button img{object-fit:cover;width:100%;height:100%;display:block}.pd__thumbs button:hover{opacity:1;transform:translateY(-2px)}.pd__thumbs button.is-active{opacity:1;border-color:var(--blue,#4ec3f7)}.pd__category{letter-spacing:.18em;text-transform:uppercase;color:var(--blue,#4ec3f7);margin-bottom:12px;font-size:12px;display:inline-block}.pd__title{color:#fff;margin:0 0 14px;font-size:clamp(26px,3.4vw,42px);font-weight:900;line-height:1.12}.pd__lead{color:#fff9;margin:0 0 clamp(20px,3vw,30px);font-size:15px;line-height:1.65}.pd__options{flex-wrap:wrap;gap:10px;margin-bottom:22px;display:flex}.pd__options button{color:#ffffffbf;cursor:pointer;background:0 0;border:1px solid #ffffff26;border-radius:999px;padding:10px 18px;font-size:14px;transition:color .25s,border-color .25s,background .25s}.pd__options button:hover{border-color:var(--blue,#4ec3f7);color:#fff}.pd__options button.is-active{border-color:var(--blue,#4ec3f7);color:var(--blue,#4ec3f7);background:#4ec3f71f}.pd__buy{background:#ffffff08;border:1px solid #ffffff12;border-radius:24px;flex-direction:column;gap:8px;padding:clamp(20px,3vw,28px);display:flex}.pd__price{color:#fff;font-size:clamp(28px,3vw,36px);font-weight:900}.pd__buy small{color:#ffffff80;font-size:13px}.pd__buy small b,.pd__buy small span{color:#fffc;font-weight:600}.pd__buy [data-stock-state=available],.pd__badge[data-stock-state=available]{color:#63d68b}.pd__actions{gap:12px;margin-top:12px;display:flex}.pd__add{letter-spacing:.03em;color:#0d0d0d;background:var(--blue,#4ec3f7);cursor:pointer;border:none;border-radius:999px;flex:1;padding:15px 26px;font-size:15px;font-weight:700;transition:transform .25s,box-shadow .25s,filter .25s}.pd__add:hover{filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 14px 30px -12px #4ec3f780}.pd__add:active{transform:translateY(0)scale(.98)}.pd__fav{color:#ffffffb3;background:0 0;border:1px solid #ffffff26;border-radius:50%;flex:none;justify-content:center;align-items:center;width:52px;height:52px;transition:color .25s,border-color .25s,background .25s,transform .25s;display:inline-flex}.pd__fav svg{width:22px;height:22px}.pd__fav:hover{color:var(--blue,#4ec3f7);border-color:var(--blue,#4ec3f7);transform:translateY(-2px)}.pd__perks{gap:10px;margin:22px 0 0;padding:0;list-style:none;display:grid}.pd__perks li{color:#fff9;padding-left:24px;font-size:14px;position:relative}.pd__perks li:before{content:"";background:var(--blue,#4ec3f7);border-radius:50%;width:8px;height:8px;position:absolute;top:7px;left:0;box-shadow:0 0 12px #4ec3f799}.pd__gallery-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;display:grid}.pd__gallery-grid img{aspect-ratio:1;object-fit:cover;border:1px solid #ffffff12;border-radius:18px;width:100%;transition:transform .4s;display:block}.pd__gallery-grid img:hover{transform:scale(1.03)}.pd-related{padding:clamp(50px,8vw,90px) 0}.pd-related__head{margin-bottom:clamp(24px,4vw,40px)}.pd-related__head h2{color:#fff;margin:8px 0 0;font-size:clamp(24px,3vw,36px);font-weight:900}.pd-related__head h2 span{color:var(--blue,#4ec3f7)}.pd-related__grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;display:grid}.pd-related__card{background:#ffffff08;border:1px solid #ffffff12;border-radius:22px;flex-direction:column;gap:8px;padding:16px;text-decoration:none;transition:transform .35s cubic-bezier(.2,.8,.3,1),border-color .35s,background .35s;display:flex}.pd-related__card:hover{background:#4ec3f70f;border-color:#4ec3f773;transform:translateY(-6px)}.pd-related__media{aspect-ratio:1;border-radius:14px;margin-bottom:6px;display:block;overflow:hidden}.pd-related__media img{object-fit:cover;width:100%;height:100%;transition:transform .5s;display:block}.pd-related__card:hover .pd-related__media img{transform:scale(1.06)}.pd-related__card small{letter-spacing:.14em;text-transform:uppercase;color:var(--blue,#4ec3f7);font-size:11px}.pd-related__card b{color:#fff;font-size:15px;font-weight:600;line-height:1.4}.pd-related__price{color:var(--blue,#4ec3f7);font-size:17px;font-weight:800}@media (width<=900px){.pd__grid{grid-template-columns:1fr}.pd__main{aspect-ratio:4/3}}.catalog-product__name-link{color:inherit;text-decoration:none;transition:color .25s}.catalog-product__name-link:hover{color:var(--blue,#4ec3f7)}a.catalog-product__visual{cursor:pointer;display:block}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-content{syntax:"*";inherits:false;initial-value:""}@keyframes pulse{50%{opacity:.5}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0));filter:blur(var(--tw-enter-blur,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0));filter:blur(var(--tw-exit-blur,0))}}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto)))))}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,var(--ngp-accordion-content-height,auto)))))}to{height:0}}@keyframes caret-blink{0%,70%,to{opacity:1}20%,50%{opacity:0}}

/* ==========================================================================
   3. Базова тема
   успадкована з верстки проєкту (desktop-first)
   ========================================================================== */

/* Fonts
	========================================================================== */
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

/* Base / Reset
	========================================================================== */
:root {
    --blue: #32c6f4;
    --dark: #151515;
    --container: 1760px;
}

*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    min-width: 320px;
    margin: 0;
    color: #fff;
    background: #111;
    font-family: 'Montserrat', Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

body.menu-open {
    overflow: hidden;
}

body.cart-open {
    overflow: hidden;
}

body.auth-modal-open {
    overflow: hidden;
}

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

button {
    font: inherit;
}

/* Square Arrow
	========================================================================== */
.square-arrow {
    --arrow-size: 36px;
    --arrow-thickness: 6px;
    --arrow-shaft: 40px;
    --arrow-top: -1px;
    --arrow-right: -2px;
    position: relative;
    display: block;
    width: var(--arrow-size);
    height: var(--arrow-size);
    flex: 0 0 var(--arrow-size);
    border-top: var(--arrow-thickness) solid currentColor;
    border-right: var(--arrow-thickness) solid currentColor;
}

.square-arrow::after {
    position: absolute;
    top: var(--arrow-top);
    right: var(--arrow-right);
    width: var(--arrow-shaft);
    height: var(--arrow-thickness);
    background: currentColor;
    content: '';
    transform: rotate(-45deg);
    transform-origin: right center;
}

/* Container
	========================================================================== */
.container {
    width: min(calc(100% - 160px), var(--container));
    margin-inline: auto;
}

@media (max-width: 1440px) {
    .container {
        width: calc(100% - 100px);
    }
}

@media (max-width: 1200px) {
    .container {
        width: calc(100% - 60px);
    }
}

/* Logo
	========================================================================== */
.logo {
    position: relative;
    z-index: 3;
    display: block;
    width: 280px;
}

.logo img {
    display: block;
    width: 100%;
    height: auto;
}

/* Header
	========================================================================== */
.header {
    position: absolute;
    z-index: 20;
    inset: 0 0 auto;
    height: 162px;
}

.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 38px;
}

.header__controls {
    position: relative;
    z-index: 31;
    display: flex;
    align-items: center;
    width: 310px;
    height: 87px;
    padding: 0 28px;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 50px;
    background: rgba(255, 255, 255, .07);
}

.icon-button,
.menu-toggle {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 52px;
    height: 52px;
    padding: 0;
    color: #fff;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.icon-button svg {
    width: 35px;
    height: 35px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.menu-open .icon-button svg {
    color: #fff;
}

.icon-button:hover svg {
    stroke: var(--blue);
}

.icon-button--cart {
    position: relative;
}

.cart-dot {
    position: absolute;
    top: 7px;
    right: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ff4025;
}

/* Minicart
	========================================================================== */
.minicart {
    position: fixed;
    z-index: 60;
    inset: 0;
    visibility: hidden;
    color: #171717;
    opacity: 0;
    pointer-events: none;
    transition: visibility .35s ease, opacity .35s ease;
}

.minicart.is-open {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.minicart__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: rgba(0, 0, 0, .62);
    cursor: default;
}

.minicart__panel {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    width: min(700px, 100vw);
    height: 100dvh;
    flex-direction: column;
    overflow-y: auto;
    background: #fff;
    box-shadow: -20px 0 60px rgba(0, 0, 0, .22);
    transform: translateX(100%);
    transition: transform .4s cubic-bezier(.22, .8, .28, 1);
}

.minicart.is-open .minicart__panel {
    transform: translateX(0);
}

.minicart__header {
    position: relative;
    display: grid;
    min-height: 104px;
    flex: 0 0 auto;
    place-items: center;
    border-bottom: 1px solid #dedede;
}

.minicart__header h2 {
    margin: 0;
    font-size: 29px;
    font-weight: 800;
    text-transform: uppercase;
}

.minicart__close {
    position: absolute;
    top: 25px;
    right: 34px;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.minicart__close::before,
.minicart__close::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 28px;
    height: 3px;
    background: #171717;
    content: '';
}

.minicart__close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.minicart__close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.minicart__delivery {
    min-height: 39px;
    margin: 0;
    padding: 10px 24px;
    color: #fff;
    background: var(--blue);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
}

.minicart__subtitle {
    min-height: 68px;
    margin: 0;
    padding: 24px 30px 20px;
    border-bottom: 1px solid #dedede;
    font-size: 16px;
    font-weight: 800;
    text-align: center;
}

.minicart__items {
    border-bottom: 1px solid #d7d7d7;
}

.minicart__item {
    position: relative;
    display: grid;
    min-height: 190px;
    grid-template-columns: 112px 1fr 115px;
    align-items: center;
    gap: 18px;
    padding: 18px 30px;
}

.minicart__product-image,
.minicart__suggestion-image {
    display: grid;
    overflow: hidden;
    place-items: center;
    border-radius: 12px;
    background: linear-gradient(140deg, #171717 52%, var(--blue));
}

.minicart__product-image {
    width: 102px;
    height: 145px;
}

.minicart__product-image img,
.minicart__suggestion-image img {
    display: block;
    width: auto;
    margin-top: 3px;
}

.minicart__product-image img {
    height: 160px;
}

.minicart__suggestion-image img {
    height: 154px;
}

.minicart__product-copy h4,
.minicart__suggestion h4 {
    margin: 0 0 3px;
    font-size: 16px;
    font-weight: 800;
}

.minicart__product-copy p,
.minicart__suggestion p {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
}

.minicart__quantity {
    display: grid;
    width: 106px;
    height: 37px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 20px;
    overflow: hidden;
    border: 1px solid #9c9c9c;
    border-radius: 19px;
}

.minicart__quantity button,
.minicart__quantity output {
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    color: #171717;
    background: #fff;
    font-size: 16px;
    font-weight: 700;
}

.minicart__quantity button {
    cursor: pointer;
}

.minicart__quantity output {
    border-right: 1px solid #b7b7b7;
    border-left: 1px solid #b7b7b7;
}

.minicart__remove {
    position: absolute;
    top: 54px;
    right: 38px;
    width: 28px;
    height: 28px;
    padding: 4px;
    border: 0;
    color: #aaa;
    background: transparent;
    cursor: pointer;
}

.minicart__remove svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
}

.minicart__price {
    align-self: end;
    justify-self: end;
    margin: 0 0 13px;
    font-size: 14px;
    font-weight: 700;
}

.minicart__suggestions h3 {
    min-height: 66px;
    margin: 0;
    padding: 25px 30px 18px;
    border-bottom: 1px solid #dedede;
    font-size: 16px;
    font-weight: 800;
    text-align: center;
}

.minicart__suggestion {
    display: grid;
    min-height: 174px;
    grid-template-columns: 100px 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 16px 30px;
    border-bottom: 1px solid #dedede;
}

.minicart__suggestion-image {
    width: 94px;
    height: 140px;
}

.minicart__suggestion strong {
    display: block;
    margin-top: 22px;
    font-size: 14px;
}

.minicart__suggestion > button {
    display: flex;
    min-width: 154px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 10px 20px;
    border: 0;
    border-radius: 25px;
    color: #fff;
    background: #171717;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
}

.minicart__suggestion > button span {
    font-size: 25px;
    font-weight: 400;
    line-height: .7;
}

.minicart__footer {
    margin-top: auto;
    padding: 25px 30px 35px;
}

.minicart__footer p {
    display: flex;
    justify-content: space-between;
    margin: 0 0 22px;
    font-size: 15px;
    font-weight: 800;
}

.minicart__footer a {
    display: flex;
    min-height: 54px;
    align-items: center;
    justify-content: center;
    gap: 15px;
    border-radius: 28px;
    color: #fff;
    background: #171717;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
}

.minicart__checkout-arrow {
    --arrow-size: 15px;
    --arrow-thickness: 3px;
    --arrow-shaft: 17px;
    --arrow-top: -2px;
    --arrow-right: -1px;
}

.header__divider {
    width: 1px;
    height: 43px;
    margin: 0 16px 0 7px;
    background: rgba(255, 255, 255, .85);
}

/* Burger Menu
	========================================================================== */
.menu-toggle {
    position: relative;
    margin-left: auto;
    cursor: pointer;
}

.menu-toggle::before,
.menu-toggle::after,
.menu-toggle span {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 43px;
    height: 5px;
    border-radius: 5px;
    background: #fff;
    content: '';
    transition: width .25s ease, opacity .18s ease, transform .25s ease;
    
}

.menu-toggle:not(.is-active):hover::before,
.menu-toggle:not(.is-active):hover::after,
.menu-toggle:not(.is-active):hover span {
    background-color: var(--blue);
}

.menu-toggle span {
    transform: translate(-50%, -50%);
}

.menu-toggle::before {
    transform: translate(-50%, calc(-50% - 14px));
}

.menu-toggle::after {
    transform: translate(-50%, calc(-50% + 14px));
}

.menu-toggle.is-active span {
    opacity: 0;
}

.menu-toggle.is-active::before,
.menu-toggle.is-active::after {
    width: 46px;
    height: 4px;
}

.menu-toggle.is-active::before {
    transform: translate(-50%, -50%) rotate(45deg);
    
}

.menu-toggle.is-active::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

/* Fullscreen Menu Panel
	========================================================================== */
.menu-panel {
    position: fixed;
    z-index: 30;
    inset: 0;
    display: grid;
    place-items: center;
    visibility: hidden;
    opacity: 0;
    background: radial-gradient(circle at 55% 35%, #292929, #151515 65%);
    transition: opacity .3s ease, visibility .3s ease;
}

.menu-panel::after {
    position: absolute;
    inset: auto 0 -55px;
    overflow: hidden;
    color: rgba(0, 0, 0, .12);
    font-size: clamp(90px, 14vw, 270px);
    font-weight: 900;
    line-height: .8;
    text-align: center;
    content: 'HYDROPHOB';
}

.menu-open .menu-panel {
    visibility: visible;
    opacity: 1;
}

.menu-panel__logo {
    position: absolute;
    z-index: 1;
    top: 65px;
    left: 50%;
    display: block;
    width: 200px;
    transform: translateX(-50%);
}

.menu-panel__logo img {
    display: block;
    width: 100%;
    height: auto;
}

.menu-panel__nav {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, auto);
    gap: 34px 95px;
    margin-top: 30px;
}

.menu-panel__nav a {
    position: relative;
    font-size: clamp(30px, 2.8vw, 54px);
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}
.menu-panel__nav a:hover,
.menu-panel__nav a.is-current {
    color: var(--blue);
}
.menu-panel__nav a:not(.is-current):hover::before {
    position: absolute;
    top: calc(50% - 18px);
    left: -52px;
    width: 36px;
    height: 36px;
    border-top: 6px solid currentColor;
    border-right: 6px solid currentColor;
    content: '';
}

.menu-panel__nav a:not(.is-current):hover::after {
    position: absolute;
    top: calc(50% - 19px);
    left: -58px;
    width: 40px;
    height: 6px;
    color: var(--blue);
    background: currentColor;
    content: '';
    transform: rotate(-45deg);
    transform-origin: right center;
}

.menu-panel__copy,
.menu-panel__socials {
    position: absolute;
    z-index: 1;
    bottom: 72px;
    margin: 0;
    color: rgba(255, 255, 255, .45);
    font-size: 14px;
}

.menu-panel__copy {
    left: 50%;
    transform: translateX(-50%);
}

.menu-panel__socials {
    right: 80px;
    display: flex;
    gap: 14px;
}

.menu-panel__socials a {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
}

/* Hero
	========================================================================== */
.hero {
    position: relative;
    overflow: hidden;
    background: #090909 url('../image/hero-slide1-poster.webp') center center / cover no-repeat;
}

.hero::before {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    content: '';
    pointer-events: none;
}

.hero__slider {
    position: absolute;
    z-index: 0;
    inset: 0;
}

.hero__slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .6s ease;
}

.hero__slide.is-active {
    opacity: 1;
}

.hero__slide picture {
    display: block;
    width: 100%;
    height: 100%;
}

.hero__media {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.hero__video {
    opacity: 1;
}

.hero__volume {
    position: absolute;
    z-index: 3;
    top: 150px;
    right: 80px;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.hero__volume:not([hidden]) {
    display: flex;
}

.hero__navigation {
    position: absolute;
    z-index: 3;
    top: 220px;
    right: 80px;
    display: flex;
    align-items: center;
    gap: 13px;
    color: #fff;
}

.hero__navigation button {
    padding: 0;
    border: 0;
    color: #fff;
    background: transparent;
    font-family: inherit;
    cursor: pointer;
}

.hero__prev,
.hero__next {
    font-size: 34px;
}

/* Уніфікований вигляд play/pause/Scroll та гучності — однаковий у hero й reviews */
.hero__action,
.reviews__action {
    display: grid;
    place-items: center;
    width: 83px;
    height: 83px;
    padding: 0;
    border: 2px solid #fff!important;
    border-radius: 50%;
    color: #fff;
    background: transparent;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

[data-hero-volume-toggle],
[data-volume-toggle] {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    color: #fff;
    background: transparent;
    cursor: pointer;
}

[data-hero-volume-toggle] svg,
[data-volume-toggle] svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

[data-hero-volume-toggle] .volume-speaker,
[data-volume-toggle] .volume-speaker {
    fill: currentColor;
    stroke: none;
}

[data-hero-volume-toggle] .volume-waves,
[data-volume-toggle] .volume-waves {
    opacity: 0;
}

[data-hero-volume-toggle].is-audible .volume-waves,
[data-volume-toggle].is-audible .volume-waves {
    opacity: 1;
}

[data-hero-volume-toggle].is-audible .volume-slash,
[data-volume-toggle].is-audible .volume-slash {
    opacity: 0;
}

[data-hero-volume],
[data-volume-range] {
    width: 103px;
    height: 5px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    outline: none;
    background: linear-gradient(90deg, var(--blue) 0%, var(--blue) var(--volume-progress, 0%), rgba(255, 255, 255, .55) var(--volume-progress, 0%));
    appearance: none;
    cursor: pointer;
}

[data-hero-volume]::-webkit-slider-thumb,
[data-volume-range]::-webkit-slider-thumb {
    width: 11px;
    height: 11px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--blue);
    appearance: none;
}

[data-hero-volume]::-moz-range-thumb,
[data-volume-range]::-moz-range-thumb {
    width: 8px;
    height: 8px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--blue);
}

.hero__inner {
    position: relative;
    z-index: 2;
    min-height: 100vh;
}

.hero__content {
    position: absolute;
    bottom: 60px;
    left: 0;
}

.hero__title {
    margin: 0;
    font-size: clamp(78px, 9.71vw, 186px);
    font-weight: 900;
    letter-spacing: -.055em;
    line-height: .78;
    text-transform: uppercase;
}

.hero__title span {
    display: block;
    white-space: nowrap;
}

.hero__title strong {
    color: var(--blue);
    font-weight: inherit;
}

.hero__text {
    margin: 31px 0 0 1px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}

.hero__seal {
    position: absolute;
    right: 205px;
    bottom: 126px;
    display: grid;
    place-items: center;
    width: 104px;
    height: 104px;
    border-radius: 50%;
}

.hero__seal svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    animation: seal-spin 14s linear infinite;
}

.hero__seal text {
    fill: #fff;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.2px;
}

.hero__seal i {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #fff;
}

@media (prefers-reduced-motion: reduce) {
    .hero__slide {
        transition: none;
    }
}

/* About / Home
	========================================================================== */
.about {
    color: #171717;
    background: #fff;
}

.about__inner {
    position: relative;
    display: grid;
    grid-template-columns: 30% 1fr;
    padding-top: 150px;
    padding-bottom: 60px;
    border-bottom: 1px solid #171717;
}

.section-label {
    margin: 12px 0 0;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.about__content {
    position: relative;
    z-index: 2;
    max-width: 870px;
}

.about__title {
    margin: 0;
    font-size: 31px;
    font-weight: 400;
    line-height: 1.1;
}

.about__lead {
    margin: 28px 0 0;
    font-size: 16px;
    line-height: 1.25;
}

.about__features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 59px;
}

.about__features article {
    position: relative;
}

.about__features span {
    position: absolute;
    z-index: -1;
    top: -48px;
    left: 0;
    color: rgba(0, 0, 0, .045);
    font-size: 118px;
    font-weight: 700;
    line-height: 1;
}

.about__features h3 {
    margin: 0 0 16px;
    color: var(--blue);
    font-size: 16px;
}

.about__features p {
    margin: 0;
    color: #777;
    font-size: 16px;
    line-height: 1.25;
}

/* Анімація появи при скролі (як .hydro-fade у hydrophob-landing): цифра/текст спливають, заголовок друкується */
.scroll-fade {
    opacity: 0;
    transform: translateY(36px);
    transition: opacity .9s ease, transform .9s ease;
}

.scroll-fade-visible {
    opacity: 1;
    transform: translateY(0);
}

.about__features span.scroll-fade {
    transform: translateY(70px);
}

.about__features p.scroll-fade {
    margin-top: 70px;
}

.hero__seal.scroll-fade {
    transform: scale(.4);
}

.hero__seal.scroll-fade-visible {
    transform: scale(1);
}

.is-typing::after {
    content: '';
    display: inline-block;
    width: 2px;
    height: .9em;
    margin-left: 2px;
    background: currentColor;
    vertical-align: baseline;
    animation: typing-caret-blink .7s steps(1) infinite;
}

@keyframes typing-caret-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

.about__button {
    grid-column: 2/3;
    position: relative;
    z-index: 3;
    margin-top: 30px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 280px;
    height: 50px;
    gap: 14px;
    border-radius: 28px;
    background: #171717;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
}

.about__arrow {
    --arrow-size: 15px;
    --arrow-thickness: 3px;
    --arrow-shaft: 17px;
    --arrow-top: -2px;
    --arrow-right: -1px;
}

.about__wordmark {
    position: absolute;
    right: 15px;
    bottom: -22px;
    color: rgba(0, 0, 0, .025);
    font-size: 170px;
    font-weight: 900;
    letter-spacing: -.07em;
    line-height: 1;
    white-space: nowrap;
}

/* Catalog / Home Slider
	========================================================================== */
.catalog {
    overflow: hidden;
    color: #171717;
    background: #fff;
}

.catalog__inner {
    position: relative;
    min-height: 930px;
}

.catalog__tabs {
    display: flex;
    justify-content: flex-start;
    gap: 12px 25px;
    flex-wrap: wrap;
    padding-top: 35px;
}

.catalog__tabs button {
    padding: 0;
    border: 0;
    color: #171717;
    background: none;
    font-family: inherit;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
}
.catalog__tabs button:hover,
.catalog__tabs button.is-active {
    color: var(--blue);
}

.catalog__stage {
    position: relative;
    padding-top: 180px;
}

.catalog__slider {
    width: 100%;
    overflow: visible;
    opacity: 0;
    transition: opacity .2s ease;
}

.catalog__slider.is-ready {
    opacity: 1;
}

.product-card {
    position: relative;
    flex: 0 0 483px;
    width: 483px !important;
    height: 563px;
    border-radius: 36px;
    color: #fff;
    background: #171717;
    opacity: .62;
    transform: translateY(26px);
    transition: opacity .45s ease, transform .45s ease, filter .45s ease;
}

.product-card::before {
    position: absolute;
    inset: 32% -6% -6% 36%;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(38, 198, 244, .95), rgba(38, 198, 244, .2) 42%, transparent 70%);
    filter: blur(10px);
    content: '';
}

.product-card img {
    position: absolute;
    z-index: 2;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 100%;
    height: 120%;
    object-position: top;
    object-fit: contain;
}

.product-card.swiper-slide-active {
    z-index: 3;
    opacity: 1;
    transform: translateY(0);
}

.product-card:not(.swiper-slide-active) img {
    filter: saturate(.35);
}

.product-card:not(.swiper-slide-active) .product-card__arrow {
    opacity: 0;
}

.product-card__arrow {
    position: absolute;
    z-index: 4;
    top: 31px;
    right: 31px;
    width: 74px;
    height: 74px;
    border-top: 14px solid var(--blue);
    border-right: 14px solid var(--blue);
}

.product-card__arrow::after {
    position: absolute;
    top: -6px;
    right: -4px;
    width: 81px;
    height: 14px;
    background: var(--blue);
    content: '';
    transform: rotate(-45deg);
    transform-origin: right center;
}

.product-card__copy {
    position: absolute;
    z-index: 4;
    right: 23px;
    bottom: 27px;
    left: 23px;
}

.product-card__copy small {
    font-size: 12px;
}

.product-card__copy h3 {
    margin: 8px 0 37px;
    font-size: 18px;
}

.product-card__copy p {
    max-width: 430px;
    margin: 0;
    font-size: 15px;
    line-height: 1.3;
}

.product-card.swiper-slide-prev {
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 55%, #000 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 55%, #000 100%);
}

.product-card.swiper-slide-next {
    -webkit-mask-image: linear-gradient(to left, transparent 0%, #000 55%, #000 100%);
    mask-image: linear-gradient(to left, transparent 0%, #000 55%, #000 100%);
}

.catalog__control {
    position: absolute;
    z-index: 5;
    top: 248px;
    left: calc(50% + 320px);
    display: flex;
    align-items: center;
    gap: 13px;
}

.catalog__control button {
    padding: 0;
    border: 0;
    background: none;
    color: #171717;
    font-size: 36px;
    line-height: 1;
    cursor: pointer;
    transition: color .2s;
}

.catalog__control button:hover {
    color: var(--blue);
}

.catalog__control span {
    display: grid;
    place-items: center;
    width: 83px;
    height: 83px;
    border: 3px solid #171717;
    border-radius: 50%;
    font-size: 15px;
    font-weight: 800;
    transition: border-color .2s, color .2s;
}

.catalog__control span:hover {
    border-color: var(--blue);
    color: var(--blue);
}

@keyframes seal-spin {
    to { transform: rotate(360deg); }
}

@media (max-width: 1280px) {
    .catalog__control {
        left: calc(50% + 275px);
    }
}

/* Reviews
	========================================================================== */
.reviews {
    position: relative;
    overflow: hidden;
    color: #fff;
    background: #101010;
}

.reviews__slider {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .25s ease;
}

.reviews__slider.is-ready {
    opacity: 1;
}

.reviews__slide {
    position: relative;
    height: 935px;
    overflow: hidden;
    background: #111;
}

.reviews__slide::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(90deg, rgba(4, 10, 13, .72), rgba(4, 10, 13, .12) 48%, rgba(4, 10, 13, .55)), linear-gradient(0deg, rgba(3, 8, 11, .88), transparent 52%);
    content: '';
    pointer-events: none;
}

.reviews__media {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reviews__caption {
    position: absolute;
    z-index: 2;
    bottom: 65px;
    left: 50px;
    max-width: 33%;
    padding-right: 20px;
}

.reviews__counter {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
}

.reviews__counter strong {
    font-size: 16px;
}

.reviews__caption h2 {
    margin: 0;
    font-size: 64px;
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1;
}

.reviews__caption > p:last-child {
    margin: 14px 0 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}

.reviews__overlay {
    position: relative;
    z-index: 4;
    min-height: 935px;
    pointer-events: none;
}

.reviews__overlay button,
.reviews__overlay input {
    pointer-events: auto;
}

.reviews__label {
    position: absolute;
    top: 159px;
    left: 0;
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.reviews__volume {
    position: absolute;
    top: 151px;
    right: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.reviews__navigation {
    position: absolute;
    top: 389px;
    right: 30px;
    display: flex;
    align-items: center;
    gap: 13px;
}

.reviews__navigation button {
    padding: 0;
    border: 0;
    color: #fff;
    background: transparent;
    font-family: inherit;
    cursor: pointer;
}

.reviews__prev,
.reviews__next {
    font-size: 34px;
}

.reviews__filters {
    position: absolute;
    right: 0;
    bottom: 58px;
    display: flex;
    gap: 18px;
    width: 65%;
}

.reviews__filters button {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 112px;
    align-items: center;
    overflow: hidden;
    padding: 20px 28px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 16px;
    color: #fff;
    background-color: rgba(8, 8, 8, .88);
    font-family: inherit;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.05;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer;
    backdrop-filter: blur(8px);
    transition: width .35s ease, color .25s ease, background-color .25s ease, border-color .25s ease;
}

.reviews__filters button::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(90deg, #090909 0%, #090909 48%, rgba(9, 9, 9, .12) 74%, rgba(9, 9, 9, .42) 100%);
    content: '';
    pointer-events: none;
    transition: opacity .25s ease;
}

.reviews__filters button.is-active {
    width: 420px;
    border-color: var(--blue);
    color: #07151a;
    background-color: var(--blue);
}

.reviews__filters button.is-active::after {
    opacity: 0;
}

.reviews__filter-copy {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
}

.reviews__filter-copy strong {
    font-size: 20px;
    font-weight: 800;
    line-height: 1.05;
}

.reviews__filter-copy small {
    display: block;
    margin-top: 6px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.05;
    white-space: nowrap;
}

.reviews__filter-media {
    position: absolute;
    z-index: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 56%;
    opacity: 1;
    transition: opacity .25s ease;
}

.reviews__filter-media img,
.reviews__filter-media video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.reviews__filters button.is-active .reviews__filter-media {
    opacity: 0;
}

.reviews__filter-arrow {
    --arrow-size: 36px;
    --arrow-thickness: 6px;
    --arrow-shaft: 40px;
    --arrow-top: -3px;
    --arrow-right: -2px;
    position: absolute;
    z-index: 3;
    top: 18px;
    right: 18px;
    transition: transform .3s ease;
}

.reviews__filters button.is-active .reviews__filter-arrow {
    transform: rotate(90deg);
}

.reviews__wordmark {
    position: absolute;
    z-index: 3;
    right: 75px;
    bottom: -37px;
    color: rgba(255, 255, 255, .045);
    font-size: 175px;
    font-weight: 900;
    letter-spacing: -.07em;
    line-height: 1;
    pointer-events: none;
}
@media (max-width: 1440px) {
    .reviews__caption h2 {
        font-size: 46px;
    }
}

@media (max-width: 1336px) {
    .reviews__caption h2 {
        font-size: 36px;
    }
}
@media (max-width: 1200px) {
    .reviews__caption {
        bottom: 200px;
    }

    .reviews__filters {
        width: 100%;
    }
}

/* FAQ
	========================================================================== */
.faq {
    color: #171717;
    background: #f7f7f7;
}

.faq__inner {
    padding-top: 120px;
    padding-bottom: 60px;
}

.faq__label {
    margin: 0 0 30px;
}

.faq__list {
    border-bottom: 1px solid rgba(23, 23, 23, .22);
}

.faq__item {
    border-top: 1px solid rgba(23, 23, 23, .22);
}

.faq__item:first-child {
    border-top: 0;
}

.faq__item h2 {
    margin: 0;
}

.faq__item h2 button {
    position: relative;
    display: flex;
    width: 100%;
    min-height: 160px;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 0 22px 0 6px;
    border: 0;
    color: #171717;
    background: transparent;
    font-family: inherit;
    font-size: 56px;
    font-weight: 700;
    letter-spacing: -.04em;
    line-height: 1;
    text-align: left;
    cursor: pointer;
}

.faq__symbol {
    position: relative;
    display: block;
    width: 75px;
    height: 75px;
    flex: 0 0 75px;
}

.faq__symbol::before,
.faq__symbol::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 75px;
    height: 10px;
    background: currentColor;
    content: '';
    transform: translate(-50%, -50%);
    transition: transform .3s ease;
}

.faq__symbol::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.faq__item.is-open .faq__symbol::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.faq__answer {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows .35s ease, opacity .25s ease;
}

.faq__answer > div {
    overflow: hidden;
}

.faq__answer p {
    max-width: 870px;
    margin: 0 152px 63px auto;
    font-size: 16px;
    line-height: 1.25;
}

.faq__item.is-open .faq__answer {
    grid-template-rows: 1fr;
    opacity: 1;
}

.faq__note {
    margin: 25px 0 0 1px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}

.faq__note a {
    color: var(--blue);
    text-decoration: underline;
}

/* Footer
	========================================================================== */
.footer {
    position: relative;
    overflow: hidden;
    
    overflow: hidden;
    background: radial-gradient(circle at 55% 35%, #282828, #171717 68%);
}

.footer__inner {
    min-height: 100vh;
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 73px 0 228px;
}

.footer__tagline {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 26px 0 0 1px;
    max-width: 360px;
    font-size: 16px;
    line-height: 1.35;
}

.footer__tagline a {
    color: var(--blue);
    text-decoration: underline;
}

.footer__tagline p {
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: inherit;
}

.footer__bottom {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: end;
}

.footer__nav {
    display: flex;
    gap: 32px;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
}

.footer__nav a {
    min-width: max-content;
}

.footer__nav a,
.footer__credit a {
    transition: color .2s, transform .2s ease;
}

.footer__nav a:hover,
.footer__credit a:hover {
    color: var(--blue);
}
.footer__nav a:hover,
.footer__nav a.is-active {
    color: var(--blue);
}

.footer__nav a:not(.is-active):hover {
    transform: translateY(-7px);
}

.footer__nav a:not(.is-active):hover:after {
    content: '';
    left: 0;
    bottom: -10px;
    width: 100%;
    height: 10px;
    position: absolute;
    z-index: 1;
}

.footer__copy,
.footer__credit {
    color: rgba(255, 255, 255, .56);
    font-size: 20px;
}

.footer__copy {
    margin: 69px 0 -8px;
}
.footer__copy * {
    font-size: inherit;
    line-height: inherit;
}

.footer__copy a {
    color: var(--blue);
    text-decoration: underline;
}

.footer__credit {
    display: none;
    margin: 0 0 -8px;
}

.footer__credit a {
    color: var(--blue);
    text-decoration: underline;
}

.footer__seal {
    position: relative;
    right: auto;
    bottom: auto;
    justify-self: end;
    width: 120px;
    height: 120px;
    margin-right: 178px;
    margin-bottom: -58px;
}

/* За Guarantee.psd: ink 133..1788 x, верх ink на footer_top+613; кегль як
   у .guarantee-features__wordmark (256px). */
.footer__wordmark {
    position: absolute;
    top: 578px;
    left: 50%;
    color: rgba(0, 0, 0, .13);
    font-size: 256px;
    font-weight: 900;
    letter-spacing: -.07em;
    line-height: 1;
    transform: translateX(calc(-50% - 12px));
    white-space: nowrap;
}

/* Internal Pages / Shared
	========================================================================== */

.page--light-header .header__controls {
    border-color: rgba(23, 23, 23, .55);
    color: #171717;
    background: rgba(255, 255, 255, .5);
}

.page--light-header .icon-button,
.page--light-header .menu-toggle {
    color: #171717;
}

.page--light-header .header__divider,
.page--light-header .menu-toggle::before,
.page--light-header .menu-toggle::after,
.page--light-header .menu-toggle span {
    background: #171717;
}

.page--light-header .header__inner > .logo img {
    filter: brightness(0);
}

.page--light-header.menu-open .header__inner > .logo img {
    filter: none;
}

.page--light-header.menu-open .menu-toggle::before,
.page--light-header.menu-open .menu-toggle::after,
.page--light-header.menu-open .menu-toggle span {
    background: #fff;
}

.pill-link {
    display: inline-flex;
    min-width: 210px;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 12px 24px;
    border-radius: 28px;
    color: #fff;
    background: #171717;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.pill-link .square-arrow,
.catalog-product__buy .square-arrow {
    --arrow-size: 15px;
    --arrow-thickness: 3px;
    --arrow-shaft: 17px;
    --arrow-top: 0px;
    --arrow-right: -1px;
}

/* Content Page / Text Columns
	========================================================================== */
.content-page {
    color: #171717;
    background: #fff;
}

.ruled-heading {
    padding-bottom: 16px;
    border-bottom: 1px solid #777;
}

.ruled-heading p {
    margin: 0;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.text-columns {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* За PSD колонки фіксовані 418px з проміжком 28px і починаються на 445px
   від лівого краю контейнера, лишаючи ~454px порожнього поля справа.
   Не повертати `width: 66%` + `margin-left: auto` — це розтягує текст до краю. */
.text-columns--offset {
    margin: 24px auto 0 30%;
}

.text-columns p {
    margin: 0;
    font-size: 14px;
    line-height: 1.35;
}

.text-columns h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
}

.text-columns h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
}

.text-columns ul {
    margin: 0;
    padding-left: 18px;
    font-size: 14px;
    line-height: 1.4;
}

.text-columns ul li + li {
    margin-top: 6px;
}

.expandable__content {
    position: relative;
    overflow: hidden;
}

.expandable:not(.is-expanded) .expandable__content {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
}

.expandable:not(.is-expanded) .expandable__content::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 56px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
    content: '';
    pointer-events: none;
}

.expandable__toggle {
    display: block;
    margin: 24px 0 0 30%;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--blue);
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.category-description {
    padding: 64px 0;
}

/* Guarantee.psd: основний текст 16px з кроком рядка 24px (line-height 1.5),
   службовий заголовок над лінійкою — 16px. Скоуплено на сторінку, бо
   delivery.php і catalog.php звірялись зі своїми PSD і поки лишаються на 14px. */
.page-guarantee .text-columns p {
    font-size: 16px;
    line-height: 1.5;
}

.page-guarantee .ruled-heading p {
    font-size: 16px;
}

.page-guarantee .ruled-heading {
    padding-bottom: 10px;
}

/* About Page
	========================================================================== */
.about-page-hero {
    position: relative;
    overflow: hidden;
    background: #181818 url('../image/pages/about/hero-car-clean.jpg') center 197px / 100% auto no-repeat;
}

.about-page-hero::after {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(23, 23, 23, .98) 0 26%, rgba(23, 23, 23, .2) 60%, rgba(23, 23, 23, .74));
    content: '';
}

.about-page-hero__inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 100vh;
}

.about-page-hero h1 {
    display: flex;
    flex-direction: column;
    gap: 20px 0;
    margin: 240px 0 0;
    font-weight: 900;
    letter-spacing: -.05em;
    line-height: .82;
    text-transform: uppercase;
}

.about-page-hero__meet {
    padding-top: 7px;
    font-size: 69px;
    white-space: nowrap;
}

.about-page-hero__brand {
    display: flex;
    flex-direction: column;
    font-size: 74px;
    display: inline-block;
}

.about-page-hero h1 strong {
    color: var(--blue);
    font: inherit;
}

.about-page-hero p {
    margin: auto 0 62px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.about-page-hero__seal {
    top: 293px;
    right: 120px;
    bottom: auto;
}

.offer-page {
    color: #171717;
    background: #fff;
}

.offer-page__inner {
    display: grid;
    min-height: 1030px;
    grid-template-columns: 403px minmax(0, 1168px);
    grid-template-rows: 220px 570px;
    column-gap: 191px;
    row-gap: 70px;
    padding-top: 77px;
}

.offer-page__heading {
    grid-column: 1;
    grid-row: 1;
}

.offer-page__heading h2 {
    margin: 28px 0 0;
    font-size: 64px;
    font-weight: 800;
    line-height: 1.05;
}

.offer-page__copy {
    width: 720px;
    max-width: 90%;
    grid-column: 2;
    grid-row: 1;
    margin-left: 10%;
    padding-top: 51px;
}

.offer-page__copy > p {
    margin: 0 0 30px;
    font-size: 15px;
    line-height: 1.35;
}

.offer-page__tabs {
    width: 403px;
    align-self: center;
    grid-column: 1;
    grid-row: 2;
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: offer;
}

.offer-page__tabs li {
    display: flex;
    align-items: center;
    padding: 0 0 0 4px;
    font-size: 15px;
    font-weight: 600;
    counter-increment: offer;
}

.offer-page__tabs li::before {
    margin-right: 20px;
    margin-left: 0;
    transition: margin-left .2s ease;
    content: '0' counter(offer);
}

.offer-page__tabs li.is-active::before {
    margin-left: 20px;
}

.offer-page__tabs li.is-active,
.offer-page__tabs li:hover {
    color: var(--blue);
}

.offer-page__tabs button {
    padding: 0;
    border: 0;
    color: inherit;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    min-height: 80px;
}
.offer-page__tabs li:hover,
.offer-page__tabs li.is-active {
    background: #f3f3f3;
    box-shadow: -80px 0 #f3f3f3;
}

.offer-page__media {
    position: relative;
    display: block;
    overflow: hidden;
    grid-column: 2;
    grid-row: 2;
    border-radius: 22px;
    background: #171717;
}

.offer-page__image {
    display: block;
    width: 100%;
    height: 570px;
    object-fit: cover;
    transition: opacity .2s ease;
}

.offer-page__media.is-loading .offer-page__image {
    opacity: .28;
}

.offer-page__loader {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    display: none;
    width: 42px;
    height: 42px;
    margin: -21px 0 0 -21px;
    border: 3px solid rgba(255, 255, 255, .32);
    border-top-color: var(--blue);
    border-radius: 50%;
    animation: offer-loader .65s linear infinite;
}

.offer-page__media.is-loading .offer-page__loader {
    display: block;
}

@keyframes offer-loader {
    to { transform: rotate(1turn); }
}

.experience-page {
    background: radial-gradient(circle at 50% 40%, #303030, #191919 68%);
}

.experience-page__inner {
    position: relative;
    display: grid;
    grid-template-columns: 54% 1fr;
    grid-template-rows: auto 1fr auto;
    grid-template-areas:
        "media title"
        ".     ."
        "stats stats";
    min-height: 100vh;
    padding: 150px 0 40px;
}

.experience-page__media {
    grid-area: media;
    align-self: start;
    position: relative;
    width: 724px;
    max-width: 100%;
    aspect-ratio: 724 / 410;
}

.experience-page__image {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: auto;
    max-width: none;
}

.experience-page__image--products {
    z-index: 1;
    width: 69.2%;
    transform: translate3d(0, 0, 0);
}

.experience-page__image--detailing {
    z-index: 2;
    width: 42.68%;
    transform: translate3d(134.3%, 62.1%, 0);
}

.experience-page__title {
    grid-area: title;
    align-self: start;
    width: 100%;
    text-align: right;
}

.experience-page__title h2 {
    margin: 25px 0;
    font-size: 64px;
    font-weight: 800;
    line-height: 1.04;
}

.experience-page__title > p:last-child {
    margin-left: auto;
    max-width: 470px;
    font-size: 14px;
}

.experience-page__stats {
    grid-area: stats;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 50px;
}

.experience-page__stats strong,
.experience-page__stats span {
    display: block;
}

.experience-page__stats strong {
    font-size: 54px;
    font-weight: 800;
}

.experience-page__stats span {
    margin-top: 10px;
    font-size: 12px;
    font-weight: 700;
}

/* Guarantee Page
	========================================================================== */
.guarantee-hero {
    overflow: hidden;
    color: #171717;
    background: #f9f9f9;
}

.guarantee-hero__inner {
    position: relative;
    min-height: 110vh;
    padding-top: 353px;
}

.guarantee-hero__copy {
    margin-left: 1px;
}

/* Guarantee.psd: cap height 50px, крок рядка 85px, трекінг ~0.
   Не повертати -.04em — з ним рядок «ВІД ВИРОБНИКА» коротшає на 12px. */
.guarantee-hero h1 {
    margin: 0;
    font-size: 71px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.2;
    text-transform: uppercase;
}

.guarantee-hero p {
    margin: 31px 0 0 -1px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}

.guarantee-hero__art img {
    position: absolute;
    display: block;
    max-width: none;
}

.guarantee-hero__card {
    top: 180px;
    right: 1px;
    width: 501px;
    height: 373px;
}

.guarantee-hero__woman {
    z-index: 2;
    top: 153px;
    right: 161px;
    width: 272px;
    height: 387px;
}

.guarantee-hero__envelope {
    z-index: 3;
    top: 371px;
    right: 457px;
    width: 227px;
    height: 186px;
}

.guarantee-hero__seal {
    z-index: 4;
    top: 328px;
    right: 523px;
    bottom: auto;
    left: auto;
}

.guarantee-copy {
    padding: 126px 0 117px;
    overflow: hidden;
}

.guarantee-intro .text-columns {
    align-items: start;
    margin-top: 11px;
}

.guarantee-intro .text-columns > div {
    display: grid;
    gap: 27px;
}

.guarantee-intro .text-columns > div p {
    margin: 0;
}

.team-page {
    position: relative;
    margin-top: 65px;
}

.team-page__media {
    overflow: hidden;
    border-radius: 20px;
}

.team-page__media img {
    display: block;
    width: 100%;
    height: 100vh;
    max-width: none;
}

.team-page > div {
    text-align: right;
}

.team-page > div:last-child {
    position: absolute;
    top: 106px;
    right: 0;
    width: 580px;
}

.team-page h2 {
    margin: 36px 0 36px;
    font-size: 61px;
    font-weight: 800;
    line-height: 1.02;
}

.team-page > div > p:last-of-type {
    width: 420px;
    margin-left: auto;
    font-size: 16px;
    line-height: 1.5;
}

/* Іконки 32x32 з кроком 48px (група `icon` у Guarantee.psd), останню
   вирівняно по правому краю контейнера. */
.team-page__socials {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 39px;
}

.team-page__socials a {
    display: block;
    width: 32px;
    height: 32px;
}

.team-page__socials img {
    display: block;
    width: 100%;
    height: 100%;
}

.guarantee-features {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 279px);
    gap: 15px;
    width: 100%;
    max-width: 900px;
    min-height: 116px;
    margin: 60px auto 0;
}

/* Великий світлий напис під колонками переваг (група `04` PSD, ink 1653x170). */
.guarantee-features__wordmark {
    position: absolute;
    z-index: 0;
    top: 119px;
    left: 50%;
    color: rgba(0, 0, 0, .012);
    font-size: 256px;
    font-weight: 900;
    letter-spacing: -.07em;
    line-height: 1;
    /* -12px компенсує від'ємний трекінг після останньої літери, інакше
       напис зміщений праворуч відносно PSD. */
    transform: translateX(calc(-50% - 12px));
    white-space: nowrap;
    pointer-events: none;
}

.guarantee-features h3 {
    margin: 0;
    color: var(--blue);
    font-size: 16px;
    line-height: 1.1;
}

.guarantee-features p {
    margin: 12px 0 0;
    color: #777;
    font-size: 16px;
    line-height: 1.25;
}

.guarantee-copy__link {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 273px;
    width: max-content;
    margin: 45px auto 0;
}

.guarantee-copy__promise {
    margin-top: 150px;
}

.guarantee-copy__promise .text-columns {
    margin-top: 13px;
}

.guarantee-copy__promise .text-columns > div {
    display: grid;
    gap: 27px;
}

.guarantee-copy__promise .text-columns > div p {
    margin: 0;
}

.guarantee-banner {
    position: relative;
    display: block;
    height: 483px;
    margin-top: 73px;
    overflow: hidden;
    border-radius: 20px;
    color: #fff;
}

/* Фон уже містить віньєтку з PSD (краї ~rgb(9,9,9), центр ~rgb(131,104,84)).
   Плоский overlay її не відтворює — не повертати rgba(0,0,0,.14) поверх чистого фото. */
.guarantee-banner__background {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    opacity: 0;
    transition: opacity .5s ease;
    pointer-events: none;
}

.guarantee-banner__background.is-active {
    opacity: 1;
}

.guarantee-banner__background img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.guarantee-banner__actions {
    position: absolute;
    z-index: 2;
    top: 320px;
    left: 48px;
    display: flex;
    gap: 13px;
}

.guarantee-banner__action {
    position: relative;
    display: flex;
    width: 579px;
    height: 115px;
    flex-direction: column;
    justify-content: flex-end;
    padding: 0 18px 17px;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, .85);
    border-radius: 20px;
    color: #fff;
    background: rgba(8, 13, 14, .76);
    font-family: inherit;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer;
    transition: width .4s cubic-bezier(.65, 0, .35, 1), color .25s ease, background-color .25s ease, border-color .25s ease;
}

.guarantee-banner__action.is-active {
    width: 280px;
    border-color: #a7c70e;
    color: #111;
    background: #a7c70e;
}

.guarantee-banner__action:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 3px;
}

.guarantee-banner__action b,
.guarantee-banner__action small {
    position: relative;
    z-index: 2;
    display: block;
    line-height: 1;
}

.guarantee-banner__action b {
    font-size: 23px;
    font-weight: 800;
}

.guarantee-banner__action small {
    margin-top: 6px;
    font-size: 9px;
    font-weight: 700;
}

/* У PSD взуття — окрема вкладена панель 278x105 (`Rectangle 3 copy 8`),
   втоплена на 5px від краю картки, а не фото на всю висоту впритул до краю. */
.guarantee-banner__panel {
    position: absolute;
    z-index: 1;
    top: 5px;
    right: 5px;
    display: block;
    overflow: hidden;
    width: 278px;
    height: 105px;
    border-radius: 18px;
    opacity: 1;
    transition: opacity .25s ease;
}

.guarantee-banner__panel img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.guarantee-banner__action.is-active .guarantee-banner__panel {
    opacity: 0;
}

.guarantee-banner__action .square-arrow {
    --arrow-size: 26px;
    --arrow-thickness: 5px;
    --arrow-shaft: 29px;
    position: absolute;
    z-index: 3;
    top: 26px;
    right: 17px;
    transition: transform .3s ease;
}

/* Акцентна картка в PSD має стрілку вниз-праворуч, фото-картка — вгору-праворуч. */
.guarantee-banner__action.is-active .square-arrow {
    transform: rotate(90deg);
}

.guarantee-banner__copy {
    position: absolute;
    z-index: 2;
    bottom: 48px;
    right: 48px;
    display: block;
    width: 540px;
    text-align: right;
}

.guarantee-banner__copy b,
.guarantee-banner__copy small {
    display: block;
}

.guarantee-banner__copy b {
    font-size: 74px;
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: 1;
    white-space: nowrap;
}

.guarantee-banner__copy small {
    margin-top: 20px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}

@media (min-width: 768px) and (max-width: 1600px) {
    .guarantee-hero__art {
        position: absolute;
        inset: 0;
        top: 150px;
        transform: scale(.8);
        transform-origin: right top;
    }

    .team-page__media {
        width: 58%;
    }

    .team-page__media img {
        object-fit: cover;
        width: 100%;
    }

    .team-page > div:last-child {
        width: 40%;
    }

    .team-page h2 {
        font-size: clamp(46px, 4.1vw, 61px);
    }

    .team-page > div > p:last-of-type {
        width: 100%;
    }

    .guarantee-features {
        width: min(868px, 100%);
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .guarantee-banner__actions {
        left: 32px;
        width: 54%;
    }

    .guarantee-banner__action {
        width: calc(66% - 6px);
    }

    .guarantee-banner__action.is-active {
        min-width: calc(34% - 6px);
    }

    .guarantee-banner__copy {
        right: 32px;
        width: 38%;
    }

    .guarantee-banner__copy b {
        font-size: clamp(48px, 4.2vw, 64px);
    }
}

@media (max-width: 1260px) {
    .guarantee-hero__art {
        top: 0;
    }
}
@media (max-width: 1080px) {
    .guarantee-hero__copy {
        top: 500px
    }
}

/* Accessibility Utilities
	========================================================================== */
.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Delivery Page
	========================================================================== */
.delivery-hero {
    padding-top: 200px;
    padding-bottom: 60px;
    overflow: hidden;
    background: #191919;
}

.delivery-hero__inner {
    position: relative;
    display: grid;
    grid-template-columns: 380px 1fr;
    grid-gap: 0 20px;
}

.delivery-hero__intro {
    width: 100%;
}

.delivery-hero h1 {
    margin: 0 0 14px;
    font-size: 68px;
    font-weight: 800;
}

.delivery-hero__intro > p {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}
.delivery-hero__promise {
    margin-top: 20px;
    display: block;
}
.delivery-hero__icons {
    display: flex;
    gap: 33px;
    margin: 38px 0 82px 8px;
}

.delivery-hero__icons button {
    width: 70px;
    height: 70px;
    padding: 0;
    border: 0;
    background-color: transparent;
    background-position: center;
    background-size: cover;
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease;
}

.delivery-hero__icons button:hover,
.delivery-hero__icons button:focus-visible {
    transform: translateY(-3px);
    outline: none;
}
.delivery-hero__icons button:hover::after,
.delivery-hero__icons button:focus-visible::after {
    position: absolute;
    left: 2px;
    top: 2px;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    content: '';
    border-radius: 15px;
    box-shadow: 0 0 0 2px var(--blue);
    z-index: 1;
}


.delivery-icon--247 { background-image: url('../image/pages/delivery/icon-247.png'); }
.delivery-icon--location { background-image: url('../image/pages/delivery/icon-location.png'); }
.delivery-icon--box { background-image: url('../image/pages/delivery/icon-box.png'); }

.delivery-info-modal {
    position: fixed;
    z-index: 70;
    inset: 0;
    display: grid;
    visibility: hidden;
    place-items: center;
    padding: 20px;
    opacity: 0;
    transition: visibility .3s ease, opacity .3s ease;
}

.delivery-info-modal.is-open {
    visibility: visible;
    opacity: 1;
}

.delivery-info-modal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: rgba(0, 0, 0, .8);
    cursor: default;
}

.delivery-info-modal__panel {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 420px;
    padding: 40px;
    border: 1px solid #262626;
    border-radius: 34px;
    color: #fff;
    background: #161616;
    transform: translateY(16px);
    transition: transform .3s ease;
}

.delivery-info-modal.is-open .delivery-info-modal__panel {
    transform: translateY(0);
}

.delivery-info-modal__close {
    position: absolute;
    top: 22px;
    right: 22px;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid #333;
    border-radius: 50%;
    color: #999;
    background: transparent;
    cursor: pointer;
    transition: color .2s ease;
}

.delivery-info-modal__close svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.delivery-info-modal__close:hover {
    color: var(--blue);
}

.delivery-info-modal__title {
    margin: 0;
    padding-right: 30px;
    font-size: 24px;
    font-weight: 900;
    text-transform: uppercase;
}

.delivery-info-modal__text {
    margin: 14px 0 0;
    color: #ccc;
    font-size: 14px;
    line-height: 1.5;
}

.delivery-hero__intro strong {
    font-size: 13px;
    text-transform: uppercase;
}

.delivery-switcher {
    z-index: 1;
    display: flex;
    width: 100%;
    gap: 1%;
    overflow: hidden;
}

.delivery-panel {
    position: relative;
    display: block;
    min-width: 0;
    height: 100vh;
    flex: 0 0 calc((100% - 15px) / 3);
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background-color: #08353b;
    background-position: center;
    background-size: cover;
    color: #fff;
    cursor: pointer;
    appearance: none;
    text-align: left;
    transition: flex-basis .55s cubic-bezier(.65, 0, .35, 1), filter .35s ease;
}

.delivery-panel::before {
    position: absolute;
    z-index: 0;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 35, 40, .14), rgba(0, 25, 29, .5));
    content: '';
    transition: background .35s ease;
}

.delivery-panel:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: -2px;
}

.delivery-panel.is-active {
    flex-basis: calc(100% - 180px);
    cursor: default;
}

.delivery-switcher:has(.delivery-panel.is-active) .delivery-panel:not(.is-active) {
    flex-basis: 80px;
}

.delivery-switcher:has(.delivery-panel.is-active) .delivery-panel:not(.is-active) .delivery-panel__card {
    display: none;
}

.delivery-panel.is-active::before {
    background: linear-gradient(180deg, rgba(0, 35, 40, .36), rgba(18, 22, 23, .5));
}

.delivery-panel--ukr {
    background-image: url('../image/pages/delivery/ukr-bg.webp');
    background-position: 50% center;
}

.delivery-panel--nova {
    background-image: url('../image/pages/delivery/nova-bg.webp');
    background-position: center;
}

.delivery-panel--meest {
    background-image: url('../image/pages/delivery/meest-bg.webp');
    background-position: 54% center;
}

.delivery-panel__word {
    position: absolute;
    z-index: 1;
    top: -6px;
    right: -7px;
    color: rgba(255, 255, 255, .82);
    font-size: 89px;
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: .84;
    text-transform: uppercase;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
    transition: opacity .3s ease;
}

.delivery-panel.is-active .delivery-panel__word {
    opacity: .1;
}

.delivery-panel__content {
    position: relative;
    z-index: 2;
    padding-left: 33px;
    display: block;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition: opacity .25s ease .18s, transform .35s ease .18s;
}

.delivery-panel.is-active .delivery-panel__content {
    opacity: 1;
    transform: none;
}

.delivery-panel__content b {
    display: block;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(255, 255, 255, .65);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.delivery-panel__content > span {
    display: block;
    width: 100%;
    max-width: 520px;
    margin: 20px 0 0 auto;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

.delivery-panel__card {
    position: absolute;
    z-index: 2;
    bottom: 32px;
    left: 4.24%;
    display: block;
    width: 91.17%;
    height: 115px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 25px;
    background: rgba(245, 248, 246, .78);
    backdrop-filter: blur(4px);
    pointer-events: none;
    transition: left .55s cubic-bezier(.65, 0, .35, 1), width .55s cubic-bezier(.65, 0, .35, 1), background .35s ease, transform .55s cubic-bezier(.65, 0, .35, 1);
}

.delivery-panel__card-copy {
    display: none;
}

.delivery-panel.is-active .delivery-panel__card {
    left: 15.96%;
    width: 79.64%;
    background: rgba(14, 18, 19, .82);
}

.delivery-panel__card-brand {
    position: absolute;
    z-index: 2;
    top: 2px;
    right: 2px;
    left: 2px;
    display: grid;
    height: 109px;
    place-items: center;
    overflow: hidden;
    border-radius: 22px;
    background: rgba(244, 244, 242, .82);
    transition: left .35s ease, width .35s ease, background .35s ease;
}

.delivery-panel.is-active .delivery-panel__card-brand {
    left: auto;
    width: 48.36%;
    background: #f4f4f2;
}

.delivery-panel__card-brand img {
    display: block;
    width: auto;
    max-width: 78%;
    height: auto;
    max-height: 68%;
    object-fit: contain;
}

.delivery-panel--ukr .delivery-panel__card-brand img {
    max-width: 82%;
}

.delivery-panel--nova .delivery-panel__card-brand img {
    max-width: 75%;
    max-height: 64%;
}

.delivery-panel--meest .delivery-panel__card-brand img {
    max-width: 76%;
    max-height: 62%;
}

.delivery-panel.is-active .delivery-panel__card-copy {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 16px;
    display: flex;
    width: 49.9%;
    height: 115px;
    flex-direction: column;
    justify-content: flex-end;
    padding-bottom: 16px;
}

.delivery-panel__card-copy b,
.delivery-panel__card-copy small {
    display: block;
    color: #fff;
    line-height: 1;
}

.delivery-panel__card-copy b {
    font-size: 25px;
    font-weight: 800;
}

.delivery-panel__card-copy small {
    margin-top: 5px;
    font-size: 10px;
    font-weight: 700;
}

.delivery-copy {
    padding: 103px 0 80px;
}

.delivery-copy .text-columns {
    margin-top: 13px;
}

@media (max-width: 1080px) {
    .delivery-hero__inner {
        display: block;
    }
    .delivery-hero__icons {
        margin-bottom: 30px;
    }
}

/* Contacts Page
	========================================================================== */
.contacts-page {
    background: radial-gradient(circle at 52% 45%, #303030, #191919 65%);
}

.contacts-page__inner {
    min-height: 100vh;
    padding-bottom: 5%;
    padding-top: 15%;
}

.contacts-page h1 {
    margin: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, .65);
    font-size: 72px;
    font-weight: 800;
    line-height: 1;
}

.contacts-page__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    margin-top: 75px;
    font-size: 15px;
    font-weight: 900;
    text-transform: uppercase;
}

.contacts-page__grid > div {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.contacts-page__grid address {
    display: inline-block;
    font-style: normal;
    line-height: 1.8;
}

.contacts-page__route {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    color: var(--blue);
}

.contacts-page__route i {
    position: relative;
    min-width: 16px;
    height: 21px;
    border: 2px solid var(--blue);
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
}

.contacts-page__route i::after {
    position: absolute;
    top: 5px;
    left: 5px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--blue);
    content: '';
}

.contacts-page__grid > div:last-child a {
    display: block;
    margin-bottom: 15px;
}

.contacts-page__socials {
    display: flex;
    gap: 10px;
    margin-top: 44px;
}

.contacts-page__socials a {
    padding: 5px 10px;
    border-radius: 12px;
    color: #171717;
    background: #fff;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

.contacts-page__inner > p {
    margin-top: 36px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.back-home {
    color: #171717;
    background: #fff;
}

.back-home__inner {
    position: relative;
    padding: 90px 0;
}

.back-home h2::after {
    position: absolute;
    bottom: -20px;
    right: 0;
    left: 0;
    height: 1px;
    background: #999;
    content: '';
}

.back-home__inner > div {
    text-align: right;
}

.back-home__inner > div > div {
    max-width: 60%;
    margin-left: auto;
}

.back-home h2 {
    margin: 0;
    font-size: 70px;
    font-weight: 800;
    line-height: 1;
    padding-left: 75px;
    position: relative;
}

.back-home p {
    margin-top: 31px;
    font-size: 13px;
}

.back-home__inner > a {
    position: absolute;
    inset: 0;
}

.back-home__arrow {
    position: absolute;
    top: 0;
    left: 0;
    width: 72px;
    height: 72px;
    border-top: 13px solid #171717;
    border-left: 13px solid #171717;
}

.back-home__arrow::after {
    position: absolute;
    top: -12px;
    left: -6px;
    width: 80px;
    height: 13px;
    background: #171717;
    content: '';
    transform: rotate(45deg);
    transform-origin: left center;
}

/* Планшет: media.css підключений лише до 767px, тож на 768–1023 діяв
   десктопний кегль 70px — заголовок ламався на рядки й розходився зі
   стрілкою. Тут проміжна розкладка. */
@media (max-width: 1023px) {
    .back-home__inner {
        padding: 72px 0;
    }

    .back-home h2 {
        padding-left: 62px;
        font-size: clamp(42px, 6.2vw, 58px);
    }

    .back-home__inner > div > div {
        max-width: 74%;
    }

    /* лише дві сторони: скидання Tailwind робить усі рамки solid, тому
       border-width малює квадрат замість кута */
    .back-home__arrow {
        width: 56px;
        height: 56px;
        border-top-width: 11px;
        border-left-width: 11px;
    }

    .back-home__arrow::after {
        width: 63px;
        height: 11px;
        left: -7px;
        top: -10px;
    }
}

/* Catalog / Product Page
	========================================================================== */
.catalog-product {
    position: relative;
    overflow: hidden;
    background: #151515;
}

.catalog-product.scroll-fade-visible::after {
    opacity: .5;
    transform: translateY(15px) translateX(-50%);
}

.catalog-product::after {
    position: absolute;
    bottom: 0;
    left: 50%;
    color: #fafafa;
    content: 'HYDROPHOB';
    font-size: 158px;
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: .8;
    pointer-events: none;
    opacity: 0;
    transform: translateY(135px) translateX(-50%);
    transition: opacity .9s ease, transform .9s ease;
}

.catalog-product__background {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    background: #151515;
}

.catalog-product__background::after {
    position: absolute;
    inset: 0;
    background: rgba(10, 10, 10, .08);
    content: '';
}

.catalog-product__background img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    opacity: 0;
    transform: scale(1.01);
    transition: opacity .5s ease, transform .7s ease;
}

.catalog-product__background img.is-current,
.catalog-product__background img.is-entering {
    opacity: 1;
    transform: scale(1);
}

.catalog-product__inner {
    position: relative;
    min-height: calc(100vh + 170px);
    padding-top: 170px;
}

.catalog-product__topline {
    position: relative;
    z-index:111;
    display: flex;
    justify-content: space-between;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .5);
}

.catalog-product__topline button {
    border: 0;
    color: #fff;
    background: transparent;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    transition: color .25s ease;
}

.catalog-product__topline > button[aria-expanded='true'] {
    color: var(--blue);
}

.catalog-product__topline > button span {
    position: relative;
    display: inline-block;
    width: 43px;
    height: 24px;
    font-size: 0;
    vertical-align: middle;
    margin-left: 10px;
}

.catalog-product__topline > button span::before,
.catalog-product__topline > button span::after {
    position: absolute;
    left: 0;
    width: 43px;
    height: 2px;
    background: #fff;
    content: '';
    box-shadow: 0 10px #fff;
    transition: background-color .25s ease, box-shadow .25s ease;
}

.catalog-product__topline > button span::before {
    top: 3px;
}

.catalog-product__topline > button span::after {
    top: 3px;
    left: 10px;
    width: 7px;
    height: 7px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #171717;
    box-shadow: 18px 10px 0 -2px #171717, 18px 10px 0 0 #fff;
    transition: left .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.catalog-product__topline > button[aria-expanded='true'] span::before {
    background: var(--blue);
    box-shadow: 0 10px var(--blue);
}

.catalog-product__topline > button[aria-expanded='true'] span::after {
    left: 28px;
    border-color: var(--blue);
    box-shadow: -18px 10px 0 -2px #171717, -18px 10px 0 0 var(--blue);
}

.catalog-product__topline nav {
    display: flex;
    gap:10px 25px;
    flex-wrap: wrap;
}

.catalog-product__topline nav a {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    transform: translateY(0);
    transition: transform .25s ease, color .25s ease;
    position: relative;
    z-index: 1;
    display: inline-block;
    cursor: pointer;
}

.catalog-product__topline nav a:hover,
.catalog-product__topline nav a.is-active {
    color: var(--blue);
}

.catalog-product__topline nav a:not(.is-active):hover {
    transform: translateY(-10px);
}

.catalog-product__topline nav a:not(.is-active):hover:after {
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 100%;
    height: 10px;
    content: '';
    z-index: 111;
    cursor: pointer;
}
.catalog-product__filter {
    position: absolute;
    z-index: 111;
    flex-direction: column;
    gap: 20px;
    top: 220px;
    right: 0;
    left: 0;
    padding: 28px;
    background: rgba(255, 255, 255, .12);
    backdrop-filter: blur(16px);
}

.catalog-product__filter:not([hidden]) {
    display: flex;
}

.catalog-product__filter-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.catalog-product__filter-title {
    margin: 0;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.catalog-product__filter-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.catalog-product__filter label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    cursor: pointer;
}

.catalog-product__filter input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.catalog-product__filter i {
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
    border: 1px solid #aaa;
    border-radius: 2px;
}

.catalog-product__filter input:checked + i {
    border-color: var(--blue);
    background: var(--blue);
    box-shadow: inset 0 0 0 2px #fff;
}

.catalog-product__filter-range {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    font-size: 13px;
}

.catalog-product__filter-range input[type="number"] {
    width: 80px;
    padding: 8px 10px;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 6px;
    background: transparent;
    color: #fff;
    font-size: 13px;
}

.catalog-product__filter-range input[type="number"]::placeholder {
    color: rgba(255, 255, 255, .6);
}

.catalog-product__visual {
    display: none;
}

.catalog-product__visual img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.catalog-product__visual img.is-main {
    opacity: 1;
}

.catalog-product__controls {
    position: absolute;
    z-index: 3;
    top: 360px;
    right: 100px;
    width: 149px;
    align-items: center;
    justify-content: space-between;
}

.catalog-product__controls:not([hidden]) {
    display: flex;
}

.catalog-product__scroll-mobile {
    display: none;
}

.catalog-product__scroll {
    display: grid;
    width: 83px;
    height: 83px;
    flex: 0 0 83px;
    place-items: center;
    border: 1px solid #fff;
    border-radius: 50%;
    font-size: 12px;
}

.catalog-product__controls button {
    position: relative;
    width: 25px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.catalog-product__controls button:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 4px;
}

.catalog-product__controls button span {
    position: absolute;
    top: 50%;
    left: 2px;
    width: 20px;
    height: 1px;
    background: #fff;
    transition: background-color .2s ease;
}

.catalog-product__controls button span::after {
    position: absolute;
    top: -3px;
    right: 0;
    width: 7px;
    height: 7px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    content: '';
    transform: rotate(45deg);
    transition: border-color .2s ease;
}

.catalog-product__controls button:first-child span {
    transform: rotate(180deg);
}

.catalog-product__controls button:hover span {
    background: var(--blue);
}

.catalog-product__controls button:hover span::after {
    border-top-color: var(--blue);
    border-right-color: var(--blue);
}

.catalog-product__dots {
    display: none;
}

.catalog-product__copy,
.catalog-product__buy {
    transition: opacity .22s ease, transform .22s ease;
}

.catalog-product.is-group-switching .catalog-product__copy,
.catalog-product.is-group-switching .catalog-product__buy {
    opacity: 0;
    transform: translateY(8px);
}

.catalog-product__copy {
    width: 100%;
    max-width: 420px;
}

.catalog-product__copy small,
.catalog-product__buy small {
    display: block;
    font-size: 11px;
    font-weight: 700;
}

.catalog-product__buy small[hidden] {
    display: none;
}

.catalog-product__copy h1 {
    margin: 8px 0 18px;
    font-size: 28px;
}

.catalog-product__copy > strong {
    display: block;
    margin-bottom: 16px;
    font-size: 13px;
}

.lead-more {
    display: block;
    margin: -8px 0 16px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--blue);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.catalog-product__thumbs-wrap {
    position: relative;
    width: fit-content;
}

.catalog-product__thumbs-nav {
    position: absolute;
    z-index: 2;
    top: 50%;
    display: flex;
    width: 38px;
    height: 38px;
    align-items: center;
    justify-content: center;
    padding: 0;
    transform: translateY(-50%);
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 50%;
    background: rgba(10, 10, 10, .6);
    color: #fff;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, background .2s ease;
}

.catalog-product__thumbs-wrap:hover .catalog-product__thumbs-nav,
.catalog-product__thumbs-nav:focus-visible {
    opacity: 1;
    pointer-events: auto;
}

.catalog-product__thumbs-nav:hover {
    background: rgba(10, 10, 10, .85);
}

.catalog-product__thumbs-nav svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.catalog-product__thumbs-nav--prev { left: 6px; }
.catalog-product__thumbs-nav--next { right: 6px; }

.catalog-product__thumbs {
    display: flex;
    gap: 7px;
    margin-top: 35px;
    /* рівно три мініатюри: ширина = 3 × 135 + 2 проміжки по 7, без хвостика четвертої */
    max-width: calc(135px * 3 + 7px * 2);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.catalog-product__thumbs::-webkit-scrollbar {
    display: none;
}

.catalog-product__thumbs button {
    flex-shrink: 0;
    width: 135px;
    height: 135px;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 10px;
    background: transparent;
    cursor: pointer;
    scroll-snap-align: start;
    transition: border-color .2s ease, background-color .2s ease;
}

.catalog-product__thumbs button.is-active {
    border-color: var(--blue);
    background: rgba(28, 187, 231, .12);
    box-shadow: 0 0 0 1px var(--blue) inset;
}

.catalog-product__thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.catalog-product__content {
    display: flex;
    gap: 0 30px;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: calc(50% + 80px);
    left: calc(50% + 80px);
    transform: translate(-50%, -50%);
}
.catalog-product__buy {
    z-index: 3;
    display: flex;
    width: 280px;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

.catalog-product__buy > strong {
    font-size: 30px;
}

.catalog-product__buy label {
    font-size: 12px;
}

.catalog-product__buy > p {
    margin: 0;
    font-size: 12px;
}

.catalog-product__buy > p b {
    margin-left: 10px;
    padding: 7px 14px;
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 20px;
    font-weight: 500;
}

.catalog-product__buy [data-stock-state="available"] {
    color: var(--blue);
}

.catalog-product__buy [data-stock-state="unavailable"] {
    color: #ff7067;
}

.catalog-product__buy [data-product-volume-value] {
    display: inline-block;
    margin-left: 10px;
    padding: 7px 14px;
    border: 1px solid rgba(255, 255, 255, .6);
    border-radius: 20px;
    color: #fff;
    font-weight: 500;
}

.catalog-product__buy > button {
    display: flex;
    min-width: 220px;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 0;
    border-radius: 25px;
    color: #07151a;
    background: var(--blue);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.catalog-product__buy > button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.product-grid-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.product-grid-nav {
    display: flex;
    gap: 10px;
}

.product-grid-nav button {
    display: flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border: 1px solid #171717;
    border-radius: 50%;
    background: none;
    -webkit-appearance: none;
    appearance: none;
    color: #171717;
    font-size: 24px;
    padding: 0;
    cursor: pointer;
    transition: opacity .2s ease;
}

.product-grid-nav button svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.product-grid-nav button.swiper-button-disabled {
    opacity: .3;
    pointer-events: none;
}

/* Product Description
	========================================================================== */
.product-description {
    position: relative;
    min-height: 625px;
    padding: 130px 80px 100px 80px;
    overflow: hidden;
}

.product-description::after {
    position: absolute;
    bottom: 0;
    left: 80px;
    color: #fafafa;
    content: 'HYDROPHOB';
    font-size: 158px;
    font-weight: 800;
    letter-spacing: -.055em;
    line-height: .8;
    pointer-events: none;
    opacity: 0;
    transform: translateY(36px);
    transition: opacity .9s ease, transform .9s ease;
}

/* Сама секція лишається видимою одразу — плавна поява стосується лише
   декоративного вотермарку на фоні, а не реального контенту опису. */
.product-description.scroll-fade {
    opacity: 1;
    transform: none;
}

.product-description.scroll-fade-visible::after {
    opacity: 1;
    transform: translateY(0);
}

.product-description > .container {
    position: relative;
    z-index: 1;
}

.product-description__panel .text-columns {
    grid-template-columns: repeat(2, 1fr);
    gap: 25px 28px;
    margin: 24px 0 0 30%;
}

.product-description__panel .text-columns p:nth-child(3) {
    grid-column: 2;
}

.product-description__tabs {
    display: flex;
    gap: 96px;
    padding-bottom: 18px;
    border-bottom: 1px solid #777;
}

.product-description__tabs button {
    padding: 0;
    border: 0;
    color: #999;
    background: transparent;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}

.product-description__tabs button.is-active {
    color: #171717;
}

.product-description__tabs button:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 5px;
}

.product-description__panel[hidden] {
    display: none;
}

.product-characteristics {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 28px;
    margin: 14px 0 0 30%;
}

.product-characteristics > div {
    display: grid;
    min-height: 62px;
    grid-template-columns: 145px 1fr;
    gap: 16px;
    align-items: start;
    padding: 13px 0;
    border-bottom: 1px solid #d5d5d5;
}

.product-characteristics dt,
.product-characteristics dd {
    margin: 0;
    font-size: 13px;
    line-height: 1.35;
}

.product-characteristics dt {
    font-weight: 700;
    text-transform: uppercase;
}

.product-characteristics__product-title {
    margin: 24px 0 0 30%;
    font-size: 18px;
    font-weight: 700;
}

.product-characteristics + .product-characteristics__product-title {
    margin-top: 34px;
}

.product-characteristics--product {
    margin-top: 14px;
}

.product-gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 24px;
}

.product-gallery__item {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 8px;
}

.product-gallery img {
    width: 100%;
    height: 100%;
    border: 1px solid #d5d5d5;
    border-radius: 8px;
    object-fit: cover;
    cursor: pointer;
    transition: transform .25s ease;
}

.product-gallery__item::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    display: grid;
    background: rgba(7, 21, 26, .35);
    color: #fff;
    content: '🔍';
    font-size: 26px;
    opacity: 0;
    pointer-events: none;
    place-items: center;
    transition: opacity .2s ease;
}

.product-gallery__item:hover::after {
    opacity: 1;
}

.product-gallery__item:hover img {
    transform: scale(1.06);
}

/* Lightbox
	========================================================================== */
.lightbox {
    position: fixed;
    z-index: 300;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox[hidden] {
    display: none;
}

.lightbox__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(7, 21, 26, .92);
}

.lightbox__image {
    position: relative;
    z-index: 1;
    max-width: min(1100px, 84vw);
    max-height: 84vh;
    object-fit: contain;
    border-radius: 4px;
}

.lightbox__close,
.lightbox__nav {
    position: absolute;
    z-index: 2;
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    transition: background-color .2s ease;
}

.lightbox__close:hover,
.lightbox__nav:hover {
    background: rgba(255, 255, 255, .2);
}

.lightbox__close {
    top: 24px;
    right: 24px;
}

.lightbox__nav--prev {
    left: 24px;
}

.lightbox__nav--next {
    right: 24px;
}

.lightbox__counter {
    position: absolute;
    z-index: 2;
    bottom: 24px;
    left: 50%;
    margin: 0;
    transform: translateX(-50%);
    color: #fff;
    font-size: 13px;
}

/* Product Video
	========================================================================== */
.product-video {
    position: relative;
    height: 100vh;
    overflow: hidden;
    background: #111;
}

.product-video__shade {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, .12) 45%, rgba(0, 0, 0, .82) 100%);
    pointer-events: none;
}

.product-video video {
    position: absolute;
    z-index: 0;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.product-video__inner {
    position: relative;
    z-index: 2;
    height: 100%;
}

.product-video__eyebrow {
    position: absolute;
    top: 160px;
    left: 0;
    margin: 0;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.product-video__seal {
    top: 149px;
    right: 274px;
    bottom: auto;
}

.product-video__play {
    position: absolute;
    top: 53.5%;
    left: 54.1%;
    display: grid;
    width: 82px;
    height: 82px;
    place-items: center;
    padding: 0;
    border: 3px solid #fff;
    border-radius: 50%;
    color: #fff;
    background: rgba(0, 0, 0, .18);
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transform: translate(-50%, -50%);
}

.product-video__controls {
    position: absolute;
    right: 80px;
    bottom: 31px;
    left: 80px;
    height: 176px;
}

.product-video__copy h2 {
    margin: 0;
    font-size: 30px;
    line-height: 1;
}

.product-video__copy p {
    margin: 8px 0 0;
    font-size: 13px;
}

.product-video__progress-label {
    position: absolute;
    top: 72px;
    right: 0;
    left: 0;
}

.product-video input[type='range'] {
    height: 4px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 3px;
    outline: none;
    background: linear-gradient(to right, var(--blue) 0 var(--range-progress, 8%), rgba(255, 255, 255, .58) var(--range-progress, 8%) 100%);
    cursor: pointer;
    appearance: none;
}

.product-video input[type='range']::-webkit-slider-thumb {
    width: 12px;
    height: 12px;
    border: 0;
    border-radius: 50%;
    background: var(--blue);
    appearance: none;
}

.product-video input[type='range']::-moz-range-thumb {
    width: 12px;
    height: 12px;
    border: 0;
    border-radius: 50%;
    background: var(--blue);
}

.product-video__progress {
    display: block;
    width: 100%;
}

.product-video__time {
    position: absolute;
    top: 94px;
    left: 0;
    color: #fff;
    font-size: 14px;
}

.product-video__toolbar {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.product-video__volume,
.product-video__options {
    display: flex;
    align-items: center;
}

.product-video__volume {
    gap: 8px;
}

.product-video__volume button,
.product-video__options button {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 0;
    color: #fff;
    background: transparent;
    cursor: pointer;
}

.product-video__volume svg,
.product-video__options svg {
    width: 23px;
    height: 23px;
    fill: currentColor;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.product-video__volume label {
    display: flex;
}

.product-video__volume input {
    width: 70px;
    --range-progress: 65%;
}

.product-video__options {
    gap: 18px;
}

.product-video__cc {
    border: 2px solid currentColor !important;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 800;
}

.product-video__cc[aria-pressed='true'] {
    color: var(--blue);
}

/* Product Grid
	========================================================================== */
.product-grid-section {
    padding: 117px 0 90px;
    color: #171717;
    background: #fff;
}

.product-grid {
    display: block;
    overflow: hidden;
    margin-top: 65px;
}

.product-grid .swiper-wrapper {
    align-items: stretch;
}

.product-tile {
    position: relative;
    height: 505px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(145deg, #171717 55%, var(--blue));
}

.product-tile > img {
    position: absolute;
    z-index: 1;
    top: 50%;
    height: auto;
    object-fit: contain;
    left: 50%;
    aspect-ratio: 1/1;
    width: 230px;
    transform: translate(-50%, -50%);
}

.product-tile .product-card__arrow {
    top: 22px;
    right: 22px;
    transform: scale(.6);
    transform-origin: top right;
}

.product-tile > div {
    position: absolute;
    z-index: 2;
    right: 25px;
    bottom: 25px;
    left: 25px;
}

.product-tile small,
.product-tile h2,
.product-tile p {
    margin: 0;
}

.product-tile h2 {
    margin: 6px 0;
    font-size: 22px;
}

.product-tile p {
    font-size: 11px;
    line-height: 1.25;
}

/* Checkout / Personal Info
	========================================================================== */
.page-checkout {
    color: #171717;
    background: #fff;
}

.page-checkout .header {
    height: 150px;
    background: #fbfbfb;
}

.checkout {
    min-height: 100vh;
    padding-top: 150px;
    background: #fff;
}

.checkout__layout {
    display: grid;
    grid-template-columns: 55% 45%;
    gap: 40px;
    align-items: start;
}

.checkout__form {
    position: relative;
    padding: 40px 0 120px;
}

.checkout__eyebrow {
    margin-left: auto;
    font-size: 17px;
    font-weight: 800;
    text-transform: uppercase;
    width: fit-content;
}

.checkout__section h1,
.checkout__section h2 {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.checkout__city {
    display: flex;
    align-items: center;
    gap: 28px;
    margin-top: 33px;
    padding-bottom: 29px;
    border-bottom: 1px solid #bbb;
}

.checkout__city > span:first-child {
    font-size: 24px;
}

.checkout__input-wrap {
    position: relative;
    display: block;
    width: 307px;
}

.checkout__input-wrap input,
.checkout__contact-grid input,
.checkout-card input {
    width: 100%;
    height: 48px;
    padding: 0 44px 0 16px;
    border: 1px solid #aaa;
    border-radius: 25px;
    outline: 0;
    color: #171717;
    background: #f3f3f3;
    font: inherit;
}

.checkout__input-wrap i,
.checkout__dark-input i {
    position: absolute;
    top: 50%;
    right: 15px;
    display: grid;
    width: 17px;
    height: 17px;
    place-items: center;
    border: 1px solid #aaa;
    border-radius: 50%;
    color: #aaa;
    font-size: 13px;
    font-style: normal;
    line-height: 1;
    cursor: pointer;
    transform: translateY(-50%);
}

.checkout__suggest i {
    display: none;
}

.checkout__suggest.has-value i {
    display: grid;
}

.checkout__carriers {
    display: flex;
    gap: 10px;
    margin-top: 28px;
}

.checkout__carriers button {
    position: relative;
    display: flex;
    width: clamp(160px, 24.14%, 254px);
    height: clamp(88px, 5.83vw, 112px);
    flex: 0 1 clamp(160px, 24.14%, 254px);
    min-width: 0;
    align-items: center;
    justify-content: center;
    padding: 0 16px;
    overflow: hidden;
    border: 1px solid #bbb;
    border-radius: 16px;
    color: #fff;
    background: #f5f5f5;
    cursor: pointer;
    transition: width .4s cubic-bezier(.65, 0, .35, 1), flex-basis .4s cubic-bezier(.65, 0, .35, 1), height .4s cubic-bezier(.65, 0, .35, 1), padding .4s cubic-bezier(.65, 0, .35, 1), border-color .25s ease, background-color .25s ease;
}

.checkout__carriers button.is-active {
    width: clamp(360px, 51.71%, 544px);
    flex-basis: clamp(360px, 51.71%, 544px);
    justify-content: space-between;
    padding: 0 0 0 15px;
    border-width: 3px;
    border-color: #555;
    background: #555;
}

.checkout__carrier-copy {
    display: flex;
    width: 0;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    opacity: 0;
    text-align: left;
    text-transform: uppercase;
    transform: translateX(-12px);
    transition: width .35s ease, min-width .35s ease, opacity .2s ease, transform .35s ease;
}

.checkout__carriers button.is-active .checkout__carrier-copy {
    width: clamp(110px, 34.9%, 190px);
    min-width: clamp(110px, 34.9%, 190px);
    opacity: 1;
    transform: translateX(0);
}

.checkout__carrier-copy b {
    font-size: clamp(15px, 1.25vw, 24px);
    font-weight: 800;
    line-height: 1.15;
}

.checkout__carrier-copy small {
    margin-top: 4px;
    font-size: clamp(8px, .47vw, 9px);
    font-weight: 700;
    line-height: 1.3;
}

.checkout__carrier-logo {
    display: grid;
    width: clamp(130px, 81%, 206px);
    height: clamp(46px, 3.85vw, 74px);
    flex: 0 1 clamp(130px, 81%, 206px);
    min-width: 0;
    place-items: center;
    transition: width .4s cubic-bezier(.65, 0, .35, 1), height .4s cubic-bezier(.65, 0, .35, 1), flex-basis .4s cubic-bezier(.65, 0, .35, 1), border-radius .4s ease, background-color .25s ease;
}

.checkout__carriers button.is-active .checkout__carrier-logo {
    width: clamp(160px, 51%, 278px);
    height: clamp(64px, 5.42vw, 104px);
    flex-basis: clamp(160px, 51%, 278px);
    border-radius: inherit;
    background: #fff;
}

.checkout__carrier-logo svg {
    display: block;
    width: min(82%, 206px);
    height: min(72%, 62px);
}

.checkout__carriers button[data-checkout-carrier="nova"] .checkout__carrier-logo svg {
    width: min(76%, 176px);
}

.checkout__carriers button[data-checkout-carrier="meest"] .checkout__carrier-logo svg {
    width: min(78%, 180px);
}

.checkout__carrier-word {
    display: block;
    height: 100px;
    overflow: hidden;
    margin: 15px -80px 0;
    color: rgba(0, 0, 0, .018);
    font-size: 126px;
    font-weight: 900;
    letter-spacing: -.06em;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    pointer-events: none;
}

.checkout__shipping {
    margin-top: 7px;
}

.checkout__shipping label {
    display: grid;
    min-height: 107px;
    grid-template-columns: 18px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 20px 0;
    border-bottom: 1px solid #bbb;
    cursor: pointer;
}

.checkout__shipping input,
.checkout__payment-option input,
.checkout__agreement input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.checkout__shipping label > i,
.checkout__payment-option > i {
    width: 15px;
    height: 15px;
    border: 1px solid #aaa;
    border-radius: 50%;
}

.checkout__shipping input:checked + i,
.checkout__payment-option input:checked + i {
    border: 4px solid #fff;
    outline: 2px solid var(--blue);
    background: var(--blue);
}

.checkout__shipping label > span {
    display: flex;
    flex-direction: column;
}

.checkout__shipping label > span b {
    font-size: 16px;
    font-weight: 400;
}

.checkout__shipping label small {
    margin-top: 6px;
    font-size: 11px;
    line-height: 1.45;
}

.checkout__shipping label > strong {
    font-size: 14px;
    font-weight: 800;
}

.checkout__pickup {
    display: block;
    margin-top: 43px;
    font-size: 13px;
    font-weight: 700;
}

.checkout__dark-input {
    position: relative;
    display: block;
    margin-top: 15px;
}

.checkout__dark-input input,
.checkout__contact-grid input {
    width: 100%;
    height: 43px;
    padding: 0 17px;
    border: 1px solid #999;
    border-radius: 23px;
    outline: 0;
    color: #fff;
    background: #1b1b1b;
    font: inherit;
}

.checkout__contacts,
.checkout__payment-method {
    margin-top: 48px;
    padding-top: 27px;
    border-top: 1px solid #171717;
}

.checkout__contact-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px 20px;
    margin-top: 36px;
}

.checkout__contact-grid input:first-child {
    grid-column: 1 / -1;
}

.checkout__payment-option {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 30px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.checkout__agreement {
    display: flex;
    width: max-content;
    max-width: 100%;
    align-items: flex-start;
    gap: 8px;
    margin: 26px 0 0 26px;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

.checkout__agreement i {
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
    border: 1px solid #aaa;
    border-radius: 2px;
}

.checkout__agreement input:checked + i {
    border-color: var(--blue);
    background: var(--blue);
    box-shadow: inset 0 0 0 2px #fff;
}

.checkout__submit,
.checkout-card__pay {
    position: relative;
    display: flex;
    min-width: 300px;
    height: 50px;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 30px;
    padding: 0 22px;
    border: 0;
    border-radius: 28px;
    color: #fff;
    background: #171717;
    font-size: 17px;
    font-weight: 800;
    text-transform: uppercase;
    cursor: pointer;
}

.checkout__submit:disabled {
    opacity: .4;
    cursor: not-allowed;
}

.checkout__submit .square-arrow,
.checkout-card__pay .square-arrow {
    --arrow-size: 16px;
    --arrow-thickness: 3px;
    --arrow-shaft: 19px;
}

.checkout__payment-option--cash {
    margin-top: 34px;
    padding-top: 30px;
    border-top: 1px solid #171717;
}

.checkout-summary {
    position: sticky;
    top: 0;
    min-height: 782px;
    padding: 20px 20px 20px 40px;
    background: #fafafa;
}

.checkout-summary h2 {
    margin: 0;
    font-size: 21px;
    font-weight: 800;
}

.checkout-summary__delivery-note {
    margin-top: 17px;
    padding: 11px 20px;
    color: #fff;
    background: var(--blue);
    font-size: 14px;
    text-align: center;
}

.checkout-summary__product {
    display: grid;
    min-height: 190px;
    grid-template-columns: 120px 1fr auto;
    align-items: center;
    gap: 20px;
}

.checkout-summary__product > span {
    position: relative;
    display: grid;
    width: 101px;
    height: 119px;
    place-items: center;
    border-radius: 0 0 17px 17px;
    background: #171717;
}

/* Фото заповнює всю «кишеньку». height:100% тут не резолвиться (span —
   grid із place-items:center, рядок міряється вмістом), тому розтягуємо
   абсолютно; бейдж кількості лишається поверх, він теж absolute. */
.checkout-summary__product img {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

.checkout-summary__product i {
    z-index: 1;
}

.checkout-summary__product i {
    position: absolute;
    top: -10px;
    right: -10px;
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--blue);
    font-size: 12px;
    font-style: normal;
}

.checkout-summary__product p {
    display: flex;
    flex-direction: column;
    margin: 0;
    font-size: 16px;
}

.checkout-summary__product p b {
    font-weight: 800;
}

.checkout-summary__product strong {
    font-weight: 400;
    white-space: nowrap;
}

.checkout-summary__promo {
    padding: 14px 20px 15px;
    border-radius: 8px;
    color: #fff;
    background: #191919;
    text-transform: uppercase;
}

.checkout-summary__promo > b {
    font-size: 16px;
}

.checkout-summary__promo > div {
    display: grid;
    grid-template-columns: 1fr 130px;
    gap: 15px;
    margin-top: 14px;
}

.checkout-summary__promo input {
    min-width: 0;
    height: 48px;
    padding: 0 20px;
    border: 1px solid #fff;
    border-radius: 25px;
    outline: 0;
    color: #fff;
    background: transparent;
}

.checkout-summary__promo button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border: 0;
    border-radius: 25px;
    color: #fff;
    background: var(--blue);
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
}

.checkout-summary__promo .square-arrow {
    --arrow-size: 16px;
    --arrow-thickness: 3px;
    --arrow-shaft: 18px;
    --arrow-top: -3px;
}

.checkout-summary__promo > small {
    display: block;
    min-height: 0;
    margin-top: 5px;
    font-size: 10px;
    text-transform: none;
}

.checkout-summary__totals {
    margin: 35px 0 0;
}

.checkout-summary__totals div {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
}

.checkout-summary__totals dt,
.checkout-summary__totals dd {
    margin: 0;
}

.checkout-summary__totals div:last-child {
    margin-top: 28px;
    font-size: 20px;
    font-weight: 800;
}

.checkout__seal {
    position: relative;
    display: grid;
    width: 104px;
    height: 104px;
    margin: 67px auto 0;
    place-items: center;
}

.checkout__seal svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    animation: seal-spin 14s linear infinite;
}

.checkout__seal text {
    fill: #171717;
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1.2px;
}

.checkout__seal i {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #171717;
}

.checkout-card {
    width: 100vw;
    max-width: none;
    height: 100vh;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    color: #171717;
    background: #fff;
}

.checkout-card::backdrop {
    background: #fff;
}

.checkout-card__inner {
    position: relative;
    width: min(calc(100% - 160px), var(--container));
    height: 100%;
    margin-inline: auto;
    padding-top: 205px;
}

.checkout-card__inner > p {
    position: absolute;
    top: 55px;
    right: 0;
    margin: 0;
    font-size: 17px;
    font-weight: 800;
    text-transform: uppercase;
}

.checkout-card fieldset {
    width: 575px;
    padding: 0 0 40px;
    border: 0;
    border-bottom: 1px solid #aaa;
}

.checkout-card legend {
    margin-bottom: 34px;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.checkout-card label {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.checkout-card fieldset > label input {
    width: 280px;
}

.checkout-card fieldset > div {
    display: flex;
    gap: 17px;
    margin-top: 35px;
}

.checkout-card fieldset > div input {
    width: 132px;
}

.checkout-card fieldset > div label:last-child input {
    width: 72px;
}

.checkout-card__pay {
    margin: 40px 0 0 375px;
    min-width: 201px;
}

.checkout-card__close {
    position: absolute;
    top: 30px;
    left: 0;
    display: none;
}

/* Автокомпліт міста/відділення (checkout__city, checkout__pickup) */
.checkout__suggest {
    position: relative;
}

.checkout__suggest-list {
    position: absolute;
    z-index: 20;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    display: none;
    max-height: 240px;
    margin: 0;
    padding: 6px;
    overflow: auto;
    list-style: none;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 12px;
    background: #1b1b1b;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .25);
}

.checkout__suggest-list.is-active {
    display: block;
}

.checkout__suggest-list li {
    padding: 9px 12px;
    border-radius: 8px;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

.checkout__suggest-list li:hover {
    background: var(--blue);
}

/* Телефон з кодом країни */
.checkout__phone {
    position: relative;
    display: flex;
    gap: 8px;
    align-items: stretch;
}

.checkout__phone-country {
    flex: 0 0 112px;
    width: 112px;
    height: 43px;
    padding: 0 26px 0 14px;
    border: 1px solid #999;
    border-radius: 23px;
    outline: 0;
    color: #fff;
    background: #1b1b1b url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="%23999" d="M4 6l4 4 4-4"/></svg>') no-repeat right 10px center / 10px;
    font: inherit;
    cursor: pointer;
    appearance: none;
}

.checkout__phone-input {
    flex: 1;
    min-width: 0;
}

.checkout__phone-input.phone-invalid {
    border-color: #e2574c;
    box-shadow: 0 0 0 1px #e2574c inset;
}

/* Intro Page
	========================================================================== */
.intro-page {
    overflow-x: hidden;
    background: #1b1b1b;
}

.intro-page .header {
    height: 160px;
}

.intro-page .header__controls,
.intro-page .menu-panel,
.intro-page .minicart {
    display: none;
}

.intro-screen {
    --intro-wrapper-w: min(calc(100% - 160px), 1760px);
    --intro-wrapper-left: calc((100% - var(--intro-wrapper-w)) / 2);
    --intro-col-w: calc((var(--intro-wrapper-w) - 50px) / 3);
    --intro-auto-left: calc(var(--intro-wrapper-left) + var(--intro-col-w) + 25px);
    --intro-heading-left: max(4.17%, calc((100% - 1760px) / 2));
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 720px;
    max-height: 1080px;
    overflow: hidden;
    color: #fff;
    background: #1b1b1b;
}

.intro-screen__heading {
    position: absolute;
    z-index: 3;
    top: 22.78%;
    left: var(--intro-heading-left);
    /* Заголовок навмисно "запливає" під автомобільну картку (як у макеті) — цей max-width
       тримає ширину пропорційно відстані до картки, щоб на проміжних екранах текст
       вчасно переносився на 2 рядки, а не наростаюче наповзав на картку. */
    max-width: calc((var(--intro-auto-left) - var(--intro-heading-left)) / 0.7444);
}

.intro-screen__heading h1 {
    margin: 0;
    font-size: clamp(48px, 3.49vw, 67px);
    font-weight: 900;
    letter-spacing: -.035em;
    line-height: 1;
    text-transform: uppercase;
}

.intro-screen__heading h1 strong {
    color: var(--blue);
    font-weight: inherit;
}

.intro-screen__heading p {
    margin: 18px 0 0;
    font-size: clamp(10px, .84vw, 16px);
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
}

.intro-screen__cards-wrapper {
    position: absolute;
    z-index: 2;
    top: 12.2%;
    height: 74.4%;
    inset-inline: 0;
    margin-inline: auto;
    width: min(calc(100% - 160px), var(--container));
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 56fr 44fr;
    gap: 25px;
}

.intro-card {
    container-type: inline-size;
    position: relative;
    z-index: 2;
    display: block;
    overflow: hidden;
    border-radius: 40px;
    color: #171717;
    background: var(--blue);
}

.intro-card > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .55s ease;
}

.intro-card:hover > img {
    transform: scale(1.025);
}

.intro-card__copy {
    position: absolute;
    z-index: 2;
    display: flex;
    flex-direction: column;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
}

.intro-card__copy b,
.intro-card__copy small {
    display: block;
    font: inherit;
}

.intro-card--textile {
    grid-column: 1;
    grid-row: 2;
    border: 1px solid #fff;
    color: var(--blue);
    background: #111;
}

.intro-card--textile::after,
.intro-card--nano::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: rgba(0, 0, 0, .34);
    content: '';
    pointer-events: none;
}

.intro-card--textile > img {
    object-position: center 45%;
}

.intro-card--textile .intro-card__copy {
    right: 38px;
    bottom: 46px;
    left: 38px;
}

.intro-card--textile .intro-card__copy b {
    font-size: clamp(14px, 9.12cqw, 52px);
}

.intro-card--textile .intro-card__copy small {
    margin-top: 9px;
    font-size: clamp(8px, 4.39cqw, 25px);
}

.intro-card__seal {
    position: absolute;
    z-index: 3;
    top: clamp(14px, 4.2cqw, 24px);
    right: clamp(13px, 4cqw, 23px);
    display: grid;
    width: clamp(60px, 18.2cqw, 104px);
    height: clamp(60px, 18.2cqw, 104px);
    place-items: center;
}

.intro-card__seal svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    animation: seal-spin 14s linear infinite;
}

.intro-card__seal text {
    fill: #fff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 1px;
}

.intro-card__seal i {
    width: clamp(18px, 4.9cqw, 28px);
    height: clamp(18px, 4.9cqw, 28px);
    border-radius: 50%;
    background: #fff;
}

.intro-card--automobile {
    grid-column: 2;
    grid-row: 1 / span 2;
}

.intro-card--automobile > img {
    opacity: .68;
    filter: grayscale(1) contrast(1.2);
    mix-blend-mode: screen;
    object-position: center;
}

.intro-card--automobile .intro-card__copy {
    right: 42px;
    bottom: 76px;
    left: 42px;
    align-items: flex-end;
}

.intro-card--automobile .intro-card__copy b,
.intro-card--automobile .intro-card__copy small {
    font-size: clamp(16px, 10.53cqw, 60px);
}

.intro-card--automobile .intro-card__copy small {
    margin-top: clamp(8px, 6.67cqw, 38px);
    line-height: 1.7;
    text-align: right;
}

.intro-card__arrow {
    position: absolute;
    z-index: 4;
    width: clamp(48px, 14.6cqw, 83px);
    height: clamp(48px, 14.6cqw, 83px);
    border-top: clamp(8px, 2.5cqw, 14px) solid currentColor;
    border-right: clamp(8px, 2.5cqw, 14px) solid currentColor;
}

.intro-card__arrow::after {
    position: absolute;
    top: clamp(-8px, -1.4cqw, -5px);
    right: clamp(-4px, -0.7cqw, -3px);
    width: clamp(48px, 14.4cqw, 82px);
    height: clamp(8px, 2.5cqw, 14px);
    background: currentColor;
    content: '';
    transform: rotate(-45deg);
    transform-origin: right center;
}

.intro-card--automobile > .intro-card__arrow {
    top: clamp(35px, 15.4cqw, 88px);
    right: clamp(35px, 12.1cqw, 69px);
}

.intro-card--nano {
    grid-column: 3;
    grid-row: 1;
    border: 1px solid #fff;
    background: #070b03;
}

.intro-card--nano > img {
    filter: grayscale(1) sepia(1) hue-rotate(38deg) saturate(5) brightness(.58);
}

.intro-card--nano::after {
    background: rgba(0, 0, 0, .28);
}

.intro-card__nano-label {
    position: absolute;
    z-index: 3;
    top: clamp(40px, 12.98cqw, 74px);
    left: 50%;
    width: clamp(140px, 43.7cqw, 249px);
    height: clamp(140px, 43.7cqw, 249px);
    color: var(--blue);
    transform: translateX(-50%);
}

.intro-card__nano-label svg {
    width: 100%;
    height: 100%;
    animation: seal-spin 18s linear infinite reverse;
}

.intro-card__nano-label text {
    fill: currentColor;
    font-size: 21px;
    font-weight: 900;
    letter-spacing: 2px;
}

.intro-card--nano > .intro-card__arrow {
    top: clamp(95px, 32.46cqw, 185px);
    left: 50%;
    color: var(--blue);
    transform: translate(-50%, -50%);
}

.intro-card--building {
    grid-column: 3;
    grid-row: 2;
}

.intro-card--building .intro-card__copy {
    top: 43px;
    right: 40px;
    left: 40px;
}

.intro-card--building .intro-card__copy b {
    font-size: clamp(14px, 10.53cqw, 60px);
}

.intro-card--building .intro-card__copy small {
    margin-top: 7px;
    font-size: clamp(8px, 4.39cqw, 25px);
}

.intro-card__line {
    position: absolute;
    right: clamp(130px, 41.75cqw, 238px);
    bottom: clamp(40px, 12.63cqw, 72px);
    left: clamp(22px, 7.02cqw, 40px);
    height: clamp(8px, 2.46cqw, 14px);
    background: #171717;
}

.intro-card--building > .intro-card__arrow {
    right: clamp(31px, 9.65cqw, 55px);
    bottom: clamp(27px, 6.84cqw, 39px);
}

.intro-screen__socials,
.intro-screen__copyright,
.intro-screen__credit,
.intro-screen__wordmark {
    position: absolute;
    z-index: 3;
}

.intro-screen__socials {
    right: 80px;
    bottom: 48px;
    display: flex;
    gap: 16px;
}

.intro-screen__socials a,
.intro-screen__socials svg {
    display: block;
    width: 32px;
    height: 32px;
}

.intro-screen__socials svg {
    fill: none;
    stroke: rgba(255, 255, 255, .48);
    stroke-width: 2;
}

.intro-screen__socials .is-fill {
    fill: rgba(255, 255, 255, .48);
    stroke: none;
}

.intro-screen__copyright,
.intro-screen__credit {
    bottom: 49px;
    margin: 0;
    font-size: 14px;
}

.intro-screen__copyright {
    left: 80px;
    color: rgba(255, 255, 255, .35);
}

.intro-screen__credit {
    display: none;
    left: 50%;
    transform: translateX(-50%);
}

.intro-screen__credit a {
    color: var(--blue);
    text-decoration: underline;
}

.intro-screen__wordmark {
    z-index: 0;
    right: 0;
    bottom: -43px;
    left: 0;
    overflow: hidden;
    color: rgba(0, 0, 0, .11);
    font-size: clamp(120px, 13.8vw, 265px);
    font-weight: 900;
    line-height: .75;
    text-align: center;
    white-space: nowrap;
}
@media (max-width: 1080px) {
    .intro-screen__cards-wrapper {
        height: 60%;
        width: min(calc(100% - 60px), var(--container));
    }
}
/* Legal (privacy policy)
	========================================================================== */
.legal-page {
    padding: 220px 0 120px;
}

.legal-page h1 {
    margin: 0;
    font-size: clamp(36px, 4vw, 56px);
    font-weight: 900;
    letter-spacing: -.03em;
    text-transform: uppercase;
}

.legal-page__intro {
    max-width: 720px;
    margin: 24px 0 0;
    color: #555;
    font-size: 16px;
    line-height: 1.5;
}

.legal-page__body {
    max-width: 780px;
    margin: 56px 0 0;
    gap: 28px;
}

/* Auth modal (вхід/реєстрація)
	========================================================================== */
.auth-modal {
    position: fixed;
    z-index: 70;
    inset: 0;
    display: grid;
    visibility: hidden;
    place-items: center;
    padding: 20px;
    opacity: 0;
    transition: visibility .3s ease, opacity .3s ease;
}

.auth-modal.is-open {
    visibility: visible;
    opacity: 1;
}

.auth-modal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: rgba(0, 0, 0, .8);
    cursor: default;
}

.auth-modal__panel {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 440px;
    padding: 44px;
    border: 1px solid #262626;
    border-radius: 34px;
    color: #fff;
    background: #161616;
    transform: translateY(16px);
    transition: transform .3s ease;
}

.auth-modal.is-open .auth-modal__panel {
    transform: translateY(0);
}

.auth-modal__close {
    position: absolute;
    top: 22px;
    right: 22px;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid #333;
    border-radius: 50%;
    color: #999;
    background: transparent;
    cursor: pointer;
}

.auth-modal__close svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.auth-modal__close:hover {
    color: var(--blue);
}

.auth-modal__eyebrow {
    margin: 0;
    color: #999;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.auth-modal__title {
    margin: 10px 0 0;
    font-size: 32px;
    font-weight: 900;
    text-transform: uppercase;
}

.auth-modal__title span {
    color: var(--blue);
}

.auth-modal__tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    margin: 28px 0 0;
    padding: 4px;
    border: 1px solid #2a2a2a;
    border-radius: 50px;
}

.auth-modal__tab {
    padding: 11px 0;
    border: 0;
    border-radius: 50px;
    color: #999;
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .12em;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.auth-modal__tab:hover {
    color: #fff;
}

.auth-modal__tab.is-active {
    color: #111;
    background: var(--blue);
}

.auth-modal__form {
    margin-top: 18px;
}

.auth-modal__field {
    position: relative;
    margin-top: 15px;
}

.auth-modal__field input {
    width: 100%;
    padding: 15px 0;
    border: 0;
    border-bottom: 1px solid #2e2e2e;
    outline: 0;
    color: #fff;
    background: transparent;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    transition: border-color .2s;
}

.auth-modal__field input::placeholder {
    color: #777;
}

.auth-modal__field input:focus {
    border-color: var(--blue);
}

.auth-modal__field--password input {
    padding-right: 40px;
}

.auth-modal__toggle-password {
    position: absolute;
    top: 50%;
    right: 0;
    display: grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 0;
    color: #999;
    background: transparent;
    cursor: pointer;
    transform: translateY(-50%);
}

.auth-modal__toggle-password svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-modal__toggle-password:hover {
    color: var(--blue);
}

.auth-modal__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 22px;
    color: #999;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
}

.auth-modal__remember {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.auth-modal__remember input {
    width: 16px;
    height: 16px;
    accent-color: var(--blue);
}

.auth-modal__forgot {
    border: 0;
    color: var(--blue);
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    cursor: pointer;
}

.auth-modal__forgot:hover {
    text-decoration: underline;
}

.auth-modal__submit {
    width: 100%;
    margin-top: 28px;
    padding: 16px 0;
    border: 1px solid var(--blue);
    border-radius: 50px;
    color: #111;
    background: var(--blue);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .2em;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.auth-modal__submit:hover {
    color: var(--blue);
    background: transparent;
}

.auth-modal__note {
    margin: 24px 0 0;
    color: #666;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .15em;
}

/* Blog
	========================================================================== */
.blog-page {
    padding: 220px 0 120px;
}

.blog-page__title {
    margin: 12px 0 0;
    font-size: clamp(36px, 6vw, 74px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.03em;
    text-transform: uppercase;
}

.blog-page__accent {
    color: var(--blue);
}

.blog-page__lead {
    max-width: 560px;
    margin: 24px 0 0;
    color: #999;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.blog-page__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 40px 0 0;
}

.blog-page__filter {
    padding: 13px 26px;
    border: 1px solid #333;
    border-radius: 50px;
    color: #999;
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, border-color .2s, background-color .2s;
}

.blog-page__filter:hover {
    color: #fff;
}

.blog-page__filter.is-active {
    border-color: var(--blue);
    color: #111;
    background: var(--blue);
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin: 40px 0 0;
}

.blog-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #222;
    border-radius: 28px;
    color: #fff;
    background: #161616;
    text-decoration: none;
    transition: transform .25s;
}

.blog-card[hidden] {
    display: none;
}

.blog-card:hover {
    transform: translateY(-6px);
}

.blog-card__cover {
    position: relative;
    display: flex;
    align-items: flex-end;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    padding: 20px;
    background: #161616;
}

.blog-card__cover img {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-card__cover--placeholder img {
    object-fit: contain;
    padding: 30px;
}

.blog-card__cover::after {
    position: absolute;
    z-index: 1;
    inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, .75));
    content: '';
}

.blog-card__cover-label {
    position: relative;
    z-index: 2;
    padding: 7px 16px;
    border-radius: 50px;
    color: var(--blue);
    background: #111;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.blog-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 24px;
}

.blog-card__title {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    text-transform: uppercase;
    transition: color .2s;
}

.blog-card:hover .blog-card__title {
    color: var(--blue);
}

.blog-card__excerpt {
    margin: 12px 0 0;
    color: #999;
    font-size: 14px;
    line-height: 1.5;
}

.blog-card__meta {
    margin: auto 0 0;
    padding-top: 24px;
    color: #666;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.blog-grid__empty {
    margin: 40px 0 0;
    color: #999;
}

/* Blog post
	========================================================================== */
.blog-post {
    padding: 220px 0 120px;
}

.blog-post__inner {
    max-width: 820px;
}

.blog-post__back {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #999;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .15em;
    text-decoration: none;
    text-transform: uppercase;
    transition: color .2s;
}

.blog-post__back:hover {
    color: var(--blue);
}

.blog-post__back-arrow {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-bottom: 2px solid currentColor;
    border-left: 2px solid currentColor;
    transform: rotate(45deg);
}

.blog-post__category {
    display: inline-block;
    margin-top: 24px;
    padding: 8px 18px;
    border-radius: 50px;
    color: #111;
    background: var(--blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.blog-post__title {
    margin: 18px 0 0;
    font-size: clamp(32px, 5vw, 58px);
    font-weight: 900;
    line-height: .98;
    letter-spacing: -.02em;
    text-transform: uppercase;
}

.blog-post__meta {
    margin: 18px 0 0;
    color: #999;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.blog-post__cover {
    aspect-ratio: 16 / 7;
    margin-top: 34px;
    overflow: hidden;
    border-radius: 32px;
    background: #161616;
}

.blog-post__cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-post__cover--placeholder img {
    object-fit: contain;
    padding: 40px;
}

.blog-post__body {
    max-width: 700px;
    margin-top: 42px;
}

.blog-post__body p {
    margin: 22px 0 0;
    color: #ccc;
    font-size: 17px;
    line-height: 1.7;
}

.blog-post__body h2 {
    margin: 34px 0 0;
    font-size: 26px;
    font-weight: 900;
    text-transform: uppercase;
}

.blog-post__body ul {
    margin: 22px 0 0;
    padding: 0;
    list-style: none;
}

.blog-post__body li {
    position: relative;
    margin-top: 12px;
    padding-left: 22px;
    color: #ccc;
    font-size: 16px;
    line-height: 1.5;
}

.blog-post__body li::before {
    position: absolute;
    top: 9px;
    left: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--blue);
    content: '';
}

.blog-post__body blockquote {
    margin: 26px 0 0;
    padding: 26px;
    border-left: 4px solid var(--blue);
    border-radius: 24px;
    color: #fff;
    background: #161616;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.4;
    text-transform: uppercase;
}

.blog-post__related {
    max-width: 700px;
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid #222;
}

.blog-post__related h2 {
    margin: 0;
    font-size: 24px;
    font-weight: 900;
    text-transform: uppercase;
}

.blog-post__related-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 24px;
}

.blog-post__related-card {
    padding: 20px;
    border: 1px solid #222;
    border-radius: 24px;
    color: #fff;
    background: #161616;
    text-decoration: none;
    transition: transform .25s;
}

.blog-post__related-card:hover {
    transform: translateY(-4px);
}

.blog-post__related-card span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.blog-post__related-card p {
    margin: 10px 0 0;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
    text-transform: uppercase;
}

/* Account (особистий кабінет)
	========================================================================== */
.account-page {
    padding: 220px 0 120px;
}

.account-page__title {
    margin: 12px 0 0;
    font-size: clamp(36px, 6vw, 74px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.03em;
    text-transform: uppercase;
}

.account-page__accent {
    color: var(--blue);
}

.account-page__guest {
    max-width: 520px;
    margin: 40px 0 0;
    padding: 48px;
    border: 1px solid #222;
    border-radius: 32px;
    text-align: center;
}

.account-page__guest p {
    margin: 0;
    color: #999;
}

.account-page__login-btn {
    margin-top: 24px;
    padding: 16px 36px;
    border: 1px solid var(--blue);
    border-radius: 50px;
    color: #111;
    background: var(--blue);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.account-page__login-btn:hover {
    color: var(--blue);
    background: transparent;
}

.account-page__layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 24px;
    margin-top: 32px;
}

.account-page__sidebar {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.account-page__user-card {
    padding: 24px;
    border: 1px solid #222;
    border-radius: 24px;
}

.account-page__avatar {
    display: grid;
    width: 56px;
    height: 56px;
    place-items: center;
    border-radius: 50%;
    color: #111;
    background: var(--blue);
    font-size: 18px;
    font-weight: 900;
}

.account-page__user-name {
    margin: 16px 0 0;
    font-size: 17px;
    font-weight: 800;
    text-transform: uppercase;
}

.account-page__user-email {
    margin: 4px 0 0;
    overflow: hidden;
    color: #999;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-page__nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px;
    border: 1px solid #222;
    border-radius: 24px;
}

.account-page__nav a,
.account-page__signout {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    border: 0;
    border-radius: 16px;
    color: #999;
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.account-page__nav a svg,
.account-page__signout svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.account-page__nav a:hover,
.account-page__signout:hover {
    color: #fff;
    background: #1e1e1e;
}

.account-page__nav a.is-active {
    color: #111;
    background: var(--blue);
}

.account-page__content {
    padding: 40px;
    border: 1px solid #222;
    border-radius: 32px;
}

.account-form__heading {
    margin-bottom: 24px;
}

.account-form--divider {
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid #222;
}

.account-form__num {
    margin: 0;
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
}

.account-form__heading h2 {
    margin: 8px 0 0;
    font-size: 28px;
    font-weight: 900;
    text-transform: uppercase;
}

.account-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.account-form__grid--three {
    grid-template-columns: repeat(3, 1fr);
}

.account-form__field label {
    display: block;
    margin-bottom: 8px;
    color: #999;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.account-form input {
    width: 100%;
    padding: 14px 0;
    border: 0;
    border-bottom: 1px solid #2e2e2e;
    outline: 0;
    color: #fff;
    background: transparent;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: border-color .2s;
}

.account-form input::placeholder {
    color: #777;
}

.account-form input:focus {
    border-color: var(--blue);
}

.account-form__submit {
    margin-top: 28px;
    padding: 16px 36px;
    border: 1px solid var(--blue);
    border-radius: 50px;
    color: #111;
    background: var(--blue);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.account-form__submit:hover {
    color: var(--blue);
    background: transparent;
}

.account-form__submit--outline {
    color: var(--blue);
    background: transparent;
}

.account-form__submit--outline:hover {
    color: #111;
    background: var(--blue);
}

/* Account: orders
	========================================================================== */
.account-orders {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.account-orders__item {
    border: 1px solid #222;
    border-radius: 20px;
    background: #161616;
}

.account-orders__item summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px;
    cursor: pointer;
    list-style: none;
}

.account-orders__item summary::-webkit-details-marker {
    display: none;
}

.account-orders__id {
    display: block;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.account-orders__date {
    display: block;
    margin-top: 4px;
    color: #999;
    font-size: 13px;
}

.account-orders__status {
    padding: 7px 16px;
    border-radius: 50px;
    background: #262626;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.account-orders__status.is-delivered {
    color: #111;
    background: var(--blue);
}

.account-orders__status.is-transit {
    border: 1px solid var(--blue);
    color: var(--blue);
    background: transparent;
}

.account-orders__status.is-cancelled {
    color: #777;
    text-decoration: line-through;
}

.account-orders__total {
    color: var(--blue);
    font-size: 18px;
    font-weight: 900;
}

.account-orders__items {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 0 20px 20px;
    border-top: 1px solid #222;
}

.account-orders__row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
    padding-top: 14px;
    font-size: 14px;
}

.account-orders__row span:last-child {
    color: #999;
}

/* Account: favorites
	========================================================================== */
.account-favorites {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.account-favorites__empty {
    color: #999;
}

.account-favorites__card {
    display: flex;
    flex-direction: column;
    padding: 20px;
    border: 1px solid #222;
    border-radius: 20px;
    background: #161616;
}

.account-favorites__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.account-favorites__category {
    color: var(--blue);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.account-favorites__remove {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 0;
    color: #999;
    background: transparent;
    cursor: pointer;
}

.account-favorites__remove svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.account-favorites__remove:hover {
    color: var(--blue);
}

.account-favorites__name {
    margin: 14px 0 0;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.account-favorites__bottom {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 20px;
}

.account-favorites__old-price {
    margin: 0;
    color: #777;
    font-size: 13px;
    text-decoration: line-through;
}

.account-favorites__price {
    margin: 2px 0 0;
    color: var(--blue);
    font-size: 22px;
    font-weight: 900;
}

.account-favorites__cart-btn {
    padding: 12px 22px;
    border: 0;
    border-radius: 50px;
    color: #111;
    background: var(--blue);
    font: inherit;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: transform .2s;
}

.account-favorites__cart-btn:hover {
    transform: translateY(-2px);
}

.account-favorites__cart-btn:disabled {
    color: #999;
    background: #2a2a2a;
    cursor: not-allowed;
    transform: none;
}

/* Reviews (відгуки клієнтів)
	========================================================================== */
.reviews-page {
    padding: 220px 0 120px;
}

.reviews-page__title {
    margin: 12px 0 0;
    font-size: clamp(36px, 6vw, 74px);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -.03em;
    text-transform: uppercase;
}

.reviews-page__accent {
    color: var(--blue);
}

.reviews-page__lead {
    max-width: 560px;
    margin: 24px 0 0;
    color: #999;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.reviews-page__controls {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    margin: 40px 0 0;
}

.reviews-page__control-label {
    display: block;
    margin-bottom: 10px;
    color: #999;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.reviews-page__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.reviews-page__pill {
    padding: 11px 20px;
    border: 1px solid #333;
    border-radius: 50px;
    color: #999;
    background: transparent;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, border-color .2s, background-color .2s;
}

.reviews-page__pill:hover {
    color: #fff;
}

.reviews-page__pill.is-active {
    border-color: var(--blue);
    color: #111;
    background: var(--blue);
}

.reviews-page__layout {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 24px;
    margin-top: 40px;
}

.reviews-page__summary {
    position: sticky;
    top: 110px;
    align-self: start;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.reviews-page__panel {
    padding: 28px;
    border: 1px solid #222;
    border-radius: 28px;
    background: #161616;
}

.reviews-page__panel-num {
    margin: 0;
    color: var(--blue);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .1em;
}

.reviews-page__panel-title {
    margin: 8px 0 0;
    font-size: 20px;
    font-weight: 900;
    text-transform: uppercase;
}

.reviews-page__score {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    margin-top: 10px;
}

.reviews-page__score-value {
    font-size: 56px;
    font-weight: 900;
    line-height: .9;
}

.reviews-page__score-max {
    padding-bottom: 6px;
    color: #999;
    font-size: 14px;
}

.reviews-page__stars {
    display: flex;
    gap: 3px;
    margin-top: 12px;
}

.reviews-page__stars svg {
    width: 18px;
    height: 18px;
    fill: #2a2a2a;
}

.reviews-page__stars svg.is-full,
.reviews-page__stars svg.is-half {
    fill: var(--blue);
}

.reviews-page__stars--sm svg {
    width: 14px;
    height: 14px;
}

.reviews-page__score-note {
    margin: 14px 0 0;
    color: #999;
    font-size: 13px;
}

.reviews-page__distribution {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 18px;
}

.reviews-page__distribution-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.reviews-page__distribution-star {
    width: 24px;
    color: #999;
    font-size: 13px;
    font-weight: 700;
}

.reviews-page__distribution-bar {
    display: block;
    flex: 1;
    height: 8px;
    border-radius: 50px;
    background: #262626;
    overflow: hidden;
}

.reviews-page__distribution-bar span {
    display: block;
    height: 100%;
    border-radius: 50px;
    background: var(--blue);
}

.reviews-page__distribution-count {
    width: 30px;
    color: #999;
    font-size: 12px;
    font-weight: 700;
    text-align: right;
}

.reviews-page__list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.reviews-page__list-count {
    color: #999;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.reviews-page__empty {
    margin-top: 20px;
    padding: 28px;
    border: 1px solid #222;
    border-radius: 28px;
    color: #999;
    background: #161616;
}

.reviews-page__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}

.reviews-page__card {
    padding: 24px;
    border: 1px solid #222;
    border-radius: 28px;
    background: #161616;
}

.reviews-page__card-top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.reviews-page__card-author {
    display: flex;
    align-items: center;
    gap: 12px;
}

.reviews-page__card-author b {
    display: block;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.reviews-page__card-author small {
    display: block;
    margin-top: 3px;
    color: #999;
    font-size: 12px;
}

.reviews-page__avatar {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    color: #111;
    background: var(--blue);
    font-size: 15px;
    font-weight: 900;
}

.reviews-page__card-rating {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    max-width: 260px;
}

.reviews-page__product {
    display: -webkit-box;
    overflow: hidden;
    color: #999;
    font-size: 11px;
    line-height: 1.4;
    text-align: right;
    text-decoration: none;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

a.reviews-page__product:hover {
    color: var(--blue);
    text-decoration: underline;
}

.reviews-page__card-text {
    margin: 18px 0 0;
    color: #ccc;
    font-size: 15px;
    line-height: 1.55;
}

.reviews-page__prom-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    color: #999;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-decoration: none;
    text-transform: uppercase;
    transition: color .2s;
}

.reviews-page__prom-link svg {
    width: 13px;
    height: 13px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.reviews-page__prom-link:hover {
    color: var(--blue);
}

.reviews-page__pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 32px;
}

.reviews-page__page-nav {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid #333;
    border-radius: 50%;
    color: #fff;
    background: transparent;
    cursor: pointer;
    transition: border-color .2s, color .2s, opacity .2s;
}

.reviews-page__page-nav svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.reviews-page__page-nav:hover:not(:disabled) {
    border-color: var(--blue);
    color: var(--blue);
}

.reviews-page__page-nav:disabled {
    color: #444;
    cursor: default;
    opacity: .5;
}

.reviews-page__page-numbers {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.reviews-page__page {
    display: grid;
    place-items: center;
    min-width: 40px;
    height: 40px;
    padding: 0 4px;
    border: 1px solid #333;
    border-radius: 50%;
    color: #999;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    transition: color .2s, border-color .2s, background-color .2s;
}

.reviews-page__page:hover {
    color: #fff;
}

.reviews-page__page.is-active {
    border-color: var(--blue);
    color: #111;
    background: var(--blue);
}

/* Product reviews (відгуки про конкретний товар, catalog.php)
	========================================================================== */
.product-reviews {
    padding: 70px 0;
}

.product-reviews__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.product-reviews__title {
    margin: 10px 0 0;
    font-size: clamp(24px, 3vw, 34px);
    font-weight: 900;
    text-transform: uppercase;
}

.product-reviews__title span {
    color: var(--blue);
}

.product-reviews__summary {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    color: #999;
    font-size: 14px;
    font-weight: 700;
}

.product-reviews__stars {
    display: flex;
    gap: 2px;
}

.product-reviews__stars svg {
    width: 16px;
    height: 16px;
    fill: #2a2a2a;
}

.product-reviews__stars svg.is-full,
.product-reviews__stars svg.is-half {
    fill: var(--blue);
}

.product-reviews__add {
    flex: 0 0 auto;
    padding: 15px 30px;
    border: 1px solid var(--blue);
    border-radius: 50px;
    color: var(--blue);
    background: transparent;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.product-reviews__add:hover {
    color: #111;
    background: var(--blue);
}

.product-reviews__empty {
    margin-top: 28px;
    color: #999;
}

.product-reviews__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 32px;
}

.product-reviews__card {
    padding: 22px;
    border: 1px solid #222;
    border-radius: 24px;
    background: #161616;
}

.product-reviews__card-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.product-reviews__card-top b {
    display: block;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.product-reviews__card-top small {
    display: block;
    margin-top: 2px;
    color: #999;
    font-size: 11px;
}

.product-reviews__card-stars {
    display: flex;
    gap: 2px;
    margin-left: auto;
}

.product-reviews__card-stars svg {
    width: 13px;
    height: 13px;
    fill: #2a2a2a;
}

.product-reviews__card-stars svg.is-full,
.product-reviews__card-stars svg.is-half {
    fill: var(--blue);
}

.product-reviews__avatar {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    color: #111;
    background: var(--blue);
    font-size: 13px;
    font-weight: 900;
}

.product-reviews__card p {
    margin: 16px 0 0;
    color: #ccc;
    font-size: 14px;
    line-height: 1.5;
}

/* Review modal (форма "Залишити відгук")
	========================================================================== */
.review-modal {
    position: fixed;
    z-index: 70;
    inset: 0;
    display: grid;
    visibility: hidden;
    place-items: center;
    padding: 20px;
    opacity: 0;
    transition: visibility .3s ease, opacity .3s ease;
}

.review-modal.is-open {
    visibility: visible;
    opacity: 1;
}

.review-modal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: rgba(0, 0, 0, .8);
    cursor: default;
}

.review-modal__panel {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 460px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    padding: 44px;
    border: 1px solid #262626;
    border-radius: 34px;
    color: #fff;
    background: #161616;
    transform: translateY(16px);
    transition: transform .3s ease;
}

.review-modal.is-open .review-modal__panel {
    transform: translateY(0);
}

.review-modal__close {
    position: absolute;
    top: 22px;
    right: 22px;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid #333;
    border-radius: 50%;
    color: #999;
    background: transparent;
    cursor: pointer;
}

.review-modal__close svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.review-modal__close:hover {
    color: var(--blue);
}

.review-modal__eyebrow {
    margin: 0;
    color: #999;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
}

.review-modal__title {
    margin: 10px 0 0;
    font-size: 28px;
    font-weight: 900;
    text-transform: uppercase;
}

.review-modal__title span {
    color: var(--blue);
}

.review-modal__form {
    margin-top: 24px;
}

.review-modal__field {
    margin-top: 18px;
}

.review-modal__field label {
    display: block;
    margin-bottom: 8px;
    color: #999;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.review-modal__field input,
.review-modal__field textarea {
    width: 100%;
    padding: 13px 16px;
    border: 1px solid #2e2e2e;
    border-radius: 16px;
    outline: 0;
    color: #fff;
    background: #1b1b1b;
    font: inherit;
    font-size: 14px;
    resize: vertical;
    transition: border-color .2s;
}

.review-modal__field input::placeholder,
.review-modal__field textarea::placeholder {
    color: #777;
}

.review-modal__field input:focus,
.review-modal__field textarea:focus {
    border-color: var(--blue);
}

.review-modal__rating {
    display: flex;
    gap: 6px;
}

.review-modal__star {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.review-modal__star svg {
    width: 26px;
    height: 26px;
    fill: #2a2a2a;
    transition: fill .15s;
}

.review-modal__star.is-active svg,
.review-modal__star.is-hover svg {
    fill: var(--blue);
}

.review-modal__error {
    margin: 16px 0 0;
    color: #ff6b6b;
    font-size: 12px;
}

.review-modal__submit {
    width: 100%;
    margin-top: 24px;
    padding: 16px 0;
    border: 1px solid var(--blue);
    border-radius: 50px;
    color: #111;
    background: var(--blue);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color .2s, background-color .2s;
}

.review-modal__submit:hover {
    color: var(--blue);
    background: transparent;
}

.review-modal__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 30px 0;
    text-align: center;
}

.review-modal__success svg {
    width: 44px;
    height: 44px;
    padding: 10px;
    border-radius: 50%;
    background: var(--blue);
    fill: none;
    stroke: #111;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.review-modal__success p {
    margin: 0;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

.review-modal__note {
    margin: 20px 0 0;
    color: #666;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .12em;
}

/* ===== Галерея "Hydrophob в дії" (каталог) ===== */

.action-gallery {
    padding: 90px 0 40px;
    border-top: 1px solid #171717;
}

.action-gallery__head {
    margin-bottom: 40px;
}

.action-gallery__title {
    margin: 14px 0 0;
    font-size: clamp(32px, 4vw, 56px);
    font-weight: 800;
    text-transform: uppercase;
}

.action-gallery__lead {
    max-width: 520px;
    margin: 16px 0 0;
    color: #999;
    font-size: 15px;
    line-height: 1.5;
}

.action-gallery__track {
    display: flex;
    gap: 16px;
    padding: 0 max(20px, calc((100vw - var(--container)) / 2)) 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-color: var(--blue) #1a1a1a;
}

.action-gallery__item,
.howto-videos__item {
    position: relative;
    flex: 0 0 auto;
    margin: 0;
    border-radius: 6px;
    overflow: hidden;
    background: #1a1a1a;
    scroll-snap-align: start;
}

.action-gallery__item {
    width: min(480px, 82vw);
}

.action-gallery__item video,
.howto-videos__item video {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.action-gallery__play {
    position: absolute;
    inset: 0;
    z-index: 2;
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
}

.action-gallery__play::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(21, 21, 21, .75) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2332c6f4' d='M9 6.5v11l9-5.5z'/%3E%3C/svg%3E") center / 26px no-repeat;
    transform: translate(-50%, -50%);
    transition: background-color .2s, transform .2s;
}

.action-gallery__play:hover::before {
    background-color: rgba(21, 21, 21, .95);
    transform: translate(-50%, -50%) scale(1.08);
}

[data-action-item].is-playing .action-gallery__play {
    display: none;
}

.action-gallery__caption,
.howto-videos__item figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    margin: 0;
    padding: 40px 16px 12px;
    background: linear-gradient(to top, rgba(17, 17, 17, .85), transparent);
    font-size: 13px;
    font-weight: 700;
    pointer-events: none;
}

[data-action-item].is-playing .action-gallery__caption,
[data-action-item].is-playing figcaption {
    display: none;
}

.action-gallery__caption span {
    display: inline-block;
    margin-right: 10px;
    padding: 3px 8px;
    border-radius: 3px;
    background: var(--blue);
    color: #111;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

/* ===== Відео "Як застосовувати" (про нас) ===== */

.howto-videos {
    padding: 90px 0;
    border-top: 1px solid #171717;
}

.howto-videos__heading h2 {
    margin: 14px 0 0;
    font-size: clamp(32px, 4vw, 56px);
    font-weight: 800;
    text-transform: uppercase;
}

.howto-videos__heading p:not(.section-label) {
    max-width: 520px;
    margin: 16px 0 0;
    color: #999;
    font-size: 15px;
    line-height: 1.5;
}

.howto-videos__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 40px;
}

@media (max-width: 767px) {
    .action-gallery,
    .howto-videos {
        padding-top: 60px;
    }

    .howto-videos__grid {
        grid-template-columns: 1fr;
    }
}


/* ===== Спільна база групи: плашки замовлень з інших магазинів + згода ===== */
.account-group__heading { margin-top: 36px; }
.account-group__intro { margin: 0 0 14px; font-size: 14px; line-height: 1.5; opacity: .75; }
.account-orders__item--group { padding: 14px 18px; }
.account-orders__group-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.account-group__badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; background: color-mix(in srgb, var(--badge, #1ea7e0) 18%, transparent); color: var(--badge, #1ea7e0); white-space: nowrap; }
.account-group__badge::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--badge, #1ea7e0); }
.account-orders__view--group { margin-left: auto; }
.hp-code__consent { margin: 12px 0 0; font-size: 12px; line-height: 1.45; opacity: .65; }

/* ===== Кабінет: блок «Єдиний профіль Hydrophob» (перемикач згоди) ===== */
.account-group { margin-top: 24px; }
.account-group__text { margin: 0 0 14px; font-size: 14px; line-height: 1.5; opacity: .8; }
.account-group__switch { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; user-select: none; }
.account-group__switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.account-group__track { flex: 0 0 44px; width: 44px; height: 24px; border-radius: 999px; background: #c9ced6; position: relative; transition: background .2s; margin-top: 1px; }
.account-group__track::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .2s; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.account-group__switch input:checked + .account-group__track { background: #1ea7e0; }
.account-group__switch input:checked + .account-group__track::after { transform: translateX(20px); }
.account-group__switch input:focus-visible + .account-group__track { outline: 2px solid #1ea7e0; outline-offset: 2px; }
.account-group__label { font-size: 14px; line-height: 1.4; display: flex; flex-direction: column; gap: 2px; }
.account-group__label small { font-size: 12px; opacity: .65; }
.account-group__sites { margin: 14px 0 0; font-size: 13px; opacity: .85; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.account-group__note { margin: 10px 0 0; font-size: 12px; opacity: .75; }
.account-group__badge--own { outline: 1px solid var(--badge, #1ea7e0); }

/* Випадайки підказок мають бути ВИЩЕ cookie-банера (z-index 130):
   інакше банер накриває список відділень унизу чекаута. */
.checkout__suggest-list,
.account-form__suggest,
.review-modal__suggest {
  z-index: 200;
}