/* ========================================================================== Cenowyraj.pl - style motywu. Wartości 1:1 z prototypu (Claude Design). Box-sizing zostaje domyślny (content-box) jak w prototypie; border-box tylko tam, gdzie prototyp go ustawia. ========================================================================== */ html { -webkit-text-size-adjust: 100%; } body { margin: 0; background: #F4F5F7; color: #141350; font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-size: 15px; line-height: normal; -webkit-font-smoothing: antialiased; } a { color: #141350; text-decoration: none; } a:hover { color: #4B49A6; } ::selection { background: #FFE01A; color: #141350; } input, button, select, textarea { font-family: inherit; } button { cursor: pointer; } img { max-width: 100%; } [hidden] { display: none !important; } h1, h2, h3, h4, p { margin: 0; } .cr-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; } .cr-hidden-btn { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; } .cr-hidden-row { display: none; } body.cr-modal-open { overflow: hidden; } .cr-site { min-height: 100vh; background: #F4F5F7; color: #141350; display: flex; flex-direction: column; } .cr-main { flex: 1 0 auto; } .cr-wrap { max-width: 1320px; margin: 0 auto; padding-left: 24px; padding-right: 24px; } .cr-page { padding-top: 24px; padding-bottom: 64px; } .cr-notices-wrap { padding-top: 16px; } /* -------------------------------------------------------------------------- Typografia wspólna -------------------------------------------------------------------------- */ .cr-kicker { font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: #9A99B5; } .cr-kicker--yellow { color: #FFE01A; } .cr-kicker--wide { letter-spacing: 0.16em; } .cr-kicker--14 { letter-spacing: 0.14em; } .cr-kicker--10 { letter-spacing: 0.1em; } .cr-kicker-sm { font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #9A99B5; } .cr-kicker-sm--light { color: rgba(255,255,255,0.55); } .cr-h1 { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; } .cr-h1--30 { font-size: 30px; margin: 0 0 8px; } .cr-h1--25 { font-size: 25px; margin: 0 0 6px; } .cr-h2 { font-size: 27px; font-weight: 800; letter-spacing: -0.02em; } .cr-h2--22 { font-size: 22px; } .cr-h2--24 { font-size: 24px; } .cr-h3 { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; } .cr-muted-12 { font-size: 12px; color: #8B8AA8; } .cr-muted-13 { font-size: 13px; color: #9A99B5; } .cr-muted { font-size: 14px; color: #6E6D93; } .cr-center { text-align: center; } .cr-green-14 { font-size: 14px; font-weight: 700; color: #1E8A4C; } .cr-req { color: #D6001C; font-style: normal; } .cr-sep { opacity: 0.4; } .cr-line { display: block; height: 1px; background: #EEEEF4; } .cr-link-strong { font-weight: 700; } .cr-link-underline { border: 0; background: none; padding: 0; font-size: 14px; font-weight: 700; color: #141350; cursor: pointer; text-decoration: underline; text-decoration-color: #FFE01A; text-decoration-thickness: 2px; text-underline-offset: 4px; } .cr-stack-6 { display: flex; flex-direction: column; gap: 6px; } .cr-stack-10 { display: flex; flex-direction: column; gap: 10px; } .cr-stack-12 { display: flex; flex-direction: column; gap: 12px; } .cr-stack-14 { display: flex; flex-direction: column; gap: 14px; } .cr-stack-16 { display: flex; flex-direction: column; gap: 16px; } .cr-stack-20 { display: flex; flex-direction: column; gap: 20px; } .cr-stack-22 { display: flex; flex-direction: column; gap: 22px; } .cr-stack-24 { display: flex; flex-direction: column; gap: 24px; } .cr-stack-26 { display: flex; flex-direction: column; gap: 26px; } .cr-card { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; } .cr-card--info { padding: 32px 38px; } .cr-card--doc { padding: 34px 38px; } .cr-card--22 { padding: 22px 26px; } .cr-card--24 { padding: 24px 26px; } .cr-card--26 { padding: 26px 30px; } .cr-card--28 { padding: 28px 30px; } .cr-card--30 { padding: 30px; } .cr-card--36 { padding: 36px 40px; } .cr-card--summary { padding: 26px 28px; } .cr-card__title { font-size: 15px; font-weight: 800; } .cr-card__title--17 { font-size: 17px; } /* Okrągłe znaczki */ .cr-circle { display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #FFE01A; flex-shrink: 0; } .cr-circle--bold { font-weight: 800; } .cr-circle--pale { background: #FFF6C2; } .cr-circle--26 { min-width: 26px; width: 26px; height: 26px; font-size: 13px; } .cr-circle--28 { min-width: 28px; width: 28px; height: 28px; font-size: 13px; } .cr-circle--30 { min-width: 30px; width: 30px; height: 30px; font-size: 14px; } .cr-circle--32 { min-width: 32px; width: 32px; height: 32px; font-size: 14px; } .cr-circle--34 { min-width: 34px; width: 34px; height: 34px; font-size: 15px; } .cr-circle--38 { min-width: 38px; width: 38px; height: 38px; font-size: 17px; } .cr-circle--40 { min-width: 40px; width: 40px; height: 40px; font-size: 16px; } .cr-circle--56 { min-width: 56px; width: 56px; height: 56px; } .cr-circle--24 { font-size: 24px; } .cr-check { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #FFE01A; font-size: 15px; font-weight: 800; color: #141350; flex-shrink: 0; } .cr-check--52 { width: 52px; height: 52px; font-size: 22px; } .cr-check--54 { width: 54px; height: 54px; font-size: 24px; } .cr-check--err { background: #D6001C; color: #fff; } /* Slot obrazu (odpowiednik image-slot fit=contain) */ .cr-slot { display: block; width: 100%; height: 100%; position: relative; background: #FFFFFF; } .cr-slot__img { display: block; width: 100%; height: 100%; object-fit: contain; } .cr-slot__empty { display: block; width: 100%; height: 100%; background: repeating-linear-gradient(135deg, #F7F7FB 0 12px, #F1F1F7 12px 24px); border-radius: 6px; } /* -------------------------------------------------------------------------- Przyciski -------------------------------------------------------------------------- */ .cr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 6px; font-size: 14px; font-weight: 800; line-height: normal; cursor: pointer; text-align: center; box-sizing: border-box; transition: background 0.15s, color 0.15s, border-color 0.15s; } .cr-btn--yellow { background: #FFE01A; color: #141350; } .cr-btn--yellow:hover { background: #141350; color: #FFFFFF; } .cr-btn--outline { border: 2px solid #141350; background: #FFFFFF; color: #141350; } .cr-btn--outline:hover { background: #141350; color: #FFFFFF; } .cr-btn--navy { background: #141350; color: #FFFFFF; } .cr-btn--navy:hover { background: #FFFFFF; color: #141350; } .cr-btn--ghost-white { border: 2px solid rgba(255,255,255,0.4); background: transparent; color: #FFFFFF; padding: 14px 24px; } .cr-btn--ghost-white:hover { border-color: #FFE01A; color: #FFE01A; } .cr-btn--soft { height: 48px; padding: 0 18px; border: 1px solid #DCDCE7; background: #FFFFFF; font-size: 13px; font-weight: 700; color: #141350; } .cr-btn--soft:hover { border-color: #141350; background: #F7F7FB; color: #141350; } .cr-btn--hero { padding: 14px 26px; } .cr-btn--cta { padding: 15px 28px; } .cr-btn--sm { font-size: 13px; } .cr-btn--xs { padding: 11px 20px; font-size: 13px; } .cr-btn--42 { height: 42px; padding: 0 8px; } .cr-btn--44 { height: 44px; padding: 0 22px; } .cr-btn--46 { padding: 12px 22px; } .cr-btn--48 { height: 48px; padding: 0 26px; } .cr-btn--50 { height: 50px; padding: 0 34px; font-size: 15px; } .cr-btn--52 { height: 52px; padding: 0 18px; font-size: 15px; } .cr-btn--block { width: 100%; height: 46px; } .cr-btn--self { align-self: flex-start; } .cr-btn--wide { padding: 0 34px; } .cr-btn:disabled { opacity: 0.55; cursor: default; } .cr-btnrow { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; } .cr-btnrow--reg { gap: 18px; } .cr-x { width: 40px; height: 40px; border: 1px solid #E3E4EC; border-radius: 6px; background: #FFFFFF; font-size: 15px; color: #141350; cursor: pointer; padding: 0; } .cr-x--corner { position: absolute; top: 14px; right: 14px; width: 32px; height: 32px; font-size: 14px; } .cr-x--corner:hover { background: #141350; color: #FFFFFF; } .cr-x--round { position: absolute; top: 16px; right: 16px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: #F1F1F7; font-size: 15px; } .cr-x--round:hover { background: #FFE01A; } /* -------------------------------------------------------------------------- Formularze -------------------------------------------------------------------------- */ .cr-form { display: flex; flex-direction: column; gap: 16px; } .cr-label { display: flex; flex-direction: column; min-width: 0; gap: 7px; font-size: 13px; font-weight: 700; } .cr-input, .form-row .input-text, .form-row select { width: 100%; min-width: 0; box-sizing: border-box; height: 48px; border: 1px solid #DCDCE7; border-radius: 6px; padding: 0 14px; font-size: 14px; color: #141350; outline: none; background: #FFFFFF; font-weight: 400; } .cr-input:focus, .form-row .input-text:focus { border-color: #141350; } .cr-input--44 { height: 46px; } .cr-input--48 { height: 50px; } .cr-textarea, .form-row textarea.input-text { width: 100%; min-width: 0; box-sizing: border-box; height: auto; border: 1px solid #DCDCE7; border-radius: 6px; padding: 12px 14px; font-family: inherit; font-size: 14px; line-height: 1.6; color: #141350; outline: none; resize: vertical; background: #FFFFFF; font-weight: 400; } .cr-textarea:focus, .form-row textarea.input-text:focus { border-color: #141350; } .cr-textarea--96 { min-height: 96px; line-height: 1.55; } .cr-checkbox { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #4A4A70; cursor: pointer; font-weight: 400; } .cr-checkbox input { width: 17px; height: 17px; margin: 0; accent-color: #141350; cursor: pointer; flex-shrink: 0; } .cr-checkbox--top { align-items: flex-start; font-size: 13px; line-height: 1.5; } .cr-checkbox--top input { margin-top: 2px; } .cr-checkbox--13 { font-size: 13px; font-weight: 600; } .cr-checkbox--12 { font-size: 12px; line-height: 1.5; } .cr-checkbox--12 input { width: 16px; height: 16px; margin-top: 2px; } .cr-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; } .cr-duo--form { gap: 18px 20px; } .cr-span2 { grid-column: span 2; } .cr-form-error { padding: 12px 14px; border-radius: 6px; background: #FFF0F1; color: #D6001C; font-size: 13px; font-weight: 700; line-height: 1.5; } .cr-form-error ul { margin: 0; padding: 0; list-style: none; } .cr-form-ok { padding: 12px 14px; border-radius: 6px; background: #E8F6EE; color: #1E8A4C; font-size: 13px; font-weight: 700; line-height: 1.5; } .cr-field-error { font-size: 12px; font-weight: 700; color: #D6001C; } .cr-input.is-error, .cr-textarea.is-error { border-color: #D6001C; } /* Pola WooCommerce */ .form-row { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 7px; font-size: 13px; font-weight: 700; padding: 0; } .form-row label { font-size: 13px; font-weight: 700; color: #141350; } .form-row label .required { color: #D6001C; text-decoration: none; } .form-row .optional { display: none; } .form-row.cr-full, .form-row.cr-span2 { grid-column: span 2; } .form-row.cr-hidden { display: none !important; } .form-row .woocommerce-input-wrapper { display: flex; flex-direction: column; } .form-row.woocommerce-invalid .input-text { border-color: #D6001C; } .form-row.cr-invoice-toggle { flex-direction: row; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; color: #4A4A70; } .form-row.cr-invoice-toggle label { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; color: #4A4A70; cursor: pointer; } .form-row.cr-invoice-toggle input { width: 17px; height: 17px; margin: 0; accent-color: #141350; } .cr-invoice-box { padding: 22px; border-radius: 8px; background: #F7F7FB; } .cr-invoice-box .form-row { grid-column: auto; } .woocommerce-account-fields { display: flex; flex-direction: column; gap: 16px; } .select2-container .select2-selection--single { height: 48px; border: 1px solid #DCDCE7; border-radius: 6px; } .select2-container .select2-selection--single .select2-selection__rendered { line-height: 46px; padding-left: 14px; color: #141350; font-size: 14px; } .select2-container .select2-selection--single .select2-selection__arrow { height: 46px; } /* Powiadomienia */ .cr-notice { margin: 0 0 16px; padding: 14px 18px; border-radius: 8px; font-size: 14px; line-height: 1.5; list-style: none; } .cr-notice--error { background: #FFF0F1; color: #D6001C; font-weight: 700; } .cr-notice--ok { background: #E8F6EE; color: #1E8A4C; font-weight: 700; } .cr-notice--info { background: #FFF9D6; color: #2B2A5C; } .cr-notice li { margin: 0; } .cr-notice li + li { margin-top: 6px; } .cr-notice a.button, .cr-notice .button { display: inline-block; margin-left: 10px; font-weight: 800; text-decoration: underline; } /* -------------------------------------------------------------------------- Pasek górny -------------------------------------------------------------------------- */ .cr-topbar { background: #141350; color: #FFFFFF; } .cr-topbar__in { padding-top: 8px; padding-bottom: 8px; min-height: 40px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 20px; font-size: 13px; box-sizing: border-box; } .cr-topbar__promo { display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,0.82); } .cr-topbar__dot { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: #FFE01A; color: #141350; font-size: 11px; font-weight: 800; } .cr-topbar__links { display: flex; align-items: center; gap: 16px; } .cr-topbar__links a { color: rgba(255,255,255,0.8); font-size: 13px; } .cr-topbar__links a:hover { color: #FFE01A; } .cr-topbar__sep { opacity: 0.28; } /* -------------------------------------------------------------------------- Nagłówek -------------------------------------------------------------------------- */ .cr-header { background: #EFEFEF; position: relative; z-index: 30; } .cr-hdr { padding-top: 18px; padding-bottom: 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; } .cr-hdr__logo-link { display: block; flex-shrink: 0; } .cr-hdr__logo { display: block; width: 222px; height: auto; } .cr-burger { display: none; order: 2; align-items: center; justify-content: center; width: 46px; height: 46px; border: 1px solid #D8D8E4; border-radius: 6px; background: #FFFFFF; font-size: 18px; color: #141350; cursor: pointer; padding: 0; } .cr-burger--search { font-size: 17px; margin-left: auto; } .cr-search { position: relative; flex: 1 1 420px; min-width: 300px; display: flex; align-items: center; height: 48px; border: 2px solid #141350; border-radius: 6px; background: #fff; margin: 0; } .cr-search__cat { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; height: 100%; padding: 0 15px; border: 0; border-right: 1px solid #E3E4EC; border-radius: 4px 0 0 4px; background: #fff; font-size: 14px; font-weight: 600; color: #141350; cursor: pointer; white-space: nowrap; max-width: 220px; overflow: hidden; } .cr-search__cat:hover { background: #F8F8FB; } .cr-search__cat-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .cr-search__caret { font-size: 9px; opacity: 0.55; } .cr-search__drop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 70; min-width: 260px; max-height: 340px; overflow: auto; background: #FFFFFF; border: 1px solid #E3E4EC; border-radius: 8px; box-shadow: 0 18px 44px rgba(10, 9, 40, 0.16); padding: 6px 0; display: flex; flex-direction: column; } .cr-search__drop a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px; font-size: 14px; font-weight: 600; color: #2B2A5C; } .cr-search__drop a:hover { background: #F7F7FB; color: #141350; } .cr-search__check { font-size: 12px; color: #141350; visibility: hidden; } .cr-search__drop a.is-active .cr-search__check { visibility: visible; } .cr-search__input { flex: 1 1 auto; min-width: 60px; height: 100%; border: 0; outline: none; padding: 0 16px; font-size: 14px; color: #141350; background: transparent; box-sizing: border-box; -webkit-appearance: none; appearance: none; } .cr-search__input::-webkit-search-decoration, .cr-search__input::-webkit-search-cancel-button { -webkit-appearance: none; } .cr-search__btn { flex: 0 0 auto; height: 100%; padding: 0 26px; border: 0; border-radius: 0 4px 4px 0; background: #FFE01A; font-size: 14px; font-weight: 800; color: #141350; cursor: pointer; white-space: nowrap; } .cr-search__btn:hover { background: #F5D000; } .cr-icons { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; } .cr-icon-btn { position: relative; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; font-size: 19px; color: #141350; } .cr-icon-btn--fav { font-size: 20px; } .cr-icon-btn--fav:hover { color: #4B49A6; } .cr-badge { position: absolute; top: -5px; right: -8px; min-width: 18px; height: 18px; padding: 0 4px; box-sizing: border-box; border-radius: 9px; background: #FFE01A; color: #141350; font-size: 11px; font-weight: 800; display: flex; align-items: center; justify-content: center; } .cr-cart-link { display: flex; align-items: center; gap: 11px; color: #141350; } .cr-cart-link:hover { color: #4B49A6; } .cr-cart-text { display: flex; flex-direction: column; line-height: 1.25; } .cr-cart-text__label { font-size: 11px; color: #6E6D93; font-weight: 500; } .cr-cart-total { font-size: 14px; font-weight: 800; } .cr-account-sep { width: 1px; height: 34px; background: #E3E4EC; } .cr-account { display: flex; align-items: center; gap: 10px; } .cr-account__avatar { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #F1F1F7; font-size: 15px; } .cr-account__text { display: flex; flex-direction: column; line-height: 1.35; align-items: flex-start; } .cr-account__main { padding: 0; border: 0; background: none; text-align: left; font-size: 13px; font-weight: 800; color: #141350; cursor: pointer; } .cr-account__main:hover { color: #4B49A6; } .cr-account__sub { padding: 0; border: 0; background: none; text-align: left; font-size: 13px; font-weight: 500; color: #6E6D93; cursor: pointer; } .cr-account__sub:hover { color: #141350; } /* Pasek menu */ .cr-navbar-wrap { border-top: 1px solid #E9E9F0; border-bottom: 1px solid #E9E9F0; position: relative; } .cr-navbar { min-height: 54px; display: flex; flex-wrap: wrap; align-items: center; gap: 0 32px; } .cr-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 0 28px; } .cr-nav__item { position: relative; display: flex; align-items: center; height: 54px; font-size: 15px; font-weight: 600; color: #141350; cursor: pointer; } .cr-nav__item:hover { opacity: 0.7; color: #141350; } .cr-nav__item.is-promo { color: #D6001C; } .cr-nav__caret { margin-left: 7px; font-size: 9px; opacity: 0.5; } .cr-nav__bar { position: absolute; left: -2px; right: -2px; bottom: -1px; height: 3px; background: #FFE01A; display: none; } .cr-nav__item.is-open { opacity: 1; } .cr-nav__item.is-open .cr-nav__bar { display: block; } .cr-nav-help { margin-left: auto; display: flex; align-items: center; gap: 9px; font-size: 15px; white-space: nowrap; } .cr-nav-help__icon { font-size: 15px; } .cr-nav-help__label { color: #6E6D93; font-weight: 500; } .cr-nav-help a { font-weight: 800; } .cr-mega { position: absolute; left: 0; right: 0; top: 100%; z-index: 40; background: #FFFFFF; border-bottom: 1px solid #E9E9F0; box-shadow: 0 26px 46px -22px rgba(20,19,80,0.3); } .cr-mega__in { padding-top: 34px; padding-bottom: 38px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); gap: 30px 40px; } .cr-mega__col { display: flex; flex-direction: column; gap: 16px; } .cr-mega__title { font-size: 15px; font-weight: 800; color: #6E6D93; } .cr-mega__list { display: flex; flex-direction: column; gap: 13px; } .cr-mega__link { display: flex; align-items: center; gap: 13px; font-size: 15px; font-weight: 500; color: #2B2A5C; } .cr-mega__link:hover { color: #4B49A6; } .cr-mega__icon { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; font-size: 15px; color: #141350; flex-shrink: 0; } .cr-mega__promo { display: flex; flex-direction: column; gap: 12px; color: #141350; } .cr-mega__promo-img { display: block; height: 200px; border-radius: 8px; overflow: hidden; background: #FFFFFF; border: 1px solid #EDEDF3; padding: 10px; box-sizing: border-box; } .cr-mega__promo-label { display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 800; } /* Okno szukania, panel mobilny, dolny pasek */ .cr-modal { position: fixed; inset: 0; z-index: 96; display: flex; align-items: center; justify-content: center; padding: 24px; background: rgba(10, 9, 40, 0.55); } .cr-modal__veil { position: absolute; inset: 0; } .cr-modal__box { position: relative; width: 100%; max-width: 480px; background: #FFFFFF; border-radius: 12px; padding: 32px 34px; box-shadow: 0 30px 80px rgba(10, 9, 40, 0.35); display: flex; flex-direction: column; gap: 22px; box-sizing: content-box; } .cr-modal--search { align-items: flex-start; padding: 18vh 20px 20px; background: rgba(10, 9, 40, 0.6); } .cr-modal__box--search { max-width: 520px; padding: 24px 22px; box-shadow: 0 30px 80px rgba(10, 9, 40, 0.4); gap: 16px; } .cr-modal__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .cr-modal__title-sm { font-size: 16px; font-weight: 800; color: #141350; } .cr-modal__head .cr-x { width: 36px; height: 36px; font-size: 14px; } .cr-search-modal__form { display: flex; align-items: center; height: 50px; border: 2px solid #141350; border-radius: 6px; overflow: hidden; margin: 0; } .cr-search-modal__form input { flex: 1; min-width: 0; height: 100%; border: 0; outline: none; padding: 0 14px; font-size: 15px; color: #141350; box-sizing: border-box; -webkit-appearance: none; appearance: none; } .cr-search-modal__form button { flex: 0 0 auto; height: 100%; padding: 0 22px; border: 0; background: #FFE01A; font-size: 14px; font-weight: 800; color: #141350; cursor: pointer; } .cr-search-modal__cats { display: flex; flex-direction: column; gap: 10px; } .cr-search-modal__cats .cr-kicker-sm { font-size: 11px; } .cr-chips { display: flex; flex-wrap: wrap; gap: 8px; } .cr-chip { padding: 9px 14px; border: 1px solid #E3E4EC; border-radius: 20px; font-size: 13px; font-weight: 700; color: #2B2A5C; } .cr-chip:hover { border-color: #141350; background: #F7F7FB; color: #2B2A5C; } .cr-chips--producers { gap: 10px; } .cr-chip--producer { padding: 9px 16px; border-radius: 999px; font-weight: 600; color: #4A4A70; } .cr-chip--producer:hover { border-color: #141350; background: #141350; color: #FFFFFF; } .cr-bottomnav { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; grid-template-columns: repeat(3, 1fr); background: #FFFFFF; border-top: 1px solid #E3E4EC; box-shadow: 0 -6px 22px rgba(10, 9, 40, 0.1); } .cr-bottomnav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 11px 6px 12px; font-size: 11px; font-weight: 700; color: #141350; } .cr-bottomnav a:hover { background: #F7F7FB; } .cr-bottomnav__mid { border-left: 1px solid #F0F0F5; border-right: 1px solid #F0F0F5; } .cr-bottomnav__icon { font-size: 19px; line-height: 1; position: relative; } .cr-bottomnav__cart .cr-badge { top: -6px; right: -12px; min-width: 17px; height: 17px; font-size: 10px; } .cr-drawer { position: fixed; inset: 0; z-index: 98; display: flex; justify-content: flex-end; background: rgba(10, 9, 40, 0.5); } .cr-drawer__veil { position: absolute; inset: 0; } .cr-drawer__panel { position: relative; width: 100%; max-width: 340px; height: 100%; overflow: auto; background: #FFFFFF; padding: 22px 22px 40px; display: flex; flex-direction: column; gap: 22px; box-sizing: border-box; } .cr-drawer__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; } .cr-drawer__logo { width: 150px; height: auto; } .cr-drawer__nav { display: flex; flex-direction: column; } .cr-drawer__nav a { display: flex; align-items: center; justify-content: space-between; padding: 14px 2px; border-bottom: 1px solid #F0F0F5; font-size: 16px; font-weight: 700; color: #141350; } .cr-drawer__nav a:hover { color: #4B49A6; } .cr-drawer__chev { font-size: 13px; color: #9A99B5; } .cr-drawer__info { display: flex; flex-direction: column; gap: 10px; } .cr-drawer__info .cr-kicker-sm { font-size: 11px; } .cr-drawer__info a { font-size: 14px; font-weight: 500; color: #4A4A70; } .cr-drawer__info a:hover { color: #141350; } .cr-drawer__account { display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 8px; background: #F7F7FB; } .cr-drawer__account .cr-btn--outline { border-width: 2px; } .cr-drawer__help { display: flex; flex-direction: column; gap: 4px; font-size: 14px; } .cr-drawer__help .cr-kicker-sm { font-size: 11px; } .cr-drawer__tel { font-weight: 800; } .cr-drawer__mail { font-weight: 600; color: #4A4A70; } /* -------------------------------------------------------------------------- Strona główna -------------------------------------------------------------------------- */ .cr-home { padding-top: 24px; padding-bottom: 64px; display: flex; flex-direction: column; gap: 44px; } .cr-home-top { display: grid; grid-template-columns: minmax(0, 268px) minmax(0, 1fr); gap: 24px; align-items: stretch; } .cr-sidecats { position: relative; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; } .cr-sidecats__list { display: flex; flex-direction: column; padding: 8px 0; } .cr-sidecats__item { position: relative; } .cr-sidecats__link { display: flex; align-items: center; gap: 11px; padding: 10px 16px; font-size: 14px; font-weight: 600; color: #2B2A5C; } .cr-sidecats__link:hover, .cr-sidecats__item:hover .cr-sidecats__link { background: #F7F7FB; color: #141350; } .cr-sidecats__link span:first-child { flex: 1; } .cr-sidecats__chev { font-size: 10px; color: #A3A2BC; } .cr-sidecats__fly { display: none; position: absolute; left: 100%; top: -8px; z-index: 25; width: 460px; padding: 22px 26px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 0 10px 10px 10px; box-shadow: 0 26px 46px -22px rgba(20,19,80,0.3); } .cr-sidecats__item:hover .cr-sidecats__fly { display: block; } .cr-sidecats__fly-title { font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #9A99B5; margin-bottom: 14px; } .cr-sidecats__fly-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 22px; } .cr-sidecats__fly-grid a { font-size: 14px; font-weight: 500; color: #4A4A70; } .cr-sidecats__fly-grid a:hover { color: #141350; } .cr-sidecats__all { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-top: 1px solid #EEEEF4; font-size: 13px; font-weight: 800; color: #141350; } .cr-sidecats__all:hover { background: #FFE01A; color: #141350; } .cr-hero { position: relative; border-radius: 12px; overflow: hidden; background: #141350; min-height: 470px; } .cr-hero__slide { position: absolute; inset: 0; display: none; grid-template-columns: minmax(300px, 0.95fr) minmax(0, 1fr); } .cr-hero__slide.is-active { display: grid; } .cr-hero__copy { position: relative; z-index: 2; padding: 40px 28px 40px 56px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 16px; } .cr-hero__title { font-size: 42px; line-height: 1.08; font-weight: 800; color: #FFFFFF; letter-spacing: -0.02em; text-wrap: balance; max-width: 460px; } .cr-hero__text { font-size: 15px; line-height: 1.55; color: rgba(255,255,255,0.72); max-width: 380px; } .cr-hero__discount { display: flex; align-items: baseline; gap: 10px; } .cr-hero__discount-label { font-size: 13px; font-weight: 600; color: rgba(255,255,255,0.7); } .cr-hero__discount-val { font-size: 30px; font-weight: 800; color: #FFE01A; letter-spacing: -0.01em; } .cr-hero__ctrls { display: inline-flex; flex-direction: column; gap: 12px; margin-top: 4px; } .cr-hero__ctrls .cr-btn--yellow:hover { background: #FFFFFF; color: #141350; } .cr-hero__nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .cr-hero__arrow { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid rgba(255,255,255,0.35); border-radius: 50%; background: transparent; font-size: 14px; color: #FFFFFF; cursor: pointer; padding: 0; } .cr-hero__arrow:hover { background: #FFE01A; color: #141350; border-color: #FFE01A; } .cr-hero__dots { display: flex; align-items: center; gap: 8px; } .cr-hero__dot { width: 18px; height: 8px; padding: 0; border: 0; border-radius: 4px; background: rgba(255,255,255,0.35); cursor: pointer; } .cr-hero__dot.is-active { width: 46px; background: #FFE01A; } .cr-hero__img { position: relative; z-index: 1; margin: 30px 34px 30px 0; border-radius: 10px; overflow: hidden; background: #FFFFFF; } .cr-hero__img .cr-slot { position: absolute; inset: 0; } .cr-usp { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1px; background: #E6E6EE; border: 1px solid #E6E6EE; border-radius: 10px; overflow: hidden; } .cr-usp__item { display: flex; align-items: center; gap: 14px; padding: 20px 22px; background: #FFFFFF; } .cr-usp__icon { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #FFF6C2; font-size: 17px; flex-shrink: 0; } .cr-usp__text { display: flex; flex-direction: column; line-height: 1.35; } .cr-usp__title { font-size: 14px; font-weight: 800; } .cr-usp__desc { font-size: 12px; color: #6E6D93; } .cr-section { display: flex; flex-direction: column; gap: 20px; } .cr-sechead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; border-bottom: 2px solid #E6E6EE; padding-bottom: 14px; } .cr-sechead__text { display: flex; flex-direction: column; gap: 6px; } .cr-sechead__link { font-size: 14px; font-weight: 700; white-space: nowrap; } .cr-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; font-size: 14px; font-weight: 600; color: #6E6D93; } .cr-tabs__btn { border: 0; background: none; padding: 0; font-size: 14px; font-weight: 600; color: #6E6D93; cursor: pointer; border-bottom: 2px solid transparent; padding-bottom: 4px; } .cr-tabs__btn.is-active { color: #141350; font-weight: 800; border-bottom-color: #FFE01A; } .cr-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 285px), 1fr)); gap: 20px; } .cr-tile { display: flex; flex-direction: column; gap: 14px; padding: 20px 20px 22px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; color: #141350; } .cr-tile:hover { border-color: #141350; box-shadow: 0 14px 26px -18px rgba(20,19,80,0.45); color: #141350; } .cr-tile__img { display: block; height: 170px; border-radius: 8px; overflow: hidden; background: #FFFFFF; border: 1px solid #F2F2F7; padding: 10px; box-sizing: border-box; } .cr-tile__name { font-size: 16px; font-weight: 800; line-height: 1.3; } .cr-tile__btn { margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border: 2px solid #141350; border-radius: 6px; font-size: 14px; font-weight: 800; color: #141350; box-sizing: border-box; } .cr-tile:hover .cr-tile__btn, .cr-tile__btn:hover { background: #141350; color: #FFFFFF; } .cr-pgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 20px; } .cr-pgrid--home { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); } .cr-pcard { position: relative; display: flex; flex-direction: column; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; overflow: hidden; } .cr-pcard:hover { border-color: #141350; box-shadow: 0 18px 30px -22px rgba(20,19,80,0.45); } .cr-fav { position: absolute; top: 12px; right: 12px; z-index: 3; width: 36px; height: 36px; border: 1px solid #E9E9F0; border-radius: 50%; background: #FFFFFF; font-size: 16px; line-height: 1; color: #8B8AA8; cursor: pointer; padding: 0; } .cr-fav:hover { border-color: #D6001C; color: #D6001C; } .cr-fav.is-active { color: #D6001C; } .cr-pcard__img { position: relative; display: block; height: 210px; background: #FFFFFF; padding: 14px; box-sizing: border-box; } .cr-pcard__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 9px; flex: 1; } .cr-pcard__brand { font-size: 12px; color: #9A99B5; font-weight: 600; } .cr-pcard__name { font-size: 15px; font-weight: 700; line-height: 1.4; } .cr-pcard__price { margin-top: auto; display: flex; align-items: baseline; gap: 10px; } .cr-pcard__amount { font-size: 21px; font-weight: 800; letter-spacing: -0.01em; } .cr-pcard__old { font-size: 13px; color: #8B8AA8; text-decoration: line-through; } .cr-pcard__btns { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; } .cr-about { display: flex; flex-direction: column; gap: 24px; } .cr-about__dark { background: #141350; border-radius: 12px; padding: 46px 52px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 28px 40px; align-items: center; } .cr-about__dark-text { display: flex; flex-direction: column; gap: 16px; } .cr-about__h2 { font-size: 34px; line-height: 1.15; font-weight: 800; color: #FFFFFF; letter-spacing: -0.02em; text-wrap: balance; } .cr-about__dark p { font-size: 16px; line-height: 1.7; color: rgba(255,255,255,0.78); } .cr-about__offer { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 12px; padding: 40px 46px; display: flex; flex-direction: column; gap: 28px; } .cr-about__offer-head { display: flex; flex-direction: column; gap: 10px; max-width: 760px; } .cr-about__offer-head p, .cr-about__card-head p { font-size: 15px; line-height: 1.7; color: #4A4A70; } .cr-about__offer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 20px; } .cr-about__offer-item { display: flex; flex-direction: column; gap: 10px; padding: 22px 20px; border: 1px solid #EDEDF3; border-radius: 10px; } .cr-about__offer-item:hover { border-color: #141350; } .cr-about__offer-icon { font-size: 20px; } .cr-about__offer-title { font-size: 15px; font-weight: 800; line-height: 1.3; } .cr-about__offer-desc { font-size: 13px; line-height: 1.6; color: #4A4A70; } .cr-about__duo { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; align-items: stretch; } .cr-about__card { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 12px; padding: 36px 40px; display: flex; flex-direction: column; gap: 22px; } .cr-about__card-head { display: flex; flex-direction: column; gap: 10px; } .cr-about__list { display: flex; flex-direction: column; gap: 14px; } .cr-about__list-item .cr-circle { min-width: 36px; width: 36px; height: 36px; font-size: 18px; } .cr-about__list-item { display: flex; gap: 14px; align-items: flex-start; padding-bottom: 14px; border-bottom: 1px solid #F0F0F5; } .cr-about__list-item:last-child { padding-bottom: 0; border-bottom: 0; } .cr-about__list-text { display: flex; flex-direction: column; gap: 3px; } .cr-about__list-title { font-size: 15px; font-weight: 800; } .cr-about__list-desc { font-size: 14px; line-height: 1.6; color: #4A4A70; } .cr-about__mini { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; } .cr-about__mini-item { display: flex; flex-direction: column; gap: 6px; padding: 18px 20px; border-radius: 10px; background: #F7F7FB; } .cr-about__mini-title { font-size: 14px; font-weight: 800; } .cr-about__mini-desc { font-size: 13px; line-height: 1.6; color: #4A4A70; } .cr-about__cta { background: #FFE01A; border-radius: 12px; padding: 40px 46px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 28px 36px; align-items: center; } .cr-about__cta-left { display: flex; flex-direction: column; gap: 12px; } .cr-about__cta-title { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; color: #141350; } .cr-about__cta p { font-size: 15px; line-height: 1.7; color: #2B2A5C; } .cr-about__cta-right { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; } .cr-bottom { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; align-items: stretch; } .cr-producers { padding: 28px 30px; display: flex; flex-direction: column; gap: 18px; } .cr-newsletter { background: #141350; border-radius: 10px; padding: 30px; display: flex; flex-direction: column; gap: 14px; justify-content: center; } .cr-newsletter__title { font-size: 22px; font-weight: 800; color: #FFFFFF; letter-spacing: -0.02em; } .cr-newsletter p { font-size: 14px; line-height: 1.55; color: rgba(255,255,255,0.7); } .cr-newsletter__form { display: flex; gap: 10px; margin: 4px 0 0; position: relative; } .cr-newsletter__form input[type="email"] { flex: 1; min-width: 0; box-sizing: border-box; height: 46px; border: 0; border-radius: 6px; padding: 0 16px; font-size: 14px; color: #141350; outline: none; } .cr-newsletter__form button { height: 46px; padding: 0 24px; border: 0; border-radius: 6px; background: #FFE01A; font-size: 14px; font-weight: 800; color: #141350; cursor: pointer; } .cr-newsletter__form button:hover { background: #FFFFFF; } .cr-newsletter__note { font-size: 12px; color: rgba(255,255,255,0.5); } .cr-newsletter__note.is-ok { color: #FFE01A; font-weight: 700; } .cr-newsletter__head { display: flex; flex-direction: column; gap: 14px; } /* Newsletter sam w rzędzie (sekcja Producenci wyłączona): tekst z lewej, formularz z prawej */ @media (min-width: 900px) { .cr-bottom--solo .cr-newsletter { display: grid; grid-template-columns: 1fr minmax(0, 480px); grid-template-rows: auto auto; column-gap: 48px; row-gap: 10px; align-items: center; padding: 34px 40px; } .cr-bottom--solo .cr-newsletter__head { grid-row: 1 / span 2; } .cr-bottom--solo .cr-newsletter__form { margin: 0; align-self: end; } .cr-bottom--solo .cr-newsletter__note { align-self: start; } } .cr-newsletter__note.is-err { color: #FFB3BA; font-weight: 700; } /* -------------------------------------------------------------------------- Okruszki, nagłówki sekcji stron -------------------------------------------------------------------------- */ .cr-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; color: #8B8AA8; margin-bottom: 22px; } .cr-crumbs a { font-size: 13px; color: #8B8AA8; } .cr-crumbs a:hover { color: #141350; } .cr-crumbs__cur { color: #141350; font-weight: 600; } .cr-stack-24 > .cr-crumbs, .cr-pdp > .cr-crumbs { margin-bottom: 0; } .cr-page-head { background: #141350; border-radius: 10px; padding: 34px 38px; color: #FFFFFF; } .cr-page-head__title { margin: 8px 0 0; font-size: 32px; font-weight: 800; letter-spacing: -0.02em; } /* -------------------------------------------------------------------------- Lista produktów -------------------------------------------------------------------------- */ .cr-filterbtn { display: none; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 48px; margin-bottom: 16px; border: 2px solid #141350; border-radius: 6px; background: #FFFFFF; font-size: 14px; font-weight: 800; color: #141350; cursor: pointer; } .cr-filterbtn span:first-child { font-size: 15px; } .cr-list-grid { display: grid; grid-template-columns: minmax(0, 268px) minmax(0, 1fr); gap: 24px; align-items: start; } .cr-filters { display: flex; flex-direction: column; gap: 16px; } .cr-filters__head { display: none; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 4px; } .cr-filters__head > span { font-size: 17px; font-weight: 800; color: #141350; } .cr-filters__cats { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; overflow: hidden; } .cr-filters__cats-head { padding: 14px 18px; background: #141350; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; } .cr-filters__cats-list { display: flex; flex-direction: column; padding: 8px 0; } .cr-filters__cats-list a { display: flex; align-items: center; gap: 10px; padding: 10px 18px; font-size: 14px; font-weight: 600; color: #2B2A5C; } .cr-filters__cats-list a:hover, .cr-filters__cats-list a.is-active { background: #F7F7FB; color: #141350; } .cr-filters__cats-list a.is-active { font-weight: 800; } .cr-filters__form { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; padding: 22px 20px; display: flex; flex-direction: column; gap: 14px; margin: 0; } .cr-filters__label { font-size: 13px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #6E6D93; } .cr-filters__price { display: flex; align-items: center; gap: 10px; } .cr-filters__price input { flex: 1; min-width: 0; box-sizing: border-box; height: 42px; border: 1px solid #DCDCE7; border-radius: 6px; padding: 0 12px; font-size: 14px; color: #141350; outline: none; -moz-appearance: textfield; } .cr-filters__price input::-webkit-outer-spin-button, .cr-filters__price input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .cr-filters__price input:focus { border-color: #141350; } .cr-filters__price span { color: #A3A2BC; } .cr-filters__line { display: block; height: 1px; background: #EEEEF4; } .cr-filters__apply { display: none; } .cr-filterveil { position: fixed; inset: 0; z-index: 84; background: rgba(10, 9, 40, 0.5); } .cr-list { display: flex; flex-direction: column; gap: 20px; } .cr-list__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; border-bottom: 2px solid #E6E6EE; padding-bottom: 14px; } .cr-sort { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .cr-sort__btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: 1px solid #E3E4EC; border-radius: 999px; background: #FFFFFF; font-size: 13px; font-weight: 600; color: #4A4A70; } .cr-sort__btn:hover { border-color: #141350; color: #141350; } .cr-sort__btn.is-active { font-weight: 800; color: #141350; } .cr-sort__dot { display: block; width: 6px; height: 6px; border-radius: 50%; background: #FFE01A; } .cr-pagination { display: flex; align-items: center; justify-content: center; gap: 8px; padding-top: 10px; } .cr-pagination--left { justify-content: flex-start; } .cr-pagination .page-numbers { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid #E3E4EC; border-radius: 6px; background: #FFFFFF; font-size: 14px; font-weight: 600; color: #4A4A70; box-sizing: border-box; } .cr-pagination .page-numbers:hover { border-color: #141350; color: #141350; } .cr-pagination .page-numbers.current { border: 0; background: #141350; font-weight: 800; color: #FFFFFF; } .cr-pagination .page-numbers.prev, .cr-pagination .page-numbers.next { color: #6E6D93; font-weight: 400; } .cr-pagination .page-numbers.dots { border: 0; background: none; width: auto; } .cr-empty { padding: 40px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; } .cr-empty p { font-size: 15px; line-height: 1.65; color: #4A4A70; } /* -------------------------------------------------------------------------- Karta produktu -------------------------------------------------------------------------- */ .cr-pdp { display: flex; flex-direction: column; gap: 40px; } .cr-pdp__top { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 32px; align-items: start; } .cr-pdp__gallery { display: flex; flex-direction: column; gap: 14px; } .cr-pdp__main { position: relative; height: 460px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 12px; padding: 18px; box-sizing: border-box; } .cr-pdp__zoom { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; } .cr-lightbox { position: fixed; inset: 0; z-index: 99; display: flex; align-items: center; justify-content: center; padding: 24px; } .cr-lightbox__veil { position: absolute; inset: 0; background: rgba(10, 9, 40, 0.92); } .cr-lightbox__img { position: relative; max-width: min(1200px, calc(100vw - 140px)); max-height: calc(100vh - 80px); width: auto; height: auto; object-fit: contain; background: #FFFFFF; border-radius: 10px; padding: 12px; box-sizing: border-box; box-shadow: 0 30px 80px rgba(0,0,0,0.5); } .cr-lightbox__x { position: absolute; top: 20px; right: 20px; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,0.35); border-radius: 50%; background: transparent; font-size: 18px; color: #FFFFFF; cursor: pointer; } .cr-lightbox__x:hover { background: #FFE01A; color: #141350; border-color: #FFE01A; } .cr-lightbox__arrow { position: absolute; top: 50%; margin-top: -24px; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,0.35); border-radius: 50%; background: transparent; font-size: 24px; line-height: 1; color: #FFFFFF; cursor: pointer; padding: 0; } .cr-lightbox__arrow:hover { background: #FFE01A; color: #141350; border-color: #FFE01A; } .cr-lightbox__arrow--prev { left: 24px; } .cr-lightbox__arrow--next { right: 24px; } .cr-lightbox__count { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.75); } .cr-pdp__arrow { position: absolute; top: 50%; z-index: 2; width: 40px; height: 40px; margin-top: -20px; border: 1px solid #E3E4EC; border-radius: 50%; background: #FFFFFF; font-size: 20px; line-height: 1; color: #141350; cursor: pointer; padding: 0; box-shadow: 0 6px 18px -8px rgba(20,19,80,0.35); display: flex; align-items: center; justify-content: center; } .cr-pdp__arrow:hover { background: #FFE01A; border-color: #FFE01A; } .cr-pdp__arrow--prev { left: 14px; } .cr-pdp__arrow--next { right: 14px; } .cr-pdp__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; } .cr-pdp__thumb { position: relative; height: 92px; padding: 6px; border: 2px solid #E9E9F0; border-radius: 8px; background: #FFFFFF; cursor: pointer; box-sizing: border-box; } .cr-pdp__thumb:hover { border-color: #B9B8D4; } .cr-pdp__thumb.is-active { border-color: #141350; } .cr-pdp__info { display: flex; flex-direction: column; gap: 18px; } .cr-pdp__head { display: flex; flex-direction: column; gap: 10px; } .cr-pdp__brand { font-size: 13px; font-weight: 700; color: #6E6D93; } a.cr-pdp__brand:hover { color: #141350; } .cr-pdp__title { font-size: 30px; line-height: 1.2; font-weight: 800; letter-spacing: -0.02em; text-wrap: balance; } .cr-pdp__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; font-size: 13px; color: #8B8AA8; } .cr-avail { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; color: #1E8A4C; } .cr-avail__dot { display: block; width: 7px; height: 7px; border-radius: 50%; background: #1E8A4C; } .cr-avail.is-off { color: #8B8AA8; } .cr-avail.is-off .cr-avail__dot { background: #8B8AA8; } .cr-avail--12 { font-size: 12px; gap: 6px; } .cr-avail--12 .cr-avail__dot { width: 6px; height: 6px; } .cr-pdp__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 14px; padding: 22px 24px; border-radius: 10px; background: #F7F7FB; } .cr-pdp__amount { font-size: 34px; font-weight: 800; letter-spacing: -0.02em; } .cr-pdp__old { font-size: 16px; color: #8B8AA8; text-decoration: line-through; } .cr-pdp__vat { font-size: 13px; color: #8B8AA8; } .cr-pdp__short { font-size: 15px; line-height: 1.7; color: #4A4A70; } .cr-pdp__short p { margin: 0; } .cr-pdp__short p + p { margin-top: 10px; } .cr-pdp__buy { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; } .cr-qty { display: flex; align-items: center; height: 52px; border: 1px solid #DCDCE7; border-radius: 6px; overflow: hidden; } .cr-qty--52 { height: 52px; } .cr-qty--38 { height: 38px; flex: 0 0 auto; } .cr-qty__btn { width: 44px; height: 100%; border: 0; background: #FFFFFF; font-size: 18px; font-weight: 700; color: #141350; cursor: pointer; padding: 0; } .cr-qty__btn:hover { background: #F1F1F7; } .cr-qty__input { width: 44px; height: 100%; text-align: center; font-size: 15px; font-weight: 800; border: 0; outline: none; color: #141350; padding: 0; background: #fff; -moz-appearance: textfield; box-sizing: border-box; } .cr-qty__input::-webkit-outer-spin-button, .cr-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .cr-qty--38 .cr-qty__btn { width: 34px; font-size: 16px; } .cr-qty--38 .cr-qty__input { width: 34px; font-size: 14px; } .cr-pdp__add { flex: 1 1 220px; } .cr-pdp__boxes, .cr-pdp__actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 12px; } .cr-pdp__box { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border: 1px solid #EDEDF3; border-radius: 8px; } .cr-pdp__box-text { display: flex; flex-direction: column; line-height: 1.35; } .cr-pdp__box-title { font-size: 13px; font-weight: 800; } .cr-pdp__box-desc { font-size: 12px; color: #6E6D93; } .cr-pdp__actions .cr-btn--soft span:first-child { font-size: 14px; } .cr-infobox { display: flex; align-items: flex-start; gap: 12px; padding: 18px 20px; border-radius: 8px; background: #FFF9D6; font-size: 13px; line-height: 1.65; color: #2B2A5C; } .cr-infobox--pdp .cr-circle { font-size: 14px; } .cr-infobox--yellow { gap: 14px; padding: 20px 24px; font-size: 14px; line-height: 1.7; } .cr-infobox--center { align-items: center; padding: 18px 22px; } .cr-infobox__strong { font-size: 15px; font-weight: 700; line-height: normal; color: #141350; } .cr-infobox__text { font-size: 14px; line-height: 1.7; color: #2B2A5C; } .cr-infobox--grey { background: #F7F7FB; gap: 11px; padding: 16px 18px; font-size: 13px; line-height: 1.6; color: #4A4A70; } .cr-infobox--col { flex-direction: column; gap: 10px; padding: 18px 20px; } .cr-infobox__title { font-size: 13px; font-weight: 800; color: #141350; } .cr-pdp__tabs { overflow: hidden; } .cr-pdp__tabbar { display: flex; flex-wrap: wrap; border-bottom: 1px solid #EDEDF3; } .cr-pdp__tab { position: relative; padding: 18px 26px; border: 0; background: transparent; font-size: 15px; font-weight: 700; color: #6E6D93; cursor: pointer; } .cr-pdp__tab:hover { color: #141350; } .cr-pdp__tab.is-active { color: #141350; } .cr-pdp__tab.is-active::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: -1px; height: 3px; background: #FFE01A; } .cr-pdp__panel { padding: 32px 34px; } .cr-pdp__desc { max-width: none; font-size: 15px; line-height: 1.8; color: #4A4A70; } .cr-highlights { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; } .cr-highlight { display: flex; align-items: center; gap: 14px; padding: 20px 22px; border-radius: 10px; background: #F7F7FB; } .cr-highlight__text { display: flex; flex-direction: column; gap: 3px; min-width: 0; } .cr-highlight__k { font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #9A99B5; } .cr-highlight__v { font-size: 15px; font-weight: 800; line-height: 1.35; } .cr-specs { display: flex; flex-direction: column; border: 1px solid #EDEDF3; border-radius: 10px; overflow: hidden; } .cr-specs__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 6px 24px; padding: 16px 22px; border-bottom: 1px solid #F4F4F8; } .cr-specs__row:last-child { border-bottom: 0; } .cr-specs__k { font-size: 13px; font-weight: 700; color: #6E6D93; } .cr-specs__v { font-size: 15px; font-weight: 600; line-height: 1.5; color: #141350; } .cr-reviews-empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; } .cr-reviews-empty__text { display: flex; flex-direction: column; gap: 8px; } .cr-reviews-empty__title { font-size: 18px; font-weight: 800; } .cr-reviews-empty__desc { font-size: 14px; line-height: 1.65; color: #4A4A70; max-width: 520px; } .cr-reviews-empty .cr-btn { padding: 13px 22px; } .cr-grid-280 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 20px; } .cr-grid-300 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 20px; } .cr-grid-260 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 20px; } .cr-grid-230 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 18px; } .cr-grid-200 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 13px; } .cr-box { display: flex; flex-direction: column; gap: 8px; border-radius: 8px; } .cr-box--grey { padding: 22px 24px; background: #F7F7FB; } .cr-box--outline { padding: 20px 22px; border: 1px solid #EDEDF3; } .cr-box--steps { gap: 10px; padding: 22px 20px; } .cr-box--addr { gap: 10px; padding: 24px 26px; } .cr-box--gap12 { gap: 12px; padding: 24px 26px; } .cr-box__title { font-size: 15px; font-weight: 800; } .cr-box--steps .cr-box__title { line-height: 1.3; } .cr-box__text { font-size: 14px; line-height: 1.6; color: #4A4A70; } .cr-box__text--17 { line-height: 1.7; } .cr-box__text--13 { font-size: 13px; } .cr-box__link { font-size: 13px; font-weight: 800; } .cr-address { font-size: 16px; font-weight: 800; line-height: 1.5; } .cr-address__tel { display: flex; flex-direction: column; gap: 3px; } .cr-address__tel a { font-size: 15px; font-weight: 700; } .cr-reviews { font-size: 14px; color: #4A4A70; } .cr-reviews .commentlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; } .cr-reviews .comment_container { display: flex; gap: 14px; padding: 18px 20px; border: 1px solid #EDEDF3; border-radius: 8px; } .cr-reviews .avatar { border-radius: 50%; width: 40px; height: 40px; } .cr-reviews .meta { font-size: 13px; color: #8B8AA8; margin: 0 0 6px; } .cr-reviews .description p { margin: 0; line-height: 1.6; } .cr-reviews .star-rating { color: #FFE01A; } .cr-reviews #review_form_wrapper { margin-top: 24px; } .cr-reviews .comment-form { display: flex; flex-direction: column; gap: 14px; } .cr-reviews .comment-form p { display: flex; flex-direction: column; gap: 7px; font-size: 13px; font-weight: 700; margin: 0; } .cr-reviews .comment-form input[type="text"], .cr-reviews .comment-form input[type="email"], .cr-reviews .comment-form textarea { border: 1px solid #DCDCE7; border-radius: 6px; padding: 12px 14px; font-size: 14px; } .cr-reviews .comment-form .submit { align-self: flex-start; height: 48px; padding: 0 26px; border: 0; border-radius: 6px; background: #FFE01A; font-size: 14px; font-weight: 800; color: #141350; cursor: pointer; } .cr-related .cr-sechead { padding-bottom: 14px; } /* Okno pytania */ .cr-modal--ask { z-index: 95; } .cr-modal__box--ask { max-width: 620px; max-height: 88vh; overflow: auto; padding: 26px 30px 28px; display: block; } .cr-modal__box--ask .cr-x--corner { top: 16px; right: 16px; width: 34px; height: 34px; font-size: 15px; } .cr-ask__title { margin: 6px 0 4px; font-size: 20px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.3; } .cr-ask__lead { margin: 0 0 18px; font-size: 13px; line-height: 1.55; color: #6E6D93; } .cr-ask__form { gap: 13px; } .cr-ask__form .cr-label { gap: 6px; } .cr-captcha { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border: 1px solid #EDEDF3; border-radius: 8px; background: #F7F7FB; cursor: pointer; } .cr-captcha input { position: absolute; opacity: 0; width: 1px; height: 1px; } .cr-captcha__box { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border: 1px solid #C9C9D8; border-radius: 3px; background: #FFFFFF; font-size: 12px; color: transparent; } .cr-captcha input:checked ~ .cr-captcha__box { color: #141350; border-color: #141350; } .cr-captcha__label { font-size: 13px; font-weight: 700; color: #4A4A70; } .cr-captcha__brand { margin-left: auto; font-size: 11px; letter-spacing: 0.06em; color: #9A99B5; } .cr-modal__h2 { margin: 0 0 6px; font-size: 25px; font-weight: 800; letter-spacing: -0.02em; } .cr-modal__h2--24 { font-size: 24px; margin: 0; } .cr-modal__lead { margin: 0 0 24px; font-size: 14px; color: #6E6D93; line-height: 1.6; } .cr-modal__text { font-size: 14px; line-height: 1.65; color: #4A4A70; } .cr-modal__text strong { color: #141350; } /* Okno "dodano" */ .cr-modal__box--added { max-width: 480px; } .cr-added__head { display: flex; align-items: center; gap: 11px; } .cr-added__title { font-size: 19px; font-weight: 800; letter-spacing: -0.01em; color: #141350; } .cr-added__item { display: flex; align-items: center; gap: 16px; padding: 16px; border: 1px solid #EDEDF3; border-radius: 8px; } .cr-added__img { display: block; width: 72px; height: 72px; flex-shrink: 0; border: 1px solid #F0F0F5; border-radius: 6px; overflow: hidden; background: #FFFFFF; } .cr-added__text { display: flex; flex-direction: column; gap: 5px; min-width: 0; } .cr-added__name { font-size: 14px; font-weight: 700; line-height: 1.4; color: #141350; } .cr-added__meta { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #6E6D93; } .cr-added__price { font-size: 15px; font-weight: 800; color: #141350; } .cr-added__actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 12px; } .cr-added__actions .cr-btn { height: 50px; } /* Okno logowania */ .cr-modal--login { z-index: 90; padding: 32px; background: rgba(20,19,80,0.55); backdrop-filter: blur(3px); } .cr-modal__box--login { width: 440px; max-width: 100%; padding: 36px 38px 32px; box-shadow: 0 40px 80px -30px rgba(20,19,80,0.6); display: block; } .cr-login__form .cr-label { gap: 7px; } .cr-login__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; } .cr-login__row .cr-checkbox { font-size: 13px; gap: 9px; white-space: nowrap; } .cr-login__forgot { font-size: 13px; font-weight: 700; white-space: nowrap; } .cr-login__foot { margin-top: 8px; padding-top: 20px; border-top: 1px solid #E9E9F0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; } .cr-login__foot > span { font-size: 14px; color: #6E6D93; } .cr-login__foot .cr-btn { padding: 11px 18px; gap: 8px; } .cr-login__form { margin-top: 0; } .cr-login__view[data-view="login"] .cr-login__form { margin-bottom: 0; } .cr-login__done { display: flex; flex-direction: column; gap: 16px; } .cr-login__done-actions { display: flex; flex-wrap: wrap; gap: 12px; } .cr-login__done-actions .cr-btn { flex: 1 1 150px; height: 48px; padding: 0 10px; } /* -------------------------------------------------------------------------- Rejestracja, konto -------------------------------------------------------------------------- */ .cr-register__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 24px; align-items: start; } .cr-register__lead { margin: 0 0 28px; font-size: 15px; color: #6E6D93; } .cr-register__consents { display: flex; flex-direction: column; gap: 12px; margin: 26px 0 24px; } .cr-register .cr-form { gap: 0; } .cr-benefit { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.5; color: #4A4A70; } .cr-auth-page { display: flex; flex-direction: column; gap: 0; } .cr-auth-card { max-width: 520px; } .cr-account-page .cr-crumbs { margin-bottom: 0; } .cr-info-grid--account .cr-info-side { position: static; max-height: none; } .cr-list__head--account h1 { font-size: 28px; } .cr-orders { display: flex; flex-direction: column; gap: 16px; } .cr-order { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); gap: 16px; align-items: center; padding: 22px 26px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; } .cr-order:hover { border-color: #141350; } .cr-order__cell { display: flex; flex-direction: column; gap: 4px; } .cr-order__k { font-size: 12px; color: #9A99B5; font-weight: 600; } .cr-order__nr { font-size: 16px; font-weight: 800; } .cr-order__v { font-size: 15px; font-weight: 600; } .cr-order__status { font-size: 15px; font-weight: 800; } .cr-order__total { font-size: 17px; font-weight: 800; } .cr-order__btn { justify-self: end; white-space: nowrap; } .cr-account-content { font-size: 14px; color: #4A4A70; } .cr-account-content > .woocommerce-notices-wrapper:empty { display: none; } .cr-account-content .woocommerce-Addresses, .cr-account-content .woocommerce-EditAccountForm, .cr-account-content .woocommerce-order-details, .cr-account-content .woocommerce-customer-details, .cr-account-content .woocommerce-address-fields, .cr-account-content .woocommerce-order { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; padding: 26px 30px; } .cr-account-content .woocommerce-Addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 24px; } .cr-account-content .woocommerce-Address-title h2, .cr-account-content h2 { font-size: 18px; font-weight: 800; color: #141350; margin: 0 0 12px; } .cr-account-content .woocommerce-Address-title a, .cr-account-content .woocommerce-orders-table__cell a { font-weight: 700; } .cr-account-content address { font-style: normal; line-height: 1.7; } .cr-account-content .woocommerce-EditAccountForm, .cr-account-content .woocommerce-address-fields { display: flex; flex-direction: column; gap: 16px; } .cr-account-content .woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px 20px; } .cr-account-content fieldset { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; } .cr-account-content legend { font-size: 15px; font-weight: 800; color: #141350; padding: 0; margin-bottom: 4px; } .cr-account-content .button { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 26px; border: 0; border-radius: 6px; background: #FFE01A; font-size: 14px; font-weight: 800; color: #141350; cursor: pointer; align-self: flex-start; } .cr-account-content .button:hover { background: #141350; color: #FFFFFF; } .cr-account-content table { width: 100%; border-collapse: collapse; } .cr-account-content th, .cr-account-content td { padding: 12px 0; border-bottom: 1px solid #F0F0F5; text-align: left; vertical-align: top; } .cr-account-content th { font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #6E6D93; } .cr-account-content .woocommerce-table--order-details tfoot th { font-size: 13px; letter-spacing: 0; text-transform: none; color: #141350; } .cr-account-content .woocommerce-order-details__title { margin-top: 0; } .cr-account-content .woocommerce-customer-details { margin-top: 20px; } .cr-account-content .woocommerce-column__title { font-size: 15px; font-weight: 800; color: #141350; margin-bottom: 8px; } .cr-account-content .woocommerce-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 20px; } .cr-account-content .woocommerce-password-strength, .cr-account-content .woocommerce-password-hint { font-size: 12px; font-weight: 600; margin-top: 6px; } .cr-account-content .show-password-input { display: none; } /* -------------------------------------------------------------------------- Producenci, ulubione -------------------------------------------------------------------------- */ .cr-producers-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; } .cr-producer { display: flex; align-items: center; gap: 14px; padding: 20px 22px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; color: #141350; } .cr-producer:hover { border-color: #141350; box-shadow: 0 14px 26px -18px rgba(20,19,80,0.45); color: #141350; } .cr-producer__letter { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 8px; background: #FFE01A; font-size: 18px; font-weight: 800; flex-shrink: 0; } .cr-producer__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .cr-producer__name { font-size: 15px; font-weight: 800; } .cr-producer__more { font-size: 12px; color: #8B8AA8; } .cr-fav-head { background: #141350; border-radius: 12px; padding: 34px 38px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 24px 40px; align-items: center; } .cr-fav-head__text { display: flex; flex-direction: column; gap: 8px; } .cr-fav-head__title { font-size: 30px; font-weight: 800; color: #FFFFFF; letter-spacing: -0.02em; } .cr-fav-head__count { font-size: 14px; color: rgba(255,255,255,0.7); } .cr-fav-head__actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; } .cr-fav-head__actions .cr-btn--yellow { padding: 14px 24px; } .cr-fav-head__actions .cr-btn--yellow:hover { background: #FFFFFF; color: #141350; } .cr-fav-list { display: flex; flex-direction: column; gap: 14px; } .cr-fav-row { display: grid; grid-template-columns: 110px minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 18px 22px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; } .cr-fav-row:hover { border-color: #141350; box-shadow: 0 16px 28px -22px rgba(20,19,80,0.4); } .cr-fav-row__img { display: block; height: 100px; border: 1px solid #F2F2F7; border-radius: 8px; background: #FFFFFF; padding: 8px; box-sizing: border-box; } .cr-fav-row__text { display: flex; flex-direction: column; gap: 7px; min-width: 0; } .cr-fav-row__brand { font-size: 12px; font-weight: 700; color: #9A99B5; } .cr-fav-row__name { font-size: 16px; font-weight: 700; line-height: 1.4; } .cr-fav-row__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 12px; color: #8B8AA8; } .cr-fav-row__meta .cr-avail { gap: 6px; } .cr-fav-row__meta .cr-avail__dot { width: 6px; height: 6px; } .cr-fav-row__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; justify-content: flex-end; } .cr-fav-row__price { font-size: 22px; font-weight: 800; letter-spacing: -0.01em; white-space: nowrap; } .cr-fav-row__actions .cr-btn--44 { white-space: nowrap; } .cr-fav-row__remove { width: 44px; height: 44px; border: 1px solid #E3E4EC; border-radius: 6px; background: #FFFFFF; font-size: 15px; color: #8B8AA8; cursor: pointer; padding: 0; } .cr-fav-row__remove:hover { border-color: #D6001C; color: #D6001C; } .cr-fav-empty { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; padding: 56px 40px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 32px; align-items: center; } .cr-fav-empty__left { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; } .cr-fav-empty__title { font-size: 22px; font-weight: 800; } .cr-fav-empty__text { font-size: 15px; line-height: 1.65; color: #6E6D93; } .cr-fav-empty .cr-btnrow { margin-top: 6px; } .cr-fav-empty__right { display: flex; flex-direction: column; gap: 12px; } .cr-fav-empty__row { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.6; color: #4A4A70; } /* -------------------------------------------------------------------------- Koszyk i zamówienie -------------------------------------------------------------------------- */ .woocommerce-cart .cr-page, .woocommerce-checkout .cr-page { display: block; } .cr-cart .cr-crumbs, .cr-checkout .cr-crumbs { margin-bottom: 22px; } .cr-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 26px; } .cr-steps__item { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: #9A99B5; } .cr-steps__item.is-active { font-weight: 800; color: #141350; } .cr-steps__item.is-done { color: #6E6D93; } .cr-steps__num { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #E9E9F0; font-size: 13px; } .cr-steps__item.is-active .cr-steps__num { background: #FFE01A; } .cr-steps__line { flex: 1; height: 2px; background: #E3E4EC; max-width: 120px; } .cr-steps__line.is-done { background: #FFE01A; } .cr-summary-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); gap: 24px; align-items: start; } .cr-sticky { position: sticky; top: 24px; } .cr-cart__table { overflow: hidden; } .cr-cart__thead { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 24px; background: #F7F7FB; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #6E6D93; } .cr-cart-row { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; padding: 20px 24px; border-top: 1px solid #F0F0F5; } .cr-cart-row__main { flex: 1 1 260px; display: flex; align-items: center; gap: 16px; min-width: 0; } .cr-cart-row__img { display: block; width: 72px; height: 72px; min-width: 72px; border-radius: 8px; background: #FFFFFF; border: 1px solid #EDEDF3; padding: 4px; box-sizing: border-box; flex-shrink: 0; } .cr-cart-row__text { display: flex; flex-direction: column; gap: 5px; min-width: 0; } .cr-cart-row__name { font-size: 15px; font-weight: 700; line-height: 1.4; } .cr-cart-row__meta { font-size: 12px; color: #8B8AA8; } .cr-cart-row__text .variation { margin: 0; font-size: 12px; color: #8B8AA8; } .cr-cart-row__unit { flex: 0 0 auto; font-size: 13px; font-weight: 600; color: #8B8AA8; white-space: nowrap; } .cr-cart-row__unit .amount { color: #8B8AA8; } .cr-cart-row__line { flex: 0 0 auto; min-width: 96px; text-align: right; font-size: 17px; font-weight: 800; white-space: nowrap; } .product-remove { flex: 0 0 auto; display: flex; } .cr-cart-row__remove { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #F5F5FA; font-size: 13px; color: #6E6D93; cursor: pointer; } .cr-cart-row__remove:hover { background: #FFE01A; color: #141350; } .cr-cart__foot { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 24px; border-top: 1px solid #F0F0F5; } .cr-cart__continue { font-size: 14px; font-weight: 700; } .cr-cart__foot .cr-muted-13 { color: #8B8AA8; } .cr-coupon { display: flex; gap: 10px; } .cr-coupon input { flex: 1; min-width: 0; } .cr-coupon .cr-btn { padding: 0 20px; white-space: nowrap; } .cr-coupon__ok { font-size: 13px; font-weight: 700; color: #1E8A4C; display: flex; align-items: center; gap: 8px; } .cr-coupon__remove { font-size: 12px; color: #8B8AA8; } .cr-progress { display: block; height: 8px; border-radius: 4px; background: #F1F1F7; overflow: hidden; } .cr-progress__bar { display: block; height: 100%; background: #FFE01A; } .cr-sumrow { display: flex; align-items: center; justify-content: space-between; font-size: 14px; color: #4A4A70; gap: 12px; } .cr-sumrow__val { font-weight: 700; color: #141350; text-align: right; } .cr-sumrow--green { color: #1E8A4C; font-weight: 700; } .cr-sumtotal { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; } .cr-sumtotal > span:first-child { font-size: 15px; font-weight: 800; } .cr-sumtotal__val { font-size: 26px; font-weight: 800; letter-spacing: -0.01em; } .cr-sumtotal__val--24 { font-size: 24px; } .cr-sumtotal__val .includes_tax, .cr-sumtotal__val .tax_label { display: none; } .cr-trust { display: flex; align-items: center; gap: 11px; font-size: 13px; color: #4A4A70; } .cr-empty-cart { padding: 60px 40px; display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; } .cr-empty-cart__icon { font-size: 34px; } .cr-empty-cart__title { font-size: 20px; font-weight: 800; } .cr-empty-cart__text { font-size: 14px; color: #6E6D93; max-width: 380px; } .cr-empty-cart .cr-btn { margin-top: 6px; } .cr-cart .woocommerce-notices-wrapper:empty { display: none; } .cr-haveacc { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 20px; } .cr-haveacc__text { display: flex; flex-direction: column; gap: 4px; } .cr-haveacc__title { font-size: 15px; font-weight: 800; } .cr-haveacc__desc { font-size: 13px; color: #6E6D93; } .cr-haveacc .cr-btn { white-space: nowrap; } .cr-choice-list { display: flex; flex-direction: column; gap: 12px; list-style: none; margin: 0; padding: 0; } .cr-choice-list--pay { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); } .cr-choice { position: relative; display: flex; align-items: center; gap: 16px; padding: 18px 20px; border: 2px solid #E9E9F0; border-radius: 8px; background: #FFFFFF; text-align: left; cursor: pointer; margin: 0; } .cr-choice:hover { border-color: #B9B8D4; } .cr-choice input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; } .cr-choice__radio { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #141350; flex-shrink: 0; } .cr-choice__radio span { display: none; width: 10px; height: 10px; border-radius: 50%; background: #141350; } .cr-choice input:checked ~ .cr-choice__radio span, .cr-choice input:checked ~ .cr-choice__label .cr-choice__radio span { display: block; } .cr-choice__text { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; } .cr-choice__name { font-size: 15px; font-weight: 700; color: #141350; } .cr-choice__desc { font-size: 13px; color: #6E6D93; } .cr-choice__desc--12 { font-size: 12px; } .cr-choice__price { font-size: 15px; font-weight: 800; color: #141350; } .cr-choice--pay { display: flex; flex-wrap: wrap; gap: 14px; } .cr-choice__label { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; cursor: pointer; margin: 0; } .cr-choice__extra { font-size: 12px; font-weight: 700; color: #8B8AA8; white-space: nowrap; } .cr-choice__box { flex-basis: 100%; font-size: 13px; line-height: 1.6; color: #4A4A70; padding-top: 4px; } .cr-choice__box p { margin: 0 0 8px; } .cr-review-items { display: flex; flex-direction: column; gap: 12px; } .cr-review-item { display: flex; align-items: center; gap: 12px; } .cr-review-item__img { display: block; width: 48px; height: 48px; border-radius: 6px; background: #FFFFFF; border: 1px solid #EDEDF3; padding: 3px; box-sizing: border-box; flex-shrink: 0; } .cr-review-item__text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; } .cr-review-item__name { font-size: 13px; font-weight: 700; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .cr-review-item__qty { font-size: 12px; color: #8B8AA8; } .cr-review-item__line { font-size: 14px; font-weight: 800; white-space: nowrap; } .cr-terms-error { font-size: 12px; font-weight: 700; line-height: 1.5; color: #D6001C; } .cr-back-link { font-size: 13px; font-weight: 700; text-align: center; } .woocommerce-checkout .blockUI.blockOverlay { border-radius: 10px; } .cr-checkout .woocommerce-NoticeGroup { grid-column: 1 / -1; } .woocommerce-additional-fields .form-row { gap: 0; } .woocommerce-additional-fields textarea { min-height: 78px; } .cr-thanks { padding-top: 16px; } .cr-thanks .cr-steps { margin-bottom: 26px; } .cr-thanks__hero { background: #141350; border-radius: 10px; padding: 44px 46px; color: #FFFFFF; display: flex; flex-direction: column; gap: 16px; } .cr-thanks__title { font-size: 32px; font-weight: 800; letter-spacing: -0.02em; } .cr-thanks__hero p { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.75); max-width: 520px; } .cr-thanks__hero p strong { color: #FFE01A; } .cr-thanks__hero .cr-btnrow { margin-top: 8px; } .cr-thanks__hero .cr-btn--yellow { padding: 14px 24px; } .cr-thanks__hero .cr-btn--yellow:hover { background: #FFFFFF; color: #141350; } .cr-thanks__details { margin-top: 24px; } .cr-thanks__details:empty { display: none; } .cr-thanks__details .woocommerce-order-details, .cr-thanks__details .woocommerce-customer-details, .cr-thanks__details .woocommerce-bacs-bank-details { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; padding: 26px 30px; margin-top: 20px; } .cr-thanks__details h2, .cr-thanks__details h3 { font-size: 16px; font-weight: 800; margin: 0 0 12px; } .cr-thanks__details table { width: 100%; border-collapse: collapse; font-size: 14px; } .cr-thanks__details th, .cr-thanks__details td { padding: 10px 0; border-bottom: 1px solid #F0F0F5; text-align: left; } .cr-thanks__details address { font-style: normal; line-height: 1.7; font-size: 14px; color: #4A4A70; } .cr-thanks__details .woocommerce-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 20px; } .cr-thanks__details .wc-bacs-bank-details { list-style: none; padding: 0; margin: 0; } /* -------------------------------------------------------------------------- Strony informacyjne -------------------------------------------------------------------------- */ .cr-info-grid { display: grid; grid-template-columns: minmax(0, 268px) minmax(0, 1fr); gap: 24px; align-items: start; } .cr-info-side { position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow: auto; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; } .cr-info-side__head { padding: 14px 18px; background: #141350; color: #fff; font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; border-radius: 9px 9px 0 0; } .cr-info-side__nav { display: flex; flex-direction: column; padding: 8px 0; } .cr-info-side__nav a { position: relative; display: flex; align-items: center; gap: 10px; padding: 11px 18px; font-size: 14px; font-weight: 600; color: #2B2A5C; } .cr-info-side__nav a:hover { background: #F7F7FB; color: #141350; } .cr-info-side__nav a.is-active { font-weight: 800; color: #141350; } .cr-info-side__nav a.is-active::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 3px; background: #FFE01A; } .cr-info-side__help { padding: 18px; border-top: 1px solid #EEEEF4; display: flex; flex-direction: column; gap: 8px; } .cr-info-side__help .cr-kicker-sm { letter-spacing: 0.08em; } .cr-info-side__tel { font-size: 16px; font-weight: 800; } .cr-info-side__hours { font-size: 12px; color: #8B8AA8; } .cr-info-side__mail { font-size: 13px; font-weight: 700; color: #4B49A6; } .cr-info-main { display: flex; flex-direction: column; gap: 24px; min-width: 0; } .cr-lead { font-size: 16px; line-height: 1.65; color: #4A4A70; max-width: 720px; } .cr-lead--780 { line-height: 1.7; max-width: 780px; } .cr-lead--760 { line-height: 1.7; max-width: 760px; } .cr-text-15 { font-size: 15px; line-height: 1.65; color: #4A4A70; } .cr-text-15 strong { color: #141350; } .cr-faq { padding: 12px 0; } .cr-faq__item { border-bottom: 1px solid #F0F0F5; } .cr-faq__item:last-child { border-bottom: 0; } .cr-faq__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 32px; border: 0; background: none; text-align: left; font-size: 16px; font-weight: 700; color: #141350; cursor: pointer; } .cr-faq__q:hover { background: #FAFAFD; } .cr-faq__sign { display: flex; align-items: center; justify-content: center; min-width: 28px; height: 28px; border-radius: 50%; background: #FFE01A; font-size: 15px; font-weight: 800; } .cr-faq__a p { margin: 0; padding: 0 88px 22px 32px; font-size: 15px; line-height: 1.65; color: #4A4A70; } .cr-yellow-bar { background: #FFE01A; border-radius: 10px; padding: 26px 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; } .cr-yellow-bar__text { display: flex; flex-direction: column; gap: 4px; } .cr-yellow-bar__title { font-size: 18px; font-weight: 800; } .cr-yellow-bar__title--16 { font-size: 16px; } .cr-yellow-bar__desc { font-size: 14px; color: #3B3A6B; } .cr-yellow-bar .cr-btn { white-space: nowrap; } .cr-yellow-bar .cr-btn--navy:hover { background: #FFFFFF; color: #141350; } .cr-yellow-bar--sm { padding: 24px 28px; border-radius: 8px; flex-wrap: wrap; gap: 20px; } .cr-yellow-bar--sm .cr-btn { padding: 13px 24px; } .cr-table { border: 1px solid #EDEDF3; border-radius: 8px; overflow: hidden; } .cr-table__head, .cr-table__row { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr) 110px; gap: 12px; padding: 14px 22px; } .cr-table__head { background: #F7F7FB; font-size: 12px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #6E6D93; } .cr-table__row { padding: 16px 22px; border-top: 1px solid #F0F0F5; font-size: 15px; align-items: center; } .cr-table__name { font-weight: 700; } .cr-table__online { font-weight: 700; color: #141350; } .cr-table__cod { color: #4A4A70; } .cr-table__right { text-align: right; } .cr-table__time { font-weight: 800; } .cr-steps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 18px; } .cr-step-card { display: flex; gap: 16px; align-items: flex-start; padding: 24px 26px; border: 1px solid #EDEDF3; border-radius: 8px; } .cr-step-card__text { display: flex; flex-direction: column; gap: 6px; min-width: 0; } .cr-step-card__title { font-size: 16px; font-weight: 800; line-height: 1.3; } .cr-step-card__desc { font-size: 14px; line-height: 1.65; color: #4A4A70; } .cr-step-row { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; border: 1px solid #EDEDF3; border-radius: 8px; } .cr-step-row__text { display: flex; flex-direction: column; gap: 5px; } .cr-step-row__title { font-size: 16px; font-weight: 800; } .cr-step-row__desc { font-size: 14px; line-height: 1.65; color: #4A4A70; } .cr-pay-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; } .cr-pay-card { display: flex; flex-direction: column; gap: 9px; padding: 22px; border: 1px solid #EDEDF3; border-radius: 8px; } .cr-pay-card:hover { border-color: #141350; } .cr-pay-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; } .cr-pay-card__name { font-size: 15px; font-weight: 800; } .cr-pay-card__tag { font-size: 11px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: #141350; } .cr-pay-card__desc { font-size: 13px; line-height: 1.6; color: #4A4A70; } .cr-rules { display: flex; flex-direction: column; gap: 14px; } .cr-rules__item { display: flex; gap: 14px; align-items: flex-start; padding-bottom: 14px; border-bottom: 1px solid #F0F0F5; } .cr-rules__item:last-child { padding-bottom: 0; border-bottom: 0; } .cr-rules__text { font-size: 14px; line-height: 1.7; color: #4A4A70; } .cr-contact { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; align-items: start; } .cr-contact__form { display: flex; flex-direction: column; gap: 22px; } .cr-contact__form .cr-form { gap: 22px; } .cr-cf7 .wpcf7-form-control-wrap { display: block; position: relative; } .cr-cf7 .wpcf7-not-valid-tip { display: block; margin-top: 6px; font-size: 12px; font-weight: 700; color: #D6001C; } .cr-cf7 .cr-input.wpcf7-not-valid, .cr-cf7 .cr-textarea.wpcf7-not-valid { border-color: #D6001C; } .cr-cf7 .cr-cf7-agree .wpcf7-form-control-wrap, .cr-cf7 .cr-cf7-agree .wpcf7-acceptance, .cr-cf7 .cr-cf7-agree .wpcf7-list-item { display: block; margin: 0; } .cr-cf7 .cr-cf7-agree label { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; } .cr-cf7 .cr-cf7-agree input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: #141350; cursor: pointer; flex-shrink: 0; } .cr-cf7 input.cr-btn { font-family: inherit; -webkit-appearance: none; appearance: none; } .cr-cf7 input.cr-btn:disabled { opacity: 0.6; cursor: wait; } .cr-cf7 .wpcf7-spinner { display: none; } .cr-cf7.submitting input.cr-btn { opacity: 0.6; cursor: wait; } .wpcf7 form.cr-form.cr-cf7 .wpcf7-response-output { margin: 0; padding: 12px 14px; border: 0; border-radius: 6px; background: #FFF0F1; color: #D6001C; font-size: 13px; font-weight: 700; line-height: 1.5; } .wpcf7 form.cr-form.cr-cf7.init .wpcf7-response-output, .wpcf7 form.cr-form.cr-cf7.resetting .wpcf7-response-output, .wpcf7 form.cr-form.cr-cf7.submitting .wpcf7-response-output { display: none; } .wpcf7 form.cr-form.cr-cf7.sent .wpcf7-response-output { background: #E8F6EE; color: #1E8A4C; } .cr-contact__title { font-size: 19px; font-weight: 800; } .cr-contact__sub { font-size: 14px; color: #6E6D93; } .cr-contact__side { display: flex; flex-direction: column; gap: 24px; } .cr-contact__company { display: flex; flex-direction: column; gap: 12px; font-size: 14px; line-height: 1.6; color: #4A4A70; } .cr-contact__company-name { font-size: 16px; font-weight: 800; color: #141350; } .cr-contact__hotline { background: #141350; border-radius: 10px; padding: 28px 30px; display: flex; flex-direction: column; gap: 14px; color: rgba(255,255,255,0.75); } .cr-contact__tel { font-size: 20px; font-weight: 800; color: #FFFFFF; } .cr-contact__tel:hover { color: #FFE01A; } .cr-contact__hours { font-size: 14px; } .cr-contact__line { display: block; height: 1px; background: rgba(255,255,255,0.14); } .cr-contact__mail { font-size: 15px; font-weight: 700; color: #FFFFFF; } .cr-contact__mail:hover { color: #FFE01A; } .cr-contact__note { font-size: 13px; } .cr-doc__intro { font-size: 15px; line-height: 1.65; color: #6E6D93; max-width: 760px; } .cr-doc__section { display: flex; flex-direction: column; gap: 12px; padding-bottom: 20px; border-bottom: 1px solid #F0F0F5; } .cr-doc__h { font-size: 18px; font-weight: 800; } .cr-doc__body { display: flex; flex-direction: column; gap: 10px; } .cr-doc__body p { margin: 0; font-size: 15px; line-height: 1.75; color: #4A4A70; max-width: 880px; } .cr-card--doc .cr-btn--outline { padding: 13px 22px; } .cr-doc__cookies { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 22px 26px; border-radius: 8px; background: #F7F7FB; } .cr-doc__cookies > span { font-size: 15px; font-weight: 700; } .cr-doc__cookies .cr-btn { padding: 12px 22px; } .cr-prose { font-size: 15px; line-height: 1.75; color: #4A4A70; } .cr-prose p { margin: 0 0 14px; } .cr-prose h2, .cr-prose h3, .cr-prose h4 { color: #141350; font-weight: 800; margin: 22px 0 10px; } .cr-prose h2 { font-size: 20px; } .cr-prose h3 { font-size: 17px; } .cr-prose ul, .cr-prose ol { margin: 0 0 14px; padding-left: 22px; } .cr-prose img { height: auto; border-radius: 8px; } .cr-prose table { width: 100%; border-collapse: collapse; margin: 0 0 14px; } .cr-prose td, .cr-prose th { border: 1px solid #EDEDF3; padding: 8px 12px; text-align: left; } .cr-pdp__desc section.section { display: flex; flex-wrap: wrap; gap: 24px; margin-bottom: 24px; align-items: center; } .cr-pdp__desc .item { flex: 1 1 260px; min-width: 0; } .cr-pdp__desc .item-12 { flex-basis: 100%; } .cr-pdp__desc .image-item img { width: 100%; height: auto; border-radius: 8px; } .cr-pdp__desc .text-item h2 { font-size: 20px; } /* 404 */ .cr-page--404 { padding-top: 40px; padding-bottom: 72px; } .cr-404 { background: #141350; border-radius: 12px; padding: 64px 56px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 40px; align-items: center; } .cr-404__text { display: flex; flex-direction: column; gap: 18px; } .cr-404__title { font-size: 34px; font-weight: 800; letter-spacing: -0.02em; color: #FFFFFF; line-height: 1.15; } .cr-404__text p { font-size: 16px; line-height: 1.65; color: rgba(255,255,255,0.75); max-width: 460px; } .cr-404__text .cr-btnrow { margin-top: 6px; } .cr-404__text .cr-btn--yellow:hover { background: #FFFFFF; color: #141350; } .cr-404__box { display: flex; flex-direction: column; gap: 14px; padding: 28px 30px; border-radius: 10px; background: rgba(255,255,255,0.06); } .cr-404__box a { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,0.12); font-size: 15px; font-weight: 700; color: #FFFFFF; } .cr-404__box a:hover { color: #FFE01A; } .cr-404__chev { font-size: 13px; color: rgba(255,255,255,0.45); } /* -------------------------------------------------------------------------- Stopka -------------------------------------------------------------------------- */ .cr-footer { background: #141350; color: rgba(255,255,255,0.72); } .cr-footer__grid { padding-top: 52px; padding-bottom: 26px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 36px 40px; } .cr-footer__about { display: flex; flex-direction: column; gap: 16px; } .cr-footer__logo { width: 200px; height: auto; filter: brightness(0) invert(1); } .cr-footer__about p { font-size: 14px; line-height: 1.6; max-width: 300px; } .cr-footer__contact { display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: #FFFFFF; font-weight: 700; } .cr-footer__contact a { color: #FFFFFF; font-size: 14px; } .cr-footer__contact a:hover { color: #FFE01A; } .cr-footer__col { display: flex; flex-direction: column; gap: 12px; } .cr-footer__head { font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #FFFFFF; } .cr-footer__col a, .cr-footer__btn { font-size: 14px; color: rgba(255,255,255,0.72); padding: 0; border: 0; background: none; text-align: left; cursor: pointer; } .cr-footer__col a:hover, .cr-footer__btn:hover { color: #FFE01A; } .cr-footer__bottom { padding-top: 18px; padding-bottom: 40px; border-top: 1px solid rgba(255,255,255,0.12); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; font-size: 13px; } .cr-footer__credit { color: #FFFFFF; font-weight: 700; font-size: 13px; } .cr-footer__credit:hover { color: #FFE01A; } .cr-footer__pay { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } .cr-footer__pay span { padding: 6px 12px; border-radius: 4px; background: rgba(255,255,255,0.1); font-size: 12px; font-weight: 700; color: #FFFFFF; } /* -------------------------------------------------------------------------- Responsywność (progi z prototypu) -------------------------------------------------------------------------- */ @media (max-width: 1080px) { .cr-home-top, .cr-list-grid, .cr-info-grid, .cr-summary-grid { grid-template-columns: minmax(0, 1fr) !important; } .cr-sidecats { display: none !important; } .cr-sticky, .cr-info-side { position: static !important; max-height: none !important; } .cr-wrap { padding-left: 16px !important; padding-right: 16px !important; } .cr-hero { min-height: 500px !important; } .cr-hero__title { font-size: 32px !important; } .cr-pdp__main { height: 380px !important; } } @media (max-width: 920px) { .cr-burger { display: flex !important; } .cr-nav, .cr-nav-help, .cr-topbar__links, .cr-account, .cr-account-sep { display: none !important; } .cr-navbar { min-height: 0 !important; } .cr-mega { display: none !important; } .cr-hdr__logo { width: 168px !important; } .cr-search { order: 3; flex-basis: 100% !important; min-width: 0 !important; display: none !important; } .cr-search[data-open="true"] { display: flex !important; } .cr-hdr { flex-wrap: nowrap !important; padding-top: 12px !important; padding-bottom: 12px !important; gap: 10px !important; } .cr-hdr[data-searching="true"] { flex-wrap: wrap !important; } .cr-icons { flex-wrap: nowrap !important; gap: 14px !important; } .cr-burger { width: 42px !important; height: 42px !important; flex: 0 0 auto; } .cr-burger--search { margin-left: 0 !important; } .cr-card--info, .cr-card--doc, .cr-card--36, .cr-card--26, .cr-card--28, .cr-thanks__hero, .cr-404, .cr-contact__form { padding: 26px 22px !important; } .cr-h1, .cr-list__head h1 { font-size: 26px !important; } .cr-h2 { font-size: 23px !important; } .cr-hero__copy { padding: 30px 24px !important; } } @media (max-width: 700px) { .cr-duo, .cr-about__mini, .cr-sidecats__fly-grid, .cr-pcard__btns, .woocommerce-billing-fields__field-wrapper, .cr-invoice-box, .woocommerce-address-fields__field-wrapper { grid-template-columns: minmax(0, 1fr) !important; } .cr-duo > *, .cr-span2, .form-row.cr-full { grid-column: auto !important; } .cr-hero__slide { grid-template-columns: minmax(0, 1fr) !important; grid-template-rows: auto minmax(140px, 1fr) !important; } .cr-hero__img { margin: 0 20px 22px !important; } .cr-hero__copy { padding: 26px 20px 18px !important; justify-content: flex-start !important; align-items: center !important; text-align: center !important; } .cr-hero__copy p, .cr-hero__copy h2 { max-width: none !important; } .cr-hero__ctrls { align-self: stretch; } .cr-hero { min-height: 620px !important; } .cr-hero__title { font-size: 27px !important; } .cr-search__cat, .cr-cart-text { display: none !important; } .cr-hdr__logo { width: 132px !important; } .cr-icons { gap: 12px !important; } .cr-pdp__main { height: 300px !important; } .cr-h1, .cr-list__head h1, .cr-pdp__title, .cr-fav-head__title { font-size: 23px !important; } .cr-h2, .cr-about__h2 { font-size: 21px !important; } .cr-sechead { padding-bottom: 12px !important; } .cr-card--info, .cr-card--doc, .cr-card--36, .cr-card--26, .cr-card--28, .cr-thanks__hero, .cr-404, .cr-contact__form, .cr-about__dark, .cr-about__offer, .cr-about__card, .cr-about__cta, .cr-fav-empty { padding: 22px 18px !important; } .cr-modal__box { padding: 22px 18px !important; } .cr-bottomnav { display: grid !important; } .cr-filterbtn { display: flex !important; } .cr-steps { flex-direction: column; align-items: flex-start !important; gap: 10px !important; } .cr-steps__line { display: none !important; } .cr-btnrow { flex-direction: column; align-items: stretch !important; } .cr-btnrow > * { width: 100%; box-sizing: border-box; text-align: center; justify-content: center; } .cr-login__foot > * { width: 100%; box-sizing: border-box; justify-content: center; text-align: center; } .cr-filterveil { display: block; } .cr-filters { display: none !important; } .cr-filters[data-open="true"] { display: flex !important; position: fixed; left: 0; right: 0; bottom: 0; top: 56px; z-index: 85; overflow: auto; background: #F4F4F8; padding: 20px 16px 28px; border-radius: 14px 14px 0 0; box-shadow: 0 -12px 40px rgba(10, 9, 40, 0.28); } .cr-filters[data-open="true"] .cr-filters__head, .cr-filters[data-open="true"] .cr-filters__apply { display: flex !important; } body { padding-bottom: 74px; } .cr-cart-row { padding: 18px 18px !important; gap: 14px !important; } .cr-cart-row__line { margin-left: auto; } .cr-fav-row { grid-template-columns: 90px minmax(0, 1fr); } .cr-fav-row__actions { grid-column: 1 / -1; justify-content: flex-start; } .cr-pay-grid { grid-template-columns: 1fr; } .cr-table__head { display: none; } .cr-table__row { grid-template-columns: 1fr 1fr; } .cr-yellow-bar, .cr-doc__cookies { flex-direction: column; align-items: flex-start; } .cr-faq__q { padding: 18px 20px; } .cr-faq__a p { padding: 0 20px 20px; } .cr-pdp__panel { padding: 22px 18px; } .cr-pdp__tab { padding: 14px 16px; font-size: 14px; } .cr-pdp__thumbs { grid-template-columns: repeat(4, 1fr); } .cr-lightbox { padding: 12px; } .cr-lightbox__img { max-width: calc(100vw - 24px); max-height: calc(100vh - 120px); padding: 6px; } .cr-lightbox__arrow { top: auto; bottom: 16px; margin-top: 0; width: 44px; height: 44px; } .cr-lightbox__arrow--prev { left: 16px; } .cr-lightbox__arrow--next { right: 16px; } .cr-lightbox__count { bottom: 30px; } .cr-order__btn { justify-self: start; } .cr-drawer__panel { max-width: 340px; } } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; } } /* -------------------------------------------------------------------------- Blog -------------------------------------------------------------------------- */ .cr-page-head--blog { display: flex; flex-direction: column; gap: 8px; } .cr-page-head--blog .cr-page-head__title { margin: 0; } .cr-page-head__lead { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,0.75); max-width: 720px; } .cr-page-head__meta { font-size: 13px; color: rgba(255,255,255,0.65); } .cr-sort--blog { gap: 8px; } .cr-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); gap: 20px; } .cr-post { display: flex; flex-direction: column; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; overflow: hidden; } .cr-post:hover { border-color: #141350; box-shadow: 0 18px 30px -22px rgba(20,19,80,0.45); } .cr-post__img { display: block; height: 210px; background: #F7F7FB; } .cr-post__thumb { display: block; width: 100%; height: 100%; object-fit: cover; } .cr-post__noimg { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 34px; color: #B9B8D4; } .cr-post__body { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 9px; flex: 1; } .cr-post__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: #9A99B5; } .cr-post__cat { font-size: 12px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: #141350; } .cr-post__title { font-size: 17px; font-weight: 800; line-height: 1.35; letter-spacing: -0.01em; } .cr-post__excerpt { font-size: 14px; line-height: 1.6; color: #4A4A70; } .cr-post__more { margin-top: auto; font-size: 13px; font-weight: 800; } .cr-article { display: flex; flex-direction: column; gap: 24px; } .cr-article__body { display: flex; flex-direction: column; gap: 22px; } .cr-article__hero img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: cover; border-radius: 10px; } .cr-prose--article { max-width: 880px; font-size: 16px; line-height: 1.75; } .cr-prose--article p { margin: 0 0 16px; } .cr-prose--article h2 { font-size: 24px; margin: 26px 0 12px; } .cr-prose--article h3 { font-size: 19px; } .cr-prose--article blockquote { margin: 0 0 16px; padding: 16px 22px; border-left: 3px solid #FFE01A; background: #F7F7FB; border-radius: 0 8px 8px 0; } .cr-article__tags { margin-top: -6px; } .cr-back-link--left { text-align: left; align-self: flex-start; } /* Ramka "Zamów telefonicznie" na karcie produktu */ /* Ramka telefoniczna: drugorzędna (jeden żółty przycisk na ekranie = Dodaj do koszyka) */ .cr-phonebox { display: flex; flex-direction: column; gap: 12px; padding: 16px 18px; border: 1px solid #EDEDF3; border-radius: 8px; background: #FFFFFF; color: #141350; } .cr-phonebox__text { display: flex; align-items: flex-start; gap: 12px; } .cr-phonebox__icon { display: flex; align-items: center; justify-content: center; min-width: 34px; width: 34px; height: 34px; border-radius: 50%; background: #F1F1F7; color: #141350; font-size: 15px; flex-shrink: 0; } .cr-phonebox__body { display: flex; flex-direction: column; gap: 3px; } .cr-phonebox__title { font-size: 13px; font-weight: 800; } .cr-phonebox__desc { font-size: 12px; line-height: 1.55; color: #6E6D93; } .cr-phonebox__nums { display: flex; flex-wrap: wrap; gap: 10px; } .cr-phonebox__num { display: inline-flex; align-items: center; justify-content: center; gap: 8px; flex: 1 1 160px; height: 44px; border: 1px solid #DCDCE7; border-radius: 6px; background: #FFFFFF; color: #141350; font-size: 14px; font-weight: 700; letter-spacing: 0.01em; transition: background 0.15s, border-color 0.15s; } .cr-phonebox__num::before { content: "✆"; font-size: 13px; } .cr-phonebox__num:hover { border-color: #141350; background: #F7F7FB; color: #141350; } .cr-phonebox__note { font-size: 11px; color: #8E8DAE; } /* ------------------------------------------------------------------ */ /* Strona główna wg briefu przebudowy (wrzesień 2026) */ /* ------------------------------------------------------------------ */ .cr-sechead__sub { font-size: 14px; line-height: 1.55; color: #6E6D93; margin: 0; } .cr-btn--ghost-light { border: 2px solid rgba(255,255,255,0.55); background: transparent; color: #FFFFFF; } .cr-btn--ghost-light:hover { border-color: #FFFFFF; background: #FFFFFF; color: #141350; } .cr-hero__btns { display: flex; flex-wrap: wrap; gap: 10px; } .cr-hero__img--collage { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 10px; background: transparent; } .cr-hero__cell { position: relative; display: block; border-radius: 10px; overflow: hidden; background: #FFFFFF; min-height: 0; } .cr-hero__cell .cr-slot { position: absolute; inset: 0 0 34px; padding: 10px; box-sizing: border-box; } .cr-hero__cell-name { position: absolute; left: 0; right: 0; bottom: 0; height: 34px; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; color: #141350; background: #FFF6C2; } .cr-hero__cell:hover .cr-hero__cell-name { background: #FFE01A; } .cr-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 20px; } .cr-quick__item { display: flex; align-items: flex-start; gap: 16px; padding: 22px 24px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; color: #141350; } .cr-quick__item:hover { border-color: #141350; box-shadow: 0 14px 26px -18px rgba(20,19,80,0.45); color: #141350; } .cr-quick__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: #FFF6C2; font-size: 22px; flex-shrink: 0; } .cr-quick__text { display: flex; flex-direction: column; gap: 4px; } .cr-quick__title { font-size: 16px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; } .cr-quick__desc { font-size: 13px; line-height: 1.5; color: #6E6D93; } .cr-quick__link { margin-top: 6px; font-size: 14px; font-weight: 800; text-decoration: underline; text-decoration-color: #FFE01A; text-decoration-thickness: 2px; text-underline-offset: 4px; } .cr-why { background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 12px; padding: 36px 40px; display: flex; flex-direction: column; gap: 26px; } .cr-why__head { display: flex; flex-direction: column; gap: 8px; max-width: 760px; } .cr-why__head p { font-size: 15px; line-height: 1.65; color: #4A4A70; margin: 0; } .cr-why__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 16px; } .cr-why__item { display: flex; flex-direction: column; gap: 8px; padding: 20px 18px; border-radius: 10px; background: #F7F7FB; } .cr-why__icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: #FFE01A; font-size: 21px; } .cr-why__title { font-size: 15px; font-weight: 800; line-height: 1.3; } .cr-why__desc { font-size: 13px; line-height: 1.6; color: #4A4A70; } .cr-pcard__pct { position: absolute; top: 12px; left: 12px; z-index: 2; padding: 4px 8px; border-radius: 5px; background: #D6001C; color: #FFFFFF; font-size: 13px; font-weight: 800; } .cr-pcard__rating { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: #6E6D93; } .cr-pcard__stars { color: #F5B400; letter-spacing: 1px; font-size: 13px; } .cr-pcard__stock { font-size: 12px; font-weight: 700; color: #1E8A4C; } .cr-pcard__stock::before { content: ''; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: currentColor; vertical-align: 1px; } .cr-pcard__stock.is-out { color: #8B8AA8; } .cr-tiles--home { grid-template-columns: repeat(4, minmax(0, 1fr)); } @media (max-width: 1080px) { .cr-tiles--home { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .cr-needs { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); gap: 14px; } .cr-needs__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 22px 12px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; text-align: center; color: #141350; } .cr-needs__item:hover { border-color: #141350; background: #FFF9D6; color: #141350; } .cr-needs__icon { font-size: 30px; line-height: 1; } .cr-needs__label { font-size: 14px; font-weight: 800; line-height: 1.3; } .cr-reviews { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 20px; } .cr-review { margin: 0; display: flex; flex-direction: column; gap: 12px; padding: 24px 24px 22px; background: #FFFFFF; border: 1px solid #E9E9F0; border-radius: 10px; } .cr-review__stars { color: #F5B400; font-size: 16px; letter-spacing: 2px; } .cr-review__text { margin: 0; font-size: 14px; line-height: 1.65; color: #2B2A5C; } .cr-review__meta { margin-top: auto; display: flex; justify-content: space-between; gap: 10px; font-size: 13px; } .cr-review__name { font-weight: 800; } .cr-review__src { color: #8B8AA8; } .cr-allegro { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 36px; padding: 34px 40px; border-radius: 12px; background: #FFE01A; } .cr-allegro__text { display: flex; flex-direction: column; gap: 8px; max-width: 720px; } .cr-allegro__text p { margin: 0; font-size: 15px; line-height: 1.65; color: #2B2A5C; } .cr-allegro__rating { font-size: 14px; font-weight: 800; } .cr-about__body { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; } .cr-about__body p { margin: 0; } .cr-onas__sec { display: flex; flex-direction: column; gap: 10px; } .cr-onas__sec .cr-lead { margin: 0; } .cr-onas__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 10px; } .cr-onas__list li { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 8px; background: #F7F7FB; font-size: 14px; font-weight: 700; } .cr-onas__icon { font-size: 20px; } .cr-onas__box { align-items: center !important; justify-content: space-between; flex-wrap: wrap; } .cr-onas__box-text { display: flex; flex-direction: column; gap: 4px; } .cr-onas__box-title { font-size: 16px; } .cr-onas__contact-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; } .cr-onas__chip { display: inline-flex; align-items: center; gap: 8px; padding: 13px 18px; border: 1px solid #E9E9F0; border-radius: 6px; font-size: 14px; font-weight: 700; } .cr-onas__chip:hover { border-color: #141350; } @media (max-width: 920px) { .cr-why, .cr-allegro { padding: 26px 22px !important; } } @media (max-width: 700px) { .cr-hero__copy h1 { max-width: none !important; } .cr-hero__btns { flex-direction: column; } .cr-hero__btns .cr-btn { width: 100%; } .cr-quick { gap: 12px; } .cr-quick__item { padding: 16px 18px; } .cr-why__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; } .cr-why__item { padding: 16px 14px; } .cr-needs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .cr-tiles--home { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .cr-tiles--home .cr-tile { padding: 12px 12px 14px; gap: 10px; } .cr-tiles--home .cr-tile__img { height: 120px; } .cr-tiles--home .cr-tile__name { font-size: 14px; } .cr-tiles--home .cr-tile__btn { height: 40px; font-size: 13px; } .cr-allegro .cr-btn, .cr-about__body .cr-btn { width: 100%; } } @media (max-width: 1400px) and (min-width: 921px) { .cr-nav { gap: 0 20px; } } @media (max-width: 1280px) and (min-width: 921px) { .cr-nav-help { display: none; } .cr-nav { gap: 0 16px; } .cr-nav__item { font-size: 14px; } } @media (max-width: 700px) { .cr-hero { min-height: 800px !important; } .cr-hero__slide { grid-template-rows: auto minmax(260px, 1fr) !important; } .cr-why__grid { grid-template-columns: minmax(0, 1fr); } .cr-why__item { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; row-gap: 2px; } .cr-why__icon { grid-row: span 2; } } .cr-mega__in--few { grid-template-columns: repeat(4, minmax(0, 1fr)); } /* Pasek informacyjny - komunikaty */ .cr-topbar__msgs { display: flex; align-items: center; gap: 22px; color: rgba(255,255,255,0.86); font-size: 13px; } .cr-topbar__msg { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; } .cr-topbar__msg + .cr-topbar__msg::before { content: ''; width: 1px; height: 14px; margin-right: 15px; background: rgba(255,255,255,0.28); } .cr-topbar__ico { font-size: 14px; line-height: 1; } @media (max-width: 920px) { .cr-topbar__msgs { position: relative; justify-content: center; width: 100%; height: 20px; overflow: hidden; } .cr-topbar__msg { position: absolute; left: 0; right: 0; justify-content: center; opacity: 0; transform: translateY(100%); transition: opacity 0.35s, transform 0.35s; } .cr-topbar__msg.is-active { opacity: 1; transform: none; } .cr-topbar__msg + .cr-topbar__msg::before { display: none; } } /* Podpowiedzi wyszukiwarki */ .has-suggest { position: relative; } .cr-search-modal__form.has-suggest { overflow: visible; } .cr-suggest { position: absolute; top: calc(100% + 6px); left: -2px; right: -2px; z-index: 75; max-height: min(70vh, 520px); overflow: auto; background: #FFFFFF; border: 1px solid #E3E4EC; border-radius: 8px; box-shadow: 0 18px 44px rgba(10, 9, 40, 0.18); padding: 6px 0; } .cr-suggest__head { padding: 10px 16px 6px; font-size: 11px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: #9A99B5; } .cr-suggest a { display: flex; align-items: center; gap: 12px; padding: 8px 16px; color: #141350; font-size: 14px; outline: none; } .cr-suggest a:hover, .cr-suggest a:focus { background: #FFF9D6; color: #141350; } .cr-suggest__cat { justify-content: space-between; font-weight: 700; } .cr-suggest__count { font-size: 12px; font-weight: 600; color: #9A99B5; } .cr-suggest__prod img, .cr-suggest__noimg { width: 44px; height: 44px; object-fit: contain; flex-shrink: 0; border: 1px solid #F0F0F5; border-radius: 6px; background: #FFFFFF; } .cr-suggest__name { flex: 1; min-width: 0; line-height: 1.35; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .cr-suggest__price { font-weight: 800; white-space: nowrap; } .cr-suggest .cr-suggest__all { margin-top: 4px; border-top: 1px solid #F0F0F5; padding-top: 12px; font-weight: 800; } .cr-suggest__none { padding: 14px 16px; font-size: 14px; color: #6E6D93; } /* Stopka - media społecznościowe */ .cr-footer__social { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; } .cr-footer__social-links { display: flex; flex-wrap: wrap; gap: 8px; } .cr-footer__social-links a { padding: 6px 12px; border: 1px solid rgba(255,255,255,0.25); border-radius: 6px; font-size: 13px; font-weight: 700; color: #FFFFFF; } .cr-footer__social-links a:hover { border-color: #FFE01A; color: #FFE01A; } /* SEO kategorii */ .cr-list__title { display: flex; flex-direction: column; gap: 8px; max-width: 760px; } .cr-list__intro { margin: 0; font-size: 14px; line-height: 1.6; color: #4A4A70; } .cr-catseo { margin-top: 36px; display: flex; flex-direction: column; gap: 18px; } .cr-catseo__text { padding: 28px 32px; display: flex; flex-direction: column; gap: 12px; } .cr-catseo__text p { margin: 0; font-size: 15px; line-height: 1.7; color: #4A4A70; } @media (max-width: 700px) { .cr-catseo__text { padding: 20px 18px; } }