@redneckz/wildless-cms-uni-blocks 0.3.95 → 0.3.96

package/bundle/bundle.umd.js

@@ -323,6 +323,7 @@
       IconMap["SignDocsIcon"] = "SignDocsIcon";
       IconMap["SmallClockIcon"] = "SmallClockIcon";
       IconMap["SoundIcon"] = "SoundIcon";
+      IconMap["StateMortgageIcon"] = "StateMortgageIcon";
       IconMap["TelegramIcon"] = "TelegramIcon";
       IconMap["UnionPayIcon"] = "UnionPayIcon";
       IconMap["UserTickIcon"] = "UserTickIcon";
@@ -407,6 +408,7 @@
       IconTitleMap["SignDocsIcon"] = "\u041F\u043E\u0434\u043F\u0438\u0441\u0430\u043D\u043D\u044B\u0435 \u0434\u043E\u043A\u0443\u043C\u0435\u043D\u0442\u044B";
       IconTitleMap["SmallClockIcon"] = "\u041C\u0430\u043B\u0435\u043D\u044C\u043A\u0438\u0435 \u0447\u0430\u0441\u044B";
       IconTitleMap["SoundIcon"] = "\u0417\u0432\u0443\u043A";
+      IconTitleMap["StateMortgageIcon"] = "StateMortgageIcon";
       IconTitleMap["TelegramIcon"] = "\u041B\u043E\u0433\u043E \u00ABTelegram\u00BB";
       IconTitleMap["UnionPayIcon"] = "UnionPay";
       IconTitleMap["UserTickIcon"] = "\u041F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u0442\u0435\u043B\u044C";
