/* hello-elementor */ html{line-height:1.15;-webkit-text-size-adjust:100%}*,:after,:before{box-sizing:border-box}body{background-color:#fff;color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:1rem;font-weight:400;line-height:1.5;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{color:inherit;font-family:inherit;font-weight:500;line-height:1.2;margin-block-end:1rem;margin-block-start:.5rem}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-block-end:.9rem;margin-block-start:0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em;white-space:pre-wrap}a{background-color:transparent;color:#c36;text-decoration:none}a:active,a:hover{color:#336}a:not([href]):not([tabindex]),a:not([href]):not([tabindex]):focus,a:not([href]):not([tabindex]):hover{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}abbr[title]{border-block-end:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none;height:auto;max-width:100%}details{display:block}summary{display:list-item}figcaption{color:#333;font-size:16px;font-style:italic;font-weight:400;line-height:1.4}[hidden],template{display:none}@media print{*,:after,:before{background:transparent!important;box-shadow:none!important;color:#000!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}a[href^="#"]:after,a[href^="javascript:"]:after{content:""}pre{white-space:pre-wrap!important}blockquote,pre{-moz-column-break-inside:avoid;border:1px solid #ccc;break-inside:avoid}thead{display:table-header-group}img,tr{-moz-column-break-inside:avoid;break-inside:avoid}h2,h3,p{orphans:3;widows:3}h2,h3{-moz-column-break-after:avoid;break-after:avoid}}label{display:inline-block;line-height:1;vertical-align:middle}button,input,optgroup,select,textarea{font-family:inherit;font-size:1rem;line-height:1.5;margin:0}input[type=date],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select,textarea{border:1px solid #666;border-radius:3px;padding:.5rem 1rem;transition:all .3s;width:100%}input[type=date]:focus,input[type=email]:focus,input[type=number]:focus,input[type=password]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=text]:focus,input[type=url]:focus,select:focus,textarea:focus{border-color:#333}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;width:auto}[type=button],[type=submit],button{background-color:transparent;border:1px solid #c36;border-radius:3px;color:#c36;display:inline-block;font-size:1rem;font-weight:400;padding:.5rem 1rem;text-align:center;transition:all .3s;-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap}[type=button]:focus:not(:focus-visible),[type=submit]:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}[type=button]:focus,[type=button]:hover,[type=submit]:focus,[type=submit]:hover,button:focus,button:hover{background-color:#c36;color:#fff;text-decoration:none}[type=button]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto;resize:vertical}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}select{display:block}table{background-color:transparent;border-collapse:collapse;border-spacing:0;font-size:.9em;margin-block-end:15px;width:100%}table td,table th{border:1px solid hsla(0,0%,50%,.502);line-height:1.5;padding:15px;vertical-align:top}table th{font-weight:700}table tfoot th,table thead th{font-size:1em}table caption+thead tr:first-child td,table caption+thead tr:first-child th,table colgroup+thead tr:first-child td,table colgroup+thead tr:first-child th,table thead:first-child tr:first-child td,table thead:first-child tr:first-child th{border-block-start:1px solid hsla(0,0%,50%,.502)}table tbody>tr:nth-child(odd)>td,table tbody>tr:nth-child(odd)>th{background-color:hsla(0,0%,50%,.071)}table tbody tr:hover>td,table tbody tr:hover>th{background-color:hsla(0,0%,50%,.102)}table tbody+tbody{border-block-start:2px solid hsla(0,0%,50%,.502)}@media(max-width:767px){table table{font-size:.8em}table table td,table table th{line-height:1.3;padding:7px}table table th{font-weight:400}}dd,dl,dt,li,ol,ul{background:transparent;border:0;font-size:100%;margin-block-end:0;margin-block-start:0;outline:0;vertical-align:baseline} /* hello-elementor-theme-style */ .comments-area a,.page-content a{text-decoration:underline}.alignright{float:right;margin-left:1rem}.alignleft{float:left;margin-right:1rem}.aligncenter{clear:both;display:block;margin-inline:auto}.alignwide{margin-inline:-80px}.alignfull{margin-inline:calc(50% - 50vw);max-width:100vw}.alignfull,.alignfull img{width:100vw}.wp-caption{margin-block-end:1.25rem;max-width:100%}.wp-caption.alignleft{margin:5px 20px 20px 0}.wp-caption.alignright{margin:5px 0 20px 20px}.wp-caption img{display:block;margin-inline:auto}.wp-caption-text{margin:0}.gallery-caption{display:block;font-size:.8125rem;line-height:1.5;margin:0;padding:.75rem}.pagination{display:flex;justify-content:space-between;margin:20px auto}.sticky{display:block;position:relative}.bypostauthor{font-size:inherit}.hide{display:none!important}.post-password-form{margin:50px auto;max-width:500px}.post-password-form p{align-items:flex-end;display:flex;width:100%}.post-password-form [type=submit]{margin-inline-start:3px}.screen-reader-text{clip:rect(1px,1px,1px,1px);height:1px;overflow:hidden;position:absolute!important;width:1px;word-wrap:normal!important}.screen-reader-text:focus{background-color:#eee;clip:auto!important;clip-path:none;color:#333;display:block;font-size:1rem;height:auto;left:5px;line-height:normal;padding:12px 24px;text-decoration:none;top:5px;width:auto;z-index:100000}.post .entry-title a{text-decoration:none}.post .wp-post-image{max-height:500px;-o-object-fit:cover;object-fit:cover;width:100%}@media(max-width:991px){.post .wp-post-image{max-height:400px}}@media(max-width:575px){.post .wp-post-image{max-height:300px}}#comments .comment-list{font-size:.9em;list-style:none;margin:0;padding:0}#comments .comment,#comments .pingback{position:relative}#comments .comment .comment-body,#comments .pingback .comment-body{border-block-end:1px solid #ccc;display:flex;flex-direction:column;padding-block-end:30px;padding-block-start:30px;padding-inline-end:0;padding-inline-start:60px}#comments .comment .avatar,#comments .pingback .avatar{border-radius:50%;left:0;margin-inline-end:10px;position:absolute}body.rtl #comments .comment .avatar,body.rtl #comments .pingback .avatar,html[dir=rtl] #comments .comment .avatar,html[dir=rtl] #comments .pingback .avatar{left:auto;right:0}#comments .comment-meta{display:flex;justify-content:space-between;margin-block-end:.9rem}#comments .comment-metadata,#comments .reply{font-size:11px;line-height:1}#comments .children{list-style:none;margin:0;padding-inline-start:30px;position:relative}#comments .children li:last-child{padding-block-end:0}#comments ol.comment-list .children:before{content:"↪";display:inline-block;font-size:1em;font-weight:400;left:0;line-height:100%;position:absolute;top:45px;width:auto}body.rtl #comments ol.comment-list .children:before,html[dir=rtl] #comments ol.comment-list .children:before{content:"↩";left:auto;right:0}@media(min-width:768px){#comments .comment-author,#comments .comment-metadata{line-height:1}}@media(max-width:767px){#comments .comment .comment-body{padding:30px 0}#comments .children{padding-inline-start:20px}#comments .comment .avatar{float:left;position:inherit}body.rtl #comments .comment .avatar,html[dir=rtl] #comments .comment .avatar{float:right}}.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{margin-inline-end:auto;margin-inline-start:auto;width:100%}@media(max-width:575px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{padding-inline-end:10px;padding-inline-start:10px}}@media(min-width:576px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:500px}.site-footer.footer-full-width .footer-inner,.site-header.header-full-width .header-inner{max-width:100%}}@media(min-width:768px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:600px}.site-footer.footer-full-width,.site-header.header-full-width{max-width:100%}}@media(min-width:992px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:800px}.site-footer.footer-full-width,.site-header.header-full-width{max-width:100%}}@media(min-width:1200px){.page-header .entry-title,.site-footer .footer-inner,.site-footer:not(.dynamic-footer),.site-header .header-inner,.site-header:not(.dynamic-header),body:not([class*=elementor-page-]) .site-main{max-width:1140px}.site-footer.footer-full-width,.site-header.header-full-width{max-width:100%}}.site-header+.elementor{min-height:calc(100vh - 320px)} /* hello-elementor-header-footer */ .site-header{display:flex;flex-wrap:wrap;justify-content:space-between;padding-block-end:1rem;padding-block-start:1rem;position:relative}.site-header .site-title{font-size:2.5rem;font-weight:500;line-height:1.2}.site-header .site-branding{display:flex;flex-direction:column;gap:.5rem;justify-content:center}.site-header .header-inner{display:flex;flex-wrap:wrap;justify-content:space-between}.site-header .header-inner .custom-logo-link{display:block}.site-header .header-inner .site-branding .site-description,.site-header .header-inner .site-branding .site-title{margin:0}.site-header .header-inner .site-branding .site-logo img{display:block}.site-header .header-inner .site-branding.show-logo .site-title,.site-header .header-inner .site-branding.show-title .site-logo{display:none!important}.site-header.header-inverted .header-inner{flex-direction:row-reverse}.site-header.header-inverted .header-inner .site-branding{text-align:end}.site-header.header-stacked .header-inner{align-items:center;flex-direction:column;text-align:center}.site-footer{padding-block-end:1rem;padding-block-start:1rem;position:relative}.site-footer .site-title{font-size:1.5rem;font-weight:500;line-height:1.2}.site-footer .site-branding{display:flex;flex-direction:column;gap:.5rem;justify-content:center}.site-footer .footer-inner{display:flex;flex-wrap:wrap;justify-content:space-between}.site-footer .footer-inner .custom-logo-link{display:block}.site-footer .footer-inner .site-branding .site-description,.site-footer .footer-inner .site-branding .site-title{margin:0}.site-footer .footer-inner .site-branding .site-logo img{display:block}.site-footer .footer-inner .site-branding.show-logo .site-title,.site-footer .footer-inner .site-branding.show-title .site-logo{display:none!important}.site-footer .footer-inner .copyright{align-items:center;display:flex;justify-content:flex-end}.site-footer .footer-inner .copyright p{margin:0}.site-footer.footer-inverted .footer-inner{flex-direction:row-reverse}.site-footer.footer-inverted .footer-inner .site-branding{text-align:end}.site-footer.footer-stacked .footer-inner{align-items:center;flex-direction:column;text-align:center}.site-footer.footer-stacked .footer-inner .site-branding .site-title{text-align:center}.site-footer.footer-stacked .footer-inner .site-navigation .menu{padding:0}@media(max-width:576px){.site-footer:not(.footer-stacked) .footer-inner .copyright,.site-footer:not(.footer-stacked) .footer-inner .site-branding,.site-footer:not(.footer-stacked) .footer-inner .site-navigation{display:block;max-width:none;text-align:center;width:100%}.site-footer .footer-inner .site-navigation ul.menu{justify-content:center}.site-footer .footer-inner .site-navigation ul.menu li{display:inline-block}}.site-header.header-stacked .site-navigation-toggle-holder{justify-content:center;max-width:100%}.site-header.menu-layout-dropdown .site-navigation{display:none}.site-navigation-toggle-holder{align-items:center;display:flex;padding:8px 15px}.site-navigation-toggle-holder .site-navigation-toggle{align-items:center;background-color:rgba(0,0,0,.05);border:0 solid;border-radius:3px;color:#494c4f;cursor:pointer;display:flex;justify-content:center;padding:.5rem}.site-navigation-toggle-holder .site-navigation-toggle-icon{display:block;width:1.25rem}.site-navigation-toggle-holder .site-navigation-toggle-icon:after,.site-navigation-toggle-holder .site-navigation-toggle-icon:before{background-color:currentColor;border-radius:3px;content:"";display:block;height:3px;transition:all .2s ease-in-out}.site-navigation-toggle-holder .site-navigation-toggle-icon:before{box-shadow:0 .35rem 0 currentColor;margin-block-end:.5rem}.site-navigation-toggle-holder .site-navigation-toggle[aria-expanded=true] .site-navigation-toggle-icon:before{box-shadow:none;transform:translateY(.35rem) rotate(45deg)}.site-navigation-toggle-holder .site-navigation-toggle[aria-expanded=true] .site-navigation-toggle-icon:after{transform:translateY(-.35rem) rotate(-45deg)}.site-navigation{align-items:center;display:flex}.site-navigation ul.menu,.site-navigation ul.menu ul{list-style-type:none;padding:0}.site-navigation ul.menu{display:flex;flex-wrap:wrap}.site-navigation ul.menu li{display:flex;position:relative}.site-navigation ul.menu li a{display:block;padding:8px 15px}.site-navigation ul.menu li.menu-item-has-children{padding-inline-end:15px}.site-navigation ul.menu li.menu-item-has-children:after{align-items:center;color:#666;content:"▾";display:flex;font-size:1.5em;justify-content:center;text-decoration:none}.site-navigation ul.menu li.menu-item-has-children:focus-within>ul{display:block}.site-navigation ul.menu li ul{background:#fff;display:none;left:0;min-width:150px;position:absolute;top:100%;z-index:2}.site-navigation ul.menu li ul li{border-block-end:1px solid #eee}.site-navigation ul.menu li ul li:last-child{border-block-end:none}.site-navigation ul.menu li ul li.menu-item-has-children a{flex-grow:1}.site-navigation ul.menu li ul li.menu-item-has-children:after{transform:translateY(-50%) rotate(-90deg)}.site-navigation ul.menu li ul ul{left:100%;top:0}.site-navigation ul.menu li:hover>ul{display:block}footer .site-navigation ul.menu li ul{bottom:100%;top:auto}footer .site-navigation ul.menu li ul ul{bottom:0}footer .site-navigation ul.menu a{padding:5px 15px}.site-navigation-dropdown{bottom:0;left:0;margin-block-start:10px;position:absolute;transform-origin:top;transition:max-height .3s,transform .3s;width:100%;z-index:10000}.site-navigation-toggle-holder:not(.elementor-active)+.site-navigation-dropdown{max-height:0;transform:scaleY(0)}.site-navigation-toggle-holder.elementor-active+.site-navigation-dropdown{max-height:100vh;transform:scaleY(1)}.site-navigation-dropdown ul{padding:0}.site-navigation-dropdown ul.menu{background:#fff;margin:0;padding:0;position:absolute;width:100%}.site-navigation-dropdown ul.menu li{display:block;position:relative;width:100%}.site-navigation-dropdown ul.menu li a{background:#fff;box-shadow:inset 0 -1px 0 rgba(0,0,0,.102);color:#55595c;display:block;padding:20px}.site-navigation-dropdown ul.menu li.current-menu-item a{background:#55595c;color:#fff}.site-navigation-dropdown ul.menu>li li{max-height:0;transform:scaleY(0);transform-origin:top;transition:max-height .3s,transform .3s}.site-navigation-dropdown ul.menu li.elementor-active>ul>li{max-height:100vh;transform:scaleY(1)}@media(max-width:576px){.site-header.menu-dropdown-mobile:not(.menu-layout-dropdown) .site-navigation{display:none!important}}@media(min-width:768px){.site-header.menu-dropdown-mobile:not(.menu-layout-dropdown) .site-navigation-toggle-holder{display:none!important}}@media(min-width:576px)and (max-width:767px){.site-header.menu-dropdown-mobile:not(.menu-layout-dropdown) .site-navigation{display:none!important}}@media(min-width:992px){.site-header.menu-dropdown-tablet:not(.menu-layout-dropdown) .site-navigation-toggle-holder{display:none!important}}@media(max-width:992px){.site-header.menu-dropdown-tablet:not(.menu-layout-dropdown) .site-navigation{display:none!important}}.site-header.menu-dropdown-none:not(.menu-layout-dropdown) .site-navigation-toggle-holder{display:none!important} /* chld_thm_cfg_child */ /* Theme Name: kreatywne-okno.pl Child Theme URI: kreatywne-okno.pl Template: hello-elementor Author: ITPER PL Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready Version: 3.4.6.1769505558 Updated: 2026-07-20 12:30:00 UWAGA: Plik zostal czesciowo odtworzony 2026-07-20. Jesli zauwazysz braki w stylach na innych podstronach, daj znac. */ /* Elementor Search (WooCommerce) — lupa zawsze, pole tylko na hover */ .elementor-widget-search .e-search-form{ display:flex; align-items:center; gap:10px; } .elementor-widget-search .e-search-input-wrapper{ order:1; overflow:hidden; transition: max-width .25s ease, opacity .2s ease; max-width:0; opacity:0; pointer-events:none; } .elementor-widget-search .e-search-input{ width:220px; max-width:70vw; } .elementor-widget-search .e-search-submit{ order:2; cursor:pointer; } .elementor-widget-search:hover .e-search-input-wrapper, .elementor-widget-search .e-search-form:focus-within .e-search-input-wrapper{ max-width:260px; opacity:1; pointer-events:auto; } @media (max-width: 768px){ .elementor-widget-search .e-search-input-wrapper{ max-width:260px; opacity:1; pointer-events:auto; } } .unic-word { color: #B19566; } /* ============================================ ZLOTE PRZYCISKI Jedno zrodlo prawdy dla zlotego wygladu. Uzywaja go: .golden-custom-buttons – przyciski w tresciach (Elementor) przycisk "Dodaj do koszyka" – karta produktu Wartosci trzymane w zmiennych, wiec zmiana koloru w jednym miejscu przebudowuje oba warianty. ============================================ */ /* Zastepczy krój dla Montserrat dopasowany metrykami (size-adjust) – do czasu wczytania Montserrat przyciski maja ta sama szerokosc, wiec nie przeskakuja (CLS). Po wczytaniu fontu nic sie nie zmienia. */ @font-face{font-family:"KO Montserrat Fallback";src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("LiberationSans"),local("Arimo"),local("Helvetica");font-weight:400;size-adjust:109.06%;ascent-override:88.76%;descent-override:23.01%;line-gap-override:0%;} @font-face{font-family:"KO Montserrat Fallback";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("LiberationSans-Bold"),local("Arimo Bold"),local("Arimo-Bold"),local("Helvetica Bold");font-weight:700;size-adjust:109.06%;ascent-override:88.76%;descent-override:23.01%;line-gap-override:0%;} :root{ --ko-gold-bg: linear-gradient(145deg,#f7e7b5,#e7c874,#d4a94f,#f3dc9a,#c89b3c); --ko-gold-border: rgba(120,80,20,.45); --ko-gold-text: #303030; --ko-gold-shadow: inset 0 2px 3px rgba(255,255,255,.55), inset 0 -2px 4px rgba(120,80,20,.35), 0 4px 10px rgba(0,0,0,.22); --ko-gold-shadow-hover: inset 0 2px 4px rgba(255,255,255,.65), inset 0 -2px 6px rgba(120,80,20,.45), 0 6px 16px rgba(0,0,0,.28); --ko-gold-shine: linear-gradient(120deg,transparent 0%,rgba(255,255,255,.65) 50%,transparent 100%); } /* --- wspolny wyglad (kolory, obramowanie, cien, typografia) --- */ .golden-custom-buttons, .single-product form.cart .single_add_to_cart_button, .single-product #itper-fixed-total-box.itper-premium-totals, .single-product .ko-swatch-toggle, .term-description details:not(.faq__item) > summary, .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button, form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt{ position: relative; display: inline-flex; align-items: center; justify-content: center; font-family: "Montserrat", "KO Montserrat Fallback", sans-serif !important; font-weight: 600 !important; color: var(--ko-gold-text) !important; text-decoration: none; border: 1px solid var(--ko-gold-border); background: var(--ko-gold-bg); box-shadow: var(--ko-gold-shadow); overflow: hidden; transition: transform .2s ease, box-shadow .3s ease; } /* --- geometria: przycisk w tresci --- */ .golden-custom-buttons{ width: fit-content; padding: 10px 26px; border-radius: 28px; font-size: 18px; } /* --- geometria: Dodaj do koszyka --- 52px / promien 12px = dopasowanie do pola ilosci, ktore stylowane jest przez wtyczke itper-wapf-price-fixer. Selektor ma wyzsza specyficznosc niz woocommerce.css (0,3,1 > 0,2,1), dzieki czemu nie trzeba tu zadnego !important. */ .single-product form.cart .single_add_to_cart_button{ flex: 1 1 auto; height: 52px; margin: 0; padding: 0 24px; border-radius: 12px; font-size: 16px; } /* --- geometria: box "Suma calkowita" --- HTML i CSS tego boxu wstrzykuje wtyczka itper-wapf-price-fixer (itper-wapf-script.js). Tlo i obramowanie ustawia tam z !important, wiec te dwie wlasciwosci musza byc nadpisane tak samo; reszta wygrywa sama specyficznoscia (1,2,0 > 1,1,0). */ .single-product #itper-fixed-total-box.itper-premium-totals{ justify-content: space-between; gap: 24px; height: 52px; margin: 0; padding: 0 24px; border-radius: 12px; font-size: 16px; background: var(--ko-gold-bg) !important; border: 1px solid var(--ko-gold-border) !important; } /* box nie jest klikalny - bez unoszenia przy najechaniu */ .single-product #itper-fixed-total-box.itper-premium-totals:hover{ transform: none; box-shadow: var(--ko-gold-shadow); } .single-product #itper-fixed-total-box .itper-label{ font-family: "Montserrat", sans-serif; font-size: 13px; font-weight: 600; letter-spacing: .10em; text-transform: uppercase; color: var(--ko-gold-text); opacity: .75; } .single-product #itper-fixed-total-box .itper-price{ font-family: "Montserrat", sans-serif; font-size: 18px; font-weight: 700; letter-spacing: .02em; color: var(--ko-gold-text); white-space: nowrap; } /* dekoracyjna kreska pod kwota - zbedna na zlotym tle */ .single-product #itper-fixed-total-box .itper-price::after{ display: none; } /* ============================================ UKLAD SEKCJI ZAKUPU "Suma calkowita" i wiersz [ilosc + przycisk] jeden pod drugim, szerokosc dopasowana do tresci - nie na cala szerokosc sekcji. Kalkulator WAPF zostaje pelnej szerokosci. ============================================ */ .single-product .woocommerce-variation-add-to-cart, .single-product form.cart:not(.variations_form){ display: flex; flex-direction: column; align-items: flex-start; gap: 16px; } .single-product .woocommerce-variation-add-to-cart > .wapf, .single-product form.cart:not(.variations_form) > .wapf{ align-self: stretch; } /* kolejnosc niezalezna od tego, gdzie wtyczka wstrzyknie box w DOM */ .single-product #itper-fixed-total-box.itper-premium-totals{ order: 1; } .single-product .itper-action-wrapper{ order: 2; } /* obie ramki rownej szerokosci, ale ograniczone do tresci */ .single-product #itper-fixed-total-box.itper-premium-totals, .single-product .itper-action-wrapper{ flex: 0 0 auto; width: fit-content; min-width: min(320px, 100%); max-width: 100%; margin: 0; } /* --- polysk przesuwajacy sie przy najechaniu --- */ .golden-custom-buttons::before, .single-product .ko-swatch-toggle::before, .term-description details:not(.faq__item) > summary::before, .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button::before, form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt::before, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt::before, .single-product form.cart .single_add_to_cart_button::before{ content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; background: var(--ko-gold-shine); transform: skewX(-20deg); transition: left .6s ease; pointer-events: none; } .golden-custom-buttons:hover::before, .single-product .ko-swatch-toggle:hover::before, .term-description details:not(.faq__item) > summary:hover::before, .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button:hover::before, form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt:hover::before, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt:hover::before, .single-product form.cart .single_add_to_cart_button:hover::before{ left: 120%; } .golden-custom-buttons:hover, .single-product .ko-swatch-toggle:hover, .term-description details:not(.faq__item) > summary:hover, .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button:hover, form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt:hover, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt:hover, .single-product form.cart .single_add_to_cart_button:hover{ transform: translateY(-1px); box-shadow: var(--ko-gold-shadow-hover); } .golden-custom-buttons:active, .single-product .ko-swatch-toggle:active, .term-description details:not(.faq__item) > summary:active, .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button:active, form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt:active, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt:active, .single-product form.cart .single_add_to_cart_button:active{ transform: translateY(1px); } /* --- stan nieaktywny: wariant jeszcze nie wybrany --- */ .single-product form.cart .single_add_to_cart_button.disabled, .single-product form.cart .single_add_to_cart_button:disabled{ opacity: .45; cursor: not-allowed; transform: none; box-shadow: var(--ko-gold-shadow); } .single-product form.cart .single_add_to_cart_button.disabled::before, .single-product form.cart .single_add_to_cart_button:disabled::before{ display: none; } /* ============================================ Obrazek w ksztalcie arkady ============================================ */ .arch-image{ position:relative; width:300px; height:300px; overflow:hidden; padding:4px; border-radius:500px 500px 0 0; border: 1px solid #B2976A; } .arch-image img{ width:100%; height:100%; object-fit:cover; display:block; border-radius:496px 496px 0 0 !important; } .arch-image::before{ content:""; position:absolute; top:4px; left:-60%; width:40%; height:calc(100% - 4px); background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.2) 45%, rgba(255,255,255,.55) 50%, rgba(255,255,255,.2) 55%, transparent 100% ); transform:skewX(-18deg); transition:left .8s ease; pointer-events:none; } .arch-image:hover::before{ left:120%; } /* USUNIETO 2026-08-17: .single-product .woocommerce-variation-add-to-cart .itper-action-wrapper > * { width:100% !important; display:block !important; } Regula nic nie wnosila (oba dzieci wrappera i tak sa elementami flex, wiec width/display byly neutralizowane przez flex-basis i blokifikacje), a jednoczesnie kasowala display:flex przycisku, przez co etykieta nie byla centrowana w pionie. */ /* ============================================ Checkout: nowy layout "Twoje zamowienie" v3 Pelny layout divowy zamiast tabeli Wszystkie metadane widoczne, ilosc przy nazwie, cena pod metadanymi. ============================================ */ .okno-review-order { font-family: inherit; color: #111; font-size: 15px; line-height: 1.45; } /* --- Produkty --- */ .okno-review-products { padding: 4px 0; } .okno-review-item { display: flex; align-items: flex-start; gap: 14px; padding: 18px 0; border-bottom: 1px solid rgba(0,0,0,0.06); } .okno-review-item:last-child { border-bottom: none; } .okno-review-item__img { flex: 0 0 56px; } .okno-review-item__img img { width: 56px; height: 56px; object-fit: cover; border-radius: 10px; display: block; border: 1px solid rgba(0,0,0,0.08); background: #fff; } .okno-review-item__body { flex: 1 1 auto; min-width: 0; padding-top: 2px; } .okno-review-item__name { font-weight: 600; font-size: 16px; line-height: 1.4; color: #111; word-break: normal; overflow-wrap: break-word; } .okno-review-item__name .okno-review-item__qty { font-weight: 700; color: #555; margin-left: 4px; font-size: 15px; } /* Kompaktowe metadane – wszystko widoczne */ .okno-review-item__meta { margin-top: 6px; font-size: 12px; color: #777; } .okno-review-item__meta dl.variation { display: flex; flex-wrap: wrap; gap: 2px 12px; margin: 0; } .okno-review-item__meta dl.variation dt { display: inline; font-weight: 400; margin: 0; color: #888; } .okno-review-item__meta dl.variation dt::after { content: ":"; } .okno-review-item__meta dl.variation dd { display: inline; margin: 0; color: #555; font-weight: 500; } .okno-review-item__meta dl.variation dd p { display: inline; margin: 0; } /* Wskazowki cenowe i wartosci Auto – mniejsze i wyszarzone, ale widoczne */ .okno-review-item__meta .wapf-pricing-hint, .okno-review-item__meta .okno-meta-auto { font-size: 11px; color: #999; font-weight: 400; } /* Cena produktu – pod metadanymi */ .okno-review-item__price { margin-top: 8px; font-weight: 700; font-size: 16px; color: #111; white-space: nowrap; } /* --- Separator --- */ .okno-review-divider { height: 1px; background: rgba(0,0,0,0.10); margin: 6px 0 10px; } /* --- Podsumowanie --- */ .okno-review-summary { padding: 4px 0 8px; } .okno-review-line { display: flex; justify-content: space-between; align-items: center; padding: 5px 0; font-size: 15px; line-height: 1.4; } .okno-review-line__label { color: #444; padding-right: 12px; } .okno-review-line__value { font-weight: 500; text-align: right; white-space: nowrap; } /* Total */ .okno-review-line--total { border-top: 1px solid rgba(0,0,0,0.12); margin-top: 8px; padding-top: 12px; font-size: 16px; } .okno-review-line--total .okno-review-line__label, .okno-review-line--total .okno-review-line__value { font-weight: 700; } /* Kupon: czerwony tekst */ .okno-review-line--coupon .okno-review-line__value { color: #d32f2f; } /* Wysylka */ .okno-review-line--shipping { align-items: flex-start; } .okno-review-line--shipping .okno-review-line__label { padding-top: 2px; } .okno-review-line--shipping .okno-review-line__value { white-space: normal; } /* Lista metod wysylki – przebicie domyslnych styli WooCommerce */ body .okno-review-order ul#shipping_method, body .okno-review-order .woocommerce-shipping-methods { list-style: none !important; margin: 0 !important; padding: 0 !important; background: transparent !important; border: none !important; box-shadow: none !important; } body .okno-review-order ul#shipping_method li, body .okno-review-order .woocommerce-shipping-methods li { display: flex !important; align-items: center !important; gap: 8px !important; padding: 4px 0 !important; margin: 0 !important; justify-content: flex-end !important; background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; } body .okno-review-order ul#shipping_method li input[type="radio"], body .okno-review-order .woocommerce-shipping-methods li input[type="radio"] { margin: 0 6px 0 0 !important; width: 16px !important; min-width: 16px !important; height: 16px !important; min-height: 16px !important; flex: 0 0 16px !important; vertical-align: middle !important; transform: none !important; accent-color: #2ea95a !important; cursor: pointer !important; } body .okno-review-order ul#shipping_method li label, body .okno-review-order .woocommerce-shipping-methods li label { font-size: 14px !important; line-height: 1.3 !important; color: #111 !important; font-weight: 500 !important; cursor: pointer !important; padding: 0 !important; margin: 0 !important; background: transparent !important; border: none !important; border-radius: 0 !important; box-shadow: none !important; width: auto !important; display: inline !important; vertical-align: middle !important; } body .okno-review-order ul#shipping_method li label .amount, body .okno-review-order .woocommerce-shipping-methods li label .amount { font-weight: 700 !important; margin-left: 4px !important; } /* Mobile */ @media (max-width: 767px) { .okno-review-item { gap: 10px; padding: 14px 0; } .okno-review-item__img { flex: 0 0 48px; } .okno-review-item__img img { width: 48px; height: 48px; } .okno-review-item__name { font-size: 15px; } .okno-review-item__meta { font-size: 11px; } .okno-review-item__price { font-size: 15px; margin-top: 6px; } .okno-review-line { font-size: 14px; padding: 4px 0; } .okno-review-line--total { font-size: 15px; padding-top: 10px; } /* Na mobile metody wysylki wyrownane do lewej */ body .okno-review-order ul#shipping_method li, body .okno-review-order .woocommerce-shipping-methods li { justify-content: flex-start !important; } } /* ============================================ SEKCJA WARIANTOW (probki koloru) Wtyczka: woo-variation-swatches, styl "squared". Zwijaniem steruje snippet Elementora #674 - dodaje klasy .ko-is-collapsible / .ko-collapsed i tworzy przycisk .ko-swatch-toggle. Snippet nie dostarcza zadnego CSS, wiec caly wyglad jest tutaj. ============================================ */ :root{ --ko-swatch-size: 48px; /* miniatury z wtyczki maja 50x50 - powyzej tego rozmyja sie */ --ko-swatch-gap: 8px; --ko-swatch-rows: 2; /* ile rzedow widac po zwinieciu */ } /* Siatka o stalej wysokosci rzedu - dzieki temu "2 rzedy" to zawsze dokladnie 2 rzedy, niezaleznie od marginesow wtyczki. */ .single-product .variations_form ul.variable-items-wrapper{ display: grid; grid-template-columns: repeat(auto-fill, var(--ko-swatch-size)); grid-auto-rows: var(--ko-swatch-size); gap: var(--ko-swatch-gap); justify-content: start; margin: 0; /* 8px zapasu dookola, zeby powiekszony kafelek nie byl przycinany */ padding: 8px; box-sizing: border-box; list-style: none; } /* Kwadratowy kafelek wypelniajacy komorke siatki */ .single-product .variations_form ul.variable-items-wrapper li.variable-item{ width: 100%; height: 100%; min-width: 0; min-height: 0; margin: 0; padding: 0; border-radius: 3px; overflow: hidden; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; } .single-product .variations_form ul.variable-items-wrapper li.variable-item .variable-item-contents, .single-product .variations_form ul.variable-items-wrapper li.variable-item img.variable-item-image{ width: 100%; height: 100%; margin: 0; display: block; object-fit: cover; } /* Powiekszenie po najechaniu. transform nie rusza ukladu siatki, wiec sasiednie kafelki nie skacza. */ .single-product .variations_form ul.variable-items-wrapper li.variable-item:hover, .single-product .variations_form ul.variable-items-wrapper li.variable-item:focus-visible{ transform: scale(1.28); box-shadow: 0 6px 16px rgba(40,30,15,.28); position: relative; z-index: 3; } /* Wybrany kolor - zloty pierscien spojny z reszta */ .single-product .variations_form ul.variable-items-wrapper li.variable-item.selected{ outline: 2px solid var(--ko-gold-border); outline-offset: 2px; z-index: 2; } /* --- zwijanie do 2 rzedow --- */ .single-product .variations_form ul.variable-items-wrapper.ko-is-collapsible{ transition: max-height .45s cubic-bezier(.4, 0, .2, 1); /* MUSI byc 'hidden', nie 'clip'. Przy 'clip' element nie jest kontenerem przewijania, wiec scrollHeight zwraca wysokosc przycieta - a snippet #674 wlasnie z scrollHeight wylicza docelowa wysokosc rozwiniecia. Zapas na hover daje padding wrappera. */ overflow: hidden; } /* Snippet #674 wpisuje inline max-height:160px (stala z czasow mniejszych kafelkow). Musimy ja nadpisac, a inline style bije zwykla regule - stad wyjatkowo !important, tylko na tej jednej wlasciwosci. */ .single-product .variations_form ul.variable-items-wrapper.ko-collapsed{ max-height: calc( var(--ko-swatch-rows) * var(--ko-swatch-size) + (var(--ko-swatch-rows) - 1) * var(--ko-swatch-gap) + 16px /* padding wrappera: 8px gora + 8px dol */ ) !important; } /* --- przycisk "Pokaz wszystkie" / "Zwin kolory" --- */ .single-product .ko-swatch-toggle{ margin-top: 14px; height: 44px; padding: 0 22px; border-radius: 12px; font-size: 15px; cursor: pointer; } /* ============================================ KALKULATOR WAPF - konfigurator na karcie produktu Wtyczka renderuje surowe pola i nie dostarcza wygladu. Markup: .wapf > .wapf-wrapper > .wapf-field-group > .wapf-field-container.wapf-field-{p|radio|number} > .wapf-field-label > label > span (+ abbr.required) > .wapf-field-input > .wapf-radios > .wapf-radio(.wapf-checked) > label.wapf-input-label > input.wapf-input + span.wapf-custom + span.wapf-label-text ============================================ */ :root{ --ko-calc-bg: linear-gradient(180deg, #f7f0e2 0%, #ebdec6 100%); --ko-calc-border: rgba(145,120,80,.34); --ko-calc-line: rgba(145,120,80,.26); --ko-calc-field: #faf6ee; --ko-calc-text: #3a3128; --ko-calc-muted: #8a7a5f; --ko-calc-radius: 22px; } /* --- karta --- */ .single-product .wapf > .wapf-wrapper{ background: var(--ko-calc-bg); border: 1px solid var(--ko-calc-border); border-radius: var(--ko-calc-radius); padding: 26px 28px; box-shadow: inset 0 1px 2px rgba(255,255,255,.8), 0 10px 28px rgba(40,30,15,.10); color: var(--ko-calc-text); } /* --- wiersz pola: cienka linia oddzielajaca --- */ .single-product .wapf .wapf-field-container + .wapf-field-container{ margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--ko-calc-line); } /* --- etykieta pola --- */ .single-product .wapf .wapf-field-label label{ display: block; margin: 0 0 10px; font-family: "Playfair Display", Georgia, serif; font-size: 16px; font-weight: 700; line-height: 1.3; color: var(--ko-calc-text); } .single-product .wapf .wapf-field-label abbr.required{ border: 0; text-decoration: none; color: #b08a3e; margin-left: 2px; } .single-product .wapf .wapf-pricing-hint{ font-weight: 400; font-size: 13px; color: var(--ko-calc-muted); } /* --- pierwszy blok tekstowy pelni role tytulu karty --- */ .single-product .wapf .wapf-field-container.wapf-field-p:first-child .wapf-field-label label{ font-size: 22px; margin-bottom: 4px; } .single-product .wapf .wapf-field-container.wapf-field-p .wapf-field-input:empty, .single-product .wapf .wapf-field-container.wapf-field-p .wapf-field-input > div:empty{ display: none; } /* --- opcje jako pigulki --- */ .single-product .wapf .wapf-radios{ display: flex; flex-wrap: wrap; gap: 10px; } .single-product .wapf .wapf-radio{ margin: 0; } .single-product .wapf label.wapf-input-label{ display: inline-flex; align-items: center; gap: 10px; margin: 0; padding: 10px 18px; border-radius: 999px; background: var(--ko-calc-field); border: 1px solid rgba(145,120,80,.30); box-shadow: inset 0 1px 2px rgba(255,255,255,.85), 0 1px 2px rgba(90,70,40,.08); font-family: "Playfair Display", Georgia, serif; font-size: 13px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--ko-calc-text); cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; } .single-product .wapf label.wapf-input-label:hover{ transform: translateY(-1px); border-color: rgba(145,120,80,.55); box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 4px 10px rgba(90,70,40,.14); } /* natywny radio chowamy, ale zostaje dostepny dla klawiatury i czytnikow */ .single-product .wapf label.wapf-input-label input.wapf-input{ position: absolute; width: 1px; height: 1px; opacity: 0; margin: 0; pointer-events: none; } /* kolko wskaznika - wtyczka zostawia na nie pusty */ .single-product .wapf label.wapf-input-label .wapf-custom{ flex: 0 0 15px; width: 15px; height: 15px; border-radius: 50%; background: #fff; border: 1px solid rgba(120,80,20,.45); box-shadow: inset 0 1px 2px rgba(90,70,40,.18); transition: background .18s ease, border-color .18s ease; } .single-product .wapf .wapf-radio.wapf-checked .wapf-custom{ background: var(--ko-gold-bg); border-color: var(--ko-gold-border); box-shadow: inset 0 1px 2px rgba(255,255,255,.6); } .single-product .wapf .wapf-radio.wapf-checked label.wapf-input-label{ border-color: var(--ko-gold-border); box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 3px 10px rgba(120,80,20,.20); } /* obrys przy nawigacji klawiatura */ .single-product .wapf label.wapf-input-label input.wapf-input:focus-visible + .wapf-custom{ outline: 2px solid var(--ko-gold-border); outline-offset: 2px; } /* --- pola liczbowe i tekstowe --- */ .single-product .wapf .wapf-field-input input.wapf-input[type="number"], .single-product .wapf .wapf-field-input input.wapf-input[type="text"], .single-product .wapf .wapf-field-input select{ box-sizing: border-box; width: 100%; height: 52px; padding: 0 20px; border-radius: 999px; background: var(--ko-calc-field); border: 1px solid rgba(145,120,80,.30); box-shadow: inset 0 2px 4px rgba(90,70,40,.10); font-size: 15px; color: var(--ko-calc-text); transition: border-color .18s ease, box-shadow .18s ease; } .single-product .wapf .wapf-field-input input.wapf-input[type="number"]:focus, .single-product .wapf .wapf-field-input input.wapf-input[type="text"]:focus, .single-product .wapf .wapf-field-input select:focus{ outline: none; border-color: var(--ko-gold-border); box-shadow: inset 0 2px 4px rgba(90,70,40,.10), 0 0 0 3px rgba(200,155,60,.22); } .single-product .wapf .wapf-field-input input.wapf-input::placeholder{ color: var(--ko-calc-muted); opacity: .85; } /* --- ramka informacyjna (np. "Informacja o przelotkach") --- */ .single-product .wapf .ko-przelotki-info{ padding: 12px 16px; border-radius: 12px; background: rgba(255,255,255,.6); border: 1px dashed var(--ko-calc-border); font-size: 14px; line-height: 1.5; color: var(--ko-calc-muted); } .single-product .wapf .ko-przelotki-info strong{ color: var(--ko-calc-text); } /* --- pola kosztowe "Auto" (klasa ko-auto nadana w grupie WAPF) - licza cene, ale klient ich nie widzi --- */ .single-product .wapf .wapf-field-container.ko-auto{ display: none !important; } /* --- checkboxy (np. "Dodatki do Wave") - te same pigulki co radio, wskaznik kwadratowy --- */ .single-product .wapf .wapf-checkboxes{ display: flex; flex-wrap: wrap; gap: 10px; } .single-product .wapf .wapf-checkbox{ margin: 0; } .single-product .wapf .wapf-checkbox label.wapf-input-label .wapf-custom{ border-radius: 4px; } .single-product .wapf .wapf-checkbox:has(input.wapf-input:checked) .wapf-custom{ background: var(--ko-gold-bg); border-color: var(--ko-gold-border); box-shadow: inset 0 1px 2px rgba(255,255,255,.6); } .single-product .wapf .wapf-checkbox:has(input.wapf-input:checked) label.wapf-input-label{ border-color: var(--ko-gold-border); box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 3px 10px rgba(120,80,20,.20); } /* --- kafelki z obrazkiem (pole "image swatch", np. "Typ zawieszenia") --- Markup: .wapf-image-swatch-wrapper > .wapf-swatch.wapf-swatch--image(.wapf-checked) > label > input[type=radio] + div.apf-pick-box > img + div.wapf-swatch-label (nazwe przenosimy nad obrazek) */ .single-product .wapf .wapf-image-swatch-wrapper{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } /* dokladnie 4 kafelki (pierwsze dziecko to ukryty input) -> jeden rzad */ .single-product .wapf .wapf-image-swatch-wrapper:has(> .wapf-swatch:nth-child(5)):not(:has(> .wapf-swatch:nth-child(6))){ grid-template-columns: repeat(4, minmax(0, 1fr)); } .single-product .wapf .wapf-swatch--image{ width: auto; margin: 0; overflow: visible; } .single-product .wapf .wapf-swatch--image label{ display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 10px 10px 12px; border-radius: 16px; background: var(--ko-calc-field); border: 1px solid rgba(145,120,80,.30); box-shadow: inset 0 1px 2px rgba(255,255,255,.85), 0 1px 2px rgba(90,70,40,.08); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; } .single-product .wapf .wapf-swatch--image label:hover{ transform: translateY(-1px); border-color: rgba(145,120,80,.55); box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 4px 10px rgba(90,70,40,.14); } .single-product .wapf .wapf-swatch--image .wapf-swatch-label{ order: -1; flex: 1 1 auto; /* dluga nazwa nie spycha obrazka - obrazki w rzedzie rowno */ display: flex; flex-direction: column; justify-content: center; min-height: 2.6em; padding: 0; font-family: "Playfair Display", Georgia, serif; font-size: 12px; font-weight: 600; line-height: 1.3; letter-spacing: .03em; text-transform: uppercase; color: var(--ko-calc-text); } .single-product .wapf .wapf-swatch--image .wapf-swatch-label .wapf-pricing-hint{ font-size: 11px; letter-spacing: 0; text-transform: none; } .single-product .wapf .wapf-swatch--image .apf-pick-box{ border: 0; border-radius: 10px; overflow: hidden; line-height: 0; } .single-product .wapf .wapf-swatch--image img{ display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; margin: 0; } .single-product .wapf .wapf-swatch--image.wapf-checked label{ border-color: var(--ko-gold-border); box-shadow: inset 0 0 0 1px var(--ko-gold-border), 0 3px 10px rgba(120,80,20,.20); } /* zlota kreska pod nazwa zaznaczonego typu */ .single-product .wapf .wapf-swatch--image.wapf-checked .wapf-swatch-label::after{ content: ""; display: block; width: 28px; height: 2px; margin: 5px auto 0; border-radius: 2px; background: var(--ko-gold-bg); } .single-product .wapf .wapf-swatch--image input:focus-visible ~ .apf-pick-box{ outline: 2px solid var(--ko-gold-border); outline-offset: 2px; } /* --- waskie ekrany --- */ @media (max-width: 767px){ .single-product .wapf > .wapf-wrapper{ padding: 20px 18px; border-radius: 18px; } .single-product .wapf label.wapf-input-label{ padding: 9px 14px; font-size: 12px; } .single-product .wapf .wapf-image-swatch-wrapper, .single-product .wapf .wapf-image-swatch-wrapper:has(> .wapf-swatch:nth-child(5)):not(:has(> .wapf-swatch:nth-child(6))){ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .single-product .wapf .wapf-swatch--image .wapf-swatch-label{ font-size: 11px; } } /* ============================================ CENA, LINK "WYCZYSC" I LISTA INFORMACJI ============================================ */ /* --- cena produktu --- Elementor ustawia kolor i font na .price (regula o specyficznosci 0,5,0). Zamiast z nia walczyc, stylujemy element potomny .woocommerce-Price-amount - regula bezposrednia zawsze wygrywa z dziedziczeniem, wiec obywa sie bez !important. Kolor zostaje odziedziczony z ustawien Elementora. */ .single-product .elementor-widget-woocommerce-product-price .price .woocommerce-Price-amount, .single-product .woocommerce-variation-price .price .woocommerce-Price-amount{ font-family: "Playfair Display", Georgia, serif; font-size: 36px; font-weight: 700; line-height: 1.15; letter-spacing: .01em; } .single-product .elementor-widget-woocommerce-product-price .price .woocommerce-Price-currencySymbol, .single-product .woocommerce-variation-price .price .woocommerce-Price-currencySymbol{ font-size: .58em; font-weight: 600; margin-left: .1em; } /* cena przekreslona przy promocji */ .single-product .elementor-widget-woocommerce-product-price .price del .woocommerce-Price-amount{ font-size: 22px; font-weight: 500; opacity: .55; } /* --- link "Wyczysc" pod probkami --- WooCommerce renderuje goly , stad domyslny wyglad linku. Robimy z niego dyskretny, drugoplanowy przycisk. */ .single-product .variations_form a.reset_variations{ display: inline-flex; align-items: center; gap: 7px; margin-top: 12px; padding: 7px 15px; border-radius: 999px; background: rgba(255,255,255,.55); border: 1px solid rgba(145,120,80,.32); font-family: "Playfair Display", Georgia, serif; font-size: 12px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; line-height: 1; color: var(--ko-calc-muted); text-decoration: none; transition: color .18s ease, border-color .18s ease, background .18s ease, transform .18s ease; } .single-product .variations_form a.reset_variations::before{ content: "\00d7"; /* znak x */ font-size: 15px; line-height: 1; font-weight: 700; } .single-product .variations_form a.reset_variations:hover, .single-product .variations_form a.reset_variations:focus-visible{ color: var(--ko-calc-text); background: #fff; border-color: var(--ko-gold-border); transform: translateY(-1px); text-decoration: none; } /* --- lista informacji nad kalkulatorem --- Widget listy ikon 0de7c19 z szablonu "Pojedynczy produkt" (469). Celowo po ID widgetu, zeby nie ruszyc list ikon w naglowku i stopce, ktore tez wystepuja na karcie produktu. */ .single-product .elementor-widget-icon-list.elementor-element-0de7c19 ul.elementor-icon-list-items{ margin: 0; padding: 6px; list-style: none; background: linear-gradient(180deg, rgba(255,255,255,.60) 0%, rgba(247,240,226,.60) 100%); border: 1px solid var(--ko-calc-line); border-radius: 14px; } .single-product .elementor-element-0de7c19 .elementor-icon-list-item{ border-radius: 10px; transition: background .18s ease; } .single-product .elementor-element-0de7c19 .elementor-icon-list-item + .elementor-icon-list-item{ border-top: 1px solid var(--ko-calc-line); } .single-product .elementor-widget-icon-list.elementor-element-0de7c19 ul.elementor-icon-list-items > li.elementor-icon-list-item > a, .single-product .elementor-widget-icon-list.elementor-element-0de7c19 ul.elementor-icon-list-items > li.elementor-icon-list-item > span{ padding: 9px 12px; } .single-product .elementor-element-0de7c19 .elementor-icon-list-item:hover{ background: rgba(255,255,255,.85); } .single-product .elementor-element-0de7c19 .elementor-icon-list-icon svg{ transition: transform .18s ease; } .single-product .elementor-element-0de7c19 .elementor-icon-list-item:hover .elementor-icon-list-icon svg{ transform: scale(1.12); } /* ============================================ DOSTEPNOSC ("Na stanie" / "Brak w magazynie") WooCommerce renderuje

, bez zadnego wygladu. ============================================ */ .single-product p.stock{ display: inline-flex; align-items: center; gap: 8px; margin: 0 0 18px; /* odstep gorny daje .single_variation_wrap - patrz nizej */ padding: 7px 14px; border-radius: 999px; border: 1px solid; font-family: "Playfair Display", Georgia, serif; font-size: 12px; font-weight: 600; line-height: 1; letter-spacing: .07em; text-transform: uppercase; } /* Odstep miedzy probkami a tym, co pod nimi, sterowany z JEDNEGO miejsca. WooCommerce dawal tabeli wariantow margin-bottom:1em (~15px), co sumowalo sie z marginesem plakietki i dawalo 33px u gory przy 18px u dolu. Teraz: 18px nad blokiem i 18px pod plakietka - rowno, i tak samo dziala zanim klient wybierze kolor (gdy plakietki jeszcze nie ma). */ .single-product .variations_form table.variations{ margin-bottom: 0; } .single-product .variations_form .single_variation_wrap{ margin-top: 18px; } .single-product .woocommerce-variation-availability, .single-product .woocommerce-variation.single_variation{ margin: 0; padding: 0; } .single-product p.stock::before{ content: ""; width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; } .single-product p.stock.in-stock{ color: #3d6b45; background: rgba(96,150,105,.12); border-color: rgba(96,150,105,.35); } .single-product p.stock.in-stock::before{ background: #5f9469; box-shadow: 0 0 0 3px rgba(96,150,105,.18); } .single-product p.stock.out-of-stock{ color: #8a4b3f; background: rgba(160,90,75,.10); border-color: rgba(160,90,75,.32); } .single-product p.stock.out-of-stock::before{ background: #a85f4f; } .single-product p.stock.available-on-backorder{ color: var(--ko-calc-muted); background: rgba(255,255,255,.60); border-color: var(--ko-calc-line); } .single-product p.stock.available-on-backorder::before{ background: #b08a3e; } /* ============================================ KOLOR CEN - globalnie zloty Ceny w listingu, koszyku i widgetach dziedziczyly kolor tekstu (czarny / szary). Ustawiamy jeden kolor marki w calym sklepie. Kolor bierzemy z ustawien Elementora dla ceny produktu (#B19566), zeby karta produktu i reszta sklepu mowily tym samym glosem. ============================================ */ :root{ --ko-price: #B19566; } .woocommerce-Price-amount, .woocommerce .price, .woocommerce p.price, .woocommerce span.price, .woocommerce-variation-price .price, .wc-block-components-product-price{ color: var(--ko-price); } /* stara cena przy promocji - ten sam zloty, tylko przygaszony */ .woocommerce del, .woocommerce del .woocommerce-Price-amount{ color: var(--ko-price); opacity: .55; } /* Widget koszyka Elementora koloruje kwoty wlasnymi zmiennymi (--order-summary-color / --totals-color) o specyficznosci 303 i 502. Celujemy wprost w same kwoty, zeby etykiety ("Suma czesciowa", "Wysylka") zachowaly swoj kolor. UWAGA: strona koszyka NIE ma klasy .woocommerce na , wiec selektor nie moze sie od niej zaczynac - klasa .woocommerce jest dopiero wewnatrz widgetu. */ .elementor-widget-woocommerce-cart .woocommerce table.cart td span.woocommerce-Price-amount, .elementor-widget-woocommerce-cart .woocommerce .cart_totals table.shop_table td span.woocommerce-Price-amount{ color: var(--ko-price); } /* WYJATEK: wlasny layout "Twoje zamowienie" w koszyku ma swoja kolorystyke (ciemny tekst na jasnym tle) - zostawiamy bez zmian. */ .okno-review-order .woocommerce-Price-amount, .okno-review-order .price{ color: inherit; opacity: 1; } /* WYJATEK: kwota w zlotym boxie "Suma calkowita" musi zostac ciemna, bo lezy na zlotym gradiencie. */ .single-product #itper-fixed-total-box .itper-price{ color: var(--ko-gold-text); } /* ============================================ ZAKLADKI PRODUKTU (Szczegoly / Pielegnacja / Cechy) Markup: .woocommerce-tabs.wc-tabs-wrapper > ul.tabs.wc-tabs > li > a + panele .wc-tab Wyglad przejmujemy po woocommerce.css, ktory rysuje biale zakladki z promieniem 4px i dekoracyjnymi zawijasami w ::before / ::after. Selektory maja specyficznosc 502+, bo reguly WooCommerce maja 403. ============================================ */ /* --- pasek --- */ .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs{ display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; overflow: visible; border-bottom: 1px solid var(--ko-calc-border); } /* WooCommerce rysuje linie paska wlasnym ::before - zastapiona przez border-bottom */ .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs::before{ display: none; } /* --- pojedyncza zakladka: czyscimy domyslne tlo, ramki i zawijasy --- */ .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li{ margin: 0; padding: 0; background: none; border: 0; border-radius: 0; z-index: auto; } .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li::before, .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li::after{ display: none; } .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li > a{ display: block; margin-bottom: -1px; /* zakladka nachodzi na linie paska */ padding: 11px 20px; border: 1px solid var(--ko-calc-border); border-radius: 12px 12px 0 0; background: linear-gradient(180deg, rgba(255,255,255,.70) 0%, rgba(247,240,226,.70) 100%); font-family: "Playfair Display", Georgia, serif; font-size: 15px; font-weight: 600; line-height: 1.2; color: var(--ko-calc-muted); text-decoration: none; text-shadow: none; transition: color .18s ease, background .18s ease, box-shadow .18s ease; } .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li > a:hover{ color: var(--ko-calc-text); background: #fff; } /* --- zakladka aktywna: zloto jak przycisk koszyka --- */ .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li.active > a{ background: var(--ko-gold-bg); border-color: var(--ko-gold-border); color: var(--ko-gold-text); box-shadow: inset 0 1px 2px rgba(255,255,255,.70), 0 -2px 8px rgba(120,80,20,.12); } .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li > a:focus-visible{ outline: 2px solid var(--ko-gold-border); outline-offset: 2px; } /* --- panele --- */ .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab{ padding: 24px 0 4px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab > h2:first-child{ margin-top: 0; } /* Przejscie miedzy panelami. Snippet Elementora #672 dodaje klasy ko-visible / ko-active / ko-leave i czeka 380 ms, ale nie dostarcza CSS. UWAGA: nie wolno chowac panelu na .ko-visible i odslaniac na .ko-active - snippet nie zawsze zdazy dolozyc .ko-active i panel zostaje wyblakly. Dlatego panel jest domyslnie widoczny, a animujemy tylko ten schodzacy; klase .ko-leave snippet zawsze zdejmuje po 380 ms, wiec nie da sie utknac w stanie niewidocznym. */ /* Panel wchodzacy: animacja, nie przejscie. Animacja BEZ fill-mode konczy sie na wartosci z kaskady (opacity 1), wiec nawet gdy snippet nie dolozy .ko-active, panel i tak zostaje widoczny - nie da sie utknac w stanie przezroczystym. */ @keyframes ko-tab-in{ from{ opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab.ko-visible{ animation: ko-tab-in .34s ease; } /* Panel schodzacy: przejscie. Klase .ko-leave snippet zdejmuje po 380 ms. */ .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab{ transition: opacity .3s ease, transform .3s ease; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab.ko-leave{ opacity: 0; transform: translateY(-6px); } @media (prefers-reduced-motion: reduce){ .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab.ko-visible{ animation: none; transition: none; } } /* --- rytm tresci w panelach --- Jedna wartosc bazowa (24px) i jedna zageszczona (12-14px). Wczesniej .ko-text mial margin:32px ze WSZYSTKICH stron (functions.php), przez co pierwszy blok byl wciety, a akapit ponizej szedl na pelna szerokosc. */ .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab .ko-text, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab .ko-more{ margin: 0; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h2, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h3{ margin: 24px 0 12px; line-height: 1.25; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab > *:first-child > *:first-child > *:first-child > :is(h2,h3):first-child, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab :is(h2,h3):first-child{ margin-top: 0; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab p{ margin: 0 0 14px; line-height: 1.65; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab p:last-child{ margin-bottom: 0; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab ul, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab ol{ margin: 0; padding-left: 22px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab li{ margin: 0 0 9px; line-height: 1.6; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab li:last-child{ margin-bottom: 0; } /* --- typografia paneli: jak reszta sklepu --- naglowki Playfair Display (jak tytul produktu i kalkulator), tekst Lato (jak lista informacji pod cena). Wczesniej panel dziedziczyl systemowy font z body, a h2 mial 36px - odstawal od strony. */ .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab{ font-family: "Lato", sans-serif; font-size: 16px; color: #3a3128; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab :is(h2, h3, h4){ font-family: "Playfair Display", Georgia, serif; font-weight: 700; letter-spacing: .005em; color: #1f1a14; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h2{ font-size: 28px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h3{ font-size: 21px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h4{ font-size: 18px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab :is(p, li){ font-size: 16px; line-height: 1.75; color: #3a3128; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab strong{ color: #1f1a14; font-weight: 700; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab a{ color: #8a6d2f; text-decoration: underline; text-decoration-color: rgba(138,109,47,.35); text-underline-offset: 3px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab li::marker{ color: #b08a3e; } /* --- waskie ekrany --- */ @media (max-width: 600px){ .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h2{ font-size: 24px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h3{ font-size: 19px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab :is(p, li){ font-size: 15px; } .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs{ gap: 4px; } .single-product .woocommerce-tabs.wc-tabs-wrapper ul.tabs.wc-tabs li > a{ padding: 9px 13px; font-size: 13px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab{ padding: 18px 0 2px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h2, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab h3{ margin: 20px 0 10px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab p{ margin-bottom: 12px; } .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab ul, .single-product .woocommerce-tabs.wc-tabs-wrapper .wc-tab ol{ padding-left: 20px; } } /* ============================================ PARAMETRY TKANINY - zwijane sekcje Shortcode [tkanina_parametry] renderuje teraz

z . Sekcje startuja zwiniete, zeby box nie zajmowal pol ekranu. Wyglad samego boxa zostaje z functions.php. ============================================ */ .tkanina-box details.tkanina-section > summary.tkanina-title{ display: block; /* zdejmuje domyslny marker listy */ list-style: none; cursor: pointer; padding-right: 34px; /* miejsce na strzalke */ user-select: none; transition: color .18s ease; } .tkanina-box details.tkanina-section > summary.tkanina-title::-webkit-details-marker{ display: none; } .tkanina-box details.tkanina-section > summary.tkanina-title:hover{ color: #7a5c22; } .tkanina-box details.tkanina-section > summary.tkanina-title:focus-visible{ outline: 2px solid rgba(168,132,68,.75); outline-offset: 3px; border-radius: 6px; } /* strzalka - .tkanina-title ma juz position:relative, a ::after jest zajete przez linie pod tytulem */ .tkanina-box details.tkanina-section > summary.tkanina-title::before{ content: ""; position: absolute; right: 6px; top: 9px; width: 9px; height: 9px; border-right: 2px solid rgba(168,132,68,.8); border-bottom: 2px solid rgba(168,132,68,.8); transform: rotate(45deg); transform-origin: center; transition: transform .25s ease; } .tkanina-box details.tkanina-section[open] > summary.tkanina-title::before{ transform: rotate(-135deg); } /* Plynnosc - ta sama technika co przy opisie kategorii (patrz komentarz nizej). */ .tkanina-box details.tkanina-section[open]::details-content{ animation: ko-reveal .34s ease; } .tkanina-box .tkanina-rows{ padding-top: 2px; } @media (prefers-reduced-motion: reduce){ .tkanina-box details.tkanina-section[open]::details-content{ animation: none; } .tkanina-box details.tkanina-section > summary.tkanina-title::before{ transition: none; } } /* ============================================ GALERIA PRODUKTU 1) miniatury w kolumnie po LEWEJ od glownego zdjecia 2) galeria przyklejona przy przewijaniu, do konca sekcji Markup (WooCommerce + flexslider): .woocommerce-product-gallery.images a.woocommerce-product-gallery__trigger (lupka, absolutna) div.flex-viewport > .woocommerce-product-gallery__wrapper > .__image ol.flex-control-nav.flex-control-thumbs > li > img Selektory stackuja klasy galerii, bo reguly WooCommerce (.woocommerce div.product div.images .flex-control-thumbs li) maja 403. ============================================ */ /* --- 1) uklad: miniatury z lewej (od tabletu w gore) --- */ @media (min-width: 768px){ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images{ display: flex; align-items: flex-start; gap: 14px; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .flex-viewport{ order: 2; flex: 1 1 auto; min-width: 0; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs{ order: 1; flex: 0 0 84px; display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs li{ width: 100%; float: none; margin: 0; } } /* --- wyglad miniatur (kazda szerokosc) --- */ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs{ list-style: none; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs img{ display: block; width: 100%; height: auto; border-radius: 8px; cursor: pointer; opacity: .65; transition: opacity .18s ease, box-shadow .18s ease; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs img:hover, .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs img.flex-active{ opacity: 1; box-shadow: 0 0 0 2px var(--ko-gold-border); } /* --- 2) przyklejona kolumna galerii --- Kolumna 'ce67e19' byla rozciagana na wysokosc calego rzedu (1791px przy ~850px tresci), stad pusta przestrzen pod galeria. 'align-self: flex-start' zwija ja do wysokosci tresci, a 'position: sticky' trzyma zdjecie w polu widzenia az do konca rzedu - czyli do konca sekcji z opisem obok. */ @media (min-width: 1025px){ .single-product .elementor-element-ce67e19{ position: sticky; top: 24px; align-self: flex-start; } } /* ============================================ KAFELKI KATEGORII W SKLEPIE Markup: ul.products.elementor-grid > li.product.product-category > a > img + h2.woocommerce-loop-category__title 1) grafiki z takim samym zaokragleniem co karty produktow (16px) 2) mocniej wyeksponowana nazwa kategorii ============================================ */ /* --- 1) zaokraglenie jak w kartach produktow --- .elementor img ustawia border-radius:0 (specyficznosc 101) */ .woocommerce ul.products li.product.product-category img{ border-radius: 16px; display: block; transition: box-shadow .25s ease, filter .25s ease; } .woocommerce ul.products li.product.product-category:hover img{ box-shadow: 0 12px 28px rgba(40,30,15,.18); filter: saturate(1.05); } /* --- 2) nazwa kategorii --- Elementor narzuca tu font-weight:100 i font-size:24px z szablonu archiwum (regula o specyficznosci 702), dlatego selektor stackuje 8 klas = 803. Celowo bez odwolania do ID szablonu (.elementor-817), zeby przetrwal ewentualna przebudowe szablonu. */ .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title{ margin: 16px 0 0; font-size: 26px; font-weight: 600; line-height: 1.25; letter-spacing: .01em; color: #2e2d2b; transition: color .22s ease; } /* zlota kreska pod nazwa - rozsuwa sie po najechaniu na kafelek */ .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title::after{ content: ""; display: block; width: 56px; height: 2px; margin-top: 10px; border-radius: 2px; background: linear-gradient(90deg, #b19566 0%, rgba(177,149,102,0) 100%); transition: width .28s ease; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category:hover h2.woocommerce-loop-category__title{ color: #8a6d2f; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category:hover h2.woocommerce-loop-category__title::after{ width: 104px; } @media (max-width: 767px){ .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title{ margin-top: 12px; font-size: 22px; } } /* ============================================ OPIS KATEGORII - zwijanie "Pokaz wiecej" Redaktor pisze opis tak jak dotad, natywnym
. Tutaj tylko wyglad przycisku i plynne rozwijanie - zadnej zmiany w sposobie pisania tresci. Zloty wyglad summary bierze sie ze wspolnej listy selektorow wyzej (te same zmienne --ko-gold-*, co przycisk "Dodaj do koszyka"). ============================================ */ .term-description details:not(.faq__item){ margin: 20px 0 0; } /* --- przycisk --- */ .term-description details:not(.faq__item) > summary{ display: inline-flex; align-items: center; gap: 10px; margin: 4px 0 0; padding: 11px 24px; border-radius: 999px; cursor: pointer; list-style: none; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; line-height: 1; } .term-description details:not(.faq__item) > summary::-webkit-details-marker{ display: none; } /* strzalka jako element flexa - ::before zajmuje polysk ze wspolnego skinu */ .term-description details:not(.faq__item) > summary::after{ content: ""; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .25s ease; } .term-description details[open]:not(.faq__item) > summary::after{ transform: rotate(-135deg) translateY(-1px); } .term-description details:not(.faq__item) > summary:focus-visible{ outline: 2px solid var(--ko-gold-border); outline-offset: 3px; } /* --- plynne rozwijanie --- ::details-content to wrapper tresci dodawany przez przegladarke, dzieki czemu nie trzeba zadnego dodatkowego
w tresci. */ /* PLYNNOSC: animacja tresci, NIE przejscie wysokosci. Sprawdzone na tej instalacji: dowolne 'transition' na ::details-content blokuje wejscie w stan [open] - sekcja zostaje zwinieta (42px) mimo details.open === true. Bez przejscia [open] dziala poprawnie. Dlatego wysokosc zmienia sie natychmiast, a plynnosc daje animacja @keyframes na tresci. Animacja jest BEZ fill-mode, wiec konczy sie na wartosci z kaskady - tresc nie moze zostac ukryta. */ @keyframes ko-reveal{ from{ opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } } .term-description details[open]:not(.faq__item)::details-content{ animation: ko-reveal .38s ease; } /* odstep nad rozwinieta trescia */ .term-description details[open]:not(.faq__item) > *:not(summary):first-of-type{ margin-top: 18px; } @media (prefers-reduced-motion: reduce){ .term-description details[open]:not(.faq__item)::details-content{ animation: none; } .term-description details:not(.faq__item) > summary::after{ transition: none; } } /* ============================================ PANEL BOCZNY SKLEPU - kategorie i filtry Widgety WooCommerce osadzone w akordeonach Elementora. Cala zawartosc byla surowa: systemowy font, fioletowy suwak ceny z domyslnego arkusza WooCommerce, szary przycisk "Filtruj". Klasy .ko-filters i .ko-price-filter sa juz nadane w Elementorze - wykorzystujemy je jako punkt zaczepienia. ============================================ */ :root{ --ko-panel-line: rgba(145,120,80,.22); --ko-panel-text: #3a3128; --ko-panel-muted: #8a7a5f; } /* --- naglowki akordeonow (Kategorie / Filtry) --- */ body.woocommerce-page .e-n-accordion .e-n-accordion-item-title-text{ font-family: "Playfair Display", Georgia, serif; font-size: 17px; font-weight: 600; letter-spacing: .02em; color: var(--ko-panel-text); } body.woocommerce-page .e-n-accordion .e-n-accordion-item-title{ padding-block: 4px; } body.woocommerce-page .e-n-accordion .e-n-accordion-item-title-icon svg{ width: 12px; height: 12px; fill: #b08a3e; } /* UWAGA na przyszlosc: nie nadpisywac tu 'height' ani 'overflow' na .e-n-accordion-item. Elementor animuje wysokosc
sam (400 ms), ale robi to z ok. 0,8 s opoznieniem po kliknieciu - latwo pomylic ten moment z zawieszona animacja. Wymuszenie 'height: auto !important' naprawia pozorny problem i przy okazji kasuje cala plynnosc. */ /* --- naglowki sekcji filtrow (Cena / Kolor / Sklad) --- */ .ko-filters h5, .ko-price-filter h5{ margin: 0 0 12px; font-family: "Playfair Display", Georgia, serif; font-size: 13px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--ko-panel-muted); } .ko-filters h5::after, .ko-price-filter h5::after{ content: ""; display: block; width: 34px; height: 2px; margin-top: 8px; border-radius: 2px; background: linear-gradient(90deg, #b19566 0%, rgba(177,149,102,0) 100%); } /* --- listy: kategorie i filtry atrybutow --- */ .ko-filters ul.product-categories, .ko-filters ul.woocommerce-widget-layered-nav-list{ margin: 0; padding: 0; list-style: none; } .ko-filters ul.product-categories li, .ko-filters ul.woocommerce-widget-layered-nav-list li{ margin: 0; padding: 0; list-style: none; } .ko-filters ul.product-categories li > a, .ko-filters ul.woocommerce-widget-layered-nav-list li > a{ display: block; padding: 8px 10px; border-radius: 8px; font-family: "Playfair Display", Georgia, serif; font-size: 16px; font-weight: 500; line-height: 1.3; color: var(--ko-panel-text); text-decoration: none; transition: background .18s ease, color .18s ease, padding-left .18s ease; } .ko-filters ul.product-categories li > a:hover, .ko-filters ul.woocommerce-widget-layered-nav-list li > a:hover{ background: rgba(255,255,255,.75); color: #8a6d2f; padding-left: 14px; } /* aktualnie ogladana kategoria */ .ko-filters ul.product-categories li.current-cat > a{ color: #8a6d2f; font-weight: 700; background: rgba(247,240,226,.85); box-shadow: inset 3px 0 0 var(--ko-gold-border); } /* --- podkategorie: wciecie ze zlota prowadnica --- */ .ko-filters ul.product-categories ul.children{ margin: 2px 0 6px 12px; padding-left: 12px; border-left: 1px solid var(--ko-panel-line); list-style: none; } .ko-filters ul.product-categories ul.children li > a{ font-size: 15px; color: var(--ko-panel-muted); padding: 6px 10px; } .ko-filters ul.product-categories ul.children li > a:hover{ color: #8a6d2f; } /* --- licznik przy filtrach atrybutow --- */ .ko-filters ul.woocommerce-widget-layered-nav-list li{ display: flex; align-items: center; justify-content: space-between; gap: 8px; } .ko-filters ul.woocommerce-widget-layered-nav-list li > a{ flex: 1 1 auto; } .ko-filters ul.woocommerce-widget-layered-nav-list li .count{ flex: 0 0 auto; min-width: 26px; padding: 2px 7px; border-radius: 999px; background: rgba(247,240,226,.9); border: 1px solid var(--ko-panel-line); font-family: "Playfair Display", Georgia, serif; font-size: 11px; line-height: 1.6; text-align: center; color: var(--ko-panel-muted); } /* wybrany filtr */ .ko-filters ul.woocommerce-widget-layered-nav-list li.chosen > a{ color: #8a6d2f; font-weight: 700; background: rgba(247,240,226,.85); } /* --- filtr ceny --- Suwak jQuery UI mial fabryczne fiolety WooCommerce (#7f54b3 / #35224c). */ .ko-price-filter .woocommerce.widget_price_filter .price_slider_wrapper{ padding-top: 4px; } .ko-price-filter .woocommerce.widget_price_filter .price_slider.ui-slider{ height: 6px; margin: 10px 8px 22px; border-radius: 999px; background: #efe6d4; border: 1px solid var(--ko-panel-line); box-shadow: inset 0 1px 2px rgba(90,70,40,.12); } .ko-price-filter .woocommerce.widget_price_filter .price_slider .ui-slider-range{ height: 100%; border-radius: 999px; background: var(--ko-gold-bg); } .ko-price-filter .woocommerce.widget_price_filter .price_slider .ui-slider-handle{ width: 18px; height: 18px; top: -7px; margin-left: -9px; border-radius: 50%; background: var(--ko-gold-bg); border: 1px solid var(--ko-gold-border); box-shadow: 0 2px 6px rgba(90,70,40,.28), inset 0 1px 2px rgba(255,255,255,.7); cursor: grab; transition: transform .16s ease, box-shadow .16s ease; } .ko-price-filter .woocommerce.widget_price_filter .price_slider .ui-slider-handle:hover, .ko-price-filter .woocommerce.widget_price_filter .price_slider .ui-slider-handle:focus-visible{ transform: scale(1.12); box-shadow: 0 4px 12px rgba(90,70,40,.34), inset 0 1px 2px rgba(255,255,255,.7); } .ko-price-filter .woocommerce.widget_price_filter .price_slider .ui-slider-handle:active{ cursor: grabbing; } .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount{ display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; } .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount .price_label{ order: 1; flex: 1 1 100%; margin: 0; font-family: "Playfair Display", Georgia, serif; font-size: 14px; color: var(--ko-panel-muted); text-align: left; } .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount .price_label .from, .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount .price_label .to{ font-weight: 700; color: var(--ko-price); } /* przycisk "Filtruj" - zloty wyglad ze wspolnej listy selektorow wyzej */ .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button{ order: 2; height: 40px; padding: 0 22px; border-radius: 999px; font-family: "Playfair Display", Georgia, serif; font-size: 13px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; line-height: 1; cursor: pointer; } .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount .clear{ display: none; } /* --- odstepy miedzy widgetami w akordeonie Filtry --- */ .ko-filters + .ko-filters, .ko-price-filter + .ko-filters, .ko-filters + .ko-price-filter{ margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--ko-panel-line); } /* --- MOBILE --- */ @media (max-width: 1024px){ body.woocommerce-page .e-n-accordion .e-n-accordion-item-title-text{ font-size: 16px; } .ko-filters ul.product-categories li > a, .ko-filters ul.woocommerce-widget-layered-nav-list li > a{ padding: 10px 10px; /* wieksze pole dotyku */ font-size: 15px; } .ko-filters ul.product-categories ul.children{ margin-left: 8px; padding-left: 10px; } .ko-price-filter .woocommerce.widget_price_filter .price_slider.ui-slider{ margin-bottom: 18px; } .ko-price-filter .woocommerce.widget_price_filter .price_slider .ui-slider-handle{ width: 22px; height: 22px; top: -9px; margin-left: -11px; } .ko-price-filter .woocommerce.widget_price_filter .price_slider_amount button.button{ flex: 1 1 100%; } } /* ============================================ KASA - formularz zamowienia Progi specyficznosci, ktore trzeba bylo pobic: pola formularza - 10400 (widget kasy Elementora) etykiety - 501 (styl per-element Elementora) #place_order - 20300 (2 ID; wlasny gradient 45deg Elementora) Blok "Twoje zamowienie" (.okno-review-order) celowo NIETKNIETY - ma wlasny, wczesniej zaprojektowany uklad. ============================================ */ /* --- naglowki sekcji --- */ form.checkout #customer_details .woocommerce-billing-fields > h3, form.checkout #customer_details .woocommerce-shipping-fields > h3, .woocommerce-checkout #order_review_heading{ margin: 0 0 18px; font-family: "Playfair Display", Georgia, serif; font-size: 22px; font-weight: 700; line-height: 1.25; color: var(--ko-calc-text); } form.checkout #customer_details .woocommerce-billing-fields > h3::after, .woocommerce-checkout #order_review_heading::after{ content: ""; display: block; width: 46px; height: 2px; margin-top: 10px; border-radius: 2px; background: linear-gradient(90deg, #b19566 0%, rgba(177,149,102,0) 100%); } /* --- etykiety --- */ form.checkout.woocommerce-checkout #customer_details .form-row label{ display: block; margin: 0 0 7px; font-family: "Playfair Display", Georgia, serif; font-size: 14px; font-weight: 600; letter-spacing: .01em; color: var(--ko-calc-text); } form.checkout.woocommerce-checkout #customer_details .form-row label .required{ color: #b08a3e; text-decoration: none; border: 0; } form.checkout.woocommerce-checkout #customer_details .form-row label .optional{ font-weight: 400; color: var(--ko-calc-muted); } /* --- pola tekstowe --- */ form.checkout.woocommerce-checkout #customer_details .form-row input.input-text, form.checkout.woocommerce-checkout #customer_details .form-row textarea.input-text, form.checkout.woocommerce-checkout #customer_details .form-row select{ box-sizing: border-box; width: 100%; padding: 0 20px; height: 52px; border-radius: 999px; background: var(--ko-calc-field); border: 1px solid rgba(145,120,80,.30); box-shadow: inset 0 2px 4px rgba(90,70,40,.08); font-size: 15px; line-height: 1.4; color: var(--ko-calc-text); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; } form.checkout.woocommerce-checkout #customer_details .form-row textarea.input-text{ height: auto; min-height: 108px; padding: 16px 20px; border-radius: 18px; resize: vertical; } form.checkout.woocommerce-checkout #customer_details .form-row input.input-text:focus, form.checkout.woocommerce-checkout #customer_details .form-row textarea.input-text:focus, form.checkout.woocommerce-checkout #customer_details .form-row select:focus{ outline: none; background: #fffdf8; border-color: var(--ko-gold-border); box-shadow: inset 0 2px 4px rgba(90,70,40,.08), 0 0 0 3px rgba(200,155,60,.22); } form.checkout.woocommerce-checkout #customer_details .form-row input.input-text::placeholder, form.checkout.woocommerce-checkout #customer_details .form-row textarea.input-text::placeholder{ color: var(--ko-calc-muted); opacity: .8; } /* pole z bledem walidacji */ form.checkout.woocommerce-checkout #customer_details .form-row.woocommerce-invalid input.input-text{ border-color: #b5675a; box-shadow: inset 0 2px 4px rgba(90,70,40,.08), 0 0 0 3px rgba(181,103,90,.18); } /* odstepy miedzy wierszami */ form.checkout #customer_details .form-row{ margin-bottom: 16px; } form.checkout #customer_details .woocommerce-billing-fields__field-wrapper, form.checkout #customer_details .woocommerce-shipping-fields__field-wrapper{ display: flex; flex-wrap: wrap; gap: 0 16px; } form.checkout #customer_details .form-row-first, form.checkout #customer_details .form-row-last{ flex: 1 1 calc(50% - 8px); width: auto; float: none; } form.checkout #customer_details .form-row-wide, form.checkout #customer_details .form-row.notes{ flex: 1 1 100%; } /* kraj wyswietlany jako tekst */ form.checkout #customer_details #billing_country_field .woocommerce-input-wrapper strong, form.checkout #customer_details #shipping_country_field .woocommerce-input-wrapper strong{ display: inline-block; padding: 6px 16px; border-radius: 999px; background: rgba(247,240,226,.9); border: 1px solid var(--ko-panel-line); font-family: "Playfair Display", Georgia, serif; font-weight: 600; color: var(--ko-calc-text); } /* --- pola wyboru (checkboxy) --- */ .woocommerce-checkout .woocommerce-form__label-for-checkbox{ display: flex; align-items: flex-start; gap: 10px; cursor: pointer; font-family: inherit; font-size: 15px; line-height: 1.5; color: var(--ko-calc-text); } .woocommerce-checkout .woocommerce-form__input-checkbox{ flex: 0 0 auto; width: 19px; height: 19px; margin: 1px 0 0; accent-color: #b08a3e; cursor: pointer; } .woocommerce-checkout #ship-to-different-address{ margin: 0 0 18px; } .woocommerce-checkout #ship-to-different-address .woocommerce-form__label-for-checkbox span{ font-family: "Playfair Display", Georgia, serif; font-size: 17px; font-weight: 600; } /* --- metody platnosci --- */ .woocommerce-checkout #payment ul.wc_payment_methods{ margin: 0 0 20px; padding: 0; list-style: none; background: transparent; border: 0; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method{ margin: 0 0 10px; padding: 0; list-style: none; background: transparent; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label{ display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 18px; border-radius: 14px; background: rgba(255,255,255,.6); border: 1px solid var(--ko-panel-line); font-family: "Playfair Display", Georgia, serif; font-size: 16px; font-weight: 600; color: var(--ko-calc-text); cursor: pointer; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label:hover{ background: #fff; border-color: rgba(145,120,80,.45); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > input[type="radio"]{ position: absolute; opacity: 0; width: 0; height: 0; } /* wybrana metoda */ .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > input[type="radio"]:checked + label{ background: linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(247,240,226,.9) 100%); border-color: var(--ko-gold-border); box-shadow: inset 0 1px 2px rgba(255,255,255,.9), 0 3px 10px rgba(120,80,20,.14); } /* kropka wskaznika */ .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label::before{ content: ""; flex: 0 0 16px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 1px solid rgba(120,80,20,.45); box-shadow: inset 0 1px 2px rgba(90,70,40,.18); transition: background .18s ease, border-color .18s ease; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > input[type="radio"]:checked + label::before{ background: var(--ko-gold-bg); border-color: var(--ko-gold-border); } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label img{ height: 28px !important; max-height: 28px !important; margin: 0 !important; width: auto; } /* dymek z opisem metody */ .woocommerce-checkout #payment div.payment_box{ margin: 8px 0 0; padding: 14px 18px; border-radius: 12px; background: rgba(247,240,226,.75); border: 1px dashed var(--ko-panel-line); color: var(--ko-calc-muted); font-size: 14px; } .woocommerce-checkout #payment div.payment_box::before{ display: none; } /* --- regulamin i polityka prywatnosci --- */ .woocommerce-checkout .woocommerce-privacy-policy-text p{ margin: 0 0 14px; font-size: 13px; line-height: 1.6; color: var(--ko-calc-muted); } .woocommerce-checkout .woocommerce-terms-and-conditions-checkbox-text{ font-size: 14px; line-height: 1.5; } .woocommerce-checkout .form-row.validate-required abbr.required{ color: #b08a3e; border: 0; text-decoration: none; } /* --- przycisk "Kupuje i place" --- Wyglad (zloto, polysk, hover) pochodzi ze wspolnej listy selektorow na gorze pliku - tej samej, co "Dodaj do koszyka". Tutaj tylko geometria. Elementor mial tu wlasny gradient 45deg i animacje "shrink". */ form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt{ width: 100%; height: 58px; margin-top: 6px; padding: 0 28px; border-radius: 14px; font-size: 17px; letter-spacing: .04em; line-height: 1; cursor: pointer; } /* wylaczenie animacji "shrink" z Elementora - hover ma byc taki jak przy "Dodaj do koszyka" (uniesienie), a nie zmniejszenie */ form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt.elementor-animation-shrink:hover, form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt.elementor-animation-shrink:focus{ transform: translateY(-1px); } /* --- przycisk "Przejdz do kasy" w koszyku --- Ten sam wyglad co "Kupuje i place" (wspolna lista na gorze pliku) i ta sama geometria. Widzet koszyka Elementora (#15, a4de39e) dawal radialny gradient, Roboto i promien 3px selektorem 0,6,0 - nasz ma 0,8,1, bez !important. */ .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt{ width: 100%; height: 58px; margin: 6px 0 0; padding: 0 28px; border-radius: 14px; font-size: 17px; letter-spacing: .04em; line-height: 1; } .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt.elementor-animation-shrink:hover, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt.elementor-animation-shrink:focus{ transform: translateY(-1px); } /* --- MOBILE --- */ @media (max-width: 767px){ form.checkout #customer_details .form-row-first, form.checkout #customer_details .form-row-last{ flex: 1 1 100%; } form.checkout #customer_details .woocommerce-billing-fields > h3, .woocommerce-checkout #order_review_heading{ font-size: 20px; } form.checkout.woocommerce-checkout #customer_details .form-row input.input-text, form.checkout.woocommerce-checkout #customer_details .form-row select{ height: 50px; } .woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label{ padding: 12px 14px; font-size: 15px; } form.checkout.woocommerce-checkout #payment.woocommerce-checkout-payment #place_order.button.alt, .elementor-widget-woocommerce-cart.elementor-widget .woocommerce .wc-proceed-to-checkout a.checkout-button.button.alt{ height: 54px; font-size: 16px; } } /* ============================================ GALERIA PRODUKTU - format 1:1 Ramka o stalych proporcjach 1:1 (kwadrat) na kazdej szerokosci. Wysokosc ramki wynika wprost z jej szerokosci, a szerokosc jest ograniczona (--ko-galeria-bok), wiec sekcja ze zdjeciem ma zawsze ta sama wysokosc. Rozwiniecie list "Parametry tkaniny" / "Sklad tkaniny" w kolumnie obok nie zmienia juz rozmiaru galerii - kolumna galerii ma align-self: flex-start (patrz sekcja wyzej). Zdjecia produktowe (3:2 i 3:4) sa kadrowane do srodka. Grafiki o skrajnych proporcjach (wzorniki kolorow) dostaja klase .ko-obraz-wysoki z functions.php i mieszcza sie w calosci, bo kadrowanie pokazaloby z nich tylko waski pasek. Wszystkie slajdy maja rowna wysokosc, wiec galeria nie skacze przy zmianie wariantu ani przy przewijaniu. ============================================ */ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images{ --ko-galeria-bok: 560px; } /* Szerokosc pola zdjecia - stad bierze sie stala wysokosc kwadratu. Produkty z jednym zdjeciem nie maja suwaka, wiec wrapper jest wtedy bezposrednim dzieckiem galerii; przy kilku zdjeciach flexslider opakowuje go w .flex-viewport i to jego ograniczamy. Wrapper w wersji z suwakiem musi zostac nietkniety - flexslider liczy mu szerokosc (liczba slajdow x szerokosc slajdu) i przesuwa go transformem. */ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images > .flex-viewport{ max-width: var(--ko-galeria-bok); } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images > .woocommerce-product-gallery__wrapper{ flex: 1 1 auto; min-width: 0; max-width: var(--ko-galeria-bok); margin-left: auto; margin-right: auto; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .woocommerce-product-gallery__image{ aspect-ratio: 3 / 4; overflow: hidden; border-radius: 16px; background: #fff; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .woocommerce-product-gallery__image > a{ display: block; width: 100%; height: 100%; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .woocommerce-product-gallery__image img{ width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; border-radius: 16px; } /* wzorniki i inne grafiki o skrajnych proporcjach - w calosci, bez przycinania */ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .woocommerce-product-gallery__image.ko-obraz-wysoki img{ object-fit: contain; background: #fff; } /* miniatury w tych samych proporcjach, zeby kolumna byla spojna */ @media (min-width: 768px){ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs li{ aspect-ratio: 1 / 1; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs img{ height: 100%; object-fit: cover; } } /* na telefonie kwadrat zajmuje szerokosc ekranu - zadnego limitu wysokosci nie trzeba, bo kwadrat nigdy nie jest wyzszy niz szeroki */ @media (max-width: 767px){ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs img{ aspect-ratio: 1 / 1; object-fit: cover; } } /* ============================== PRODUKTY W ARTYKUŁACH BLOGOWYCH kreatywne-okno.pl ============================== */ .blog-products-section { margin: 45px 0; } .blog-products-section h2 { margin: 0 0 25px; font-size: 28px; line-height: 1.25; font-weight: 700; } /* SIATKA PRODUKTÓW */ .blog-products-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } /* KARTA PRODUKTU */ .blog-product-card { display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid #e8e8e8; border-radius: 8px; overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; } .blog-product-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08); } /* ZDJĘCIE */ .blog-product-image { width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #f7f7f7; } .blog-product-image a { display: block; width: 100%; height: 100%; } .blog-product-image img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; } .blog-product-card:hover .blog-product-image img { transform: scale(1.03); } /* TREŚĆ KARTY */ .blog-product-content { display: flex; flex-direction: column; flex-grow: 1; padding: 18px; } /* NAZWA PRODUKTU */ .blog-product-name { margin-bottom: 10px; font-size: 17px; line-height: 1.35; font-weight: 700; } .blog-product-name a { color: #222; text-decoration: none; transition: color 0.2s ease; } .blog-product-name a:hover { color: #1e7d25; } /* OPIS */ .blog-product-description { margin-bottom: 16px; font-size: 14px; line-height: 1.55; color: #666; } /* CENA */ .blog-product-price { margin-top: auto; padding-top: 5px; font-size: 18px; line-height: 1.2; font-weight: 700; color: #222; } /* TABLET */ @media (max-width: 1024px) { .blog-products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; } } /* TELEFON */ @media (max-width: 600px) { .blog-products-section { margin: 35px 0; } .blog-products-section h2 { margin-bottom: 20px; font-size: 24px; } .blog-products-grid { grid-template-columns: 1fr; gap: 18px; } .blog-product-content { padding: 16px; } .blog-product-name { font-size: 17px; } .blog-product-description { font-size: 14px; } .blog-product-price { font-size: 18px; } } /* ================================================================== FAQ — premium minimalizm + złoto ------------------------------------------------------------------ Dodane 01.09.2026 na podstawie faq-style.css z katalogu roboczego. Sekcje 1–12 pochodzą ze wzoru; pominięto z niego blok @media (prefers-color-scheme: dark) — motyw jest wyłącznie jasny, a ciemna paleta dawała linie rgba(255,255,255,.12) na białym tle, czyli FAQ bez widocznych ramek u osób z ciemnym motywem systemu. Sekcja 13 dopisana: te same reguły dla akordeonu FAQ Elementora na stronach usługowych, żeby oba warianty wyglądały tak samo. ================================================================== */ /* ---------- 1. ZMIENNE — tu zmieniasz cały wygląd ---------- */ :root { /* Złoto — dobierz do palety sklepu */ --faq-gold: #C8A24A; --faq-gold-hover: #B08C34; --faq-gold-faint: rgba(200, 162, 74, 0.28); --faq-gold-wash: rgba(200, 162, 74, 0.045); /* Linie */ --faq-line: rgba(17, 17, 17, 0.10); --faq-line-hover: rgba(17, 17, 17, 0.18); /* Rytm pionowy */ --faq-gap: 1.35rem; /* padding pytania góra/dół */ --faq-block-margin: 3.5rem; /* odstęp całej sekcji */ /* Ruch */ --faq-speed: 0.32s; --faq-ease: cubic-bezier(0.4, 0, 0.2, 1); /* Płynna animacja wysokości w nowych przeglądarkach */ interpolate-size: allow-keywords; } /* ---------- 2. SEKCJA I NAGŁÓWEK ---------- */ .faq { margin-block: var(--faq-block-margin); } .faq__title { position: relative; margin: 0 0 0.35rem; padding-bottom: 1rem; } /* Krótka złota belka — sygnał premium, bez ozdobników */ .faq__title::after { content: ""; position: absolute; inset-inline-start: 0; bottom: 0; width: 44px; height: 1px; background: var(--faq-gold); } /* ---------- 3. LISTA I POZYCJE ---------- */ .faq__list { border-top: 1px solid var(--faq-line); } .faq__item { position: relative; border-bottom: 1px solid var(--faq-line); } /* Złota linia „przejeżdża" pod otwartą pozycją */ .faq__item::after { content: ""; position: absolute; inset-inline-start: 0; bottom: -1px; height: 1px; width: 0; background: var(--faq-gold); transition: width 0.5s var(--faq-ease); pointer-events: none; } .faq__item[open]::after { width: 100%; } /* ---------- 4. PYTANIE (summary) ---------- */ .faq__question { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: var(--faq-gap) 0; cursor: pointer; list-style: none; user-select: none; transition: color var(--faq-speed) var(--faq-ease), padding-inline-start var(--faq-speed) var(--faq-ease); } /* Kasowanie natywnego trójkąta */ .faq__question::-webkit-details-marker { display: none; } .faq__question::marker { content: ""; } .faq__question:hover { color: var(--faq-gold-hover); } /* Delikatne przesunięcie w prawo przy najechaniu */ .faq__item:hover { border-bottom-color: var(--faq-line-hover); } .faq__item:hover .faq__question { padding-inline-start: 0.4rem; } /* Dostępność klawiatury — złoty outline zamiast domyślnego */ .faq__question:focus-visible { outline: 1px solid var(--faq-gold); outline-offset: 4px; border-radius: 2px; } .faq__question-text { flex: 1 1 auto; } /* ---------- 5. IKONA PLUS → MINUS ---------- */ .faq__icon { position: relative; flex: 0 0 auto; width: 13px; height: 13px; } .faq__icon::before, .faq__icon::after { content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: var(--faq-gold); transform: translateY(-50%); transition: transform 0.35s var(--faq-ease), opacity 0.25s var(--faq-ease); } /* Pionowa kreska plusa */ .faq__icon::after { transform: translateY(-50%) rotate(90deg); } /* Po otwarciu pionowa kreska obraca się i znika → zostaje minus */ .faq__item[open] .faq__icon::after { transform: translateY(-50%) rotate(0deg); opacity: 0; } /* ---------- 6. ODPOWIEDŹ ---------- */ .faq__answer-inner { padding: 0 0 calc(var(--faq-gap) * 1.15); padding-inline-start: 1.25rem; border-inline-start: 1px solid var(--faq-gold-faint); max-width: 68ch; } .faq__answer-inner > :first-child { margin-top: 0; } .faq__answer-inner > :last-child { margin-bottom: 0; } .faq__answer-inner a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--faq-gold); transition: color var(--faq-speed) var(--faq-ease); } .faq__answer-inner a:hover { color: var(--faq-gold-hover); } .faq__answer-inner ul { padding-inline-start: 1.1rem; list-style: none; } .faq__answer-inner ul li { position: relative; padding-inline-start: 0.35rem; } /* Złoty myślnik zamiast punktora */ .faq__answer-inner ul li::before { content: ""; position: absolute; inset-inline-start: -1.1rem; top: 0.7em; width: 7px; height: 1px; background: var(--faq-gold); } /* ---------- 7. ANIMACJA ROZWIJANIA ---------- */ /* Fallback: łagodne pojawienie się (wszystkie przeglądarki) */ .faq__item[open] .faq__answer { animation: faqReveal 0.4s var(--faq-ease); } @keyframes faqReveal { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } } /* WYLACZONE SWIADOMIE — wzor proponuje tu przejscie wysokosci na ::details-content (Chrome/Edge 131+, Safari 18.2+). Na tej instalacji to nie dziala: dowolne 'transition' na ::details-content blokuje wejscie w stan [open] — details.open robi sie true, ale tresc zostaje zwinieta. Sprawdzone 01.09.2026 na zywej stronie: pozycja FAQ po kliknieciu miala open === true przy niezmienionej wysokosci 71px. Ten sam problem opisano wyzej przy zwijce "Pokaz wiecej" w opisie kategorii (sekcja OPIS KATEGORII) i rozwiazano tak samo: wysokosc zmienia sie od razu, a plynnosc daje @keyframes na tresci — czyli faqReveal powyzej. Jesli w przyszlosci silnik przegladarki to naprawi, blok mozna przywrocic, ale najpierw przetestuj klikniecie zwinietej pozycji FAQ. */ /* ---------- 8. TŁO PRZY NAJECHANIU (opcjonalne) ---------- */ /* Odkomentuj, jeśli chcesz subtelną złotą poświatę. Domyślnie wyłączone — czystszy minimalizm. .faq__item:hover { background: var(--faq-gold-wash); } .faq__item[open] { background: var(--faq-gold-wash); } */ /* ---------- 9. MOBILE ---------- */ @media (max-width: 782px) { :root { --faq-gap: 1.1rem; --faq-block-margin: 2.5rem; } .faq__question { gap: 1rem; } .faq__answer-inner { padding-inline-start: 1rem; } } /* ---------- 10. DOSTĘPNOŚĆ: OGRANICZONY RUCH ---------- */ @media (prefers-reduced-motion: reduce) { .faq__item::after, .faq__question, .faq__icon::before, .faq__icon::after { transition: none; } .faq__item[open] .faq__answer { animation: none; } } /* ---------- 12. WYDRUK ---------- */ /* Na wydruku rozwijamy wszystko — inaczej klient dostaje puste pytania */ @media print { /* Na wydruku rozwijamy wszystko — inaczej klient dostaje puste pytania. */ .faq__item[open] .faq__answer { animation: none; } .faq__icon { display: none; } } /* ---------- 13. AKORDEON FAQ ELEMENTORA ---------- */ /* Strony usługowe (dekoracje okienne, zasłony, rolety rzymskie, firany) mają FAQ w widgecie „nested accordion" Elementora z włączonym przełącznikiem FAQ Schema. Widget zostaje — jest edytowalny klikaniem i sam wystawia JSON-LD — a poniższe reguły nadają mu wygląd ze wzoru. Markup Elementora: details.e-n-accordion-item > summary.e-n-accordion-item-title + kontener odpowiedzi .e-con. Selektory celują w klasy .faq-accordion / .faq-accordion-title, wpisane tym widgetom w Elementorze (Zaawansowane → Klasy CSS), a NIE w sam typ widgetu: sidebar kategorii sklepu buduje na tym samym widgecie listy „Kategorie" i „Filtry", które nie powinny dostać złotej oprawy FAQ. Dodając nowe FAQ w Elementorze wpisz widgetowi klasę faq-accordion, a nagłówkowi nad nim faq-accordion-title. */ /* Nagłówek nad akordeonem — ta sama złota belka co .faq__title */ .faq-accordion-title .elementor-heading-title { position: relative; margin-bottom: 0.35rem; padding-bottom: 1rem; } .faq-accordion-title .elementor-heading-title::after { content: ""; position: absolute; inset-inline-start: 0; bottom: 0; width: 44px; height: 1px; background: var(--faq-gold); } /* Kolory ustawiamy zmiennymi Elementora, a nie wlasnymi fill/color: widget czyta je w swoich regulach, wiec to jedyny sposob, ktory nie wymaga podbijania specyficznosci. Podwojona klasa daje (0,2,0) i wygrywa z domyslnymi wartosciami wtyczki, zapisanymi na .elementor-widget-n-accordion (0,1,0). */ .faq-accordion.faq-accordion { interpolate-size: allow-keywords; --n-accordion-icon-normal-color: var(--faq-gold); --n-accordion-icon-hover-color: var(--faq-gold-hover); --n-accordion-icon-active-color: var(--faq-gold); /* Pytanie tak jak we wzorze: kolor tekstu motywu, zloto dopiero pod kursorem. */ --n-accordion-title-hover-color: var(--faq-gold-hover); /* We wzorze ikona stoi przy prawej krawedzi wiersza; Elementor domyslnie stawia ja przed tekstem (icon-order: -1) i zbija oba elementy do lewej. */ --n-accordion-title-icon-order: 1; --n-accordion-title-justify-content: space-between; /* Rytm pionowy i odstep ikony tez ida przez zmienne: widget zapisuje padding i gap jako var(--n-accordion-*) selektorem o tej samej specyficznosci co nasz, ale ladowanym pozniej, wiec wlasne deklaracje padding/gap by przegraly. */ --n-accordion-padding: var(--faq-gap) 0; --n-accordion-icon-gap: 0 1.5rem; } .faq-accordion .e-n-accordion { border-top: 1px solid var(--faq-line); } .faq-accordion .e-n-accordion-item { position: relative; border-bottom: 1px solid var(--faq-line); } .faq-accordion .e-n-accordion-item:hover { border-bottom-color: var(--faq-line-hover); } /* Złota linia „przejeżdża" pod otwartą pozycją */ .faq-accordion .e-n-accordion-item::after { content: ""; position: absolute; inset-inline-start: 0; bottom: -1px; height: 1px; width: 0; background: var(--faq-gold); transition: width 0.5s var(--faq-ease); pointer-events: none; } .faq-accordion .e-n-accordion-item[open]::after { width: 100%; } /* Pytanie */ .faq-accordion .e-n-accordion-item-title { cursor: pointer; user-select: none; transition: color var(--faq-speed) var(--faq-ease), padding-inline-start var(--faq-speed) var(--faq-ease); } .faq-accordion .e-n-accordion-item-title:hover { color: var(--faq-gold-hover); } .faq-accordion .e-n-accordion-item:hover .e-n-accordion-item-title { padding-inline-start: 0.4rem; } .faq-accordion .e-n-accordion-item-title:focus-visible { outline: 1px solid var(--faq-gold); outline-offset: 4px; border-radius: 2px; } /* Ikona plus/minus — Elementor rysuje ją jako SVG, więc barwimy wypełnienie */ .faq-accordion .e-n-accordion-item-title-icon span > svg { transition: fill var(--faq-speed) var(--faq-ease); } /* Odpowiedź — wcięcie i cienka złota pionowa linia jak w .faq__answer-inner. Odstępy ustawiamy zmiennymi Elementora (--padding-*), bo to one zasilają padding kontenera .e-con; bezpośrednie deklaracje przegrałyby specyficznością. */ /* Podwojone .e-con daje (0,4,0). Elementor zapisuje kontenerom tych stron border-style:none selektorem o specyficznosci (0,3,0), ladowanym po arkuszu motywu - bez podbicia zlota kreska ma styl none, czyli szerokosc 0. */ .faq-accordion .e-n-accordion-item > .e-con.e-con { --padding-top: 0px; --padding-right: 0px; --padding-bottom: calc(var(--faq-gap) * 1.15); --padding-left: 1.25rem; border-inline-start-width: 1px; border-inline-start-style: solid; border-inline-start-color: var(--faq-gold-faint); max-width: 68ch; } .faq-accordion .e-n-accordion-item > .e-con.e-con a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--faq-gold); transition: color var(--faq-speed) var(--faq-ease); } .faq-accordion .e-n-accordion-item > .e-con.e-con a:hover { color: var(--faq-gold-hover); } @media (max-width: 782px) { .faq-accordion.faq-accordion { --n-accordion-icon-gap: 0 1rem; } .faq-accordion .e-n-accordion-item > .e-con.e-con { --padding-left: 1rem; } } @media (prefers-reduced-motion: reduce) { .faq-accordion .e-n-accordion-item::after, .faq-accordion .e-n-accordion-item-title, .faq-accordion .e-n-accordion-item-title-icon span > svg { transition: none; } } @media print { .faq-accordion .e-n-accordion-item-title-icon { display: none; } } /* Menu off-canvas (naglowek #97): kafelki kategorii w jednakowych proporcjach, niezaleznie od proporcji zdjecia (nowe kategorie maja zdjecia 3:2 i 1:1) */ .elementor-element-283ba16 .elementor-widget-image img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; } /* ko-popup-pływające: gdy popup Elementora (formularz) jest otwarty, pływające przyciski (do góry, telefon – .itper-floating-buttons; dostępność – #ea11y-root) nie zasłaniają jego treści na telefonie. Otwarty modal nie ma inline display:none (zamknięty: style="display: none;"). */ body:has(.elementor-popup-modal:not([style*="none"])) .itper-floating-buttons, body:has(.elementor-popup-modal:not([style*="none"])) #ea11y-root { display: none !important; } /* ============================================ GALERIA PRODUKTU - kropki i strzalki 1) telefon: nizszy kadr 4:3, zeby pod zdjeciem od razu byla widac nazwe produktu i opinie (odstepy kolumn ustawione w Elementorze, szablony 469 i 6082: gap/padding/spacing w wersji mobile) 2) telefon: miniatury zamienione w kropki pod zdjeciem (w normalnym przeplywie, nie nalozone na zdjecie). Kropki to te same
  • flexslidera, wiec klikniecie dalej przelacza slajd. 3) subtelne strzalki na glownym zdjeciu (wlaczone filtrem woocommerce_single_product_carousel_options w functions.php) ============================================ */ /* --- 1) nizszy kadr na telefonie --- */ @media (max-width: 767px){ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .woocommerce-product-gallery__image{ aspect-ratio: 4 / 3; } .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images{ margin-bottom: 0; } } /* --- 2) kropki zamiast miniatur na telefonie --- */ @media (max-width: 767px){ .single-product .elementor-widget-woocommerce-product-images .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs{ display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; padding: 0; } .single-product .elementor-widget-woocommerce-product-images .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs li{ width: 8px; height: 8px; margin: 0; padding: 0; float: none; flex: 0 0 auto; aspect-ratio: auto; border-radius: 999px; overflow: hidden; background: rgba(120,80,20,.22); transition: width .2s ease, background-color .2s ease; } .single-product .elementor-widget-woocommerce-product-images .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs li:has(img.flex-active){ width: 22px; background: var(--ko-gold-border); } /* obrazek miniatury zostaje jako niewidoczna powierzchnia klikniecia */ .single-product .elementor-widget-woocommerce-product-images .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs li img{ width: 100%; height: 100%; aspect-ratio: auto; opacity: 0; box-shadow: none; border-radius: 0; } /* jedno zdjecie = nie ma czego przewijac */ .single-product .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images ol.flex-control-thumbs li:only-child{ display: none; } } /* --- 3) strzalki --- */ .single-product .woocommerce-product-gallery .flex-direction-nav{ list-style: none; margin: 0; padding: 0; } .single-product .woocommerce-product-gallery .flex-direction-nav a{ position: absolute; top: 50%; z-index: 3; width: 34px; height: 34px; margin-top: -17px; border-radius: 50%; background: rgba(255,255,255,.72); box-shadow: 0 1px 4px rgba(40,30,15,.12); overflow: hidden; text-indent: -9999px; opacity: .8; transition: opacity .2s ease, background-color .2s ease; } .single-product .woocommerce-product-gallery .flex-direction-nav a.flex-prev{ left: 10px; } .single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next{ right: 10px; } /* cienki szewron z obramowania */ .single-product .woocommerce-product-gallery .flex-direction-nav a::before{ content: ""; position: absolute; top: 50%; left: 50%; width: 8px; height: 8px; border-top: 1.5px solid #5a4320; border-right: 1.5px solid #5a4320; text-indent: 0; } .single-product .woocommerce-product-gallery .flex-direction-nav a.flex-prev::before{ transform: translate(-35%, -50%) rotate(-135deg); } .single-product .woocommerce-product-gallery .flex-direction-nav a.flex-next::before{ transform: translate(-65%, -50%) rotate(45deg); } .single-product .woocommerce-product-gallery .flex-direction-nav a:hover, .single-product .woocommerce-product-gallery .flex-direction-nav a:focus-visible{ opacity: 1; background: rgba(255,255,255,.92); } /* pierwszy/ostatni slajd - strzalka w strone, w ktora nie da sie przewinac, znika */ .single-product .woocommerce-product-gallery .flex-direction-nav a.flex-disabled{ opacity: 0; pointer-events: none; } /* na komputerze strzalki pojawiaja sie dopiero po najechaniu na zdjecie */ @media (hover: hover) and (min-width: 1025px){ .single-product .woocommerce-product-gallery .flex-direction-nav a{ opacity: 0; } .single-product .woocommerce-product-gallery .flex-viewport:hover .flex-direction-nav a:not(.flex-disabled){ opacity: .8; } .single-product .woocommerce-product-gallery .flex-viewport:hover .flex-direction-nav a:not(.flex-disabled):hover{ opacity: 1; } } /* odstep zdjecie -> kropki: widget Elementora daje .flex-viewport 32px (kontrolka "Odstep" nie ma wersji mobilnej), na telefonie zostaje 12px z kropek */ @media (max-width: 767px){ .single-product .elementor-widget-woocommerce-product-images .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images .flex-viewport:not(:last-child){ margin-bottom: 0; } } /* ============================================ KATEGORIE NA TELEFONIE Wczesniej kafel kategorii (miniatura 88px + nazwa obok, custom CSS widgetu w szablonie 817) stal w 2 kolumnach i nie miescil sie w ekranie - cala strona /sklep/ przesuwala sie na boki. Teraz na telefonie: 1) siatka 2 kolumn, ktore moga sie zwezac (minmax(0,1fr)) - dlugie nazwy lamia sie zamiast rozpychac strone 2) /sklep/ (same kategorie): biale karty, zdjecie 4:3 na gorze, nazwa pod 3) kategoria z podkategoriami (np. Firany): podkategorie jako zwarte biale "chipy" z mala miniatura, zeby produkty zaczynaly sie wysoko Od tabletu w gore bez zmian (custom CSS widgetu 285611f, szablon 817). ============================================ */ @media (max-width: 767px){ /* --- 1) siatka, ktora nie wychodzi poza ekran --- */ .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 12px; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product{ min-width: 0; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title{ overflow-wrap: break-word; hyphens: auto; } /* lista z samymi kategoriami - mniejszy odstep miedzy rzedami kart */ .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid:not(:has(> li.product:not(.product-category))){ row-gap: 12px; } /* --- 2) /sklep/: karty --- */ .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category{ margin: 0; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category > a{ display: block; height: 100%; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 1px 3px rgba(40,30,15,.08); } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category img{ display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; margin: 0; border-radius: 0; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title{ margin: 0; padding: 10px 12px 12px; font-size: 17px; line-height: 1.2; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title::after{ width: 32px; margin-top: 6px; } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category:hover h2.woocommerce-loop-category__title::after{ width: 56px; } /* --- 3) strona kategorii: podkategorie jako zwarte chipy --- */ .tax-product_cat .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category > a{ display: flex; align-items: center; gap: 10px; padding: 6px 10px 6px 6px; border-radius: 12px; } .tax-product_cat .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category img{ flex: 0 0 48px; width: 48px; height: 48px; aspect-ratio: 1 / 1; border-radius: 8px; } .tax-product_cat.woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title{ padding: 0; font-size: 15px; } .tax-product_cat.woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title::after{ display: none; } } /* elementor-frontend */ :root{--direction-multiplier:1}body.rtl,html[dir=rtl]{--direction-multiplier:-1}.elementor-hidden{display:none}.elementor-visibility-hidden{visibility:hidden}.elementor-screen-only,.screen-reader-text,.screen-reader-text span,.ui-helper-hidden-accessible{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;top:-10000em;width:1px;clip:rect(0,0,0,0);border:0}.elementor-clearfix:after{clear:both;content:"";display:block;height:0;width:0}.e-logo-wrapper{display:inline-block;line-height:1}.e-logo-wrapper i{color:var(--e-a-color-circle-logo);font-size:2.5em}.elementor *,.elementor :after,.elementor :before{box-sizing:border-box}.elementor a{box-shadow:none;text-decoration:none}.elementor hr{background-color:transparent;margin:0}.elementor img{border:none;border-radius:0;box-shadow:none;height:auto;max-width:100%}.elementor .elementor-widget:not(.elementor-widget-text-editor):not(.elementor-widget-theme-post-content) figure{margin:0}.elementor embed,.elementor iframe,.elementor object,.elementor video{border:none;line-height:1;margin:0;max-width:100%;width:100%}.elementor .elementor-background,.elementor .elementor-background-holder,.elementor .elementor-background-video-container{direction:ltr;inset:0;overflow:hidden;position:absolute;z-index:0}.elementor .elementor-background-video-container{pointer-events:none;transition:opacity 1s}.elementor .elementor-background-video-container.elementor-loading{opacity:0}.elementor .elementor-background-video,.elementor .elementor-background-video-embed{max-width:none}.elementor .elementor-background-video,.elementor .elementor-background-video-embed,.elementor .elementor-background-video-hosted{inset-block-start:50%;inset-inline-start:50%;position:absolute;transform:translate(-50%,-50%)}.elementor .elementor-background-video-hosted{-o-object-fit:cover;object-fit:cover}.elementor .elementor-background-overlay{inset:0;position:absolute}.elementor .elementor-background-slideshow{inset:0;position:absolute;z-index:0}.elementor .elementor-background-slideshow__slide__image{background-position:50%;background-size:cover;height:100%;width:100%}.e-con-inner>.elementor-element.elementor-absolute,.e-con>.elementor-element.elementor-absolute,.elementor-widget-wrap>.elementor-element.elementor-absolute{position:absolute}.e-con-inner>.elementor-element.elementor-fixed,.e-con>.elementor-element.elementor-fixed,.elementor-widget-wrap>.elementor-element.elementor-fixed{position:fixed}.elementor-widget-wrap .elementor-element.elementor-widget__width-auto,.elementor-widget-wrap .elementor-element.elementor-widget__width-initial{max-width:100%}@media (max-width:1024px){.elementor-widget-wrap .elementor-element.elementor-widget-tablet__width-auto,.elementor-widget-wrap .elementor-element.elementor-widget-tablet__width-initial{max-width:100%}}@media (max-width:767px){.elementor-widget-wrap .elementor-element.elementor-widget-mobile__width-auto,.elementor-widget-wrap .elementor-element.elementor-widget-mobile__width-initial{max-width:100%}}.elementor-element.elementor-absolute,.elementor-element.elementor-fixed{z-index:1}.elementor-element{--flex-direction:initial;--flex-wrap:initial;--justify-content:initial;--align-items:initial;--align-content:initial;--gap:initial;--flex-basis:initial;--flex-grow:initial;--flex-shrink:initial;--order:initial;--align-self:initial;align-self:var(--align-self);flex-basis:var(--flex-basis);flex-grow:var(--flex-grow);flex-shrink:var(--flex-shrink);order:var(--order)}.elementor-element:where(.e-con-full,.elementor-widget){align-content:var(--align-content);align-items:var(--align-items);flex-direction:var(--flex-direction);flex-wrap:var(--flex-wrap);gap:var(--row-gap) var(--column-gap);justify-content:var(--justify-content)}.elementor-invisible{visibility:hidden}.elementor-custom-embed-play{inset-block-start:50%;inset-inline-start:50%;position:absolute;transform:translate(calc(-50% * var(--direction-multiplier)),-50%)}.elementor-custom-embed-play i{color:#fff;font-size:100px;text-shadow:1px 0 6px rgba(0,0,0,.3)}.elementor-custom-embed-play svg{fill:#fff;filter:drop-shadow(1px 0 6px rgba(0,0,0,.3));height:100px;width:100px}.elementor-custom-embed-play i,.elementor-custom-embed-play svg{opacity:.8;transition:all .5s}.elementor-custom-embed-play.elementor-playing i{font-family:eicons}.elementor-custom-embed-play.elementor-playing i:before{content:"\e8fb"}.elementor-custom-embed-play.elementor-playing i,.elementor-custom-embed-play.elementor-playing svg{animation:eicon-spin 2s linear infinite}.elementor-tag{display:inline-flex}.elementor-ken-burns{transition-duration:10s;transition-property:transform;transition-timing-function:linear}.elementor-ken-burns--out{transform:scale(1.3)}.elementor-ken-burns--active{transition-duration:20s}.elementor-ken-burns--active.elementor-ken-burns--out{transform:scale(1)}.elementor-ken-burns--active.elementor-ken-burns--in{transform:scale(1.3)}.elementor-align-center{text-align:center}.elementor-align-right{text-align:right}.elementor-align-left{text-align:left}.elementor-align-center .elementor-button,.elementor-align-left .elementor-button,.elementor-align-right .elementor-button{width:auto}.elementor-align-justify .elementor-button{width:100%}@media (min-width:-1){.elementor-widescreen-align-center{text-align:center}.elementor-widescreen-align-right{text-align:right}.elementor-widescreen-align-left{text-align:left}.elementor-widescreen-align-center .elementor-button,.elementor-widescreen-align-left .elementor-button,.elementor-widescreen-align-right .elementor-button{width:auto}.elementor-widescreen-align-justify .elementor-button{width:100%}}@media (max-width:-1){.elementor-laptop-align-center{text-align:center}.elementor-laptop-align-right{text-align:right}.elementor-laptop-align-left{text-align:left}.elementor-laptop-align-center .elementor-button,.elementor-laptop-align-left .elementor-button,.elementor-laptop-align-right .elementor-button{width:auto}.elementor-laptop-align-justify .elementor-button{width:100%}.elementor-tablet_extra-align-center{text-align:center}.elementor-tablet_extra-align-right{text-align:right}.elementor-tablet_extra-align-left{text-align:left}.elementor-tablet_extra-align-center .elementor-button,.elementor-tablet_extra-align-left .elementor-button,.elementor-tablet_extra-align-right .elementor-button{width:auto}.elementor-tablet_extra-align-justify .elementor-button{width:100%}}@media (max-width:1024px){.elementor-tablet-align-center{text-align:center}.elementor-tablet-align-right{text-align:right}.elementor-tablet-align-left{text-align:left}.elementor-tablet-align-center .elementor-button,.elementor-tablet-align-left .elementor-button,.elementor-tablet-align-right .elementor-button{width:auto}.elementor-tablet-align-justify .elementor-button{width:100%}}@media (max-width:-1){.elementor-mobile_extra-align-center{text-align:center}.elementor-mobile_extra-align-right{text-align:right}.elementor-mobile_extra-align-left{text-align:left}.elementor-mobile_extra-align-center .elementor-button,.elementor-mobile_extra-align-left .elementor-button,.elementor-mobile_extra-align-right .elementor-button{width:auto}.elementor-mobile_extra-align-justify .elementor-button{width:100%}}@media (max-width:767px){.elementor-mobile-align-center{text-align:center}.elementor-mobile-align-right{text-align:right}.elementor-mobile-align-left{text-align:left}.elementor-mobile-align-center .elementor-button,.elementor-mobile-align-left .elementor-button,.elementor-mobile-align-right .elementor-button{width:auto}.elementor-mobile-align-justify .elementor-button{width:100%}}:root{--page-title-display:block}.elementor-page-title,h1.entry-title{display:var(--page-title-display)}@keyframes eicon-spin{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}.eicon-animation-spin{animation:eicon-spin 2s linear infinite}.elementor-section{position:relative}.elementor-section .elementor-container{display:flex;margin-inline:auto;position:relative}@media (max-width:1024px){.elementor-section .elementor-container{flex-wrap:wrap}}.elementor-section.elementor-section-boxed>.elementor-container{max-width:1140px}.elementor-section.elementor-section-stretched{position:relative;width:100%}.elementor-section.elementor-section-items-top>.elementor-container{align-items:flex-start}.elementor-section.elementor-section-items-middle>.elementor-container{align-items:center}.elementor-section.elementor-section-items-bottom>.elementor-container{align-items:flex-end}@media (min-width:768px){.elementor-section.elementor-section-height-full{height:100vh}.elementor-section.elementor-section-height-full>.elementor-container{height:100%}}.elementor-bc-flex-widget .elementor-section-content-top>.elementor-container>.elementor-column>.elementor-widget-wrap{align-items:flex-start}.elementor-bc-flex-widget .elementor-section-content-middle>.elementor-container>.elementor-column>.elementor-widget-wrap{align-items:center}.elementor-bc-flex-widget .elementor-section-content-bottom>.elementor-container>.elementor-column>.elementor-widget-wrap{align-items:flex-end}.elementor-widget-wrap{align-content:flex-start;flex-wrap:wrap;position:relative;width:100%}.elementor:not(.elementor-bc-flex-widget) .elementor-widget-wrap{display:flex}.elementor-widget-wrap>.elementor-element{width:100%}.elementor-widget-wrap.e-swiper-container{width:calc(100% - (var(--e-column-margin-left, 0px) + var(--e-column-margin-right, 0px)))}.elementor-widget{position:relative}.elementor-widget:not(:last-child){margin-block-end:var(--kit-widget-spacing,20px)}.elementor-widget:not(:last-child).elementor-absolute,.elementor-widget:not(:last-child).elementor-widget__width-auto,.elementor-widget:not(:last-child).elementor-widget__width-initial{margin-block-end:0}.elementor-column{display:flex;min-height:1px;position:relative}.elementor-column-gap-narrow>.elementor-column>.elementor-element-populated{padding:5px}.elementor-column-gap-default>.elementor-column>.elementor-element-populated{padding:10px}.elementor-column-gap-extended>.elementor-column>.elementor-element-populated{padding:15px}.elementor-column-gap-wide>.elementor-column>.elementor-element-populated{padding:20px}.elementor-column-gap-wider>.elementor-column>.elementor-element-populated{padding:30px}.elementor-inner-section .elementor-column-gap-no .elementor-element-populated{padding:0}@media (min-width:768px){.elementor-column.elementor-col-10,.elementor-column[data-col="10"]{width:10%}.elementor-column.elementor-col-11,.elementor-column[data-col="11"]{width:11.111%}.elementor-column.elementor-col-12,.elementor-column[data-col="12"]{width:12.5%}.elementor-column.elementor-col-14,.elementor-column[data-col="14"]{width:14.285%}.elementor-column.elementor-col-16,.elementor-column[data-col="16"]{width:16.666%}.elementor-column.elementor-col-20,.elementor-column[data-col="20"]{width:20%}.elementor-column.elementor-col-25,.elementor-column[data-col="25"]{width:25%}.elementor-column.elementor-col-30,.elementor-column[data-col="30"]{width:30%}.elementor-column.elementor-col-33,.elementor-column[data-col="33"]{width:33.333%}.elementor-column.elementor-col-40,.elementor-column[data-col="40"]{width:40%}.elementor-column.elementor-col-50,.elementor-column[data-col="50"]{width:50%}.elementor-column.elementor-col-60,.elementor-column[data-col="60"]{width:60%}.elementor-column.elementor-col-66,.elementor-column[data-col="66"]{width:66.666%}.elementor-column.elementor-col-70,.elementor-column[data-col="70"]{width:70%}.elementor-column.elementor-col-75,.elementor-column[data-col="75"]{width:75%}.elementor-column.elementor-col-80,.elementor-column[data-col="80"]{width:80%}.elementor-column.elementor-col-83,.elementor-column[data-col="83"]{width:83.333%}.elementor-column.elementor-col-90,.elementor-column[data-col="90"]{width:90%}.elementor-column.elementor-col-100,.elementor-column[data-col="100"]{width:100%}}@media (max-width:479px){.elementor-column.elementor-xs-10{width:10%}.elementor-column.elementor-xs-11{width:11.111%}.elementor-column.elementor-xs-12{width:12.5%}.elementor-column.elementor-xs-14{width:14.285%}.elementor-column.elementor-xs-16{width:16.666%}.elementor-column.elementor-xs-20{width:20%}.elementor-column.elementor-xs-25{width:25%}.elementor-column.elementor-xs-30{width:30%}.elementor-column.elementor-xs-33{width:33.333%}.elementor-column.elementor-xs-40{width:40%}.elementor-column.elementor-xs-50{width:50%}.elementor-column.elementor-xs-60{width:60%}.elementor-column.elementor-xs-66{width:66.666%}.elementor-column.elementor-xs-70{width:70%}.elementor-column.elementor-xs-75{width:75%}.elementor-column.elementor-xs-80{width:80%}.elementor-column.elementor-xs-83{width:83.333%}.elementor-column.elementor-xs-90{width:90%}.elementor-column.elementor-xs-100{width:100%}}@media (max-width:767px){.elementor-column.elementor-sm-10{width:10%}.elementor-column.elementor-sm-11{width:11.111%}.elementor-column.elementor-sm-12{width:12.5%}.elementor-column.elementor-sm-14{width:14.285%}.elementor-column.elementor-sm-16{width:16.666%}.elementor-column.elementor-sm-20{width:20%}.elementor-column.elementor-sm-25{width:25%}.elementor-column.elementor-sm-30{width:30%}.elementor-column.elementor-sm-33{width:33.333%}.elementor-column.elementor-sm-40{width:40%}.elementor-column.elementor-sm-50{width:50%}.elementor-column.elementor-sm-60{width:60%}.elementor-column.elementor-sm-66{width:66.666%}.elementor-column.elementor-sm-70{width:70%}.elementor-column.elementor-sm-75{width:75%}.elementor-column.elementor-sm-80{width:80%}.elementor-column.elementor-sm-83{width:83.333%}.elementor-column.elementor-sm-90{width:90%}.elementor-column.elementor-sm-100{width:100%}}@media (min-width:768px) and (max-width:1024px){.elementor-column.elementor-md-10{width:10%}.elementor-column.elementor-md-11{width:11.111%}.elementor-column.elementor-md-12{width:12.5%}.elementor-column.elementor-md-14{width:14.285%}.elementor-column.elementor-md-16{width:16.666%}.elementor-column.elementor-md-20{width:20%}.elementor-column.elementor-md-25{width:25%}.elementor-column.elementor-md-30{width:30%}.elementor-column.elementor-md-33{width:33.333%}.elementor-column.elementor-md-40{width:40%}.elementor-column.elementor-md-50{width:50%}.elementor-column.elementor-md-60{width:60%}.elementor-column.elementor-md-66{width:66.666%}.elementor-column.elementor-md-70{width:70%}.elementor-column.elementor-md-75{width:75%}.elementor-column.elementor-md-80{width:80%}.elementor-column.elementor-md-83{width:83.333%}.elementor-column.elementor-md-90{width:90%}.elementor-column.elementor-md-100{width:100%}}@media (min-width:-1){.elementor-reverse-widescreen>.elementor-container>:first-child{order:10}.elementor-reverse-widescreen>.elementor-container>:nth-child(2){order:9}.elementor-reverse-widescreen>.elementor-container>:nth-child(3){order:8}.elementor-reverse-widescreen>.elementor-container>:nth-child(4){order:7}.elementor-reverse-widescreen>.elementor-container>:nth-child(5){order:6}.elementor-reverse-widescreen>.elementor-container>:nth-child(6){order:5}.elementor-reverse-widescreen>.elementor-container>:nth-child(7){order:4}.elementor-reverse-widescreen>.elementor-container>:nth-child(8){order:3}.elementor-reverse-widescreen>.elementor-container>:nth-child(9){order:2}.elementor-reverse-widescreen>.elementor-container>:nth-child(10){order:1}}@media (min-width:1025px) and (max-width:-1){.elementor-reverse-laptop>.elementor-container>:first-child{order:10}.elementor-reverse-laptop>.elementor-container>:nth-child(2){order:9}.elementor-reverse-laptop>.elementor-container>:nth-child(3){order:8}.elementor-reverse-laptop>.elementor-container>:nth-child(4){order:7}.elementor-reverse-laptop>.elementor-container>:nth-child(5){order:6}.elementor-reverse-laptop>.elementor-container>:nth-child(6){order:5}.elementor-reverse-laptop>.elementor-container>:nth-child(7){order:4}.elementor-reverse-laptop>.elementor-container>:nth-child(8){order:3}.elementor-reverse-laptop>.elementor-container>:nth-child(9){order:2}.elementor-reverse-laptop>.elementor-container>:nth-child(10){order:1}}@media (min-width:-1) and (max-width:-1){.elementor-reverse-laptop>.elementor-container>:first-child{order:10}.elementor-reverse-laptop>.elementor-container>:nth-child(2){order:9}.elementor-reverse-laptop>.elementor-container>:nth-child(3){order:8}.elementor-reverse-laptop>.elementor-container>:nth-child(4){order:7}.elementor-reverse-laptop>.elementor-container>:nth-child(5){order:6}.elementor-reverse-laptop>.elementor-container>:nth-child(6){order:5}.elementor-reverse-laptop>.elementor-container>:nth-child(7){order:4}.elementor-reverse-laptop>.elementor-container>:nth-child(8){order:3}.elementor-reverse-laptop>.elementor-container>:nth-child(9){order:2}.elementor-reverse-laptop>.elementor-container>:nth-child(10){order:1}}@media (min-width:1025px) and (max-width:-1){.elementor-reverse-laptop>.elementor-container>:first-child,.elementor-reverse-laptop>.elementor-container>:nth-child(10),.elementor-reverse-laptop>.elementor-container>:nth-child(2),.elementor-reverse-laptop>.elementor-container>:nth-child(3),.elementor-reverse-laptop>.elementor-container>:nth-child(4),.elementor-reverse-laptop>.elementor-container>:nth-child(5),.elementor-reverse-laptop>.elementor-container>:nth-child(6),.elementor-reverse-laptop>.elementor-container>:nth-child(7),.elementor-reverse-laptop>.elementor-container>:nth-child(8),.elementor-reverse-laptop>.elementor-container>:nth-child(9){order:0}.elementor-reverse-tablet_extra>.elementor-container>:first-child{order:10}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(2){order:9}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(3){order:8}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(4){order:7}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(5){order:6}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(6){order:5}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(7){order:4}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(8){order:3}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(9){order:2}.elementor-reverse-tablet_extra>.elementor-container>:nth-child(10){order:1}}@media (min-width:768px) and (max-width:1024px){.elementor-reverse-tablet>.elementor-container>:first-child{order:10}.elementor-reverse-tablet>.elementor-container>:nth-child(2){order:9}.elementor-reverse-tablet>.elementor-container>:nth-child(3){order:8}.elementor-reverse-tablet>.elementor-container>:nth-child(4){order:7}.elementor-reverse-tablet>.elementor-container>:nth-child(5){order:6}.elementor-reverse-tablet>.elementor-container>:nth-child(6){order:5}.elementor-reverse-tablet>.elementor-container>:nth-child(7){order:4}.elementor-reverse-tablet>.elementor-container>:nth-child(8){order:3}.elementor-reverse-tablet>.elementor-container>:nth-child(9){order:2}.elementor-reverse-tablet>.elementor-container>:nth-child(10){order:1}}@media (min-width:-1) and (max-width:1024px){.elementor-reverse-tablet>.elementor-container>:first-child{order:10}.elementor-reverse-tablet>.elementor-container>:nth-child(2){order:9}.elementor-reverse-tablet>.elementor-container>:nth-child(3){order:8}.elementor-reverse-tablet>.elementor-container>:nth-child(4){order:7}.elementor-reverse-tablet>.elementor-container>:nth-child(5){order:6}.elementor-reverse-tablet>.elementor-container>:nth-child(6){order:5}.elementor-reverse-tablet>.elementor-container>:nth-child(7){order:4}.elementor-reverse-tablet>.elementor-container>:nth-child(8){order:3}.elementor-reverse-tablet>.elementor-container>:nth-child(9){order:2}.elementor-reverse-tablet>.elementor-container>:nth-child(10){order:1}}@media (min-width:768px) and (max-width:-1){.elementor-reverse-tablet>.elementor-container>:first-child,.elementor-reverse-tablet>.elementor-container>:nth-child(10),.elementor-reverse-tablet>.elementor-container>:nth-child(2),.elementor-reverse-tablet>.elementor-container>:nth-child(3),.elementor-reverse-tablet>.elementor-container>:nth-child(4),.elementor-reverse-tablet>.elementor-container>:nth-child(5),.elementor-reverse-tablet>.elementor-container>:nth-child(6),.elementor-reverse-tablet>.elementor-container>:nth-child(7),.elementor-reverse-tablet>.elementor-container>:nth-child(8),.elementor-reverse-tablet>.elementor-container>:nth-child(9){order:0}.elementor-reverse-mobile_extra>.elementor-container>:first-child{order:10}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(2){order:9}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(3){order:8}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(4){order:7}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(5){order:6}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(6){order:5}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(7){order:4}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(8){order:3}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(9){order:2}.elementor-reverse-mobile_extra>.elementor-container>:nth-child(10){order:1}}@media (max-width:767px){.elementor-reverse-mobile>.elementor-container>:first-child{order:10}.elementor-reverse-mobile>.elementor-container>:nth-child(2){order:9}.elementor-reverse-mobile>.elementor-container>:nth-child(3){order:8}.elementor-reverse-mobile>.elementor-container>:nth-child(4){order:7}.elementor-reverse-mobile>.elementor-container>:nth-child(5){order:6}.elementor-reverse-mobile>.elementor-container>:nth-child(6){order:5}.elementor-reverse-mobile>.elementor-container>:nth-child(7){order:4}.elementor-reverse-mobile>.elementor-container>:nth-child(8){order:3}.elementor-reverse-mobile>.elementor-container>:nth-child(9){order:2}.elementor-reverse-mobile>.elementor-container>:nth-child(10){order:1}.elementor-column{width:100%}}.elementor-grid{display:grid;grid-column-gap:var(--grid-column-gap);grid-row-gap:var(--grid-row-gap)}.elementor-grid .elementor-grid-item{min-width:0}.elementor-grid-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}@media (min-width:-1){.elementor-grid-widescreen-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-widescreen-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-widescreen-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-widescreen-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-widescreen-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-widescreen-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-widescreen-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-widescreen-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-widescreen-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-widescreen-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-widescreen-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-widescreen-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-widescreen-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-widescreen-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}}@media (max-width:-1){.elementor-grid-laptop-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-laptop-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-laptop-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-laptop-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-laptop-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-laptop-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-laptop-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-laptop-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-laptop-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-laptop-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-laptop-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-laptop-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-laptop-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-laptop-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}.elementor-grid-tablet_extra-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-tablet_extra-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-tablet_extra-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-tablet_extra-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-tablet_extra-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-tablet_extra-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-tablet_extra-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-tablet_extra-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-tablet_extra-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-tablet_extra-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-tablet_extra-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-tablet_extra-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-tablet_extra-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-tablet_extra-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}}@media (max-width:1024px){.elementor-grid-tablet-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-tablet-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-tablet-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-tablet-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-tablet-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-tablet-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-tablet-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-tablet-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-tablet-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-tablet-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-tablet-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-tablet-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-tablet-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-tablet-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}}@media (max-width:-1){.elementor-grid-mobile_extra-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-mobile_extra-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-mobile_extra-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-mobile_extra-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-mobile_extra-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-mobile_extra-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-mobile_extra-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-mobile_extra-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-mobile_extra-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-mobile_extra-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-mobile_extra-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-mobile_extra-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-mobile_extra-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-mobile_extra-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}}@media (max-width:767px){.elementor-grid-mobile-0 .elementor-grid{display:inline-block;margin-block-end:calc(-1 * var(--grid-row-gap));width:100%;word-spacing:var(--grid-column-gap)}.elementor-grid-mobile-0 .elementor-grid .elementor-grid-item{display:inline-block;margin-block-end:var(--grid-row-gap);word-break:break-word}.elementor-grid-mobile-1 .elementor-grid{grid-template-columns:repeat(1,1fr)}.elementor-grid-mobile-2 .elementor-grid{grid-template-columns:repeat(2,1fr)}.elementor-grid-mobile-3 .elementor-grid{grid-template-columns:repeat(3,1fr)}.elementor-grid-mobile-4 .elementor-grid{grid-template-columns:repeat(4,1fr)}.elementor-grid-mobile-5 .elementor-grid{grid-template-columns:repeat(5,1fr)}.elementor-grid-mobile-6 .elementor-grid{grid-template-columns:repeat(6,1fr)}.elementor-grid-mobile-7 .elementor-grid{grid-template-columns:repeat(7,1fr)}.elementor-grid-mobile-8 .elementor-grid{grid-template-columns:repeat(8,1fr)}.elementor-grid-mobile-9 .elementor-grid{grid-template-columns:repeat(9,1fr)}.elementor-grid-mobile-10 .elementor-grid{grid-template-columns:repeat(10,1fr)}.elementor-grid-mobile-11 .elementor-grid{grid-template-columns:repeat(11,1fr)}.elementor-grid-mobile-12 .elementor-grid{grid-template-columns:repeat(12,1fr)}}@media (min-width:1025px){#elementor-device-mode:after{content:"desktop"}}@media (min-width:-1){#elementor-device-mode:after{content:"widescreen"}}@media (max-width:-1){#elementor-device-mode:after{content:"laptop";content:"tablet_extra"}}@media (max-width:1024px){#elementor-device-mode:after{content:"tablet"}}@media (max-width:-1){#elementor-device-mode:after{content:"mobile_extra"}}@media (max-width:767px){#elementor-device-mode:after{content:"mobile"}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}.e-con{--border-radius:0;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;--border-style:initial;--border-color:initial;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--content-width:min(100%,var(--container-max-width,1140px));--width:100%;--min-height:initial;--height:auto;--text-align:initial;--margin-top:0px;--margin-right:0px;--margin-bottom:0px;--margin-left:0px;--padding-top:var(--container-default-padding-top,10px);--padding-right:var(--container-default-padding-right,10px);--padding-bottom:var(--container-default-padding-bottom,10px);--padding-left:var(--container-default-padding-left,10px);--position:relative;--z-index:revert;--overflow:visible;--gap:var(--widgets-spacing,20px);--row-gap:var(--widgets-spacing-row,20px);--column-gap:var(--widgets-spacing-column,20px);--overlay-mix-blend-mode:initial;--overlay-opacity:1;--overlay-transition:0.3s;--e-con-grid-template-columns:repeat(3,1fr);--e-con-grid-template-rows:repeat(2,1fr);border-radius:var(--border-radius);height:var(--height);min-height:var(--min-height);min-width:0;overflow:var(--overflow);position:var(--position);width:var(--width);z-index:var(--z-index);--flex-wrap-mobile:wrap}.e-con:where(:not(.e-div-block-base)){transition:background var(--background-transition,.3s),border var(--border-transition,.3s),box-shadow var(--border-transition,.3s),transform var(--e-con-transform-transition-duration,.4s)}.e-con{--margin-block-start:var(--margin-top);--margin-block-end:var(--margin-bottom);--margin-inline-start:var(--margin-left);--margin-inline-end:var(--margin-right);--padding-inline-start:var(--padding-left);--padding-inline-end:var(--padding-right);--padding-block-start:var(--padding-top);--padding-block-end:var(--padding-bottom);--border-block-start-width:var(--border-top-width);--border-block-end-width:var(--border-bottom-width);--border-inline-start-width:var(--border-left-width);--border-inline-end-width:var(--border-right-width)}body.rtl .e-con{--padding-inline-start:var(--padding-right);--padding-inline-end:var(--padding-left);--margin-inline-start:var(--margin-right);--margin-inline-end:var(--margin-left);--border-inline-start-width:var(--border-right-width);--border-inline-end-width:var(--border-left-width)}.e-con{margin-block-end:var(--margin-block-end);margin-block-start:var(--margin-block-start);margin-inline-end:var(--margin-inline-end);margin-inline-start:var(--margin-inline-start);padding-inline-end:var(--padding-inline-end);padding-inline-start:var(--padding-inline-start)}.e-con.e-flex{--flex-direction:column;--flex-basis:auto;--flex-grow:0;--flex-shrink:1;flex:var(--flex-grow) var(--flex-shrink) var(--flex-basis)}.e-con-full,.e-con>.e-con-inner{padding-block-end:var(--padding-block-end);padding-block-start:var(--padding-block-start);text-align:var(--text-align)}.e-con-full.e-flex,.e-con.e-flex>.e-con-inner{flex-direction:var(--flex-direction)}.e-con,.e-con>.e-con-inner{display:var(--display)}.e-con.e-grid{--grid-justify-content:start;--grid-align-content:start;--grid-auto-flow:row}.e-con.e-grid,.e-con.e-grid>.e-con-inner{align-content:var(--grid-align-content);align-items:var(--align-items);grid-auto-flow:var(--grid-auto-flow);grid-template-columns:var(--e-con-grid-template-columns);grid-template-rows:var(--e-con-grid-template-rows);justify-content:var(--grid-justify-content);justify-items:var(--justify-items)}.e-con-boxed.e-flex{align-content:normal;align-items:normal;flex-direction:column;flex-wrap:nowrap;justify-content:normal}.e-con-boxed.e-grid{grid-template-columns:1fr;grid-template-rows:1fr;justify-items:legacy}.e-con-boxed{gap:initial;text-align:initial}.e-con.e-flex>.e-con-inner{align-content:var(--align-content);align-items:var(--align-items);align-self:auto;flex-basis:auto;flex-grow:1;flex-shrink:1;flex-wrap:var(--flex-wrap);justify-content:var(--justify-content)}.e-con.e-grid>.e-con-inner{align-items:var(--align-items);justify-items:var(--justify-items)}.e-con>.e-con-inner{gap:var(--row-gap) var(--column-gap);height:100%;margin:0 auto;max-width:var(--content-width);padding-inline-end:0;padding-inline-start:0;width:100%}:is(.elementor-section-wrap,[data-elementor-id])>.e-con{--margin-left:auto;--margin-right:auto;max-width:min(100%,var(--width))}.e-con .elementor-widget.elementor-widget{margin-block-end:0}.e-con:before,.e-con>.elementor-background-slideshow:before,.e-con>.elementor-motion-effects-container>.elementor-motion-effects-layer:before,:is(.e-con,.e-con>.e-con-inner)>.elementor-background-video-container:before{border-block-end-width:var(--border-block-end-width);border-block-start-width:var(--border-block-start-width);border-color:var(--border-color);border-inline-end-width:var(--border-inline-end-width);border-inline-start-width:var(--border-inline-start-width);border-radius:var(--border-radius);border-style:var(--border-style);content:var(--background-overlay);display:block;height:max(100% + var(--border-top-width) + var(--border-bottom-width),100%);left:calc(0px - var(--border-left-width));mix-blend-mode:var(--overlay-mix-blend-mode);opacity:var(--overlay-opacity);position:absolute;top:calc(0px - var(--border-top-width));transition:var(--overlay-transition,.3s);width:max(100% + var(--border-left-width) + var(--border-right-width),100%)}.e-con:before{transition:background var(--overlay-transition,.3s),border-radius var(--border-transition,.3s),opacity var(--overlay-transition,.3s)}.e-con>.elementor-background-slideshow,:is(.e-con,.e-con>.e-con-inner)>.elementor-background-video-container{border-block-end-width:var(--border-block-end-width);border-block-start-width:var(--border-block-start-width);border-color:var(--border-color);border-inline-end-width:var(--border-inline-end-width);border-inline-start-width:var(--border-inline-start-width);border-radius:var(--border-radius);border-style:var(--border-style);height:max(100% + var(--border-top-width) + var(--border-bottom-width),100%);left:calc(0px - var(--border-left-width));top:calc(0px - var(--border-top-width));width:max(100% + var(--border-left-width) + var(--border-right-width),100%)}@media (max-width:767px){:is(.e-con,.e-con>.e-con-inner)>.elementor-background-video-container.elementor-hidden-mobile{display:none}}:is(.e-con,.e-con>.e-con-inner)>.elementor-background-video-container:before{z-index:1}:is(.e-con,.e-con>.e-con-inner)>.elementor-background-slideshow:before{z-index:2}.e-con .elementor-widget{min-width:0}.e-con .elementor-widget-empty,.e-con .elementor-widget-google_maps,.e-con .elementor-widget-video,.e-con .elementor-widget.e-widget-swiper{width:100%}.e-con>.e-con-inner>.elementor-widget>.elementor-widget-container,.e-con>.elementor-widget>.elementor-widget-container{height:100%}.e-con.e-con>.e-con-inner>.elementor-widget,.elementor.elementor .e-con>.elementor-widget{max-width:100%}.e-con .elementor-widget:not(:last-child){--kit-widget-spacing:0px}@media (max-width:767px){.e-con.e-flex{--width:100%;--flex-wrap:var(--flex-wrap-mobile)}.e-con.e-flex .elementor-widget-archive-posts{width:100%}}.elementor-form-fields-wrapper{display:flex;flex-wrap:wrap}.elementor-form-fields-wrapper.elementor-labels-above .elementor-field-group .elementor-field-subgroup,.elementor-form-fields-wrapper.elementor-labels-above .elementor-field-group>.elementor-select-wrapper,.elementor-form-fields-wrapper.elementor-labels-above .elementor-field-group>input,.elementor-form-fields-wrapper.elementor-labels-above .elementor-field-group>textarea{flex-basis:100%;max-width:100%}.elementor-form-fields-wrapper.elementor-labels-inline>.elementor-field-group .elementor-select-wrapper,.elementor-form-fields-wrapper.elementor-labels-inline>.elementor-field-group>input{flex-grow:1}.elementor-field-group{align-items:center;flex-wrap:wrap}.elementor-field-group.elementor-field-type-submit{align-items:flex-end}.elementor-field-group .elementor-field-textual{background-color:transparent;border:1px solid #69727d;color:#1f2124;flex-grow:1;max-width:100%;vertical-align:middle;width:100%}.elementor-field-group .elementor-field-textual:focus{box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);outline:0}.elementor-field-group .elementor-field-textual::-moz-placeholder{color:inherit;font-family:inherit;opacity:.6}.elementor-field-group .elementor-field-textual::placeholder{color:inherit;font-family:inherit;opacity:.6}.elementor-field-group .elementor-select-wrapper{display:flex;position:relative;width:100%}.elementor-field-group .elementor-select-wrapper select{-webkit-appearance:none;-moz-appearance:none;appearance:none;color:inherit;flex-basis:100%;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;padding-inline-end:20px;text-transform:inherit}.elementor-field-group .elementor-select-wrapper:before{content:"\e92a";font-family:eicons;font-size:15px;inset-block-start:50%;inset-inline-end:10px;pointer-events:none;position:absolute;text-shadow:0 0 3px rgba(0,0,0,.3);transform:translateY(-50%)}.elementor-field-group.elementor-field-type-select-multiple .elementor-select-wrapper:before{content:""}.elementor-field-subgroup{display:flex;flex-wrap:wrap}.elementor-field-subgroup .elementor-field-option label{display:inline-block}.elementor-field-subgroup.elementor-subgroup-inline .elementor-field-option{padding-inline-end:10px}.elementor-field-subgroup:not(.elementor-subgroup-inline) .elementor-field-option{flex-basis:100%}.elementor-field-type-acceptance .elementor-field-subgroup .elementor-field-option input,.elementor-field-type-acceptance .elementor-field-subgroup .elementor-field-option label,.elementor-field-type-checkbox .elementor-field-subgroup .elementor-field-option input,.elementor-field-type-checkbox .elementor-field-subgroup .elementor-field-option label,.elementor-field-type-radio .elementor-field-subgroup .elementor-field-option input,.elementor-field-type-radio .elementor-field-subgroup .elementor-field-option label{display:inline}.elementor-field-label{cursor:pointer}.elementor-mark-required .elementor-field-label:after{color:red;content:"*";padding-inline-start:.2em}.elementor-field-textual{border-radius:3px;font-size:15px;line-height:1.4;min-height:40px;padding:5px 14px}.elementor-field-textual.elementor-size-xs{border-radius:2px;font-size:13px;min-height:33px;padding:4px 12px}.elementor-field-textual.elementor-size-md{border-radius:4px;font-size:16px;min-height:47px;padding:6px 16px}.elementor-field-textual.elementor-size-lg{border-radius:5px;font-size:18px;min-height:59px;padding:7px 20px}.elementor-field-textual.elementor-size-xl{border-radius:6px;font-size:20px;min-height:72px;padding:8px 24px}.elementor-button-align-stretch .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button{flex-basis:100%}.elementor-button-align-stretch .e-form__buttons__wrapper{flex-basis:50%;flex-grow:1}.elementor-button-align-stretch .e-form__buttons__wrapper__button{flex-basis:100%}.elementor-button-align-center .e-form__buttons,.elementor-button-align-center .elementor-field-type-submit{justify-content:center}.elementor-button-align-start .e-form__buttons,.elementor-button-align-start .elementor-field-type-submit{justify-content:flex-start}.elementor-button-align-end .e-form__buttons,.elementor-button-align-end .elementor-field-type-submit,[dir=rtl] .elementor-button-align-start .e-form__buttons,[dir=rtl] .elementor-button-align-start .elementor-field-type-submit{justify-content:flex-end}[dir=rtl] .elementor-button-align-end .e-form__buttons,[dir=rtl] .elementor-button-align-end .elementor-field-type-submit{justify-content:flex-start}.elementor-button-align-center .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button,.elementor-button-align-end .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button,.elementor-button-align-start .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button{flex-basis:auto}.elementor-button-align-center .e-form__buttons__wrapper,.elementor-button-align-end .e-form__buttons__wrapper,.elementor-button-align-start .e-form__buttons__wrapper{flex-grow:0}.elementor-button-align-center .e-form__buttons__wrapper,.elementor-button-align-center .e-form__buttons__wrapper__button,.elementor-button-align-end .e-form__buttons__wrapper,.elementor-button-align-end .e-form__buttons__wrapper__button,.elementor-button-align-start .e-form__buttons__wrapper,.elementor-button-align-start .e-form__buttons__wrapper__button{flex-basis:auto}@media screen and (max-width:1024px){.elementor-tablet-button-align-stretch .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button{flex-basis:100%}.elementor-tablet-button-align-stretch .e-form__buttons__wrapper{flex-basis:50%;flex-grow:1}.elementor-tablet-button-align-stretch .e-form__buttons__wrapper__button{flex-basis:100%}.elementor-tablet-button-align-center .e-form__buttons,.elementor-tablet-button-align-center .elementor-field-type-submit{justify-content:center}.elementor-tablet-button-align-start .e-form__buttons,.elementor-tablet-button-align-start .elementor-field-type-submit{justify-content:flex-start}.elementor-tablet-button-align-end .e-form__buttons,.elementor-tablet-button-align-end .elementor-field-type-submit,[dir=rtl] .elementor-tablet-button-align-start .e-form__buttons,[dir=rtl] .elementor-tablet-button-align-start .elementor-field-type-submit{justify-content:flex-end}[dir=rtl] .elementor-tablet-button-align-end .e-form__buttons,[dir=rtl] .elementor-tablet-button-align-end .elementor-field-type-submit{justify-content:flex-start}.elementor-tablet-button-align-center .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button,.elementor-tablet-button-align-end .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button,.elementor-tablet-button-align-start .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button{flex-basis:auto}.elementor-tablet-button-align-center .e-form__buttons__wrapper,.elementor-tablet-button-align-end .e-form__buttons__wrapper,.elementor-tablet-button-align-start .e-form__buttons__wrapper{flex-grow:0}.elementor-tablet-button-align-center .e-form__buttons__wrapper,.elementor-tablet-button-align-center .e-form__buttons__wrapper__button,.elementor-tablet-button-align-end .e-form__buttons__wrapper,.elementor-tablet-button-align-end .e-form__buttons__wrapper__button,.elementor-tablet-button-align-start .e-form__buttons__wrapper,.elementor-tablet-button-align-start .e-form__buttons__wrapper__button{flex-basis:auto}}@media screen and (max-width:767px){.elementor-mobile-button-align-stretch .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button{flex-basis:100%}.elementor-mobile-button-align-stretch .e-form__buttons__wrapper{flex-basis:50%;flex-grow:1}.elementor-mobile-button-align-stretch .e-form__buttons__wrapper__button{flex-basis:100%}.elementor-mobile-button-align-center .e-form__buttons,.elementor-mobile-button-align-center .elementor-field-type-submit{justify-content:center}.elementor-mobile-button-align-start .e-form__buttons,.elementor-mobile-button-align-start .elementor-field-type-submit{justify-content:flex-start}.elementor-mobile-button-align-end .e-form__buttons,.elementor-mobile-button-align-end .elementor-field-type-submit,[dir=rtl] .elementor-mobile-button-align-start .e-form__buttons,[dir=rtl] .elementor-mobile-button-align-start .elementor-field-type-submit{justify-content:flex-end}[dir=rtl] .elementor-mobile-button-align-end .e-form__buttons,[dir=rtl] .elementor-mobile-button-align-end .elementor-field-type-submit{justify-content:flex-start}.elementor-mobile-button-align-center .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button,.elementor-mobile-button-align-end .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button,.elementor-mobile-button-align-start .elementor-field-type-submit:not(.e-form__buttons__wrapper) .elementor-button{flex-basis:auto}.elementor-mobile-button-align-center .e-form__buttons__wrapper,.elementor-mobile-button-align-end .e-form__buttons__wrapper,.elementor-mobile-button-align-start .e-form__buttons__wrapper{flex-grow:0}.elementor-mobile-button-align-center .e-form__buttons__wrapper,.elementor-mobile-button-align-center .e-form__buttons__wrapper__button,.elementor-mobile-button-align-end .e-form__buttons__wrapper,.elementor-mobile-button-align-end .e-form__buttons__wrapper__button,.elementor-mobile-button-align-start .e-form__buttons__wrapper,.elementor-mobile-button-align-start .e-form__buttons__wrapper__button{flex-basis:auto}}.elementor-error .elementor-field{border-color:#d9534f}.elementor-error .help-inline{color:#d9534f;font-size:.9em}.elementor-message{font-size:1em;line-height:1;margin:10px 0}.elementor-message:before{content:"\e90e";display:inline-block;font-family:eicons;font-style:normal;font-weight:400;margin-inline-end:5px;vertical-align:middle}.elementor-message.elementor-message-danger{color:#d9534f}.elementor-message.elementor-message-danger:before{content:"\e87f"}.elementor-message.form-message-success{color:#5cb85c}.elementor-form .elementor-button{border:none;padding-block-end:0;padding-block-start:0}.elementor-form .elementor-button-content-wrapper,.elementor-form .elementor-button>span{display:flex;flex-direction:row;gap:5px;justify-content:center}.elementor-form .elementor-button.elementor-size-xs{min-height:33px}.elementor-form .elementor-button.elementor-size-sm{min-height:40px}.elementor-form .elementor-button.elementor-size-md{min-height:47px}.elementor-form .elementor-button.elementor-size-lg{min-height:59px}.elementor-form .elementor-button.elementor-size-xl{min-height:72px}.elementor-element:where(:not(.e-con)):where(:not(.e-div-block-base)) .elementor-widget-container,.elementor-element:where(:not(.e-con)):where(:not(.e-div-block-base)):not(:has(.elementor-widget-container)){transition:background .3s,border .3s,border-radius .3s,box-shadow .3s,transform var(--e-transform-transition-duration,.4s)}.elementor-heading-title{line-height:1;margin:0;padding:0}.elementor-button{background-color:#69727d;border-radius:3px;color:#fff;display:inline-block;fill:#fff;font-size:15px;line-height:1;padding:12px 24px;text-align:center;transition:all .3s}.elementor-button:focus,.elementor-button:hover,.elementor-button:visited{color:#fff}.elementor-button-content-wrapper{display:flex;flex-direction:row;gap:5px;justify-content:center}.elementor-button-icon{align-items:center;display:flex}.elementor-button-icon svg{height:auto;width:1em}.elementor-button-icon .e-font-icon-svg{height:1em}.elementor-button-text{display:inline-block}.elementor-button.elementor-size-xs{border-radius:2px;font-size:13px;padding:10px 20px}.elementor-button.elementor-size-md{border-radius:4px;font-size:16px;padding:15px 30px}.elementor-button.elementor-size-lg{border-radius:5px;font-size:18px;padding:20px 40px}.elementor-button.elementor-size-xl{border-radius:6px;font-size:20px;padding:25px 50px}.elementor-button span{text-decoration:inherit}.elementor-element.elementor-button-info .elementor-button{background-color:#5bc0de}.elementor-element.elementor-button-success .elementor-button{background-color:#5cb85c}.elementor-element.elementor-button-warning .elementor-button{background-color:#f0ad4e}.elementor-element.elementor-button-danger .elementor-button{background-color:#d9534f}.elementor-widget-button .elementor-button .elementor-button-info{background-color:#5bc0de}.elementor-widget-button .elementor-button .elementor-button-success{background-color:#5cb85c}.elementor-widget-button .elementor-button .elementor-button-warning{background-color:#f0ad4e}.elementor-widget-button .elementor-button .elementor-button-danger{background-color:#d9534f}.elementor-view-stacked .elementor-icon{background-color:#69727d;color:#fff;fill:#fff;padding:.5em}.elementor-view-framed .elementor-icon{background-color:transparent;border:3px solid #69727d;color:#69727d;padding:.5em}.elementor-icon{color:#69727d;display:inline-block;font-size:50px;line-height:1;text-align:center;transition:all .3s}.elementor-icon:hover{color:#69727d}.elementor-icon i,.elementor-icon svg{display:block;height:1em;position:relative;width:1em}.elementor-icon i:before,.elementor-icon svg:before{left:50%;position:absolute;transform:translateX(-50%)}.elementor-icon i.fad{width:auto}.elementor-shape-square .elementor-icon{border-radius:0}.elementor-shape-rounded .elementor-icon{border-radius:10%}.elementor-shape-circle .elementor-icon{border-radius:50%}.e-transform .elementor-widget-container,.e-transform:not(:has(.elementor-widget-container)){transform:perspective(var(--e-transform-perspective,0)) rotate(var(--e-transform-rotateZ,0)) rotateX(var(--e-transform-rotateX,0)) rotateY(var(--e-transform-rotateY,0)) translate(var(--e-transform-translate,0)) translateX(var(--e-transform-translateX,0)) translateY(var(--e-transform-translateY,0)) scaleX(calc(var(--e-transform-flipX, 1) * var(--e-transform-scaleX, var(--e-transform-scale, 1)))) scaleY(calc(var(--e-transform-flipY, 1) * var(--e-transform-scaleY, var(--e-transform-scale, 1)))) skewX(var(--e-transform-skewX,0)) skewY(var(--e-transform-skewY,0));transform-origin:var(--e-transform-origin-y) var(--e-transform-origin-x)}.e-con.e-transform{transform:perspective(var(--e-con-transform-perspective,0)) rotate(var(--e-con-transform-rotateZ,0)) rotateX(var(--e-con-transform-rotateX,0)) rotateY(var(--e-con-transform-rotateY,0)) translate(var(--e-con-transform-translate,0)) translateX(var(--e-con-transform-translateX,0)) translateY(var(--e-con-transform-translateY,0)) scaleX(calc(var(--e-con-transform-flipX, 1) * var(--e-con-transform-scaleX, var(--e-con-transform-scale, 1)))) scaleY(calc(var(--e-con-transform-flipY, 1) * var(--e-con-transform-scaleY, var(--e-con-transform-scale, 1)))) skewX(var(--e-con-transform-skewX,0)) skewY(var(--e-con-transform-skewY,0));transform-origin:var(--e-con-transform-origin-y) var(--e-con-transform-origin-x)}.animated{animation-duration:1.25s}.animated.animated-slow{animation-duration:2s}.animated.animated-fast{animation-duration:.75s}.animated.infinite{animation-iteration-count:infinite}.animated.reverse{animation-direction:reverse;animation-fill-mode:forwards}@media (prefers-reduced-motion:reduce){.animated{animation:none!important}html *{transition-delay:0s!important;transition-duration:0s!important}}@media (max-width:767px){.elementor .elementor-hidden-mobile,.elementor .elementor-hidden-phone{display:none}}@media (min-width:-1) and (max-width:-1){.elementor .elementor-hidden-mobile_extra{display:none}}@media (min-width:768px) and (max-width:1024px){.elementor .elementor-hidden-tablet{display:none}}@media (min-width:-1) and (max-width:-1){.elementor .elementor-hidden-laptop,.elementor .elementor-hidden-tablet_extra{display:none}}@media (min-width:1025px) and (max-width:99999px){.elementor .elementor-hidden-desktop{display:none}}@media (min-width:-1){.elementor .elementor-hidden-widescreen{display:none}} /* elementor-post-12 */ .elementor-kit-12{--e-global-color-primary:#2E2D2B;--e-global-color-secondary:#8A6726;--e-global-color-text:#5C5248;--e-global-color-accent:#2E2A26;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-weight:100;--e-global-typography-secondary-font-family:"Lato";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Lato";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Montserrat";--e-global-typography-accent-font-weight:500;background-color:transparent;font-size:17px;line-height:1.6em;background-image:linear-gradient(80deg, #F2F0E4 0%, #F4F0E4 100%);}.elementor-kit-12 e-page-transition{background-color:#FFBC7D;}.elementor-kit-12 a{color:#664900;}.elementor-kit-12 a:hover{color:#000000;}.elementor-kit-12 h1{font-family:"Playfair Display", Sans-serif;font-size:52px;line-height:1.2em;}.elementor-kit-12 h2{font-family:"Playfair Display", Sans-serif;font-size:36px;font-weight:600;}.elementor-kit-12 h3{font-family:"Playfair Display", Sans-serif;font-size:32px;}.elementor-kit-12 h4{font-family:"Playfair Display", Sans-serif;}.elementor-kit-12 h5{font-family:"Playfair Display", Sans-serif;}.elementor-kit-12 h6{font-family:"Playfair Display", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1350px;}.e-con{--container-max-width:1350px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-12 h1{font-size:30px;}.elementor-kit-12 h2{font-size:26px;}.elementor-kit-12 h3{font-size:22px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* === ITPER 2026-10-06: ujednolicony złoty akcent === Kolor ustawiany w: Ustawienia witryny → Kolory globalne → „Złoty (akcent)” (#8A6726, kontrast 4,5:1 na tle strony). Poniżej elementy z CSS motywu przepięte na ten kolor globalny. */ body.elementor-kit-12 { --ko-price: var(--e-global-color-secondary); --ko-op-zloto-ciemne: var(--e-global-color-secondary); --ko-ti-zloto-ciemne: var(--e-global-color-secondary); --ko-nt-zloto-c: var(--e-global-color-secondary); } .unic-word, .ko-catbar__list a.is-active { color: var(--e-global-color-secondary); } .ko-catbar__list a::after { background: linear-gradient(to right, transparent, var(--e-global-color-secondary), transparent); } .woocommerce-page .elementor-widget-woocommerce-products.elementor-wc-products ul.products.elementor-grid li.product.product-category h2.woocommerce-loop-category__title::after, .ko-filters h5::after, .ko-price-filter h5::after, form.checkout #customer_details .woocommerce-billing-fields > h3::after, .woocommerce-checkout #order_review_heading::after { background: linear-gradient(90deg, var(--e-global-color-secondary) 0%, transparent 100%); } /* Dopisek przy cenie produktów na wymiar – mniejszy, jak dolny indeks, czcionka tekstu sklepu */ .ko-cena-mb { font-family: var(--e-global-typography-text-font-family), sans-serif; font-size: max(0.5em, 13px); font-weight: 400; letter-spacing: 0.02em; vertical-align: sub; line-height: 1; margin-left: 0.3em; white-space: nowrap; } /* ITPER 2026-10-06 (2): większa waga reguł – CSS motywu ładuje się po CSS witryny */ body .ko-catbar__list a:hover, body .ko-catbar__list a:focus-visible, body .ko-catbar__list a.is-active, body .ko-filters ul.product-categories li.current-cat > a, body .ko-filters ul.product-categories ul.children li > a:hover, body .ko-filters ul.woocommerce-widget-layered-nav-list li > a:hover, body .ko-filters ul.woocommerce-widget-layered-nav-list li.chosen > a { color: var(--e-global-color-secondary); } body .ko-catbar__list a::after { background: linear-gradient(to right, transparent, var(--e-global-color-secondary), transparent); } /* ITPER 2026-10-06 (3): gwiazdka pól wymaganych w kalkulatorze, „czytaj więcej” w opiniach */ body .elementor-widget-woocommerce-product-add-to-cart abbr.required { color: var(--e-global-color-secondary); } body .ti-read-more::after { background-color: var(--e-global-color-secondary); border-color: var(--e-global-color-secondary); } /* === koniec ITPER 2026-10-06 === */ /* ITPER 2026-10-11 wydajność: galeria produktu widoczna bez czekania na skrypt (LCP stron produktu) */ .woocommerce div.product div.images.woocommerce-product-gallery { opacity: 1 !important; }/* End custom CSS */ /* widget-search */ /*! elementor-pro - v3.34.0 - 26-01-2026 */ .elementor-widget-search{--e-search-white:#fff;--e-search-light-grey:#cdcdcd;--e-search-medium-grey:#515962;--e-search-dark-grey:#2d2d2d;--e-search-black:#000;--e-search-dark-red:#c36;--e-search-dark-purple:#336;--e-search-input-color:var(--e-search-medium-grey);--e-search-input-border-color:var(--e-search-light-grey);--e-search-input-border-radius:0;--e-search-input-gap:4px;--e-search-input-padding:16px;--e-search-input-padding-inline-start:16px;--e-search-input-padding-inline-end:16px;--e-search-input-padding-block-start:16px;--e-search-input-padding-block-end:16px;--e-search-input-transition:0.3s;--e-search-placeholder-color:var(--e-search-medium-grey);--e-search-icon-label-color:var(--e-search-medium-grey);--e-search-icon-label-size:24px;--e-search-icon-label-absolute-width:initial;--e-search-icon-clear-color:var(--e-search-light-grey);--e-search-icon-clear-size:12px;--e-search-icon-clear-absolute-width:initial;--e-search-icon-clear-transition:0.3s;--e-search-submit-color:var(--e-search-white);--e-search-submit-background-color:var(--e-search-dark-grey);--e-search-submit-border-color:none;--e-search-submit-border-type:none;--e-search-submit-border-radius:0;--e-search-submit-border-width:0px;--e-search-submit-padding:24px;--e-search-submit-margin-inline-start:8px;--e-search-submit-button-width:initial;--e-search-submit-button-flex-direction:row;--e-search-submit-hover-transition:0.3s;--e-search-pagination-numbers-padding-left:8px;--e-search-pagination-numbers-padding-right:8px;--e-search-icon-submit-color:var(--e-search-white);--e-search-submit-icon-gap:8px;--e-search-submit-icon-margin-inline-start:0px;--e-search-submit-icon-margin-inline-end:var(--e-search-submit-icon-gap);--e-search-icon-submit-size:24px;--e-search-submit-transition:0.3s;--e-search-results-background-color:var(--e-search-white);--e-search-results-border-color:var(--e-search-light-grey);--e-search-results-border-type:solid;--e-search-results-border-width:1px;--e-search-results-border-radius:0px;--e-search-results-padding:16px;--e-search-results-width:100%;--e-search-results-columns:1;--e-search-results-max-height:initial;--e-search-input-and-results-gap:8px;--e-search-results-transition:0.3s;--e-search-loop-item-equal-height:initial;--e-search-results-grid-auto-rows:initial;--e-search-results-inset-inline-start:initial;--e-search-results-inset-inline-end:initial;--e-search-results-transform:initial;--e-search-results-default-gap:16px;--e-search-results-column-gap:var(--e-search-results-default-gap);--e-search-results-row-gap:var(--e-search-results-default-gap);--e-search-pagination-inset-inline-start:initial;--e-search-pagination-inline-end:initial;--e-search-pagination-transform:initial;--e-search-pagination-border-radius:0px;--e-search-pagination-background-color:var(--e-search-black);--e-search-pagination-text-align:center;--e-search-pagination-justify-content:center;--e-search-pagination-color:var(--e-search-dark-red);--e-search-pagination-hover:var(--e-search-dark-purple);--e-search-pagination-current:var(--e-search-black);--e-search-pagination-page-numbers-gap:10px;--e-search-pagination-block-end-spacing:0px;--e-search-pagination-block-start-spacing:0px;--e-search-pagination-vertical-position:column;--e-search-nothing-found-padding-block-start:0;--e-search-nothing-found-padding-block-end:0;--e-search-nothing-found-results-columns:1;--e-search-nothing-found-message-color:var(--e-search-medium-grey);--e-search-nothing-found-message-alignment:center;--e-search-loader-icon-color:var(--e-search-black);--e-search-loader-icon-size:34px}.elementor-widget-search .e-search-form{display:flex}.elementor-widget-search .e-search-label{display:flex;position:relative;z-index:10}.elementor-widget-search .e-search-label>i,.elementor-widget-search .e-search-label>svg{inset-block-start:50%;inset-inline-start:var(--e-search-input-padding-inline-start);position:absolute;transform:translateY(-50%);transition:width 0s,height 0s}.elementor-widget-search .e-search-label>i:is(i),.elementor-widget-search .e-search-label>svg:is(i){color:var(--e-search-icon-label-color);font-size:var(--e-search-icon-label-size)}.elementor-widget-search .e-search-label>i:is(svg),.elementor-widget-search .e-search-label>svg:is(svg){fill:var(--e-search-icon-label-color);height:var(--e-search-icon-label-size);width:auto}.elementor-widget-search .e-search-input-wrapper{display:flex;flex:1;flex-direction:column;position:relative}.elementor-widget-search .e-search-input-wrapper>i,.elementor-widget-search .e-search-input-wrapper>svg{cursor:pointer;inset-block-start:50%;inset-inline-end:var(--e-search-input-padding-inline-end);position:absolute;transform:translateY(-50%);transition:color var(--e-search-icon-clear-transition),fill var(--e-search-icon-clear-transition),width 0s,height 0s}.elementor-widget-search .e-search-input-wrapper>i:is(i),.elementor-widget-search .e-search-input-wrapper>svg:is(i){color:var(--e-search-icon-clear-color);font-size:var(--e-search-icon-clear-size)}.elementor-widget-search .e-search-input-wrapper>i:is(svg),.elementor-widget-search .e-search-input-wrapper>svg:is(svg){fill:var(--e-search-icon-clear-color);height:var(--e-search-icon-clear-size);width:auto}.elementor-widget-search .e-search-input{--e-search-icons-min-height:max(var(--e-search-icon-clear-size),var(--e-search-icon-label-size));border-color:var(--e-search-input-border-color);border-radius:var(--e-search-input-border-radius);color:var(--e-search-input-color);height:100%;min-height:calc(var(--e-search-input-padding-block-end) + var(--e-search-input-padding-block-start) + var(--e-search-icons-min-height));padding-block-end:var(--e-search-input-padding-block-end);padding-block-start:var(--e-search-input-padding-block-start);padding-inline-end:calc(var(--e-search-input-padding-inline-end) + var(--e-search-icon-clear-absolute-width) + var(--e-search-input-gap));padding-inline-start:calc(var(--e-search-input-padding-inline-start) + var(--e-search-icon-label-absolute-width) + var(--e-search-input-gap));transition:padding-inline 0s}.elementor-widget-search .e-search-input::-moz-placeholder{color:var(--e-search-placeholder-color)}.elementor-widget-search .e-search-input::placeholder{color:var(--e-search-placeholder-color)}.elementor-widget-search .e-search-input.no-icon-clear{padding-inline-end:var(--e-search-input-padding-inline-end)}.elementor-widget-search .e-search-input.no-icon-label{padding-inline-start:var(--e-search-input-padding-inline-start)}.elementor-widget-search .e-search-input:focus{outline:none;transition:var(--e-search-input-transition)}.elementor-widget-search .e-search-input::-ms-clear,.elementor-widget-search .e-search-input::-ms-reveal{display:none;height:0;width:0}.elementor-widget-search .e-search-input::-webkit-search-cancel-button,.elementor-widget-search .e-search-input::-webkit-search-decoration,.elementor-widget-search .e-search-input::-webkit-search-results-button,.elementor-widget-search .e-search-input::-webkit-search-results-decoration{display:none}.elementor-widget-search .e-search-results-container{background-color:var(--e-search-results-background-color);border-radius:var(--e-search-results-border-radius);display:flex;height:-moz-fit-content;height:fit-content;inset-block-start:calc(100% + var(--e-search-input-and-results-gap));inset-inline-end:var(--e-search-results-inset-inline-end);inset-inline-start:var(--e-search-results-inset-inline-start);position:absolute;transform:var(--e-search-results-transform);width:var(--e-search-results-width);z-index:2000}.elementor-widget-search .e-search-results-container>div{border:var(--e-search-results-border-type) var(--e-search-results-border-width) var(--e-search-results-border-color);border-radius:var(--e-search-results-border-radius);max-height:var(--e-search-results-max-height);overflow:auto;padding:var(--e-search-results-padding);width:100%}.elementor-widget-search .e-search-results-container>div:empty{display:none}.elementor-widget-search .e-search-results-container>div .e-loop-item .elementor-section-wrap>.e-con,.elementor-widget-search .e-search-results-container>div .e-loop-item>.e-con,.elementor-widget-search .e-search-results-container>div .e-loop-item>.elementor-section,.elementor-widget-search .e-search-results-container>div .e-loop-item>.elementor-section>.elementor-container{height:var(--e-search-loop-item-equal-height)}.elementor-widget-search .e-search-results{display:none}.elementor-widget-search .e-search-results-list{-moz-column-gap:var(--e-search-results-column-gap);column-gap:var(--e-search-results-column-gap);display:grid;grid-auto-rows:var(--e-search-results-grid-auto-rows);grid-template-columns:repeat(var(--e-search-results-columns),1fr);row-gap:var(--e-search-results-row-gap)}.elementor-widget-search .e-search-loader svg{display:flex;width:var(--e-search-loader-icon-size);fill:var(--e-search-loader-icon-color);animation:rotate 4s linear infinite;margin:0 auto;transform:rotate(45deg)}.elementor-widget-search .e-search .e-search-submit{align-items:center;background-color:var(--e-search-submit-background-color);border-color:var(--e-search-submit-border-color);border-radius:var(--e-search-submit-border-radius);border-style:var(--e-search-submit-border-type);border-width:var(--e-search-submit-border-width);color:var(--e-search-submit-color);display:flex;flex-direction:var(--e-search-submit-button-flex-direction);font-size:var(--e-search-form-submit-icon-size);margin-inline-start:var(--e-search-submit-margin-inline-start);padding:var(--e-search-submit-padding);transition:var(--e-search-submit-hover-transition);width:var(--e-search-submit-button-width)}.elementor-widget-search .e-search .e-search-submit:focus{transition:--e-search-submit-transition}.elementor-widget-search .e-search .e-search-submit:focus:not(:focus-visible){outline:none}.elementor-widget-search .e-search .e-search-submit>i,.elementor-widget-search .e-search .e-search-submit>svg{margin-inline-end:var(--e-search-submit-icon-margin-inline-end);margin-inline-start:var(--e-search-submit-icon-margin-inline-start);transition:inherit}.elementor-widget-search .e-search .e-search-submit>i:is(i),.elementor-widget-search .e-search .e-search-submit>svg:is(i){color:var(--e-search-icon-submit-color);font-size:var(--e-search-icon-submit-size)}.elementor-widget-search .e-search .e-search-submit>i:is(svg),.elementor-widget-search .e-search .e-search-submit>svg:is(svg){fill:var(--e-search-icon-submit-color);height:var(--e-search-icon-submit-size);width:auto}.elementor-widget-search .e-search-input-wrapper,.elementor-widget-search .e-search-label *{transition:var(--e-search-input-transition)}.elementor-widget-search .e-search-nothing-found-message{color:var(--e-search-nothing-found-message-color);padding-block-end:var(--e-search-nothing-found-padding-block-end);padding-block-start:var(--e-search-nothing-found-padding-block-start);text-align:var(--e-search-nothing-found-message-alignment)}.elementor-widget-search .hidden{opacity:0;visibility:hidden}.elementor-widget-search .hide-loader .e-search-loader{display:none}.elementor-widget-search .hide-loader .e-search-results{display:flex;flex-direction:var(--e-search-pagination-vertical-position)}.elementor-widget-search .no-results>div{grid-template-columns:var(--e-search-nothing-found-results-columns)}.elementor-widget-search .e-search-results-loader{width:var(--e-search-loader-icon-size);fill:var(--e-search-loader-icon-color);animation:rotate 4s linear infinite;margin:0 auto;transform:rotate(45deg)}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.elementor-widget-search .elementor-pagination{-moz-column-gap:var(--e-search-pagination-page-numbers-gap);column-gap:var(--e-search-pagination-page-numbers-gap);display:flex;justify-content:var(--e-search-pagination-justify-content);padding-block-end:var(--e-search-pagination-block-end-spacing);padding-block-start:var(--e-search-pagination-block-start-spacing)}.elementor-widget-search .elementor-pagination>a{color:var(--e-search-pagination-color)}.elementor-widget-search .elementor-pagination>a:hover{color:var(--e-search-pagination-hover)}.elementor-widget-search .elementor-pagination>.page-numbers.current{color:var(--e-search-pagination-current)}.elementor-widget-search .elementor-pagination>.next,.elementor-widget-search .elementor-pagination>.prev{color:var(--e-search-pagination-color)}.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers{display:none}.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.next,.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.prev{color:var(--e-search-pagination-color);display:initial}.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.next:hover,.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.prev:hover{color:var(--e-search-pagination-hover)}.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.next.inactive,.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.next.inactive:hover,.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.prev.inactive,.elementor-widget-search .hide-pagination-numbers .elementor-pagination>.page-numbers.prev.inactive:hover{color:var(--e-search-pagination-color)} /* widget-image */ .elementor-widget-image{text-align:center}.elementor-widget-image a{display:inline-block}.elementor-widget-image a img[src$=".svg"]{width:48px}.elementor-widget-image img{display:inline-block;vertical-align:middle} /* widget-nav-menu */ /*! elementor-pro - v3.34.0 - 26-01-2026 */ .site-main .menu-navigation-container{overflow:visible}.elementor-item:after,.elementor-item:before{display:block;position:absolute;transition:.3s;transition-timing-function:cubic-bezier(.58,.3,.005,1)}.elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{opacity:0}.elementor-item-active:after,.elementor-item-active:before,.elementor-item.highlighted:after,.elementor-item.highlighted:before,.elementor-item:focus:after,.elementor-item:focus:before,.elementor-item:hover:after,.elementor-item:hover:before{transform:scale(1)}.e--pointer-double-line .elementor-item:after,.e--pointer-double-line .elementor-item:before,.e--pointer-overline .elementor-item:after,.e--pointer-overline .elementor-item:before,.e--pointer-underline .elementor-item:after,.e--pointer-underline .elementor-item:before{background-color:#3f444b;height:3px;left:0;width:100%;z-index:2}.e--pointer-double-line.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-double-line.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-overline.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-overline.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-underline.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-underline.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{height:0;left:50%;width:0}.e--pointer-double-line.e--animation-drop-out .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-overline.e--animation-drop-out .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-underline.e--animation-drop-out .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{top:10px}.e--pointer-double-line.e--animation-drop-out .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-overline.e--animation-drop-out .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-underline.e--animation-drop-out .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after{bottom:10px}.e--pointer-double-line.e--animation-drop-in .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-overline.e--animation-drop-in .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-underline.e--animation-drop-in .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{top:-10px}.e--pointer-double-line.e--animation-drop-in .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-overline.e--animation-drop-in .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-underline.e--animation-drop-in .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after{bottom:-10px}.e--pointer-double-line.e--animation-none,.e--pointer-double-line.e--animation-none .elementor-item,.e--pointer-double-line.e--animation-none .elementor-item:after,.e--pointer-double-line.e--animation-none .elementor-item:before,.e--pointer-double-line.e--animation-none .elementor-item:focus,.e--pointer-double-line.e--animation-none .elementor-item:hover,.e--pointer-double-line.e--animation-none:after,.e--pointer-double-line.e--animation-none:before,.e--pointer-double-line.e--animation-none:focus,.e--pointer-double-line.e--animation-none:hover,.e--pointer-overline.e--animation-none,.e--pointer-overline.e--animation-none .elementor-item,.e--pointer-overline.e--animation-none .elementor-item:after,.e--pointer-overline.e--animation-none .elementor-item:before,.e--pointer-overline.e--animation-none .elementor-item:focus,.e--pointer-overline.e--animation-none .elementor-item:hover,.e--pointer-overline.e--animation-none:after,.e--pointer-overline.e--animation-none:before,.e--pointer-overline.e--animation-none:focus,.e--pointer-overline.e--animation-none:hover,.e--pointer-underline.e--animation-none,.e--pointer-underline.e--animation-none .elementor-item,.e--pointer-underline.e--animation-none .elementor-item:after,.e--pointer-underline.e--animation-none .elementor-item:before,.e--pointer-underline.e--animation-none .elementor-item:focus,.e--pointer-underline.e--animation-none .elementor-item:hover,.e--pointer-underline.e--animation-none:after,.e--pointer-underline.e--animation-none:before,.e--pointer-underline.e--animation-none:focus,.e--pointer-underline.e--animation-none:hover{transition-duration:0s}.e--pointer-double-line .elementor-item:before,.e--pointer-overline .elementor-item:before{content:"";top:0}.e--pointer-double-line.e--animation-slide .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before,.e--pointer-overline.e--animation-slide .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{left:-20px;width:10px}.e--pointer-double-line .elementor-item:after,.e--pointer-underline .elementor-item:after{bottom:0;content:""}.e--pointer-double-line.e--animation-slide .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after,.e--pointer-underline.e--animation-slide .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):after{inset-inline-start:100%;width:10px}.e--pointer-framed .elementor-item:after,.e--pointer-framed .elementor-item:before{background:transparent;border:3px solid #3f444b;bottom:0;left:0;right:0;top:0}.e--pointer-framed .elementor-item:before{content:""}.e--pointer-framed.e--animation-grow .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{transform:scale(.75)}.e--pointer-framed.e--animation-shrink .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{transform:scale(1.25)}.e--pointer-framed.e--animation-grow .elementor-item:before,.e--pointer-framed.e--animation-shrink .elementor-item:before{transition:opacity .2s,transform .4s}.e--pointer-framed.e--animation-draw .elementor-item:after,.e--pointer-framed.e--animation-draw .elementor-item:before{height:3px;width:3px}.e--pointer-framed.e--animation-draw .elementor-item:before{border-block-end-width:3px;border-block-start-width:0;border-inline-end-width:0;border-inline-start-width:3px;transition:width .1s .2s,height .1s .3s,opacity .12s .22s}.e--pointer-framed.e--animation-draw .elementor-item:after{border-block-end-width:0;border-block-start-width:3px;border-inline-end-width:3px;border-inline-start-width:0;content:"";inset-block-end:0;inset-block-start:auto;inset-inline-end:0;inset-inline-start:auto;transition:width .1s,height .1s .1s,opacity .02s .18s}.e--pointer-framed.e--animation-draw .elementor-item-active:after,.e--pointer-framed.e--animation-draw .elementor-item-active:before,.e--pointer-framed.e--animation-draw .elementor-item.highlighted:after,.e--pointer-framed.e--animation-draw .elementor-item.highlighted:before,.e--pointer-framed.e--animation-draw .elementor-item:focus:after,.e--pointer-framed.e--animation-draw .elementor-item:focus:before,.e--pointer-framed.e--animation-draw .elementor-item:hover:after,.e--pointer-framed.e--animation-draw .elementor-item:hover:before{height:100%;width:100%}.e--pointer-framed.e--animation-draw .elementor-item-active:before,.e--pointer-framed.e--animation-draw .elementor-item.highlighted:before,.e--pointer-framed.e--animation-draw .elementor-item:focus:before,.e--pointer-framed.e--animation-draw .elementor-item:hover:before{transition:opacity .02s,height .1s,width .1s .1s}.e--pointer-framed.e--animation-draw .elementor-item-active:after,.e--pointer-framed.e--animation-draw .elementor-item.highlighted:after,.e--pointer-framed.e--animation-draw .elementor-item:focus:after,.e--pointer-framed.e--animation-draw .elementor-item:hover:after{transition:opacity .02s .2s,height .1s .2s,width .1s .3s}.e--pointer-framed.e--animation-corners .elementor-item:after,.e--pointer-framed.e--animation-corners .elementor-item:before{height:3px;width:3px}.e--pointer-framed.e--animation-corners .elementor-item:before{border-block-end-width:0;border-block-start-width:3px;border-inline-end-width:0;border-inline-start-width:3px}.e--pointer-framed.e--animation-corners .elementor-item:after{border-block-end-width:3px;border-block-start-width:0;border-inline-end-width:3px;border-inline-start-width:0;content:"";inset-block-end:0;inset-block-start:auto;inset-inline-end:0;inset-inline-start:auto}.e--pointer-framed.e--animation-corners .elementor-item-active:after,.e--pointer-framed.e--animation-corners .elementor-item-active:before,.e--pointer-framed.e--animation-corners .elementor-item.highlighted:after,.e--pointer-framed.e--animation-corners .elementor-item.highlighted:before,.e--pointer-framed.e--animation-corners .elementor-item:focus:after,.e--pointer-framed.e--animation-corners .elementor-item:focus:before,.e--pointer-framed.e--animation-corners .elementor-item:hover:after,.e--pointer-framed.e--animation-corners .elementor-item:hover:before{height:100%;transition:opacity 2ms,width .4s,height .4s;width:100%}.e--pointer-framed.e--animation-none,.e--pointer-framed.e--animation-none .elementor-item,.e--pointer-framed.e--animation-none .elementor-item:after,.e--pointer-framed.e--animation-none .elementor-item:before,.e--pointer-framed.e--animation-none .elementor-item:focus,.e--pointer-framed.e--animation-none .elementor-item:hover,.e--pointer-framed.e--animation-none:after,.e--pointer-framed.e--animation-none:before,.e--pointer-framed.e--animation-none:focus,.e--pointer-framed.e--animation-none:hover{transition-duration:0s}.e--pointer-background .elementor-item:after,.e--pointer-background .elementor-item:before{content:"";transition:.3s}.e--pointer-background .elementor-item:before{background:#3f444b;inset:0;z-index:-1}.e--pointer-background .elementor-item-active,.e--pointer-background .elementor-item.highlighted,.e--pointer-background .elementor-item:focus,.e--pointer-background .elementor-item:hover{color:#fff}.e--pointer-background.e--animation-grow .elementor-item:before{transform:scale(.5)}.e--pointer-background.e--animation-grow .elementor-item-active:before,.e--pointer-background.e--animation-grow .elementor-item.highlighted:before,.e--pointer-background.e--animation-grow .elementor-item:focus:before,.e--pointer-background.e--animation-grow .elementor-item:hover:before{opacity:1;transform:scale(1)}.e--pointer-background.e--animation-shrink .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{transform:scale(1.2);transition:.3s}.e--pointer-background.e--animation-shrink .elementor-item-active:before,.e--pointer-background.e--animation-shrink .elementor-item.highlighted:before,.e--pointer-background.e--animation-shrink .elementor-item:focus:before,.e--pointer-background.e--animation-shrink .elementor-item:hover:before{transition:opacity .15s,transform .4s}.e--pointer-background.e--animation-sweep-left .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{left:100%}.e--pointer-background.e--animation-sweep-right .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{right:100%}.e--pointer-background.e--animation-sweep-up .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{top:100%}.e--pointer-background.e--animation-sweep-down .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{bottom:100%}.e--pointer-background.e--animation-shutter-out-vertical .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{bottom:50%;top:50%}.e--pointer-background.e--animation-shutter-out-horizontal .elementor-item:not(:hover):not(:focus):not(.elementor-item-active):not(.highlighted):before{left:50%;right:50%}.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:after,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:after{background:#3f444b;inset:0;z-index:-1}.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:before{bottom:100%;top:0}.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:after{bottom:0;top:100%}.e--pointer-background.e--animation-shutter-in-vertical .elementor-item-active:before,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item.highlighted:before,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:focus:before,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:hover:before{bottom:50%}.e--pointer-background.e--animation-shutter-in-vertical .elementor-item-active:after,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item.highlighted:after,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:focus:after,.e--pointer-background.e--animation-shutter-in-vertical .elementor-item:hover:after{top:50%}.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:before{left:100%;right:0}.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:after{left:0;right:100%}.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item-active:before,.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item.highlighted:before,.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:focus:before,.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:hover:before{left:50%}.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item-active:after,.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item.highlighted:after,.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:focus:after,.e--pointer-background.e--animation-shutter-in-horizontal .elementor-item:hover:after{right:50%}.e--pointer-background.e--animation-none,.e--pointer-background.e--animation-none .elementor-item,.e--pointer-background.e--animation-none .elementor-item:after,.e--pointer-background.e--animation-none .elementor-item:before,.e--pointer-background.e--animation-none .elementor-item:focus,.e--pointer-background.e--animation-none .elementor-item:hover,.e--pointer-background.e--animation-none:after,.e--pointer-background.e--animation-none:before,.e--pointer-background.e--animation-none:focus,.e--pointer-background.e--animation-none:hover{transition-duration:0s}.e--pointer-text.e--animation-skew .elementor-item:focus,.e--pointer-text.e--animation-skew .elementor-item:hover{transform:skew(-8deg)}.e--pointer-text.e--animation-grow .elementor-item:focus,.e--pointer-text.e--animation-grow .elementor-item:hover{transform:scale(1.2)}.e--pointer-text.e--animation-shrink .elementor-item:focus,.e--pointer-text.e--animation-shrink .elementor-item:hover{transform:scale(.8)}.e--pointer-text.e--animation-float .elementor-item:focus,.e--pointer-text.e--animation-float .elementor-item:hover{transform:translateY(-8px)}.e--pointer-text.e--animation-sink .elementor-item:focus,.e--pointer-text.e--animation-sink .elementor-item:hover{transform:translateY(8px)}.e--pointer-text.e--animation-rotate .elementor-item:focus,.e--pointer-text.e--animation-rotate .elementor-item:hover{transform:rotate(6deg)}.e--pointer-text.e--animation-none,.e--pointer-text.e--animation-none .elementor-item,.e--pointer-text.e--animation-none .elementor-item:after,.e--pointer-text.e--animation-none .elementor-item:before,.e--pointer-text.e--animation-none .elementor-item:focus,.e--pointer-text.e--animation-none .elementor-item:hover,.e--pointer-text.e--animation-none:after,.e--pointer-text.e--animation-none:before,.e--pointer-text.e--animation-none:focus,.e--pointer-text.e--animation-none:hover{transition-duration:0s}.elementor-nav-menu--main .elementor-nav-menu a{transition:.4s}.elementor-nav-menu--main .elementor-nav-menu a,.elementor-nav-menu--main .elementor-nav-menu a.highlighted,.elementor-nav-menu--main .elementor-nav-menu a:focus,.elementor-nav-menu--main .elementor-nav-menu a:hover{padding:13px 20px}.elementor-nav-menu--main .elementor-nav-menu a.current{background:#1f2124;color:#fff}.elementor-nav-menu--main .elementor-nav-menu a.disabled{background:#3f444b;color:#88909b}.elementor-nav-menu--main .elementor-nav-menu ul{border-style:solid;border-width:0;padding:0;position:absolute;width:12em}.elementor-nav-menu--main .elementor-nav-menu span.scroll-down,.elementor-nav-menu--main .elementor-nav-menu span.scroll-up{background:#fff;display:none;height:20px;overflow:hidden;position:absolute;visibility:hidden}.elementor-nav-menu--main .elementor-nav-menu span.scroll-down-arrow,.elementor-nav-menu--main .elementor-nav-menu span.scroll-up-arrow{border:8px dashed transparent;border-bottom:8px solid #33373d;height:0;inset-block-start:-2px;inset-inline-start:50%;margin-inline-start:-8px;overflow:hidden;position:absolute;width:0}.elementor-nav-menu--main .elementor-nav-menu span.scroll-down-arrow{border-color:#33373d transparent transparent;border-style:solid dashed dashed;top:6px}.elementor-nav-menu--main .elementor-nav-menu--dropdown .sub-arrow .e-font-icon-svg,.elementor-nav-menu--main .elementor-nav-menu--dropdown .sub-arrow i{transform:rotate(calc(-90deg * var(--direction-multiplier, 1)))}.elementor-nav-menu--main .elementor-nav-menu--dropdown .sub-arrow .e-font-icon-svg{fill:currentColor;height:1em;width:1em}.elementor-nav-menu--layout-horizontal{display:flex}.elementor-nav-menu--layout-horizontal .elementor-nav-menu{display:flex;flex-wrap:wrap}.elementor-nav-menu--layout-horizontal .elementor-nav-menu a{flex-grow:1;white-space:nowrap}.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li{display:flex}.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li ul,.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li>.scroll-down{top:100%!important}.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li:not(:first-child)>a{margin-inline-start:var(--e-nav-menu-horizontal-menu-item-margin)}.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li:not(:first-child)>.scroll-down,.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li:not(:first-child)>.scroll-up,.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li:not(:first-child)>ul{inset-inline-start:var(--e-nav-menu-horizontal-menu-item-margin)!important}.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li:not(:last-child)>a{margin-inline-end:var(--e-nav-menu-horizontal-menu-item-margin)}.elementor-nav-menu--layout-horizontal .elementor-nav-menu>li:not(:last-child):after{align-self:center;border-color:var(--e-nav-menu-divider-color,#000);border-left-style:var(--e-nav-menu-divider-style,solid);border-left-width:var(--e-nav-menu-divider-width,2px);content:var(--e-nav-menu-divider-content,none);height:var(--e-nav-menu-divider-height,35%)}.elementor-nav-menu__align-right .elementor-nav-menu{justify-content:flex-end;margin-left:auto}.elementor-nav-menu__align-right .elementor-nav-menu--layout-vertical>ul>li>a{justify-content:flex-end}.elementor-nav-menu__align-left .elementor-nav-menu{justify-content:flex-start;margin-right:auto}.elementor-nav-menu__align-left .elementor-nav-menu--layout-vertical>ul>li>a{justify-content:flex-start}.elementor-nav-menu__align-start .elementor-nav-menu{justify-content:flex-start;margin-inline-end:auto}.elementor-nav-menu__align-start .elementor-nav-menu--layout-vertical>ul>li>a{justify-content:flex-start}.elementor-nav-menu__align-end .elementor-nav-menu{justify-content:flex-end;margin-inline-start:auto}.elementor-nav-menu__align-end .elementor-nav-menu--layout-vertical>ul>li>a{justify-content:flex-end}.elementor-nav-menu__align-center .elementor-nav-menu{justify-content:center;margin-inline-end:auto;margin-inline-start:auto}.elementor-nav-menu__align-center .elementor-nav-menu--layout-vertical>ul>li>a{justify-content:center}.elementor-nav-menu__align-justify .elementor-nav-menu--layout-horizontal .elementor-nav-menu{width:100%}.elementor-nav-menu__align-justify .elementor-nav-menu--layout-horizontal .elementor-nav-menu>li{flex-grow:1}.elementor-nav-menu__align-justify .elementor-nav-menu--layout-horizontal .elementor-nav-menu>li>a{justify-content:center}.elementor-widget-nav-menu:not(.elementor-nav-menu--toggle) .elementor-menu-toggle{display:none}.elementor-widget-nav-menu .elementor-widget-container,.elementor-widget-nav-menu:not(:has(.elementor-widget-container)):not([class*=elementor-hidden-]){display:flex;flex-direction:column}.elementor-nav-menu{position:relative;z-index:2}.elementor-nav-menu:after{clear:both;content:" ";display:block;font:0/0 serif;height:0;overflow:hidden;visibility:hidden}.elementor-nav-menu,.elementor-nav-menu li,.elementor-nav-menu ul{display:block;line-height:normal;list-style:none;margin:0;padding:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}.elementor-nav-menu ul{display:none}.elementor-nav-menu ul ul a,.elementor-nav-menu ul ul a:active,.elementor-nav-menu ul ul a:focus,.elementor-nav-menu ul ul a:hover{border-left:16px solid transparent}.elementor-nav-menu ul ul ul a,.elementor-nav-menu ul ul ul a:active,.elementor-nav-menu ul ul ul a:focus,.elementor-nav-menu ul ul ul a:hover{border-left:24px solid transparent}.elementor-nav-menu ul ul ul ul a,.elementor-nav-menu ul ul ul ul a:active,.elementor-nav-menu ul ul ul ul a:focus,.elementor-nav-menu ul ul ul ul a:hover{border-left:32px solid transparent}.elementor-nav-menu ul ul ul ul ul a,.elementor-nav-menu ul ul ul ul ul a:active,.elementor-nav-menu ul ul ul ul ul a:focus,.elementor-nav-menu ul ul ul ul ul a:hover{border-left:40px solid transparent}.elementor-nav-menu a,.elementor-nav-menu li{position:relative}.elementor-nav-menu li{border-width:0}.elementor-nav-menu a{align-items:center;display:flex}.elementor-nav-menu a,.elementor-nav-menu a:focus,.elementor-nav-menu a:hover{line-height:20px;padding:10px 20px}.elementor-nav-menu a.current{background:#1f2124;color:#fff}.elementor-nav-menu a.disabled{color:#88909b;cursor:not-allowed}.elementor-nav-menu .e-plus-icon:before{content:"+"}.elementor-nav-menu .sub-arrow{align-items:center;display:flex;line-height:1;margin-block-end:-10px;margin-block-start:-10px;padding:10px;padding-inline-end:0}.elementor-nav-menu .sub-arrow i{pointer-events:none}.elementor-nav-menu .sub-arrow .fa.fa-chevron-down,.elementor-nav-menu .sub-arrow .fas.fa-chevron-down{font-size:.7em}.elementor-nav-menu .sub-arrow .e-font-icon-svg{height:1em;width:1em}.elementor-nav-menu .sub-arrow .e-font-icon-svg.fa-svg-chevron-down{height:.7em;width:.7em}.elementor-nav-menu--dropdown .elementor-item.elementor-item-active,.elementor-nav-menu--dropdown .elementor-item.highlighted,.elementor-nav-menu--dropdown .elementor-item:focus,.elementor-nav-menu--dropdown .elementor-item:hover,.elementor-sub-item.elementor-item-active,.elementor-sub-item.highlighted,.elementor-sub-item:focus,.elementor-sub-item:hover{background-color:#3f444b;color:#fff}.elementor-menu-toggle{align-items:center;background-color:rgba(0,0,0,.05);border:0 solid;border-radius:3px;color:#33373d;cursor:pointer;display:flex;font-size:var(--nav-menu-icon-size,22px);justify-content:center;padding:.25em}.elementor-menu-toggle.elementor-active .elementor-menu-toggle__icon--open,.elementor-menu-toggle:not(.elementor-active) .elementor-menu-toggle__icon--close{display:none}.elementor-menu-toggle .e-font-icon-svg{fill:#33373d;height:1em;width:1em}.elementor-menu-toggle svg{height:auto;width:1em;fill:var(--nav-menu-icon-color,currentColor)}span.elementor-menu-toggle__icon--close,span.elementor-menu-toggle__icon--open{line-height:1}.elementor-nav-menu--dropdown{background-color:#fff;font-size:13px}.elementor-nav-menu--dropdown-none .elementor-menu-toggle,.elementor-nav-menu--dropdown-none .elementor-nav-menu--dropdown{display:none}.elementor-nav-menu--dropdown.elementor-nav-menu__container{margin-top:10px;overflow-x:hidden;overflow-y:auto;transform-origin:top;transition:max-height .3s,transform .3s}.elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-sub-item{font-size:.85em}.elementor-nav-menu--dropdown a{color:#33373d}.elementor-nav-menu--dropdown a.current{background:#1f2124;color:#fff}.elementor-nav-menu--dropdown a.disabled{color:#b3b3b3}ul.elementor-nav-menu--dropdown a,ul.elementor-nav-menu--dropdown a:focus,ul.elementor-nav-menu--dropdown a:hover{border-inline-start:8px solid transparent;text-shadow:none}.elementor-nav-menu__text-align-center .elementor-nav-menu--dropdown .elementor-nav-menu a{justify-content:center}.elementor-nav-menu--toggle{--menu-height:100vh}.elementor-nav-menu--toggle .elementor-menu-toggle:not(.elementor-active)+.elementor-nav-menu__container{max-height:0;overflow:hidden;transform:scaleY(0)}.elementor-nav-menu--toggle .elementor-menu-toggle.elementor-active+.elementor-nav-menu__container{animation:hide-scroll .3s backwards;max-height:var(--menu-height);transform:scaleY(1)}.elementor-nav-menu--stretch .elementor-nav-menu__container.elementor-nav-menu--dropdown{position:absolute;z-index:9997}@media (max-width:767px){.elementor-nav-menu--dropdown-mobile .elementor-nav-menu--main{display:none}}@media (min-width:768px){.elementor-nav-menu--dropdown-mobile .elementor-menu-toggle,.elementor-nav-menu--dropdown-mobile .elementor-nav-menu--dropdown{display:none}.elementor-nav-menu--dropdown-mobile nav.elementor-nav-menu--dropdown.elementor-nav-menu__container{overflow-y:hidden}}@media (max-width:-1){.elementor-nav-menu--dropdown-mobile_extra .elementor-nav-menu--main{display:none}}@media (min-width:-1){.elementor-nav-menu--dropdown-mobile_extra .elementor-menu-toggle,.elementor-nav-menu--dropdown-mobile_extra .elementor-nav-menu--dropdown{display:none}.elementor-nav-menu--dropdown-mobile_extra nav.elementor-nav-menu--dropdown.elementor-nav-menu__container{overflow-y:hidden}}@media (max-width:1024px){.elementor-nav-menu--dropdown-tablet .elementor-nav-menu--main{display:none}}@media (min-width:1025px){.elementor-nav-menu--dropdown-tablet .elementor-menu-toggle,.elementor-nav-menu--dropdown-tablet .elementor-nav-menu--dropdown{display:none}.elementor-nav-menu--dropdown-tablet nav.elementor-nav-menu--dropdown.elementor-nav-menu__container{overflow-y:hidden}}@media (max-width:-1){.elementor-nav-menu--dropdown-tablet_extra .elementor-nav-menu--main{display:none}}@media (min-width:-1){.elementor-nav-menu--dropdown-tablet_extra .elementor-menu-toggle,.elementor-nav-menu--dropdown-tablet_extra .elementor-nav-menu--dropdown{display:none}.elementor-nav-menu--dropdown-tablet_extra nav.elementor-nav-menu--dropdown.elementor-nav-menu__container{overflow-y:hidden}}@keyframes hide-scroll{0%,to{overflow:hidden}} /* widget-heading */ .elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}