.srv-main{ padding: 0 0 60px} .srv-main .container{ max-width: 1280px; margin: 0 auto; padding: 0 20px} .srv-archive__header{ text-align: center; padding: 40px 0 30px} .srv-archive__title{ font-size: 2rem; font-weight: 700; color: #1a1a2e; margin: 0 0 10px} .srv-archive__subtitle{ font-size: 1.05rem; color: #666; max-width: 600px; margin: 0 auto; line-height: 1.5} .srv-categories{ margin-bottom: 40px} .srv-categories__grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px} .srv-cat-card{ display: flex; align-items: center; gap: 16px; background: #fff; border: 1px solid #e8e8e8; border-radius: 12px; padding: 20px; text-decoration: none; color: #333; transition: box-shadow .2s, border-color .2s, transform .15s} .srv-cat-card:hover{ box-shadow: 0 4px 20px rgba(0,0,0,.08); border-color: #f5c518; transform: translateY(-2px)} .srv-cat-card__icon{ font-size: 2.2rem; flex-shrink: 0; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; background: #f0f4ff; border-radius: 12px} .srv-cat-card__body{ flex: 1; min-width: 0} .srv-cat-card__title{ font-size: 1.05rem; font-weight: 600; margin: 0 0 4px; color: #1a1a2e} .srv-cat-card__desc{ font-size: .85rem; color: #777; margin: 0 0 6px; line-height: 1.4} .srv-cat-card__count{ font-size: .8rem; color: #999} .srv-cat-card__arrow{ flex-shrink: 0; color: #ccc; transition: color .2s} .srv-cat-card:hover .srv-cat-card__arrow{ color: #f5c518} .srv-list{ margin-bottom: 40px} .srv-list__grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px} .srv-list__grid--wide{ grid-template-columns: 1fr} .srv-card{ display: flex; flex-direction: column; background: #fff; border: 1px solid #e8e8e8; border-radius: 12px; overflow: hidden; text-decoration: none; color: #333; transition: box-shadow .2s, transform .15s} .srv-card:hover{ box-shadow: 0 4px 20px rgba(0,0,0,.08); transform: translateY(-2px)} .srv-card--horizontal{ flex-direction: row} .srv-card__visual{ height: 160px; background: linear-gradient(135deg, #f0f4ff, #e8ecf5); display: flex; align-items: center; justify-content: center; overflow: hidden} .srv-card__visual img{ width: 100%; height: 100%; object-fit: cover} .srv-card__visual--sm{ width: 160px; min-width: 160px; height: auto; min-height: 120px} .srv-card__icon-big{ font-size: 3rem; opacity: .5} .srv-card__body{ padding: 16px; flex: 1; display: flex; flex-direction: column} .srv-card__cat{ font-size: .78rem; color: #888; margin-bottom: 6px} .srv-card__title{ font-size: 1rem; font-weight: 600; margin: 0 0 6px; color: #1a1a2e; line-height: 1.3} .srv-card__desc{ font-size: .85rem; color: #666; margin: 0 0 10px; line-height: 1.4; flex: 1} .srv-card__link{ font-size: .85rem; font-weight: 600; color: #f5c518} .srv-card:hover .srv-card__link{ color: #e0a800} .srv-taxheader{ display: flex; align-items: center; gap: 16px; padding: 30px 0 20px} .srv-taxheader__icon{ font-size: 2.5rem; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #f5c518, #e0a800); border-radius: 16px} .srv-taxheader__title{ font-size: 1.8rem; font-weight: 700; margin: 0 0 4px; color: #1a1a2e} .srv-taxheader__desc{ font-size: .95rem; color: #666; margin: 0; line-height: 1.4} .srv-section-title{ font-size: 1.4rem; font-weight: 700; margin: 0 0 20px; color: #1a1a2e; position: relative; padding-left: 16px} .srv-section-title::before{ content: ''; position: absolute; left: 0; top: 4px; bottom: 4px; width: 4px; background: #f5c518; border-radius: 2px} .srv-single__header{ padding: 24px 0 20px} .srv-single__cat-badge{ display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; color: #666; text-decoration: none; background: #f5f5f5; border: 1px solid #e0e0e0; border-radius: 20px; padding: 4px 14px 4px 8px; margin-bottom: 12px; transition: all .2s} .srv-single__cat-badge:hover{ background: #fff8e1; border-color: #f5c518; color: #1a1a2e} .srv-single__cat-emoji{ font-size: 1.1rem} .srv-single__title{ font-size: 1.8rem; font-weight: 700; margin: 0 0 12px; color: #1a1a2e; line-height: 1.3} .srv-single__badges{ display: flex; flex-wrap: wrap; gap: 8px} .srv-single__badge{ display: inline-flex; align-items: center; gap: 4px; font-size: .78rem; color: #555; background: #f8f9fa; border: 1px solid #e8e8e8; border-radius: 6px; padding: 4px 10px} .srv-single__badge--free{ color: #166534; background: #f0fdf4; border-color: #bbf7d0; font-weight: 600} .srv-tool{ background: #fff; border: 1px solid #e0e0e0; border-radius: 16px; padding: 32px; margin-bottom: 30px; box-shadow: 0 2px 16px rgba(0,0,0,.05); position: relative} :where(.srv-tool) input[type="text"], :where(.srv-tool) input[type="number"], :where(.srv-tool) input[type="email"], :where(.srv-tool) input[type="tel"], :where(.srv-tool) input[type="url"], :where(.srv-tool) input[type="search"], :where(.srv-tool) input[type="date"], :where(.srv-tool) textarea{ display: block; width: 100%; box-sizing: border-box; padding: 12px 16px; font-size: 15px; line-height: 1.5; color: #1a1a2e; background: #fafbfc; border: 2px solid #c0c8d4; border-radius: 10px; transition: border-color .2s, box-shadow .2s, background .2s; -webkit-appearance: none; appearance: none; font-family: inherit} :where(.srv-tool) input[type="text"]:hover, :where(.srv-tool) input[type="number"]:hover, :where(.srv-tool) textarea:hover, :where(.srv-tool) select:hover{ border-color: #a0aab8; background: #fff} :where(.srv-tool) input[type="text"]:focus, :where(.srv-tool) input[type="number"]:focus, :where(.srv-tool) input[type="email"]:focus, :where(.srv-tool) input[type="tel"]:focus, :where(.srv-tool) textarea:focus{ border-color: #f5c518; background: #fff; outline: none; box-shadow: 0 0 0 4px rgba(245,197,24,.18)} :where(.srv-tool) input::placeholder, :where(.srv-tool) textarea::placeholder{ color: #999} :where(.srv-tool) input[type="number"]{ font-size: 16px; font-weight: 500} :where(.srv-tool) select{ display: block; width: 100%; box-sizing: border-box; padding: 12px 40px 12px 16px; font-size: 15px; line-height: 1.5; color: #1a1a2e; background: #fafbfc; border: 2px solid #c0c8d4; border-radius: 10px; -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23555' d='M6 8L1 3h10z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; cursor: pointer; transition: border-color .2s, background .2s; font-family: inherit} :where(.srv-tool) select:focus{ border-color: #f5c518; background: #fff; outline: none; box-shadow: 0 0 0 4px rgba(245,197,24,.18)} :where(.srv-tool) label{ display: block; font-size: .88rem; font-weight: 600; color: #333; margin-bottom: 6px; letter-spacing: .01em} :where(.srv-tool) button, .srv-tool .srv-btn{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 28px; font-size: 15px; font-weight: 700; color: #1a1a2e; background: linear-gradient(135deg, #f5c518, #ffd54f); border: none; border-radius: 10px; cursor: pointer; transition: all .2s; -webkit-appearance: none; font-family: inherit; box-shadow: 0 2px 8px rgba(245,197,24,.3)} :where(.srv-tool) button:hover, .srv-tool .srv-btn:hover{ background: linear-gradient(135deg, #e0a800, #f5c518); transform: translateY(-1px); box-shadow: 0 4px 16px rgba(245,197,24,.4)} :where(.srv-tool) button:active{ transform: translateY(0); box-shadow: 0 1px 4px rgba(245,197,24,.3)} :where(.srv-tool) input[type="range"]{ -webkit-appearance: none; width: 100%; height: 8px; background: linear-gradient(90deg, #f5c518, #e0e0e0); border-radius: 4px; outline: none; border: none; margin: 8px 0} :where(.srv-tool) input[type="range"]::-webkit-slider-thumb{ -webkit-appearance: none; width: 24px; height: 24px; background: #fff; border: 3px solid #f5c518; border-radius: 50%; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.15)} :where(.srv-tool) input[type="range"]::-moz-range-thumb{ width: 24px; height: 24px; background: #fff; border: 3px solid #f5c518; border-radius: 50%; cursor: pointer} :where(.srv-tool) table{ width: 100%; border-collapse: collapse; font-size: .9rem; margin: 12px 0} :where(.srv-tool) th{ background: #f0f2f5; padding: 12px 14px; text-align: left; font-weight: 600; border-bottom: 2px solid #e0e0e0; color: #333; font-size: .85rem; text-transform: uppercase; letter-spacing: .03em} :where(.srv-tool) td{ padding: 11px 14px; border-bottom: 1px solid #eee} :where(.srv-tool) tbody tr:hover td{ background: #fafbfc} :where(.srv-tool) tbody tr:nth-child(even) td{ background: #f9f9fb} :where(.srv-tool) tbody tr:nth-child(even):hover td{ background: #f0f2f5} :where(.srv-tool) canvas{ display: block; max-width: 100%; border-radius: 12px; border: 2px solid #e0e0e0; background: #fefefe} .srv-tool .srv-result{ background: linear-gradient(135deg, #f0fdf4, #dcfce7); border: 2px solid #86efac; border-radius: 14px; padding: 24px; margin-top: 20px; position: relative} .srv-tool .srv-result::before{ content: '📊'; position: absolute; top: -14px; left: 20px; font-size: 1.5rem; background: #f0fdf4; padding: 0 6px} .srv-tool .srv-result h3, .srv-tool .srv-result strong{ color: #166534} .srv-tool .srv-result .big-number{ font-size: 2rem; font-weight: 800; color: #166534} .srv-tool fieldset{ border: 2px solid #e8eaed; border-radius: 12px; padding: 20px 24px; margin: 0 0 20px; background: #fafbfc} .srv-tool fieldset legend{ font-weight: 700; font-size: .9rem; color: #1a1a2e; padding: 0 10px; background: #fafbfc} .srv-tool input[type="checkbox"], .srv-tool input[type="radio"]{ width: 20px; height: 20px; accent-color: #f5c518; cursor: pointer; margin-right: 8px; vertical-align: middle} .srv-tool small, .srv-tool .srv-help{ font-size: .8rem; color: #888; display: block; margin-top: 4px} .srv-tool .srv-grid-2{ display: grid; grid-template-columns: 1fr 1fr; gap: 20px} .srv-tool .srv-grid-3{ display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px} .srv-tool .srv-col{ min-width: 0} .srv-products-section{ padding: 20px 0 10px} .srv-products-section .srv-section-title{ margin-bottom: 20px} .srv-products-section .related-products__grid{ display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px} .srv-products-section .product-card{ display: flex; flex-direction: column; background: #fff; border: 1px solid #e8e8e8; border-radius: 12px; overflow: hidden; transition: box-shadow .2s, transform .15s; text-decoration: none; color: #333} .srv-products-section .product-card:hover{ box-shadow: 0 6px 24px rgba(0,0,0,.08); transform: translateY(-3px)} .srv-products-section .product-card__image{ position: relative; aspect-ratio: 4/3; background: #f5f5f5; overflow: hidden} .srv-products-section .product-card__image img, .srv-products-section .product-card__img{ width: 100%; height: 100%; object-fit: cover} .srv-products-section .product-card__no-image{ display: flex; align-items: center; justify-content: center; height: 100%; color: #ccc} .srv-products-section .product-card__badge{ position: absolute; top: 10px; left: 10px; font-size: .72rem; font-weight: 600; padding: 3px 10px; border-radius: 20px} .srv-products-section .product-card__badge--stock{ background: #dcfce7; color: #166534} .srv-products-section .product-card__content{ padding: 14px 16px 8px; flex: 1} .srv-products-section .product-card__category{ font-size: .75rem; color: #888; display: block; margin-bottom: 4px} .srv-products-section .product-card__title{ font-size: .95rem; font-weight: 600; margin: 0 0 4px; line-height: 1.3} .srv-products-section .product-card__title-link{ color: #1a1a2e; text-decoration: none} .srv-products-section .product-card__title-link:hover{ color: #f5c518} .srv-products-section .product-card__article{ font-size: .78rem; color: #999} .srv-products-section .product-card__desc{ font-size: .82rem; color: #666; margin: 6px 0 0; line-height: 1.4} .srv-products-section .product-card__footer{ padding: 10px 16px 14px; border-top: 1px solid #f0f0f0; display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap} .srv-products-section .product-card__price{ font-size: .9rem} .srv-products-section .product-card__price-from{ color: #999; font-size: .78rem} .srv-products-section .product-card__price-value{ font-weight: 700; color: #1a1a2e} .srv-products-section .product-card__price-value--request{ color: #888; font-weight: 600; font-size: .85rem} .srv-products-section .product-card__price-unit{ color: #999; font-size: .78rem} .srv-products-section .product-card__actions{ display: flex; gap: 8px} .srv-products-section .product-card__actions .btn{ font-size: .8rem; padding: 6px 14px; border-radius: 8px; font-weight: 600; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; transition: all .2s} .srv-products-section .product-card__actions .btn--outline{ background: #fff; color: #333; border: 1px solid #ddd} .srv-products-section .product-card__actions .btn--outline:hover{ border-color: #f5c518; color: #1a1a2e} .srv-products-section .product-card__actions .btn--primary{ background: #f5c518; color: #1a1a2e; border: 1px solid #f5c518} .srv-products-section .product-card__actions .btn--primary:hover{ background: #e0a800} .srv-description{ background: var(--c-light); border-radius: 12px; padding: 32px; margin-bottom: 30px; font-size: var(--fs-sm); line-height: var(--lh-relaxed); color: var(--c-gray)} .srv-description > *:first-child{ margin-top: 0} .srv-description h2{ font-size: var(--fs-xl); font-weight: var(--fw-bold); color: var(--c-dark); margin: 32px 0 14px; padding-bottom: 10px; border-bottom: 3px solid var(--c-primary)} .srv-description h3{ font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--c-dark); margin: 28px 0 12px; padding: 8px 16px; background: var(--c-white); border-left: 4px solid var(--c-primary); border-radius: 0 8px 8px 0} .srv-description h4{ font-size: var(--fs-base); font-weight: var(--fw-bold); color: var(--c-dark-soft); margin: 22px 0 10px} .srv-description p{ margin: 0 0 14px} .srv-description strong{ color: var(--c-dark)} .srv-description a{ color: var(--c-dark); text-decoration: underline; text-underline-offset: 2px} .srv-description a:hover{ color: var(--c-primary-dark)} .srv-description table{ width: 100%; border-collapse: collapse; margin: 20px 0; border-radius: 10px; overflow: hidden; border: 1px solid var(--c-border); background: var(--c-white); table-layout: auto} .srv-description table th{ background: var(--c-dark); color: var(--c-white); font-weight: var(--fw-bold); padding: 11px 16px; text-align: left; font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .03em; border: none} .srv-description table td{ padding: 10px 16px; border-bottom: 1px solid var(--c-border); font-size: var(--fs-sm); color: var(--c-gray); vertical-align: top} .srv-description table tbody tr:nth-child(even){ background: var(--c-light-warm)} .srv-description table tbody tr:hover{ background: #fffde7} .srv-description table td:first-child{ font-weight: 600; color: var(--c-dark)} .srv-description figure.wp-block-table{ margin: 20px 0; overflow-x: auto; -webkit-overflow-scrolling: touch} .srv-description figure.wp-block-table table{ margin: 0; min-width: 480px} .srv-description ul{ margin: 16px 0; padding-left: 0; list-style: none} .srv-description ul li{ position: relative; padding: 5px 0 5px 26px; font-size: var(--fs-sm); line-height: 1.7; color: var(--c-gray); margin-bottom: 4px} .srv-description ul li::before{ content: ''; position: absolute; left: 8px; top: 14px; width: 8px; height: 8px; background: var(--c-primary); border-radius: 50%} .srv-description ol{ margin: 16px 0; padding-left: 0; list-style: none; counter-reset: srv-ol} .srv-description ol li{ position: relative; padding: 5px 0 5px 34px; counter-increment: srv-ol; font-size: var(--fs-sm); line-height: 1.7; color: var(--c-gray); margin-bottom: 4px} .srv-description ol li::before{ content: counter(srv-ol); position: absolute; left: 0; top: 4px; width: 24px; height: 24px; background: var(--c-dark); color: var(--c-white); font-size: 11px; font-weight: var(--fw-bold); border-radius: 50%; display: flex; align-items: center; justify-content: center} .srv-description blockquote{ margin: 22px 0; padding: 18px 22px; background: var(--c-white); border-left: 4px solid var(--c-primary); border-radius: 0 10px 10px 0; font-size: var(--fs-sm); color: var(--c-dark-soft)} .srv-description blockquote p:last-child{ margin-bottom: 0} .srv-description details{ margin: 10px 0; background: var(--c-white); border: 1px solid var(--c-border); border-radius: 10px; overflow: hidden; transition: border-color .2s} .srv-description details[open]{ border-color: var(--c-primary)} .srv-description details summary{ padding: 14px 18px; font-weight: var(--fw-bold); font-size: var(--fs-sm); color: var(--c-dark); cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; transition: background .15s} .srv-description details summary::-webkit-details-marker{ display: none} .srv-description details summary::before{ content: '+'; font-size: 16px; font-weight: var(--fw-bold); color: var(--c-dark); width: 26px; height: 26px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--c-light); border-radius: 6px; transition: background .2s, color .2s} .srv-description details[open] summary::before{ content: '−'; background: var(--c-primary); color: var(--c-dark)} .srv-description details summary:hover{ background: var(--c-light-warm)} .srv-description details > div, .srv-description details > p{ padding: 0 18px 16px; font-size: var(--fs-sm); color: var(--c-gray); line-height: 1.7} .srv-description img{ max-width: 100%; height: auto; border-radius: 10px; margin: 18px 0; display: block; border: 1px solid var(--c-border)} .srv-description figcaption{ text-align: center; font-size: var(--fs-xs); color: var(--c-gray-light); margin-top: 6px; font-style: italic} .srv-description hr, .srv-description .wp-block-separator{ border: none; height: 2px; background: var(--c-border); margin: 28px 0; border-radius: 2px} .srv-description .wp-block-button{ margin: 18px 0} .srv-description .wp-block-button__link{ background: var(--c-primary) !important; color: var(--c-dark) !important; border: none; border-radius: 10px; padding: 12px 28px; font-weight: var(--fw-bold); font-size: var(--fs-sm); text-decoration: none; display: inline-block; transition: all .2s} .srv-description .wp-block-button__link:hover{ background: var(--c-primary-hover) !important; transform: translateY(-2px)} .srv-description .wp-block-columns{ margin: 20px 0; gap: 20px} .srv-description::after{ content: ''; display: table; clear: both} .srv-desc-section{ padding: 40px 0 10px} .srv-pagination{ text-align: center; margin-top: 30px; padding-bottom: 10px} .srv-pagination .page-numbers{ display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 12px; border: 1px solid #e5e7eb; border-radius: 8px; margin: 0 3px; font-size: 14px; font-weight: 600; color: #6b7280; text-decoration: none; transition: all .2s} .srv-pagination .page-numbers:hover{ border-color: #212b62; color: #212b62} .srv-pagination .page-numbers.current{ background: #212b62; color: #fff; border-color: #212b62} .srv-pagination .page-numbers.dots{ border: none} .srv-auth{ max-width: 440px; margin: 40px auto; padding: 48px 40px; background: #fff; border-radius: 20px; border: 1px solid #e5e7eb; box-shadow: 0 8px 30px rgba(0,0,0,.06); text-align: center} .srv-auth__icon{ font-size: 48px; margin-bottom: 16px} .srv-auth__title{ font-size: 1.4rem; font-weight: 700; color: #1a1a2e; margin: 0 0 10px} .srv-auth__desc{ font-size: .9rem; color: #777; line-height: 1.5; margin: 0 0 24px} .srv-auth__error{ font-size: .85rem; font-weight: 600; color: #dc2626; background: #fef2f2; border: 1px solid #fca5a5; border-radius: 8px; padding: 10px 16px; margin: 0 0 16px} .srv-auth__form{ display: flex; gap: 10px; justify-content: center; flex-wrap: wrap} .srv-auth__input{ flex: 1; min-width: 200px; padding: 12px 16px; border: 2px solid #e5e7eb; border-radius: 10px; font-size: 15px; font-family: inherit; outline: none; transition: border-color .2s} .srv-auth__input:focus{ border-color: #212b62} .srv-auth__btn{ padding: 12px 28px; border: none; border-radius: 10px; background: #212b62; color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; transition: all .2s; white-space: nowrap} .srv-auth__btn:hover{ background: #e8a530; transform: translateY(-1px)} .srv-empty{ text-align: center; padding: 40px 20px; color: #999; font-size: 1rem} .srv-main + .cpa-block{ margin-top: 0} @media (max-width: 768px){ .srv-archive__title{ font-size: 1.5rem} .srv-single__title{ font-size: 1.4rem} .srv-taxheader__title{ font-size: 1.4rem} .srv-categories__grid{ grid-template-columns: 1fr} .srv-list__grid{ grid-template-columns: 1fr} .srv-card--horizontal{ flex-direction: column} .srv-card__visual--sm{ width: 100%; min-height: 120px} .srv-tool{ padding: 20px; border-radius: 12px} .srv-tool .srv-grid-2, .srv-tool .srv-grid-3{ grid-template-columns: 1fr} .srv-taxheader{ flex-direction: column; text-align: center} .srv-taxheader__icon{ margin: 0 auto} .srv-single__badges{ gap: 6px} .srv-auth{ padding: 32px 24px; margin: 30px auto} .srv-auth__form{ flex-direction: column} .srv-auth__input{ min-width: 0} .srv-description{ padding: 22px 18px} .srv-description h2{ font-size: 1.2rem} .srv-description h3{ font-size: 1.05rem; padding: 7px 14px} .srv-description figure.wp-block-table table{ min-width: 400px} .srv-description .wp-block-columns{ flex-direction: column !important} :where(.srv-tool) table{ display: block; overflow-x: auto; -webkit-overflow-scrolling: touch} :where(.srv-tool) table thead, :where(.srv-tool) table tbody, :where(.srv-tool) table tr{ min-width: 500px}} @media (max-width: 480px){ .srv-tool{ padding: 14px} .srv-tool input[type="text"], .srv-tool input[type="number"], .srv-tool input[type="email"], .srv-tool input[type="tel"], .srv-tool select, .srv-tool textarea{ font-size: 16px} .srv-single__badge{ font-size: .72rem; padding: 3px 8px} .srv-description{ padding: 16px 14px; font-size: .88rem} .srv-description h2{ font-size: 1.1rem} .srv-description h3{ font-size: .95rem} .srv-description table th{ padding: 8px 10px; font-size: .75rem} .srv-description table td{ padding: 8px 10px; font-size: .82rem} .srv-description figure.wp-block-table table{ min-width: 340px} .srv-description details summary{ padding: 12px 14px; font-size: .88rem}}/* ============================================================= CATALOG PROMO — секция каталога на страницах сервисов ============================================================= */ .srv-catalog-promo{padding:48px 0;background:linear-gradient(135deg,#f8f9fc 0%,#f0f4ff 100%)}.srv-catalog-promo__inner{max-width:1100px;margin:0 auto}.srv-catalog-promo__header{text-align:center;margin-bottom:32px}.srv-catalog-promo__title{font-size:1.6rem;font-weight:800;color:#212b62;margin:0 0 8px;line-height:1.3}.srv-catalog-promo__subtitle{font-size:.95rem;color:#666;margin:0;line-height:1.5;max-width:600px;margin:0 auto}.srv-catalog-promo__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}.srv-catalog-promo__card{display:flex;flex-direction:column;background:#fff;border:2px solid #e8eaed;border-radius:14px;text-decoration:none;color:#333;transition:all .25s;overflow:hidden;position:relative}.srv-catalog-promo__card:hover{border-color:#e8a530;box-shadow:0 8px 28px rgba(33,43,98,.1);transform:translateY(-3px)}.srv-catalog-promo__img{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#f0f4ff}.srv-catalog-promo__img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.srv-catalog-promo__card:hover .srv-catalog-promo__img img{transform:scale(1.05)}.srv-catalog-promo__img-fallback{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:2.8rem;background:linear-gradient(135deg,#eef2ff,#e0e7ff)}.srv-catalog-promo__body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;flex:1}.srv-catalog-promo__name{font-size:.95rem;font-weight:700;color:#212b62;line-height:1.35}.srv-catalog-promo__count{font-size:.78rem;color:#999;font-weight:500}.srv-catalog-promo__arrow{position:absolute;top:12px;right:12px;width:28px;height:28px;background:rgba(255,255,255,.85);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.85rem;color:#212b62;transition:all .2s;backdrop-filter:blur(4px);box-shadow:0 2px 8px rgba(0,0,0,.1)}.srv-catalog-promo__card:hover .srv-catalog-promo__arrow{background:#e8a530;color:#fff}.srv-catalog-promo__cta{text-align:center}.srv-catalog-promo__btn{display:inline-block;padding:14px 36px;background:#212b62;color:#fff;font-weight:700;font-size:.95rem;border-radius:10px;text-decoration:none;transition:all .2s}.srv-catalog-promo__btn:hover{background:#e8a530;transform:translateY(-1px)}@media (max-width:900px){.srv-catalog-promo__grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:600px){.srv-catalog-promo__grid{grid-template-columns:repeat(2,1fr);gap:10px}.srv-catalog-promo__title{font-size:1.3rem}.srv-catalog-promo__body{padding:10px 12px 12px}.srv-catalog-promo__name{font-size:.85rem}}