@@ -474,7 +476,7 @@
       return 0;
   };
   const ImgAsPicture = JSX(({ className = '', image, imageClassName = '', isMobile = false }) => {
-      if (!image) {
+      if (!image || (!image?.sources && !image?.src)) {
           return null;
       }
       const pictureStyles = isMobile ? 'flex' : 'flex-none';
@@ -538,7 +540,7 @@
   };
   const HEADLINE_VERSION = {
       XXL: {
-          descriptionFont: 'text-h4-alt',
+          descriptionFont: 'text-h5',
           gap: 'gap-[18px]',
           headingType: 'h0',
           as: 'h1',
@@ -598,7 +600,7 @@
       return index !== -1 ? href.substring(index + 1) : '';
   };
 
-  const LinkDocsListItem = JSX(({ className = '', doc, icon }) => (jsx(LinkDocsListItemBase, { className: `flex h-full box-border ${className}`, iconClassName: "mr-2.5 min-w-6 min-h-6", textClassName: "self-center font-light", suffixClassName: "text-secondary-text group-hover:text-primary-main", doc: doc, icon: icon })));
+  const LinkDocsListItem = JSX(({ className = '', doc, icon }) => (jsx(LinkDocsListItemBase, { className: `flex h-full box-border ${className}`, iconClassName: "mr-2.5 min-w-6 min-h-6", textClassName: "self-center text-l-light", suffixClassName: "text-secondary-text group-hover:text-primary-main", doc: doc, icon: icon })));
 
   const LinkDocsList = JSX(({ className, documents, columnsMode = 'double', icon }) => {
       return documents?.length ? (jsx("div", { className: className, role: "list", children: documents.map((doc, i) => (jsx("div", { className: columnsMode === 'double' ? 'basis-[calc(50%-20px)]' : '', role: "listitem", children: jsx(LinkDocsListItem, { className: "group flex align-middle h-fit w-fit text-primary-text no-underline hover:text-primary-main", doc: doc, icon: icon }) }, String(i)))) })) : null;
@@ -620,7 +622,7 @@
       return (jsxs(BlockWrapper, { className: `relative font-sans p-14 ${pictureTextStyleMap[version]} ${className}`, ...rest, children: [jsx(Heading, { headingType: "h2", className: "text-center", title: title }), jsxs("div", { className: 'flex justify-center mt-9', children: [image?.src && jsx(Img, { className: directionRight ? 'order-2 ml-6' : 'mr-6', image: image }), benefits?.length ? (jsx("div", { className: "flex flex-col", children: benefits.map((_, i) => renderBenefit$2(_, i, version)) })) : null] })] }));
   });
   function renderBenefit$2(benefit, i, version) {
-      return (jsxs("div", { className: "flex flex-row mb-8", children: [benefit.icon ? (jsx(Img, { className: "w-[48px] h-[48px] bg-main rounded-full box-border p-[12px]", image: benefit.icon, width: "48", height: "48", asSVG: true })) : null, jsxs("div", { className: "flex gap-1 flex-col h-full ml-5 max-w-[490px]", children: [benefit?.label ? (jsx("div", { className: `font-medium text-xl-light m-0 ${version === 'primary' ? 'text-primary-text' : ''}`, children: benefit.label })) : null, benefit?.description ? (jsx("div", { className: `font-normal text-sm ${version === 'primary' ? 'text-secondary-text' : ''}`, children: benefit.description })) : null] })] }, String(i)));
+      return (jsxs("div", { className: "flex flex-row mb-8", children: [benefit.icon ? (jsx(Img, { className: "w-[48px] h-[48px] bg-main rounded-full box-border p-[12px]", image: benefit.icon, width: "48", height: "48", asSVG: true })) : null, jsxs("div", { className: "flex gap-1 flex-col h-full ml-5 max-w-[490px]", children: [benefit?.label ? (jsx("div", { className: `text-xl m-0 ${version === 'primary' ? 'text-primary-text' : ''}`, children: benefit.label })) : null, benefit?.description ? (jsx("div", { className: `text-s ${version === 'primary' ? 'text-secondary-text' : ''}`, children: benefit.description })) : null] })] }, String(i)));
   }
 
   const isURL = (href) => href?.includes('//');
@@ -705,7 +707,7 @@
 
   const ButtonInner = JSX((props) => {
       const { text, aboveText, appendLeft, appendRight } = props;
-      return (jsxs("div", { className: getButtonStyle(props), children: [appendLeft ? appendLeft : null, isWithText(props) ? (jsxs("div", { children: [jsx("div", { className: "text-xs text-left", children: aboveText }), jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-0.5' : 'text-l'}`, children: text })] })) : null, appendRight ? appendRight : null] }));
+      return (jsxs("div", { className: getButtonStyle(props), children: [appendLeft ? appendLeft : null, isWithText(props) ? (jsxs("div", { children: [jsx("div", { className: "text-xs-light text-left", children: aboveText }), jsx("div", { className: `text-left ${aboveText ? 'text-s -mt-0.5' : 'text-l'}`, children: text })] })) : null, appendRight ? appendRight : null] }));
   });
   const getButtonStyle = (props) => {
       const { version, aboveText, rounded } = props;
@@ -812,7 +814,7 @@
   };
   function renderBenefit$1({ benefit, version = 'primary', benefitsVersion = 'normal' }, i) {
       const isIconWhite = benefitsVersion === 'white' || version === 'secondary';
-      return (jsxs("div", { className: "flex gap-4 items-center", children: [benefit.icon ? (jsx(Img, { className: renderBenefitIconBgStyle(version, benefitsVersion), image: { ...benefit?.icon, iconVersion: isIconWhite ? 'white' : 'normal' }, width: "24", height: "24", asSVG: true })) : null, jsxs("div", { className: "flex gap-0.5 flex-col h-full max-w-[149px] min-w-[149px]", children: [jsx("div", { className: `text-h6 m-0 ${benefitTitleStyleMap[version]}`, children: benefit.label }), benefit.description ? (jsx("div", { className: `text-m ${benefitDescStyleMap[version]}`, children: benefit.description })) : null] })] }, String(i)));
+      return (jsxs("div", { className: "flex gap-4 items-center", children: [benefit.icon ? (jsx(Img, { className: renderBenefitIconBgStyle(version, benefitsVersion), image: { ...benefit?.icon, iconVersion: isIconWhite ? 'white' : 'normal' }, width: "24", height: "24", asSVG: true })) : null, jsxs("div", { className: "flex gap-0.5 flex-col h-full max-w-[149px] min-w-[149px]", children: [jsx("div", { className: `text-h6 m-0 ${benefitTitleStyleMap[version]}`, children: benefit.label }), benefit.description ? (jsx("div", { className: `text-m-light ${benefitDescStyleMap[version]}`, children: benefit.description })) : null] })] }, String(i)));
   }
   function renderBenefitIconBgStyle(version, benefitsVersion) {
       let bgColorStyle = 'bg-primary-main text-black';
@@ -826,7 +828,7 @@
   }
 
   const ProductBlockInner = JSX(({ className = '', context, title, headlineVersion = 'L', description, benefits, benefitsVersion = 'normal', buttons, image, items, version = 'primary', isDotted = true, textBlockClassName = '', }) => {
-      return (jsxs("div", { className: `flex grow justify-between items-stretch h-full ${className}`, children: [jsxs("div", { className: `flex flex-col ${textBlockClassName}`, children: [jsx(Headline, { context: context, title: title, description: description, className: `!p-0 max-w-[600px]`, bgColorHeadline: version, headlineVersion: headlineVersion, align: "left" }), jsxs(BaseTile, { context: context, buttons: getButtons(context, buttons), children: [benefits?.filter((_) => _.label)?.length ? (jsx("div", { className: "flex gap-6 mt-6", children: benefits.map((benefit, i) => renderBenefit$1({ benefit, version, benefitsVersion }, i)) })) : null, items?.length ? (jsx(List, { className: "mt-5 text-h6 font-light", items: items, itemClassName: "mb-[7px]", version: version, isDotted: isDotted })) : null] })] }), image?.src && jsx(Img, { className: "mt-[-50px]", image: image })] }));
+      return (jsxs("div", { className: `flex grow justify-between items-stretch h-full ${className}`, children: [jsxs("div", { className: `flex flex-col ${textBlockClassName}`, children: [jsx(Headline, { context: context, title: title, description: description, className: `!p-0 max-w-[600px]`, bgColorHeadline: version, headlineVersion: headlineVersion, align: "left" }), jsxs(BaseTile, { context: context, buttons: getButtons(context, buttons), children: [benefits?.filter((_) => _.label)?.length ? (jsx("div", { className: "flex gap-6 mt-6", children: benefits.map((benefit, i) => renderBenefit$1({ benefit, version, benefitsVersion }, i)) })) : null, items?.length ? (jsx(List, { className: "mt-5 text-h6", items: items, itemClassName: "mb-[7px]", version: version, isDotted: isDotted })) : null] })] }), image?.src && jsx(Img, { className: "mt-[-50px]", image: image })] }));
   });
   const getButtons = (context, buttons) => {
       return buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex gap-4" })) : null;
@@ -853,7 +855,7 @@
       const { handlerDecorator } = context;
       return (jsxs(BlockWrapper, { context: context, className: `font-sans overflow-hidden p-[50px] flex flex-col box-border min-h-[528px] ${productBlockStyleMap$1[version]} ${className}`, ...otherProps, children: [backwardButton?.text
                   ? renderBackwardButton(useLink({ router, handlerDecorator }, backwardButton), version, 'mb-10 -mt-2.5')
-                  : null, breadcrumbs?.length ? (jsx("div", { className: "text-xs mb-6", children: joinList(jsx("span", { className: `mx-2 ${breadcrumbsStyleMap[version]}`, children: "/" }))(breadcrumbs.map((breadcrumb, i) => (jsx(Breadcrumb, { ...useLink({ router, handlerDecorator }, { className: breadcrumbsStyleMap[version], ...breadcrumb }) }, String(i))))) })) : null, jsx(ProductBlockInner, { context: context, version: version, ...otherProps })] }));
+                  : null, breadcrumbs?.length ? (jsx("div", { className: "text-xs-light mb-6", children: joinList(jsx("span", { className: `mx-2 ${breadcrumbsStyleMap[version]}`, children: "/" }))(breadcrumbs.map((breadcrumb, i) => (jsx(Breadcrumb, { ...useLink({ router, handlerDecorator }, { className: breadcrumbsStyleMap[version], ...breadcrumb }) }, String(i))))) })) : null, jsx(ProductBlockInner, { context: context, version: version, ...otherProps })] }));
   });
 
   const textBlockStyleMaps = {
@@ -878,10 +880,10 @@
   };
   const TextBlock = JSX(({ title, description, blockVersion = 'primary', iconVersion, image, className, ...rest }) => {
       const textBlockStyleMap = textBlockStyleMaps[blockVersion];
-      return (jsxs(BlockWrapper, { className: `font-sans px-9 py-4 flex ${textBlockStyleMap.background} ${className || ''}`, ...rest, children: [iconVersion === 'small' ? renderIcon(textBlockStyleMap.icon) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "py-0.5", children: [title ? (jsx("div", { className: `font-medium text-base mb-1 ${textBlockStyleMap.title}`, children: title })) : null, description ? (jsx("div", { className: `text-sm ${textBlockStyleMap.description}`, children: description })) : null] })] }));
+      return (jsxs(BlockWrapper, { className: `font-sans px-9 py-4 flex ${textBlockStyleMap.background} ${className || ''}`, ...rest, children: [iconVersion === 'small' ? renderIcon(textBlockStyleMap.icon) : null, iconVersion === 'big' ? renderImage(image) : null, jsxs("div", { className: "py-0.5", children: [title ? (jsx("div", { className: `text-l font-medium mb-1 ${textBlockStyleMap.title}`, children: title })) : null, description ? (jsx("div", { className: `text-s ${textBlockStyleMap.description}`, children: description })) : null] })] }));
   });
   function renderIcon(className) {
-      return (jsx("div", { className: "pt-1.5 pl-1 pr-4", children: jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs ${className}`, children: "i" }) }));
+      return (jsx("div", { className: "pt-1.5 pl-1 pr-4", children: jsx("div", { className: `rounded-full h-4 w-4 text-center text-xs-light ${className}`, children: "i" }) }));
   }
   function renderImage(image) {
       return image?.src ? jsx(Img, { className: "pt-0.5 pr-3", image: image }) : null;
@@ -930,7 +932,7 @@
   });
   function renderList$2(items, version, isDotted) {
       const listVersion = version === 'primary' ? 'tile' : 'tile-white';
-      return items?.length ? (jsx(List, { items: items, isDotted: isDotted, itemClassName: "text-h6 font-light mt-2", version: listVersion })) : null;
+      return items?.length ? (jsx(List, { items: items, isDotted: isDotted, itemClassName: "text-h6 mt-2", version: listVersion })) : null;
   }
 
   const productTileStyleMap = {
@@ -953,14 +955,14 @@
           primary: 'text-secondary-text',
           secondary: 'text-white',
       };
-      return (jsx("div", { className: `text-m ${i ? 'mt-4' : ''} ${labelStyleMap[version]}`, children: benefit.description }, String(i)));
+      return (jsx("div", { className: `text-m-light ${i ? 'mt-4' : ''} ${labelStyleMap[version]}`, children: benefit.description }, String(i)));
   }
   function renderAdditionalDescription(additionalDescription, version = 'primary') {
       const descStyleMap = {
           primary: 'text-secondary-text',
           secondary: 'text-white',
       };
-      return jsx("div", { className: `text-m mt-2.5 ${descStyleMap[version]}`, children: additionalDescription });
+      return (jsx("div", { className: `text-m-light mt-2.5 ${descStyleMap[version]}`, children: additionalDescription }));
   }
 
   const ArrowButton = JSX(({ className, disabled, ...rest }) => (jsx(Button, { rounded: true, className: `group shadow-[0_4px_25px_rgba(0,0,0,0.07)] w-12 h-12 min-h-12 max-h-12 flex items-center justify-center ${disabled
@@ -999,7 +1001,7 @@
       return jsx("div", { className: `text-xl-light m-0 ${className}`, children: title });
   }
   function renderItems(items, isDotted, version = 'primary') {
-      return (jsx(List, { className: `max-w-[308px] mt-2 text-sm ${version === 'primary' ? '!text-secondary-text' : ''}`, itemClassName: "mt-1 first:mt-0", items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted, version: version }));
+      return (jsx(List, { className: `max-w-[308px] mt-2 text-s ${version === 'primary' ? '!text-secondary-text' : ''}`, itemClassName: "mt-1 text-left first:mt-0", items: items.filter((item) => item?.text).map((item) => item.text), isDotted: isDotted, version: version }));
   }
   function getTitleStyle(version) {
       return `text-xl-light m-0
@@ -1008,7 +1010,7 @@
   }
 
   const GalleryContainer = JSX(({ context, title, description, cards = [], version = 'normal', activeCardIndex }) => {
-      return (jsxs("div", { children: [jsx("div", { className: "absolute top-0 left-0 bottom-0 w-[84px] bg-gradient-to-r from-white to-transparent" }), jsxs("div", { className: "flex flex-col items-center mb-8", children: [title ? jsx(Heading, { headingType: "h2", className: "text-center", title: title }) : null, description ? (jsx("div", { className: "text-xl-light max-w-[600px] mt-2.5", children: description })) : null] }), jsx("div", { className: `flex ${cards?.length <= galleryLengthForScrollMap[version] ? 'justify-center' : ''} duration-1000`, style: { transform: `translateX(-${activeCardIndex * cardWidthMap[version]}px)` }, role: "list", children: cards?.map((card, i) => renderCard({ card, version, context }, i)) })] }));
+      return (jsxs("div", { children: [jsx("div", { className: "absolute top-0 left-0 bottom-0 w-[84px] bg-gradient-to-r from-white to-transparent" }), jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "L", align: "center" }), jsx("div", { className: `flex mt-8 ${cards?.length <= galleryLengthForScrollMap[version] ? 'justify-center' : ''} duration-1000`, style: { transform: `translateX(-${activeCardIndex * cardWidthMap[version]}px)` }, role: "list", children: cards?.map((card, i) => renderCard({ card, version, context }, i)) })] }));
   });
   function renderCard({ card, version }, i) {
       return (jsx("section", { className: `box-border border-solid border border-main-stroke p-6 mx-2 flex flex-col justify-between
@@ -1036,7 +1038,7 @@
   const MiniGallery = JSX((props) => (jsx(GalleryInner, { ...props, version: "mini" })));
 
   const LinkList = JSX(({ className = '', documents, ...rest }) => {
-      return (jsx(BlockWrapper, { className: `font-sans bg-white mt-[10px] ${className}`, ...rest, children: jsx("ul", { className: "flex flex-col text-sm text-secondary-text p-0", children: documents?.length ? renderLinkListItem(documents) : null }) }));
+      return (jsx(BlockWrapper, { className: `font-sans bg-white mt-[10px] ${className}`, ...rest, children: jsx("ul", { className: "flex flex-col text-s text-secondary-text p-0", children: documents?.length ? renderLinkListItem(documents) : null }) }));
   });
   const renderLinkListItem = (documents) => {
       return documents.map((doc, i) => {
@@ -1073,7 +1075,7 @@
   };
 
   const AccordionItemInner = JSX(({ blocks, context }) => {
-      return (jsx("div", { className: "grid grid-cols-12 transition-all duration-300 max-h-0 overflow-hidden", children: renderBlocksList({ context, blocks, className: '!p-0 mb-5' }) }));
+      return (jsx("div", { className: "grid grid-cols-12 transition-all duration-300 max-h-0 overflow-hidden", children: renderBlocksList({ context, blocks, className: '!p-0 mb-3.5' }) }));
   });
 
   const useActiveHandler$1 = ({ context, blocks, initialState = false }) => {
@@ -1100,9 +1102,9 @@
           blocks,
           initialState: isExpanded,
       });
-      return (jsxs("li", { className: "border-0 border-b border-solid border-main-divider last:border-b-0", children: [jsxs("button", { className: `border-none bg-transparent px-0 py-5 flex justify-between text-left w-full font-sans
-            ${hasContent ? 'group cursor-pointer' : ''}
-          `, onClick: handleToggle, children: [jsx("span", { className: `text-xl-light pr-2.5 font-medium`, children: label }), hasContent ? (jsx(Img, { image: icon, className: "text-primary-main", width: "24", height: "24", asSVG: true })) : null] }), hasContent ? (jsx(AccordionItemInner, { isExpanded: isActive, blocks: blocks, context: context })) : null] }));
+      return (jsxs("li", { className: "border-0 border-b border-solid border-main-divider last:border-b-0", children: [jsxs("button", { className: `border-none bg-transparent px-0 pt-5 pb-3.5 flex justify-between text-left w-full
+            font-sans text-h6 ${hasContent ? 'group cursor-pointer' : ''}
+          `, onClick: handleToggle, children: [jsx("span", { className: `text-xl font-medium pr-2.5`, children: label }), hasContent ? (jsx(Img, { image: icon, className: "text-primary-main", width: "24", height: "24", asSVG: true })) : null] }), hasContent ? (jsx(AccordionItemInner, { isExpanded: isActive, blocks: blocks, context: context })) : null] }));
   });
 
   const ALIGN_TITLE = {
@@ -1111,18 +1113,18 @@
       right: 'text-right',
   };
   const Accordion = JSX(({ title, description, accordionItems, context, className = '', accordionAlignTitle = 'center', ...rest }) => {
-      return (jsxs(BlockWrapper, { context: context, className: `p-[50px] font-sans bg-white text-primary-text ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h4", className: `mb-2.5 ${ALIGN_TITLE[accordionAlignTitle]}`, title: title })) : null, description ? jsx("div", { className: "mb-2.5 text-l", children: description }) : null, accordionItems?.length ? (jsx("ul", { className: "list-none m-0 p-0", children: accordionItems.map((item, i) => (jsx(AccordionItem, { ...item, context: context }, `AccordionItem${i}`))) })) : null] }));
+      return (jsxs(BlockWrapper, { context: context, className: `p-[50px] mb-1 last:mb-0 font-sans bg-white text-primary-text ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", className: `mb-2.5 ${ALIGN_TITLE[accordionAlignTitle]}`, title: title })) : null, description ? jsx("div", { className: "mb-2.5 text-l", children: description }) : null, accordionItems?.length ? (jsx("ul", { className: "list-none m-0 p-0", children: accordionItems.map((item, i) => (jsx(AccordionItem, { ...item, context: context }, `AccordionItem${i}`))) })) : null] }));
   });
 
-  const BenefitsBlock = JSX(({ className = '', headingType = 'h2', title, benefitList, ...rest }) => {
-      return (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-12 flex flex-col items-center ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: headingType, as: "h2", className: "max-w-[47rem] text-center", title: title })) : null, benefitList?.length ? renderBenefits(benefitList) : null] }));
+  const BenefitsBlock = JSX(({ className = '', title, benefitList, ...rest }) => {
+      return (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-12 flex flex-col items-center ${className}`, ...rest, children: [title ? (jsx(Heading, { headingType: "h3", as: "h2", className: "max-w-[47rem] text-center", title: title })) : null, benefitList?.length ? renderBenefits(benefitList) : null] }));
   });
   const renderBenefits = (benefits) => {
-      return (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-9", children: benefits.map(renderStep) }));
+      return (jsx("div", { className: "flex flex-wrap w-full justify-center gap-x-20 mt-8", children: benefits.map(renderStep) }));
   };
   const renderStep = (benefit, i) => {
       const description = benefit?.description || undefined;
-      return (jsxs("div", { className: "flex items-center basis-1/2 max-w-[500px] mb-[46px]", children: [benefit?.icon ? (jsx(Img, { className: "h-[70px] w-[70px] min-w-[70px] min-h-[70px] mr-5", image: benefit.icon, width: "70", height: "70" })) : null, jsxs("div", { children: [benefit?.label ? jsx("h3", { className: "font-medium text-xl-light m-0", children: benefit.label }) : null, renderDescription(description)] })] }, String(i)));
+      return (jsxs("div", { className: "flex items-center basis-1/2 max-w-[500px] mb-14", children: [benefit?.icon?.icon ? (jsx(Img, { className: "w-[50px] h-[50px] min-w-[50px] p-3 rounded-full bg-main-divider", image: benefit.icon, asSVG: true })) : null, benefit?.icon?.src ? jsx(Img, { image: benefit.icon }) : null, jsxs("div", { className: "ml-5", children: [benefit?.label ? jsx("h3", { className: "text-h6 m-0", children: benefit.label }) : null, renderDescription(description)] })] }, String(i)));
   };
   const renderDescription = (description) => {
       const benefitType = description ? description?.benefitType : null;
@@ -1140,8 +1142,8 @@
   };
 
   const Bonus = JSX((props) => {
-      const { className = '', title, description, bonusItems, ...rest } = props;
-      return (jsx(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, ...rest, children: jsxs("div", { className: "container", children: [title ? jsx(Heading, { headingType: "h3", className: "text-center", title: title }) : null, description ? (jsx("div", { className: "text-xl-light text-center mt-[10px]", children: description })) : null, jsx("div", { className: "flex flex-wrap w-full mt-9", children: bonusItems
+      const { context, className = '', title, description, bonusItems, ...rest } = props;
+      return (jsx(BlockWrapper, { className: `font-sans bg-white p-[50px] pb-9 ${className}`, context: context, ...rest, children: jsxs("div", { className: "container", children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center" }), jsx("div", { className: "flex flex-wrap w-full mt-9", children: bonusItems
                           ? bonusItems.map((_, i) => {
                               return (jsx("div", { className: "flex-grow w-[49%] border border-gray pl-9 pt-9 pr-6 pb-6 mb-[14px] mx-[7px] even:mr-0 odd:ml-0 last:odd:mx-0", children: jsxs("div", { className: "flex justify-between w-full", children: [jsxs("div", { className: "mr-4", children: [jsx("div", { className: "text-h4", children: _.title }), jsx("div", { className: "text-xl-light mt-[14px] max-w-[488px]", children: _.description })] }), _.bonusCount ? (jsxs("div", { className: "relative -bottom-3 h-auto flex items-end mt-14 shrink-0", children: [jsx("span", { className: "font-mohave -tracking-[5px] text-title-extra bg-clip-text text-transparent bg-green-to-yellow -mb-7", children: _.bonusCount }), jsx("span", { className: "text-[44px] bg-clip-text text-transparent bg-green-to-yellow", children: _.bonusName })] })) : null] }) }, String(i)));
                           })
@@ -1161,8 +1163,8 @@
       }
   }
 
-  const BonusBenefitsBlock = JSX(({ className = '', title, subtitle, bonusBenefits, ...rest }) => {
-      return (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-50 flex flex-col text-center ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-[10px]", title: title }) : null, subtitle ? jsx("span", { className: "text-md font-normal", children: subtitle }) : null, bonusBenefits?.length ? (jsx("div", { className: `grid gap-1 ${getElementsColsValue(className)}`, children: bonusBenefits.map(renderBonusBenefit) })) : null] }));
+  const BonusBenefitsBlock = JSX(({ context, className = '', title, subtitle, bonusBenefits, ...rest }) => {
+      return (jsxs(BlockWrapper, { className: `font-sans text-primary-text bg-white p-50 flex flex-col text-center ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: subtitle, headlineVersion: "M", align: "center" }), bonusBenefits?.length ? (jsx("div", { className: `grid gap-1 mt-8 ${getElementsColsValue(className)}`, children: bonusBenefits.map(renderBonusBenefit) })) : null] }));
   });
   const renderBonusBenefit = (bonusBenefit, i) => {
       return (jsxs("div", { className: "flex flex-col items-center max-w-[292px]", children: [bonusBenefit?.icon ? (jsx(Img, { className: "h-[180px] w-[160px] min-w-[160px] min-h-[160px]", image: bonusBenefit.icon, width: "160", height: "180" })) : null, jsx("div", { children: bonusBenefit?.label ? jsx("span", { className: "text-h6 m-0", children: bonusBenefit.label }) : null })] }, String(i)));
@@ -1240,7 +1242,7 @@
           }
       };
       return (jsxs("div", { className: className, children: [jsxs("label", { className: "block relative", children: [title ? jsx("span", { className: "text-l text-secondary-text pl-4", children: title }) : null, jsx("input", { className: `m-0 mt-[5px] font-sans text-h3 w-full h-14 border border-solid border-main-stroke rounded-md
-                        outline-none p-0 pl-4 box-border text-primary-text`, value: addSpacesBetweenNumbers(value), onChange: (e) => handleChange(e.target.value), onBlur: handleBlur }), jsx("div", { className: "absolute inset-x-0 bottom-[-4px] px-4 leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider", type: "range", min: min, max: max, step: step, value: value, onChange: (e) => handleChange(e.target.value), style: inputStyle }) })] }), jsx("div", { className: "flex justify-between my-3", children: items.map((item, i) => (jsx("span", { className: "text-sm leading-[14px] text-secondary-text pl-4", children: item }, String(i)))) })] }));
+                        outline-none p-0 pl-4 box-border text-primary-text`, value: addSpacesBetweenNumbers(value), onChange: (e) => handleChange(e.target.value), onBlur: handleBlur }), jsx("div", { className: "absolute inset-x-0 bottom-[-4px] px-4 leading-[18px]", children: jsx("input", { className: "box-border w-full m-0 cursor-pointer slider", type: "range", min: min, max: max, step: step, value: value, onChange: (e) => handleChange(e.target.value), style: inputStyle }) })] }), jsx("div", { className: "flex justify-between my-3", children: items.map((item, i) => (jsx("span", { className: "text-s leading-[14px] text-secondary-text pl-4", children: item }, String(i)))) })] }));
   });
 
   const clamp = (value, min, max) => Math.max(min, Math.min(value, max));
@@ -1532,10 +1534,10 @@
           ? 'h-[88px] w-[387px] min-w-[387px] p-5 border-none bg-primary-main text-white'
           : `h-[77px] w-[322px] min-w-[322px] px-5 py-4 ease-in duration-300 bg-white text-primary-text`;
       const btnTitleClassName = isActiveBtn ? 'text-xl mb-1.5' : `text-l mb-[3px]`;
-      const btnDescClassName = isActiveBtn ? 'text-l text-white' : `text-m-md`;
+      const btnDescClassName = isActiveBtn ? 'text-l font-light text-white' : `text-m font-light`;
       const iconClassName = isActiveBtn ? '' : `text-primary-main`;
-      return (jsxs("button", { type: "button", onClick: onClick, "aria-label": tab?.title, className: `box-border font-sans relative border border-main-stroke cursor-pointer text-left border-b-0 flex
-      ${btnClassName}`, children: [jsx(Img, { className: `h-[24px] w-[24px] min-w-[24px] min-h-[24px] mr-4 ${iconClassName}`, image: { ...tab?.icon, iconVersion: isActiveBtn ? 'white' : 'normal' }, width: "24", height: "24", asSVG: true }), jsxs("div", { className: "border-0", children: [jsx("div", { className: `font-medium ${btnTitleClassName}`, children: tab?.title }), jsx("div", { className: `text-secondary-text ${btnDescClassName}`, children: tab.description })] })] }, String(i)));
+      return (jsxs("button", { type: "button", onClick: onClick, "aria-label": tab?.title, className: `box-border font-sans relative border border-main-stroke cursor-pointer text-left border-b-0 flex hover:h-[88px]
+      ${btnClassName}`, children: [jsx(Img, { className: `h-[24px] w-[24px] min-w-[24px] min-h-[24px] mr-4 ${iconClassName}`, image: { ...tab?.icon, iconVersion: isActiveBtn ? 'white' : 'normal' }, width: "24", height: "24", asSVG: true }), jsxs("div", { className: "border-0", children: [jsx("div", { className: `${btnTitleClassName}`, children: tab?.title }), jsx("div", { className: `text-secondary-text ${btnDescClassName}`, children: tab.description })] })] }, String(i)));
   }
   function renderTabs({ tabsShift, tabsNav, activeSlideIndex, setActiveSlideIndex }) {
       return (jsxs("div", { children: [jsx("div", { style: { transform: `translateX(-${tabsShift * 388}px)` }, className: "flex flex-col justify-end items-center h-[126px] pt-[38px] box-border duration-1000", children: jsx("div", { className: "w-full flex flex-nowrap items-end gap-2", children: tabsNav.map((tab, i) => renderNavButton$2({
@@ -1551,7 +1553,7 @@
       white: 'bg-white',
   };
   const CatalogCard = JSX(({ className = '', title, description, image, price, button, colors }) => {
-      return (jsxs("section", { className: `border border-solid box-border p-[30px] min-w-[402px] flex flex-col justify-left ${className}`, role: "listitem", children: [image?.src ? jsx(Img, { className: "mb-5 flex justify-center", image: image }) : null, title ? (jsx(Heading, { headingType: "h6", as: "h4", className: "text-left mb-1.5", title: title })) : null, description ? (jsx("div", { className: "text-m-md text-left mb-4 font-light", children: description })) : null, colors?.length ? (jsxs("div", { className: "flex mb-4 text-m-md text-secondary-text font-light", children: [jsx("div", { className: "mr-1.5", children: "\u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0446\u0432\u0435\u0442\u0430: " }), colors.map(renderColorOption)] })) : null, price ? jsxs("div", { className: "text-h3 text-left", children: [price, "\u00A0\u20BD"] }) : null, button ? renderButton(button) : null] }));
+      return (jsxs("section", { className: `border border-solid box-border p-[30px] min-w-[402px] flex flex-col justify-left ${className}`, role: "listitem", children: [image?.src ? jsx(Img, { className: "mb-5 flex justify-center", image: image }) : null, title ? (jsx(Heading, { headingType: "h6", as: "h4", className: "text-left mb-1.5", title: title })) : null, description ? jsx("div", { className: "text-m-light text-left mb-4", children: description }) : null, colors?.length ? (jsxs("div", { className: "flex mb-4 text-m-light text-secondary-text", children: [jsx("div", { className: "mr-1.5", children: "\u0414\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0435 \u0446\u0432\u0435\u0442\u0430: " }), colors.map(renderColorOption)] })) : null, price ? jsxs("div", { className: "text-h3 text-left", children: [price, "\u00A0\u20BD"] }) : null, button ? renderButton(button) : null] }));
   });
   const renderColorOption = (color, i) => (jsx("span", { className: `w-6 h-6 ml-3 border border-solid border-main-divider rounded-full ${cardStyleMap[color]}` }, String(i)));
   const renderButton = (button) => {
@@ -1576,7 +1578,7 @@
   const CARD_SHIFT$1 = 430;
   const Catalog = JSX(({ context, cards = [], className = '', title, description, ...rest }) => {
       const [activeCardIndex, setActiveCardIndex] = context.useState(0);
-      return (jsxs(BlockWrapper, { context: context, className: `bg-white relative font-sans p-12 overflow-hidden text-center ${className}`, ...rest, children: [title ? jsx(Heading, { headingType: "h3", className: "mb-6", title: title }) : null, description ? jsx(Description, { className: "mb-6", description: description }) : null, jsx("div", { className: "flex duration-1000 gap-3.5", style: { transform: `translateX(-${activeCardIndex * CARD_SHIFT$1}px)` }, role: "list", children: cards?.length ? cards.map(renderCatalogCard(context)) : null }), renderNavButtons$1({
+      return (jsxs(BlockWrapper, { context: context, className: `bg-white relative font-sans p-12 overflow-hidden text-center ${className}`, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center" }), jsx("div", { className: "flex duration-1000 gap-3.5 mt-8", style: { transform: `translateX(-${activeCardIndex * CARD_SHIFT$1}px)` }, role: "list", children: cards?.length ? cards.map(renderCatalogCard(context)) : null }), renderNavButtons$1({
                   cardsCount: cards.length,
                   activeCardIndex,
                   setActiveCardIndex,
@@ -1606,7 +1608,7 @@
   const COLS_LENGTH_FOR_SCROLL$1 = 2;
   const COLUMN_WIDTH$1 = 4 * 80 + 4 * 4; // w-80 + gap-4 = 336px
 
-  const HeaderCell = JSX(({ icon, image, title, link }) => (jsxs("div", { className: `w-80 box-border flex flex-col items-center rounded-t-md border-b-0 px-7 pt-7 pb-[46px] ${BORDER_CLASSES$1} ${GRADIENT}`, role: "columnheader", children: [icon && !image?.src && (jsx(Img, { className: "h-[63px] w-[63px] min-w-[63px] min-h-[63px] mb-4", image: icon, width: "63", height: "63" })), image?.src && jsx(Img, { className: "mb-[18px]", image: image }), title ? (jsx(Heading, { headingType: "h4", as: "h3", className: "text-center text-white", title: title })) : null, link?.text && (jsx("div", { className: "mt-auto w-full", children: jsx(Button, { href: link.href, target: link.target, className: "mt-4 w-full text-primary-main bg-white hover:bg-secondary-hover active:bg-secondary-active", children: jsx("div", { className: "font-medium text-xs py-[11px]", children: link.text }) }) }))] })));
+  const HeaderCell = JSX(({ icon, image, title, link }) => (jsxs("div", { className: `w-80 box-border flex flex-col items-center rounded-t-md border-b-0 px-7 pt-7 pb-[46px] ${BORDER_CLASSES$1} ${GRADIENT}`, role: "columnheader", children: [icon && !image?.src && (jsx(Img, { className: "h-[63px] w-[63px] min-w-[63px] min-h-[63px] mb-4", image: icon, width: "63", height: "63" })), image?.src && jsx(Img, { className: "mb-[18px]", image: image }), title ? (jsx(Heading, { headingType: "h4", as: "h3", className: "text-center text-white", title: title })) : null, link?.text && (jsx("div", { className: "mt-auto w-full", children: jsx(Button, { href: link.href, target: link.target, className: "mt-4 w-full text-primary-main bg-white hover:bg-secondary-hover active:bg-secondary-active", children: jsx("div", { className: "text-xs-light font-medium py-[11px]", children: link.text }) }) }))] })));
 
   const carouselContainerClassesMap = {
       comparison: 'flex gap-4 duration-1000',
@@ -1625,11 +1627,11 @@
       const cellClasses = `mx-7 h-full ${DIVIDER_CLASSES$1} ${isFillGradient && isFirstRow ? 'border-t' : ''} ${!isLastRow ? 'border-solid' : 'border-b-0'}`;
       return (jsx("div", { className: cellWrapperClasses, role: "cell", children: jsx("div", { className: cellClasses, children: cell.map((item, i) => renderCellInner$1(item, i, isFillGradient)) }) }));
   });
-  const labelStyle = (isFillGradient = false) => `text-xl-light font-medium m-0 ${isFillGradient ? 'text-white' : ''}`;
-  const descriptionStyle = (isFillGradient = false) => `text-sm opacity-80 ${isFillGradient ? 'text-white' : 'text-secondary-text'}`;
+  const labelStyle = (isFillGradient = false) => `text-xl m-0 ${isFillGradient ? 'text-white' : ''}`;
+  const descriptionStyle = (isFillGradient = false) => `text-s opacity-80 ${isFillGradient ? 'text-white' : 'text-secondary-text'}`;
   const renderCellInner$1 = ({ label, description }, i, isFillGradient) => (jsxs("div", { className: "first:pt-7 pt-6 last:pb-7", children: [label ? jsx("h4", { className: labelStyle(isFillGradient), children: label }) : null, description ? jsx("div", { className: descriptionStyle(isFillGradient), children: description }) : null] }, String(i)));
 
-  const titleStyle = (isLastRow = false) => `text-sm py-7 ${DIVIDER_CLASSES$1} ${FIRST_CELL_CLASSES$1} ${isLastRow ? 'border-b-0' : 'border-solid'}`;
+  const titleStyle = (isLastRow = false) => `text-s py-7 ${DIVIDER_CLASSES$1} ${FIRST_CELL_CLASSES$1} ${isLastRow ? 'border-b-0' : 'border-solid'}`;
   const TableRow = JSX(({ row: { header, data }, activeCardIndex, isColoredFirstColumn, isFirstRow, isLastRow }) => (jsxs(TableRowContainer, { children: [header?.title ? jsx("div", { className: titleStyle(isLastRow), children: header.title }) : null, data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH$1, children: data.map((cell, i) => (jsx(TableCell, { cell: cell, isFirstRow: isFirstRow, isLastRow: isLastRow, isFillGradient: isColoredFirstColumn && i === 0 }, String(i)))) })) : null] })));
 
   const TableArrowScrollControl = JSX(({ isScrollAvailable, handleNextClick, handlePrevClick, showNextButton, showPrevButton }) => {
@@ -1685,7 +1687,7 @@
                   : null] }));
   });
   const renderShowMoreToggleButton = ({ isShowAllRow, onClick, }) => {
-      return (jsx("div", { className: "pr-[50px]", children: jsxs("div", { className: "flex w-full", children: [jsx("div", { className: FIRST_CELL_CLASSES$1 }), jsx("button", { onClick: onClick, className: "mt-5 flex-1 border-main-stroke border-solid border text-primary-text bg-white hover:border-primary-main hover:text-primary-main", children: jsx("div", { className: "font-sans font-medium text-xs py-[11px]", children: !isShowAllRow ? 'Показать все параметры' : 'Скрыть' }) })] }) }));
+      return (jsx("div", { className: "pr-[50px]", children: jsxs("div", { className: "flex w-full", children: [jsx("div", { className: FIRST_CELL_CLASSES$1 }), jsx("button", { onClick: onClick, className: "mt-5 flex-1 border-main-stroke border-solid border text-primary-text bg-white hover:border-primary-main hover:text-primary-main", children: jsx("div", { className: "font-sans text-xs-light font-medium py-[11px]", children: !isShowAllRow ? 'Показать все параметры' : 'Скрыть' }) })] }) }));
   };
 
   function useExchangeRates(useAsyncData) {
@@ -1763,7 +1765,7 @@
   });
   const formatCurrency = (value) => (value ? currencyNumberFormat.format(value) : '');
 
-  const TABLE_HEAD_STYLE = 'text-left text-m text-secondary-text';
+  const TABLE_HEAD_STYLE = 'text-left text-m-light text-secondary-text';
   const CURRENCY_ICONS_MAP = {
       USD: 'DollarIcon',
       EUR: 'EuroIcon',
@@ -1844,14 +1846,14 @@
       };
       return (jsxs("div", { className: `grid gap-[18px] pt-2 ${className}`, children: [renderInput({
                   placeholder: 'Хочу продать',
-                  rates: currencyRatesBuy,
+                  rates: currencyRatesSell,
                   selected: calcState.selectSell,
                   setSelected: handleSelectSell(calcState, handleSetCalcState, currencyRatesSell),
                   value: calcState.inputSell,
                   setValue: (value) => handleInputSell(handleSetCalcState, currencyRatesSell)(value, calcState.selectSell, calcState.selectBuy),
               }), renderInput({
                   placeholder: 'Получу',
-                  rates: currencyRatesSell,
+                  rates: currencyRatesBuy,
                   selected: calcState.selectBuy,
                   setSelected: handleSelectBuy(calcState, handleSetCalcState, currencyRatesBuy),
                   value: calcState.inputBuy,
@@ -1929,10 +1931,8 @@
   const SearchBarInner = JSX(({ className, context, isMobile = false }) => {
       const { term, setTerm } = context.useSearch();
       const LoupeIconClassName = isMobile ? 'w-[20px] h-[20px]' : 'w-[24px] h-[24px]';
-      const SearchBarLabelClassName = isMobile ? 'font-normal text-sm' : 'text-l-light';
-      const SearchBarInputClassName = isMobile
-          ? ' placeholder-transparent font-normal'
-          : 'font-light h-full';
+      const SearchBarLabelClassName = isMobile ? 'text-s' : 'text-l-light';
+      const SearchBarInputClassName = isMobile ? ' placeholder-transparent' : 'h-full';
       const inputPlaceholder = isMobile ? 'some search' : undefined;
       return (jsxs("form", { className: `font-sans relative ${className}`, children: [jsxs("div", { className: "absolute rounded h-full flex items-center justify-center pl-4 max-w-[170px] gap-3.5 pointer-events-none", children: [jsx("div", { className: LoupeIconClassName, children: jsx(Img, { image: "LoupeIcon", width: "24", height: "24" }) }), term ? null : (jsx("label", { htmlFor: "search-bar-input", className: `text-secondary-text ${SearchBarLabelClassName}`, children: "\u041F\u043E\u0438\u0441\u043A \u043F\u043E \u0441\u0430\u0439\u0442\u0443" }))] }), jsx("input", { id: "search-bar-input", className: `h-12 pl-12 w-full peer text-l text-black border border-solid rounded-md box-border
               outline-none pr-[6%] border-main-divider focus:border-primary-text ${SearchBarInputClassName}`, value: term, onChange: (e) => setTerm(e.target.value), type: "text", name: "search-bar-input", placeholder: inputPlaceholder }), isMobile ? (jsx("button", { className: "visible peer-placeholder-shown:invisible absolute top-2 right-3 w-6 h-6 p-1 bg-transparent cursor-pointer border-none", onClick: (e) => {
@@ -1941,7 +1941,7 @@
                   }, children: jsx(Img, { image: "CloseIcon", width: "24", height: "24" }) })) : (jsx(Button, { version: "primary", text: "\u041D\u0430\u0439\u0442\u0438", className: "invisible peer-focus:visible absolute top-1 right-1", onClick: (ev) => {
                       ev?.preventDefault();
                       console.log('click');
-                  }, children: jsx("div", { className: "font-normal text-sm px-9 py-[9px]", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
+                  }, children: jsx("div", { className: "text-s px-9 py-2.5", children: "\u041D\u0430\u0439\u0442\u0438" }) }))] }));
   });
 
   const SearchBar = JSX(({ className = '', context }) => {
@@ -2058,12 +2058,12 @@
       return (jsxs("div", { className: "font-sans", children: [jsx("div", { className: `flex gap-2.5 ${className}`, children: media?.map((_, index) => (jsx(MediaButton, { version: version, ...useLink({ router, handlerDecorator }, _) }, String(index)))) }), jsx("span", { className: "text-s-light text-secondary-text", children: children })] }));
   });
 
-  const TextInformationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `text-xs text-secondary-text visited:text-secondary-text hover:text-primary-main inline-block no-underline max-w-[292px] ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
+  const TextInformationLink = JSX(({ className = '', index, text, href, target, onClick }) => (jsx("a", { className: `text-xs-light text-secondary-text visited:text-secondary-text hover:text-primary-main inline-block no-underline max-w-[292px] ${className}`, href: href, target: target, onClick: onClick, children: text || `Документ ${index}` })));
 
   const TextInformation = JSX(({ className, links, context }) => {
       const router = context.useRouter();
       const { handlerDecorator } = context;
-      return (jsxs("div", { className: `${className || ''}`, children: [jsx("div", { className: "pt-5", children: jsx("span", { className: "font-light text-xs text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: "flex justify-start items-start gap-5 pt-2.5", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, className: "font-light", ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
+      return (jsxs("div", { className: `${className || ''}`, children: [jsx("div", { className: "pt-5", children: jsx("span", { className: "text-xs-light text-secondary-text", children: `\u00a9\u00A02000-${new Date().getFullYear()}\u00A0АО \u00ABРоссельхозбанк\u00BB Генеральная лицензия Банка России \u2116\u00A03349 от\u00A012.08.2015\u00A0г.` }) }), links?.length ? (jsx("div", { className: "flex justify-start items-start gap-5 pt-2.5", children: links.map((_, i) => (jsx(TextInformationLink, { index: i, ...useLink({ router, handlerDecorator }, _) }, String(i)))) })) : null] }));
   });
 
   const LEFT_COL_WIDTH_FULL_HD = 'w-[204px]';
@@ -2071,8 +2071,8 @@
       return (jsxs(BlockWrapper, { tag: "footer", context: context, className: `p-9 bg-white font-sans ${className || ''}`, ...rest, children: [jsxs("div", { className: "flex items-stretch gap-[54px] pb-[30px] xl:gap-8", children: [jsx(Logo, { className: LEFT_COL_WIDTH_FULL_HD }), jsx(SearchBar, { context: context, className: "grow" })] }), jsxs("div", { className: "flex items-stretch gap-[54px] xl:gap-8", children: [jsxs("div", { className: `${LEFT_COL_WIDTH_FULL_HD} flex flex-col shrink-0 overflow-hidden`, children: [jsx(Contacts, { items: contacts, context: context, hasButton: true }), jsx(SocialMedia, { media: socialMedia, context: context, children: "\u0421\u043E\u0446\u0441\u0435\u0442\u0438" }), jsx(SocialMedia, { className: "mt-6", media: mobileApps, context: context, children: "\u041C\u043E\u0431\u0438\u043B\u044C\u043D\u043E\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" })] }), jsx(Sitemap, { className: "pt-[3px]", context: context, items: topItems })] }), jsx(HorizontalNavigation, { className: "mt-[98px]", links: relatedEnterprises, context: context }), jsx(TextInformation, { links: documents, context: context })] }));
   });
 
-  const GracePeriod = JSX(({ className = '', title, description, calendar, ...rest }) => {
-      return (jsxs(BlockWrapper, { className: `font-sans bg-white p-[50px] ${className}`, ...rest, children: [jsx(Heading, { headingType: "h3", className: "text-center", title: title }), jsx("div", { className: "text-l-light-md text-center mt-3", children: description }), calendar ? renderCalendar(calendar) : null] }));
+  const GracePeriod = JSX(({ context, className = '', title, description, calendar, ...rest }) => {
+      return (jsxs(BlockWrapper, { className: `font-sans bg-white p-[50px] ${className}`, context: context, ...rest, children: [jsx(Headline, { context: context, className: "!p-0", title: title, description: description, headlineVersion: "M", align: "center" }), calendar ? renderCalendar(calendar) : null] }));
   });
   const renderCalendar = (calendar) => {
       const colCount = calendar.reduce((accumulator, currentValue) => currentValue?.month?.length ? accumulator + currentValue.month.length : accumulator, 0) || 1;
@@ -2083,7 +2083,7 @@
           ..._,
           flexBasis: `${_.month.length * colSize}%`,
       }));
-      return (jsxs("div", { className: "w-full flex flex-col justify-center mt-[54px]", children: [jsx("div", { className: "flex w-full mb-3 font-light text-h6 text-center", children: mappedCalendar.map((_) => renderMonthNames(_, colSize)) }), jsx("div", { className: "flex w-full", children: mappedCalendar.map((_, ind) => (jsxs("div", { className: "pr-[11px] mr-3 border-r border-main-divider last:border-r-0 last:pr-0 last:mr-0", style: { flexBasis: _.flexBasis }, children: [jsx("div", { className: "flex", children: renderMonthImages(_) }), jsxs("div", { className: "font-light text-sm text-primary-text mt-3", children: [jsx("span", { children: _.text }), "\u2009", jsx("span", { className: "text-primary-main", children: _.greenText })] })] }, `monthItem-${ind}`))) })] }));
+      return (jsxs("div", { className: "w-full flex flex-col justify-center mt-[54px]", children: [jsx("div", { className: "flex w-full mb-3 text-h6 text-center", children: mappedCalendar.map((_) => renderMonthNames(_, colSize)) }), jsx("div", { className: "flex w-full", children: mappedCalendar.map((_, ind) => (jsxs("div", { className: "pr-[11px] mr-3 border-r border-main-divider last:border-r-0 last:pr-0 last:mr-0", style: { flexBasis: _.flexBasis }, children: [jsx("div", { className: "flex", children: renderMonthImages(_) }), jsxs("div", { className: "text-s-light text-primary-text mt-3", children: [jsx("span", { children: _.text }), "\u2009", jsx("span", { className: "text-primary-main", children: _.greenText })] })] }, `monthItem-${ind}`))) })] }));
   };
   const renderMonthNames = (item, colSize) => item.month.map((_, i) => (jsx("div", { style: { flexBasis: `${colSize}%` }, children: _.text }, `monthName-${i}`)));
   const renderMonthImages = (item) => item.month.map((_) => _.image?.src ? (jsx("div", { className: "h-[207px] border-r-[1px] pr-3 mr-3 border-main-divider last:border-r-0 last:pr-0 last:mr-0", children: jsx(Img, { image: _.image, className: "flex" }) }, `monthImage-${_.image.src}`)) : null);
@@ -2114,11 +2114,11 @@
       const { className = '', tabs, currentTag, isShowCounter = false, onTabClick } = props;
       return (jsx("div", { className: `box-border flex gap-x-1 h-14 ${className}`, role: "tablist", children: tabs?.map(renderTab$2({ currentTag, isShowCounter, onTabClick })) }));
   });
-  const badgeStyle$1 = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs ml-2';
+  const badgeStyle$1 = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs-light ml-2';
   const renderTab$2 = ({ currentTag, isShowCounter, onTabClick }) => (tab, i) => {
       const isActive = currentTag === tab.tag;
       const tabBg = isActive ? 'bg-primary-main' : 'group bg-white';
-      const tabText = `text-m ${isActive ? 'text-white' : 'text-secondary-text group-hover:text-primary-main'}`;
+      const tabText = `text-m-light ${isActive ? 'text-white' : 'text-secondary-text group-hover:text-primary-main'}`;
       const counterBlockStyle = `${badgeStyle$1}
       ${isActive
         ? 'bg-white/30 text-white'
@@ -2150,7 +2150,7 @@
       isHrefActive(topItem.href, router) ||
       checkIsHrefSameOrigin(topItem.href, router);
 
-  const TEXT_CLASSES$2 = 'font-sans font-light text-sm';
+  const TEXT_CLASSES$2 = 'font-sans text-s-light';
   const LINK_CLASSES$1 = 'inline-block border border-solid bg-transparent text-center no-underline';
   const TopItem = JSX(({ className = '', text, href, target, active, flat, onClick, children, ariaLabel, bgColor = 'bg-white', }) => (jsx("a", { className: `${getLinkClasses$1(bgColor, active, flat)} ${className}`, href: href, target: target, onClick: onClick, rel: "noopener noreferrer", "aria-label": ariaLabel, children: jsx("span", { className: getTextClasses$2(bgColor, active, flat), children: text || children }) })));
   const getLinkClasses$1 = (bgColor, active = false, flat = false) => {
@@ -2284,7 +2284,7 @@
       return (jsxs("div", { className: `flex justify-between items-center gap-2 w-full ${widthStyle}`, children: [jsx("span", { className: "text-secondary-text text-l-light", children: title }), jsxs("span", { className: "text-primary-main text-h6", children: [addSpacesBetweenNumbers(sum), " \u20BD"] })] }));
   }
 
-  const InsuranceAmountBlockInner = JSX(({ className = '', context, cards = [] }) => {
+  const InsuranceAmountBlockInner = JSX(({ className = '', context, cards = [], button }) => {
       const [activeSlideIndex, setActiveSlideIndex] = context.useState(0);
       const [tabsShift, setTabsShift] = context.useState(0);
       const handleNextClick = () => setTabsShift(tabsShift + 1);
@@ -2308,7 +2308,7 @@
                           isShown: [showPrevButton, showNextButton],
                           btnClass: ['left-[50px]', 'right-[50px]'],
                           className: 'top-[62px]',
-                      }), showPrevButton ? (jsx("div", { className: "absolute top-0 left-0 h-full w-[136px] bg-opacity-from-white" })) : null, showNextButton ? (jsx("div", { className: "absolute top-0 right-0 h-full w-[136px] bg-opacity-to-white" })) : null] }), jsx(Button, { className: "w-[240px] p-4 text-center", version: "primary", href: activeHref, children: "\u0412\u044B\u0431\u0440\u0430\u0442\u044C \u043F\u0440\u043E\u0433\u0440\u0430\u043C\u043C\u0443" })] }));
+                      }), showPrevButton ? (jsx("div", { className: "absolute top-0 left-0 h-full w-[136px] bg-opacity-from-white" })) : null, showNextButton ? (jsx("div", { className: "absolute top-0 right-0 h-full w-[136px] bg-opacity-to-white" })) : null] }), jsx(Button, { className: "w-[240px] text-center", version: "primary", ...button, href: activeHref })] }));
   });
   function renderGallery({ tabsShift, cards, activeSlideIndex, isLastShift, setActiveSlideIndex, }) {
       const tabsShiftWidth = isLastShift ? tabsShift * 460 - 240 : tabsShift * 460;
@@ -2333,7 +2333,7 @@
       return isActive ? (jsx(Img, { className: `h-[24px] w-[24px] min-w-[24px] min-h-[24px] absolute right-4 top-4`, image: "DoneIcon", width: "24", height: "24" })) : null;
   }
 
-  const InsuranceAmountBlock = JSX(({ className = '', context, title, insuranceTabs = [], ...rest }) => {
+  const InsuranceAmountBlock = JSX(({ className = '', context, title, insuranceTabs = [], button, ...rest }) => {
       const [activeSlideIndex, setActiveSlideIndex] = context.useState(0);
       return (jsxs(BlockWrapper, { context: context, className: `box-border py-[50px] overflow-hidden relative font-sans w-100 bg-white ${className}`, ...rest, children: [title ? jsx(Heading, { className: "text-center", title: title, headingType: "h3" }) : null, insuranceTabs?.length > 1 ? (jsx("div", { className: "p-1.5 bg-secondary-light w-fit m-auto rounded-md mt-[34px]", children: insuranceTabs.map((item, i) => renderNavButton$1({
                       title: item?.title,
@@ -2344,12 +2344,13 @@
                       context,
                       className,
                       insuranceTabs,
+                      button,
                   }) })] }));
   });
-  const renderInsuranceGalleries = ({ insuranceTabs, context, className = '', }) => {
+  const renderInsuranceGalleries = ({ insuranceTabs, button, context, className = '', }) => {
       const insuranceGalleries = insuranceTabs?.map((_) => _.cards);
       return insuranceGalleries?.length
-          ? insuranceGalleries.map((cards, i) => (jsx(InsuranceAmountBlockInner, { context: context, className: className, cards: cards }, String(i))))
+          ? insuranceGalleries.map((cards, i) => (jsx(InsuranceAmountBlockInner, { context: context, className: className, button: button, cards: cards }, String(i))))
           : null;
   };
   function renderNavButton$1({ title, i, activeSlideIndex, onClick }) {
@@ -2357,32 +2358,33 @@
       const btnClassName = isActiveBtn
           ? 'bg-primary-main text-white rounded-md'
           : `text-secondary-text`;
-      return (jsx("button", { type: "button", onClick: onClick, "aria-label": title, className: `box-border px-4 py-3 text-m ${btnClassName}`, children: title }, String(i)));
+      return (jsx("button", { type: "button", onClick: onClick, "aria-label": title, className: `box-border px-4 py-3 text-m-light ${btnClassName}`, children: title }, String(i)));
   }
 
   const mobileAppStyleMap = {
       primary: 'bg-white text-primary-text',
       secondary: 'bg-primary-main text-white',
   };
-  const MobileAppTile = JSX(({ className = '', context, title = 'Мобильное приложение', qr, buttons, version = 'primary', items, image, ...rest }) => {
+  const MobileAppTile = JSX(({ className = '', context, title = 'Мобильное приложение', qr, buttons, version = 'primary', items, image, headingType = 'h4', ...rest }) => {
       const textColorClass = version === 'primary' ? 'text-primary-text' : '';
-      return (jsxs(BlockWrapper, { context: context, className: `flex justify-between font-sans p-9 box-border relative
-        ${getTileRightPadding(className)} ${getTileMinHeight(className)}
+      const containerStyle = version === 'secondary' ? 'p-3.5 min-w-[120px]' : 'min-w-[92px]';
+      return (jsxs(BlockWrapper, { context: context, className: `flex justify-between font-sans p-9 box-border relative min-h-[320px]
+        ${getTileMinHeight(className)}
         ${mobileAppStyleMap[version]}
-        ${className}`, ...rest, children: [jsx(BaseTile, { context: context, title: title ? (jsx(Heading, { headingType: "h4", as: "h3", title: title, className: `whitespace-pre-wrap max-w-[509px] mb-6
-                  ${textColorClass}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-[30px] gap-4" })) : null, children: jsxs("div", { className: "flex flex-1 items-center", children: [qr?.src && qr?.href && (jsx("a", { href: qr.href, target: "_blank", "aria-label": title, children: jsx("img", { src: qr.src, alt: title, title: title, width: "122", height: "122", className: "w-[122px] h-[122px] min-w-[122px] min-h-[122px] bg-secondary-light mr-4 rounded-md" }) })), renderList$1(version, items)] }) }), image?.src ? (jsx("div", { className: "absolute right-0 bottom-0", children: jsx(Img, { image: image }) })) : null] }));
+        ${className}`, ...rest, children: [jsx(BaseTile, { context: context, className: "z-[1]", title: title ? (jsx(Heading, { headingType: headingType, as: "h3", title: title, className: `whitespace-pre-wrap max-w-[509px] mb-6
+                  ${textColorClass}` })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-8 gap-4" })) : null, children: jsxs("div", { className: "flex flex-1 items-center", children: [qr?.src && (jsx("div", { className: `flex justify-center mr-5 bg-white rounded-md ${containerStyle}`, children: jsx(Img, { image: qr }) })), renderList$1(version, items)] }) }), image?.src ? (jsx("div", { className: "absolute right-0 bottom-0", children: jsx(Img, { image: image }) })) : null] }));
   });
   const renderList$1 = (version, items) => {
-      return items?.length ? (jsx(List, { items: items, itemClassName: "base font-light mb-2 last:mb-0", version: version === 'primary' ? 'tile' : 'tile-white' })) : (jsx("span", { className: "text-m text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
+      return items?.length ? (jsx(List, { items: items, itemClassName: "text-l-light mb-2 last:mb-0", version: version === 'primary' ? 'tile' : 'tile-white' })) : (jsx("span", { className: "text-m-light text-secondary-text", children: "\u041D\u0430\u0432\u0435\u0434\u0438\u0442\u0435 \u043A\u0430\u043C\u0435\u0440\u0443 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430 \u043D\u0430 QR-\u043A\u043E\u0434 \u0438 \u0441\u043A\u0430\u0447\u0430\u0439\u0442\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u0435" }));
   };
 
-  const NavigationItem = JSX(({ className, text, onClick, href, target, isActive }) => (jsx("a", { className: `bg-inherit no-underline px-4 py-2.5 cursor-pointer rounded text-sm border border-solid hover:text-primary-main ${className || ''} ${isActive ? 'border-primary-main text-primary-main' : 'border-white text-secondary-text'}`, onClick: onClick, href: href, target: target, children: text })));
+  const NavigationItem = JSX(({ className, text, onClick, href, target, isActive }) => (jsx("a", { className: `bg-inherit no-underline px-4 py-2.5 cursor-pointer rounded text-s border border-solid hover:text-primary-main ${className || ''} ${isActive ? 'border-primary-main text-primary-main' : 'border-white text-secondary-text'}`, onClick: onClick, href: href, target: target, children: text })));
 
   const Navigation = JSX(({ className, context, title, buttons, ...rest }) => {
       const router = context.useRouter();
       const { handlerDecorator } = context;
       const activeButton = findActiveSubItem(router)(buttons);
-      return (jsxs(BlockWrapper, { context: context, className: `font-sans text-primary-text rounded-[40px] flex items-center justify-between ${className || ''}`, ...rest, children: [jsx("h2", { className: "font-medium text-xl-light m-0", children: title }), buttons?.length ? (jsx("div", { className: "flex rounded-md overflow-hidden bg-white", children: buttons
+      return (jsxs(BlockWrapper, { context: context, className: `font-sans text-primary-text rounded-[40px] flex items-center justify-between ${className || ''}`, ...rest, children: [jsx("h2", { className: "text-xl font-medium m-0", children: title }), buttons?.length ? (jsx("div", { className: "flex rounded-md overflow-hidden bg-white", children: buttons
                       .filter(({ text }) => text)
                       .map((button, i) => (jsx(NavigationItem, { className: "first:rounded-tl-md first:rounded-bl-md last:rounded-tr-md last:rounded-br-md", isActive: button === activeButton, ...useLink({ router, handlerDecorator }, button) }, String(i)))) })) : null] }));
   });
@@ -2442,7 +2444,7 @@
   });
   const renderBlocks = (blocks, render, { blocksToHide, isActive, containerClasses }) => {
       const visibleBlocks = blocks.slice(0, blocks.length - blocksToHide);
-      const hiddenBlocks = blocks.slice(-blocksToHide);
+      const hiddenBlocks = blocksToHide > 0 ? blocks.slice(-blocksToHide) : [];
       return render(jsxs("div", { children: [visibleBlocks, jsx("div", { className: `${foldableBlockClassNames} ${containerClasses}`, children: hiddenBlocks })] }), isActive);
   };
 
@@ -2476,7 +2478,7 @@
 
   const GOLDEN_RATIO = 1.618;
   const Placeholder = JSX(({ className, context, title, description = 'Блок в разработке...', ...rest }) => {
-      return (jsxs(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: [jsx(Headline, { context: context, className: "!p-0 max-w-[600px]", title: title, description: description, headlineVersion: getTileHeadingType(className) }), jsx("figure", { className: "m-0 min-w-[600px]", children: renderShimmer() })] }));
+      return (jsxs(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: [jsx(Headline, { context: context, className: "!p-0 max-w-[600px]", title: title, description: description, headlineVersion: getTileHeadingType(className) }), jsx("figure", { className: "m-0 min-w-[80%]", children: renderShimmer() })] }));
   });
   const renderShimmer = (size = 3) => goldenSequence(100, size)
       .map((_) => Math.floor(_))
@@ -2525,7 +2527,7 @@
           : `text-l ${productBlockStyleMap[version].title}`;
       const btnDescClassName = isActiveBtn
           ? 'text-secondary-text text-m-title-xs mt-2.5'
-          : `text-m-md mt-1.5 ${productBlockStyleMap[version].text}`;
+          : `text-m mt-1.5 ${productBlockStyleMap[version].text}`;
       const additionalBorder = version === 'secondary' ? 'border-white/50' : 'border-black/50';
       return (jsx("button", { type: "button", onClick: onClick, "aria-label": slide?.title, className: `box-border font-sans relative overflow-hidden border border-white/50 cursor-pointer text-left mx-1 grow basis-0
         ${btnClassName} ${additionalBorder}
@@ -2537,7 +2539,7 @@
       secondary: 'bg-primary-main text-white',
   };
   const PromoTile = JSX(({ className = '', context, title = 'Акции и спецпредложения', date, description, buttons = [], version = 'primary', ...rest }) => {
-      return (jsx(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${promoTileStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsx(BaseTile, { context: context, title: title ? (jsx("div", { children: jsx(Headline, { context: context, title: title, className: `!p-0 max-w-[600px]`, headlineVersion: getTileHeadingType(className), bgColorHeadline: version, align: "left" }) })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, children: jsxs("div", { className: "mt-1.5", children: [date ? jsx("div", { className: "text-sm mb-2", children: formatDate(date) }) : null, jsx("div", { className: "text-l", children: description })] }) }) }));
+      return (jsx(BlockWrapper, { context: context, className: `bg-white text-primary-text font-sans p-9 box-border ${className} ${promoTileStyleMap[version]} ${getTileRightPadding(className)} ${getTileMinHeight(className)} `, ...rest, children: jsx(BaseTile, { context: context, title: title ? (jsx("div", { children: jsx(Headline, { context: context, title: title, className: `!p-0 max-w-[600px]`, headlineVersion: getTileHeadingType(className), bgColorHeadline: version, align: "left" }) })) : null, buttons: buttons?.length ? (jsx(ButtonSection, { context: context, buttons: buttons, className: "flex mt-9 gap-3" })) : null, children: jsxs("div", { className: "mt-1.5", children: [date ? jsx("div", { className: "text-s mb-2", children: formatDate(date) }) : null, jsx("div", { className: "text-l", children: description })] }) }) }));
   });
   function formatDate(date) {
       const dateObj = new Date(date);
@@ -2550,9 +2552,9 @@
   }
 
   const RecommendationCard = JSX(({ context, className = '', title, description, items, image, version, socialMedia }) => {
-      const tileTitle = title ? (jsx(Heading, { headingType: "h5", as: "h3", className: "font-normal mb-3.5 z-10", title: title })) : null;
+      const tileTitle = title ? (jsx(Heading, { headingType: "h5", as: "h3", className: "mb-3.5 z-10", title: title })) : null;
       const tileImage = image?.src ? (jsx(Img, { className: "absolute bottom-0 right-0 m-0", image: image })) : null;
-      return (jsx("section", { className: `relative overflow-hidden text-left border border-solid box-border p-7 min-w-[524px] min-h-[218px] ${className}`, role: "listitem", children: jsxs(BaseTile, { context: context, className: "flex justify-between", title: tileTitle, image: tileImage, children: [description ? jsx(Description, { className: "mb-2", description: description }) : null, items?.length ? (jsx(List, { className: "text-md font-light flex flex-col flex-1 gap-2 max-w-[236px]", items: items, version: version })) : null, socialMedia ? (jsx(SocialMedia, { className: "pt-[42px] pb-0", media: socialMedia, version: version, context: context })) : null] }) }));
+      return (jsx("section", { className: `relative overflow-hidden text-left border border-solid box-border p-7 min-w-[524px] min-h-[218px] ${className}`, role: "listitem", children: jsxs(BaseTile, { context: context, className: "flex justify-between", title: tileTitle, image: tileImage, children: [description ? jsx(Description, { className: "mb-2", description: description }) : null, items?.length ? (jsx(List, { className: "text-xl-light flex flex-col flex-1 gap-2 max-w-[236px]", items: items, version: version })) : null, socialMedia ? (jsx(SocialMedia, { className: "pt-[42px] pb-0", media: socialMedia, version: version, context: context })) : null] }) }));
   });
 
   const BLUR_BLOCK_CLASSES = 'absolute top-0 bottom-0 w-[84px]';
@@ -2587,12 +2589,12 @@
           }) }));
   };
 
-  const Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center w-5 h-5 border-2 border-primary-main rounded-full cursor-pointer after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main", type: "radio", value: value, name: name, checked: checked, onChange: onChange }), text ? jsx("span", { className: "font-sans ml-3 text-m-base cursor-pointer", children: text }) : null] }) })));
+  const Radio = JSX(({ name, text, value, checked, onChange, className }) => (jsx("div", { className: className, children: jsxs("label", { className: "flex items-center relative cursor-pointer", children: [jsx("input", { className: "appearance-none flex justify-center items-center w-5 h-5 border-2 border-primary-main rounded-full cursor-pointer after:block after:w-2.5 after:h-2.5 after:rounded-full checked:after:bg-primary-main", type: "radio", value: value, name: name, checked: checked, onChange: onChange }), text ? jsx("span", { className: "font-sans ml-3 cursor-pointer", children: text }) : null] }) })));
 
   const SafeDepositRentalForm = ({ cities, cellDimensions, cellOptions, days, setDays, context, }) => {
       return (jsxs("div", { className: "flex-1 mr-9", children: [cities.length ? renderCitiesOffices(cities, context) : null, renderRentalPeriod(days, setDays), cellDimensions.length && cellOptions.length
                   ? renderDimensionsOptions(cellDimensions, cellOptions, context)
-                  : null, jsx("span", { className: "text-secondary-text font-light", children: "\u0422\u0438\u043F \u0434\u043E\u0433\u043E\u0432\u043E\u0440\u0430" }), jsxs("div", { className: "flex justify-between items-center mt-5", children: [renderRadioButtons(context), jsx(Button, { text: "\u041E\u0444\u0438\u0441\u044B \u043D\u0430 \u043A\u0430\u0440\u0442\u0435", version: "primary" })] })] }));
+                  : null, jsx("span", { className: "text-secondary-text text-l-light", children: "\u0422\u0438\u043F \u0434\u043E\u0433\u043E\u0432\u043E\u0440\u0430" }), jsxs("div", { className: "flex justify-between items-center mt-5", children: [renderRadioButtons(context), jsx(Button, { text: "\u041E\u0444\u0438\u0441\u044B \u043D\u0430 \u043A\u0430\u0440\u0442\u0435", version: "primary" })] })] }));
   };
   const renderCitiesOffices = (cities, context) => {
       const [selectedCity, setSelectedCity] = context.useState(cities[0].city);
@@ -2639,11 +2641,11 @@
   };
   const renderSelect = (props) => {
       const { data, field, selected, setSelected, label } = props;
-      return (jsxs("div", { children: [jsx("span", { className: "block font-light text-m mb-2", children: label }), jsx(Select, { className: "h-14 border border-gray p-4 rounded-md text-m-sm w-full cursor-pointer", value: selected, onChange: (_) => setSelected(_), children: data.map((_, i) => (jsx(SelectOption, { value: _?.[field], children: _?.[field] }, String(i)))) })] }));
+      return (jsxs("div", { children: [jsx("span", { className: "block text-m-light mb-2", children: label }), jsx(Select, { className: "h-14 border border-gray p-4 rounded-md text-s w-full cursor-pointer", value: selected, onChange: (_) => setSelected(_), children: data.map((_, i) => (jsx(SelectOption, { value: _?.[field], children: _?.[field] }, String(i)))) })] }));
   };
   const renderRentalPeriod = (days, setDays) => {
       const items = ['От 1 дня', 'До 365 дней'];
-      return (jsxs("div", { className: "mb-6", children: [jsx("span", { className: "block font-light text-m mb-[3px]", children: "\u0421\u0440\u043E\u043A \u0430\u0440\u0435\u043D\u0434\u044B" }), jsx(InputRange, { min: 1, max: 365, value: days, items: items, onChange: setDays })] }));
+      return (jsxs("div", { className: "mb-6", children: [jsx("span", { className: "block text-m-light mb-[3px]", children: "\u0421\u0440\u043E\u043A \u0430\u0440\u0435\u043D\u0434\u044B" }), jsx(InputRange, { min: 1, max: 365, value: days, items: items, onChange: setDays })] }));
   };
   const renderRadioButtons = (context) => {
       const [selected, setSelected] = context.useState('option1');
@@ -2653,10 +2655,10 @@
 
   const SafeDepositRentalTotal = ({ days }) => {
       const price = calculatePrice(days);
-      return (jsxs("div", { className: "flex flex-col justify-between", children: [jsxs("div", { className: "flex", children: [renderTotal('Аренда за', days, 'mr-11'), renderTotal('Цена', price + ' ₽')] }), jsxs("div", { className: "bg-primary-main px-10 pt-10 pb-4 text-center", children: [jsx(Img, { image: { icon: 'PackA4' }, width: "290", height: "257", asSVG: true }), jsxs("span", { className: "font-light text-white opacity-80 mt-2 inline-block", children: ["\u041D\u0430 \u0440\u0438\u0441\u0443\u043D\u043A\u0438 \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0430 \u043F\u0430\u0447\u043A\u0430", jsx("br", {}), " \u043B\u0438\u0441\u0442\u043E\u0432 \u0444\u043E\u0440\u043C\u0430\u0442\u0430 \u04104"] })] })] }));
+      return (jsxs("div", { className: "flex flex-col justify-between", children: [jsxs("div", { className: "flex", children: [renderTotal('Аренда за', days, 'mr-11'), renderTotal('Цена', price + ' ₽')] }), jsxs("div", { className: "bg-primary-main px-10 pt-10 pb-4 text-center", children: [jsx(Img, { image: { icon: 'PackA4' }, width: "290", height: "257", asSVG: true }), jsxs("span", { className: "text-s-light text-white opacity-80 mt-2 inline-block", children: ["\u041D\u0430 \u0440\u0438\u0441\u0443\u043D\u043A\u0438 \u0438\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0430 \u043F\u0430\u0447\u043A\u0430", jsx("br", {}), " \u043B\u0438\u0441\u0442\u043E\u0432 \u0444\u043E\u0440\u043C\u0430\u0442\u0430 \u04104"] })] })] }));
   };
   const renderTotal = (label, total, className = '') => {
-      return (jsxs("div", { className: className, children: [jsx("span", { className: "block font-light text-m mb-1", children: label }), jsx("span", { className: "text-h3", children: total })] }));
+      return (jsxs("div", { className: className, children: [jsx("span", { className: "block text-m-light mb-1", children: label }), jsx("span", { className: "text-h3", children: total })] }));
   };
   const calculatePrice = (days) => {
       let TariffType = 1;
@@ -2738,7 +2740,7 @@
   const SafeDepositRental = JSX(({ context, className = '', ...rest }) => {
       const [days, setDays] = context.useState(DEFAULT_DAYS);
       const data = DATA;
-      return (jsxs(BlockWrapper, { context: context, className: `bg-white px-8 py-12 ${className}`, ...rest, children: [jsxs("div", { className: "flex justify-between align-top mb-6", children: [data?.cities?.length ? (jsx(SafeDepositRentalForm, { ...data, days: days, setDays: setDays, context: context })) : null, jsx(SafeDepositRentalTotal, { days: days })] }), jsx("p", { className: "text-button font-light text-secondary-text", children: "\u0410\u0440\u0435\u043D\u0434\u0430 \u0421\u042F, \u0432 \u0441\u043B\u0443\u0447\u0430\u0435 \u043F\u0440\u043E\u0432\u0435\u0434\u0435\u043D\u0438\u044F \u043F\u0440\u043E\u0446\u0435\u0434\u0443\u0440\u044B \u043A\u0443\u043F\u043B\u0438-\u043F\u0440\u043E\u0434\u0430\u0436\u0438, \u0441 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u043D\u0438\u0435\u043C \u043D\u0430\u043B\u0438\u0447\u043D\u044B\u0445 \u0434\u0435\u043D\u0435\u0433 \u0438\u043B\u0438 \u043F\u0440\u043E\u0446\u0435\u0434\u0443\u0440\u044B \u0438\u043F\u043E\u0442\u0435\u0447\u043D\u043E\u0439 \u0441\u0434\u0435\u043B\u043A\u0438" })] }));
+      return (jsxs(BlockWrapper, { context: context, className: `bg-white px-8 py-12 ${className}`, ...rest, children: [jsxs("div", { className: "flex justify-between align-top mb-6", children: [data?.cities?.length ? (jsx(SafeDepositRentalForm, { ...data, days: days, setDays: setDays, context: context })) : null, jsx(SafeDepositRentalTotal, { days: days })] }), jsx("p", { className: "text-s-light text-secondary-text", children: "\u0410\u0440\u0435\u043D\u0434\u0430 \u0421\u042F, \u0432 \u0441\u043B\u0443\u0447\u0430\u0435 \u043F\u0440\u043E\u0432\u0435\u0434\u0435\u043D\u0438\u044F \u043F\u0440\u043E\u0446\u0435\u0434\u0443\u0440\u044B \u043A\u0443\u043F\u043B\u0438-\u043F\u0440\u043E\u0434\u0430\u0436\u0438, \u0441 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u043D\u0438\u0435\u043C \u043D\u0430\u043B\u0438\u0447\u043D\u044B\u0445 \u0434\u0435\u043D\u0435\u0433 \u0438\u043B\u0438 \u043F\u0440\u043E\u0446\u0435\u0434\u0443\u0440\u044B \u0438\u043F\u043E\u0442\u0435\u0447\u043D\u043E\u0439 \u0441\u0434\u0435\u043B\u043A\u0438" })] }));
   });
 
   const checkIsIconRenderable = (icon) => Boolean(icon?.icon || icon?.src);
@@ -2787,19 +2789,19 @@
                           })) })] })) : null, button?.text ? (jsx(Button, { className: "mt-8 w-full max-w-[240px]", version: "primary", ...useLink({ router, handlerDecorator }, button) })) : null] }));
   });
   const renderStepIcon = (styleMap) => ({ icon }, i) => {
-      return (jsx("div", { className: "flex flex-col items-center text-center", children: jsx("div", { className: `h-[100px] w-[100px] min-w-[100px] min-h-[100px] rounded-full p-[26px] box-border z-10 
+      return (jsx("div", { className: "flex flex-col items-center text-center", children: jsx("div", { className: `h-[100px] w-[100px] min-w-[100px] min-h-[100px] rounded-full p-[26px] box-border z-10 flex justify-center items-center
             ${styleMap.iconBackground} ${styleMap.title}`, children: checkIsIconRenderable(icon) ? (jsx(Img, { image: icon, width: "48", height: "48", asSVG: true })) : (jsx("span", { className: `text-h4 ${styleMap.iconText}`, children: i + 1 })) }) }, String(i)));
   };
   const renderStepTitle = ({ styleMap, isMainButton, version, router, handlerDecorator, }) => (step, i) => {
       const additionalMarginClass = step?.label ? 'mt-2' : 'mt-4';
-      return (jsxs("div", { className: "flex flex-col items-center justify-between text-center relative w-[276px] \n        whitespace-pre-line overflow-hidden", children: [step?.label ? (jsx("div", { className: "font-normal text-xl-light m-0 mt-4", children: step.label })) : null, step?.description ? (jsx("div", { className: `font-light text-base ${styleMap.description} ${additionalMarginClass}`, children: step.description })) : null, step.button?.text && !isMainButton ? (jsx(Button, { className: "box-border mt-8 py-3 h-12 w-full max-w-[240px]", ...useLink({ router, handlerDecorator }, step.button), version: version, children: step.button.text })) : null] }, String(i)));
+      return (jsxs("div", { className: "flex flex-col items-center justify-between text-center relative w-[276px]\n        whitespace-pre-line overflow-hidden", children: [step?.label ? jsx("div", { className: "text-xl m-0 mt-4", children: step.label }) : null, step?.description ? (jsx("div", { className: `text-l-light ${styleMap.description} ${additionalMarginClass}`, children: step.description })) : null, step.button?.text && !isMainButton ? (jsx(Button, { className: "box-border mt-8 py-3 h-12 w-full max-w-[240px]", ...useLink({ router, handlerDecorator }, step.button), version: version, children: step.button.text })) : null] }, String(i)));
   };
 
-  const badgeStyle = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs ml-2';
+  const badgeStyle = 'min-w-[22px] w-[22px] h-[22px] rounded-full text-xs-light ml-2';
   const renderTab = ({ onClick, currentTab, showCounter, page }) => (tab, i) => {
       const isActive = currentTab === tab;
       const tabBg = isActive ? 'bg-primary-main' : 'group bg-white';
-      const tabText = `text-m ${isActive ? 'text-white' : 'text-secondary-text group-hover:text-primary-main'}`;
+      const tabText = `text-m-light ${isActive ? 'text-white' : 'text-secondary-text group-hover:text-primary-main'}`;
       const counterBlockStyle = `${badgeStyle}
       ${isActive
         ? 'bg-white/30 text-white'
@@ -2832,12 +2834,12 @@
       const cellWrapperClasses = `first:pl-0 pl-10 w-80 flex-grow flex flex-col border-solid border-main-divider border border-t-0 border-x-0 ${isLastRow ? 'border-t-0 rounded-b-md' : ''}`;
       return (jsx("div", { className: cellWrapperClasses, role: "cell", children: jsx("div", { children: cell.map(renderCellInner) }) }));
   });
-  const renderCellInner = ({ label, description, list, image, buttons }, i) => (jsxs("div", { className: "first:pt-5 last:pb-5", children: [i > 0 && (jsx("div", { className: "border-main-divider border border-solid border-t-0 border-x-0 my-4" })), label ? jsx("div", { className: "text-xl font-medium m-0", children: label }) : null, description ? jsx("div", { className: "text-sm text-secondary-text", children: description }) : null, list?.items?.length ? renderList(list) : null, image ? jsx(Img, { image: image }) : null, buttons?.length ? renderButtons(buttons) : null] }, String(i)));
-  const renderList = (list) => (jsx(List, { className: "flex flex-col justify-between items-start text-sm", version: "gray", items: list.items, isDotted: list.isDotted ?? true }));
+  const renderCellInner = ({ label, description, list, image, buttons }, i) => (jsxs("div", { className: "first:pt-5 last:pb-5", children: [i > 0 && (jsx("div", { className: "border-main-divider border border-solid border-t-0 border-x-0 my-4" })), label ? jsx("div", { className: "text-xl m-0", children: label }) : null, description ? jsx("div", { className: "text-s text-secondary-text", children: description }) : null, list?.items?.length ? renderList(list) : null, image ? jsx(Img, { image: image }) : null, buttons?.length ? renderButtons(buttons) : null] }, String(i)));
+  const renderList = (list) => (jsx(List, { className: "flex flex-col justify-between items-start text-s", version: "gray", items: list.items, isDotted: list.isDotted ?? true }));
   const renderButtons = (buttons) => (jsx("div", { children: buttons.map(({ icon, rounded, ...buttonProps }, idx) => (jsx(Button, { className: `${idx > 0 && rounded ? 'ml-3' : ''} w-12 h-12`, ariaLabel: getButtonAriaLabel(icon), rounded: rounded, appendLeft: icon ? jsx(Img, { image: icon, width: "24px", height: "24px", asSVG: true }) : null, ...buttonProps }, String(idx)))) }));
 
   const TariffsTableRow = JSX(({ row: { header, data }, activeCardIndex, isLastRow }) => {
-      return (jsxs(TableRowContainer, { children: [jsx("div", { className: `text-sm py-5 ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES} ${!isLastRow ? 'border-solid' : ''}`, children: jsxs("div", { className: "flex items-center text-primary-text", children: [header?.icon ? (jsx(Img, { className: "mr-[14px] max-w-6 max-h-6", image: header.icon, width: "24px", height: "24px", asSVG: true })) : null, header?.title] }) }), data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH, version: "tariff", children: data.map((cell, i) => (jsx(TariffsTableCell, { cell: cell, isLastRow: isLastRow }, String(i)))) })) : null] }));
+      return (jsxs(TableRowContainer, { children: [jsx("div", { className: `text-s py-5 ${FIRST_CELL_CLASSES} ${DIVIDER_CLASSES} ${!isLastRow ? 'border-solid' : ''}`, children: jsxs("div", { className: "flex items-center text-primary-text", children: [header?.icon ? (jsx(Img, { className: "mr-[14px] max-w-6 max-h-6", image: header.icon, width: "24px", height: "24px", asSVG: true })) : null, header?.title] }) }), data?.length ? (jsx(TableCarouselContainer, { activeCardIndex: activeCardIndex, columnWidth: COLUMN_WIDTH, version: "tariff", children: data.map((cell, i) => (jsx(TariffsTableCell, { cell: cell, isLastRow: isLastRow }, String(i)))) })) : null] }));
   });
 
   const TariffsTable = JSX(({ className, context, title, description, rowHeaders, columns, hiddenRowsNum = 0, ...rest }) => {