/* PIUROPRINT layout/components. Canonical tokens and primitives live in theme.css. */
/* Child-theme base: do not depend on Astra's presentation reset. */
html{box-sizing:border-box;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
body.pp-body{box-sizing:inherit;margin:0;font-family:var(--pp-font);background:var(--pp-bg);color:var(--pp-text);}
body.pp-body *,body.pp-body *::before,body.pp-body *::after{box-sizing:inherit;}
body.pp-body button,body.pp-body input,body.pp-body optgroup,body.pp-body select,body.pp-body textarea{font:inherit;}
/* A reset must not outrank component image heights (.component img). */
:where(body.pp-body) img{max-width:100%;height:auto;}
html:has(body.pp-body),body.pp-body{overflow-x:clip;}
/* .pp-header — sticky, ~81px. Без цього будь-який якір/scrollIntoView зупиняється так,
   що верх цільового блоку лишається під шапкою й вона його зрізає. */
html:has(body.pp-body){scroll-padding-top:96px;}
.pp-wrap{width:calc(100% - var(--pp-shell-inset));max-width:var(--pp-container);margin-left:auto;margin-right:auto;}
/* Ann bar */
.pp-ann-bar{background:var(--pp-dark);padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07);}
.pp-ann-bar__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;overflow:visible;}
.pp-ann-bar__items{display:flex;align-items:center;gap:16px;font-size:var(--pp-fs-xs, 12px);font-weight:500;color:#fff;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;min-width:0;}
.pp-ann-bar__items::-webkit-scrollbar{display:none;}
.pp-ann-bar__items .pp-sep,.pp-ann-bar__items .pp-ann-sep{color:rgba(255,255,255,.2);}
.pp-ann-item{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;}
.pp-ann-item svg{color:var(--pp-orange);flex-shrink:0;}
.pp-ann-bar__right{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.pp-lang-globe{display:inline-flex;align-items:center;color:#CBD5E1;margin-right:-4px;}
.pp-ann-bar__login{display:inline-flex;align-items:center;gap:6px;font-size:var(--pp-fs-xs, 12px);font-weight:600;color:#CBD5E1;text-decoration:none;}
.pp-ann-bar__login svg{flex-shrink:0;}
.pp-ann-bar__login:hover{color:var(--pp-orange);}
.pp-lang-menu{position:relative;color:#CBD5E1;font-size:var(--pp-fs-xs, 12px);font-weight:700;}
.pp-lang-menu>summary{list-style:none;}
.pp-lang-menu>summary::-webkit-details-marker{display:none;}
/* Language trigger stays lightweight: this is a selector, not another primary button. */
.pp-lang-menu__toggle{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 3px;border:0;background:transparent;color:#CBD5E1;cursor:pointer;user-select:none;transition:color .2s;}
.pp-lang-menu__toggle:hover,.pp-lang-menu[open] .pp-lang-menu__toggle{color:#fff;}
.pp-lang-menu__globe{flex:0 0 auto;opacity:.86;}
.pp-lang-menu__chevron{flex:0 0 auto;transition:transform .18s;}
.pp-lang-menu[open] .pp-lang-menu__chevron{transform:rotate(180deg);}
.pp-lang-menu__panel{position:absolute;z-index:2600;top:calc(100% + 7px);right:0;min-width:150px;padding:6px;background:#fff;border:1px solid var(--pp-border);border-radius:10px;box-shadow:0 14px 32px rgba(15,23,42,.18);}
.pp-lang-menu__panel a{display:flex;align-items:center;gap:10px;min-height:36px;padding:7px 9px;border-radius:7px;color:var(--pp-text-2,#475569);text-decoration:none;white-space:nowrap;}
.pp-lang-menu__panel a:hover{background:#F8FAFC;color:var(--pp-orange);}
.pp-lang-menu__panel a.is-current{background:var(--pp-orange-light);color:var(--pp-orange);}
.pp-lang-menu__code{min-width:24px;font-weight:800;letter-spacing:.04em;}
.pp-lang-menu__name{font-weight:600;}
.pp-ann-cart{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:32px;color:#CBD5E1;text-decoration:none;border-radius:8px;transition:color .2s,background .2s;}
.pp-ann-cart:hover{color:var(--pp-orange);background:rgba(255,255,255,.06);}
.pp-ann-cart .pp-cart-count{top:-4px;right:-5px;}
/* Header */
.pp-header{background:#fff;border-bottom:1px solid var(--pp-border);position:sticky;top:0;z-index:200;box-shadow:0 2px 12px rgba(0,0,0,.06);}
.pp-header__inner{display:flex;align-items:center;height:69px;}
.pp-logo{flex-shrink:0;display:flex;flex-direction:column;line-height:1;text-decoration:none;}
.pp-logo__name{display:inline-flex;align-items:baseline;}
.pp-logo__piuro{font-weight:800;color:var(--pp-dark);letter-spacing:-.5px;}
.pp-logo__print{font-weight:800;color:var(--pp-orange);letter-spacing:-.5px;}
.pp-logo__sub{width:100%;font-weight:600;color:#9CA3AF;letter-spacing:.15em;text-align:center;text-transform:uppercase;margin-top:2px;}

/* Minimal cart/checkout chrome: logo + one contextual return action. */
body.pp-co-body{background:var(--pp-bg);}
.pp-co-header{position:sticky;z-index:100;top:0;background:#fff;border-bottom:1px solid var(--pp-border);box-shadow:0 2px 12px rgba(15,23,42,.05);}
.pp-co-header__inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:30px;}
.pp-co-header__back{display:inline-flex;align-items:center;gap:7px;margin-left:auto;color:var(--pp-text-2);font-size:var(--pp-fs-sm, 13px);font-weight:700;text-decoration:none;}
.pp-co-header__back svg{width:15px;height:15px;}
.pp-co-header__back:hover{color:var(--pp-orange);}
/* gap стискається: 8 пунктів меню (з «Opinie») не мали б місця при фіксованих 48px.
   Бюджет рядка при .pp-wrap max-width:1800 — лого 264 + пошук 274 + дії 223 + 3×32 gap
   = 857px, на меню лишається 943. Текст 8 пунктів на 18px = 685 → на 7 проміжків
   лишається 36px. Стеля 26px тримає запас; 48px не вміщались НІКОЛИ (звідси зрізана CTA). */
.pp-nav{display:flex;align-items:center;flex:1;}
.pp-nav a{position:relative;font-weight:700;color:#5c5e63;text-decoration:none;display:inline-flex;align-items:center;transition:color .2s;white-space:nowrap;text-transform:uppercase;letter-spacing:.01em;}
.pp-nav a:hover{color:var(--pp-orange);}
.pp-badge-count,.pp-badge-new{position:absolute;bottom:100%;left:100%;transform:translate(-55%,40%);font-size:var(--pp-fs-3xs, 10px);font-weight:700;color:#fff;padding:2px 5px;border-radius:4px;line-height:1;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;pointer-events:none;}
.pp-badge-count{background:var(--pp-orange);}
.pp-badge-new{background:#10B981;}
/* Рейтинг магазину біля «Opinie» — інлайн (не absolute), бо це дані, а не наліпка. */
.pp-badge-rating{display:inline-flex;align-items:center;gap:3px;margin-left:7px;padding:2px 6px;border-radius:5px;background:rgba(245,158,11,.14);color:#B45309;font-size:var(--pp-fs-3xs, 10px);font-weight:800;line-height:1;letter-spacing:.02em;}
.pp-badge-rating svg{flex-shrink:0;}
.pp-nav a:hover .pp-badge-rating{background:rgba(245,158,11,.24);}
.pp-header__actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.pp-cta-desktop{padding:13px 26px;font-size:var(--pp-fs-lg, 15px);border-radius:11px;}
.pp-header__actions .pp-search-toggle{display:none;}
.pp-mobile-search,.pp-mobile-panel{display:none;}
.pp-burger{display:none;flex-direction:column;justify-content:center;gap:4px;width:42px;height:42px;padding:0;border:1px solid var(--pp-border);border-radius:10px;background:#fff;cursor:pointer;flex-shrink:0;order:5;}
.pp-burger span{display:block;width:20px;height:2px;margin:0 auto;background:var(--pp-dark);border-radius:2px;transition:transform .25s,opacity .2s;}
body.pp-menu-open .pp-burger span:nth-child(1){transform:translateY(6px) rotate(45deg);}
body.pp-menu-open .pp-burger span:nth-child(2){opacity:0;}
body.pp-menu-open .pp-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
/* Оверлей «Usługi» на мобільному — повноекранний position:fixed;inset:0, тож
   йому потрібен лок прокрутки фону, і зламати sticky-хедер він не може.
   А бургер-панель висить під sticky-хедером: НЕ локати тут body{overflow:hidden},
   бо overflow на body «відклеює» sticky-хедер — він стрибав на верх документа
   разом із панеллю. Без локу хедер лишається sticky, панель тримається під ним,
   без стрибка контенту.
   ВАЖЛИВО: лок ЛИШЕ до 768px. Вище цього дропдаун «Produkty» лежить усередині
   sticky .pp-header (absolute до 1200px, static нижче), і overflow:hidden на body
   відклеював хедер — прогорнувши сторінку, користувач клікав «Produkty», а панель
   разом із хедером стрибала на верх документа (тобто «зникала» з екрана). */
.pp-search-form{display:flex;align-items:center;gap:6px;background:#F3F4F6;border:1px solid var(--pp-border);border-radius:999px;padding:0 6px 0 18px;height:44px;}
.pp-search-form input[type=search]{border:none;background:transparent;box-shadow:none;font-size:var(--pp-fs-sm, 13px);font-family:var(--pp-font);color:var(--pp-dark);outline:none;height:auto;margin:0;padding:0;-webkit-appearance:none;appearance:none;}
.pp-search-form input[type=search]::-webkit-search-decoration,.pp-search-form input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;}
.pp-search-form input::placeholder{color:#9CA3AF;}
.pp-search-form .pp-search-btn{flex-shrink:0;width:32px;height:32px;min-width:0;min-height:0;padding:0;margin:0;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:transparent;color:#6B7280;box-shadow:none;cursor:pointer;font-size:0;line-height:1;transition:color .2s,background .2s;}
.pp-search-form .pp-search-btn:hover{color:var(--pp-orange);background:#fff;}
.pp-search-form .pp-search-btn svg{display:block;}
.pp-icon-btn{width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:#6B7280;border:none;background:none;cursor:pointer;text-decoration:none;position:relative;transition:color .2s;}
.pp-icon-btn:hover{color:var(--pp-orange);}
.pp-cart-count{position:absolute;top:4px;right:4px;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;background:var(--pp-orange);color:#fff;font-size:var(--pp-fs-3xs, 10px);font-weight:800;border-radius:999px;display:flex;align-items:center;justify-content:center;}
/* Hero */
.pp-hero {
    background: linear-gradient(135deg, #0F172A 0%, #111827 65%, #1C2336 100%);
    padding: 10px 0 50px;
    position: relative;
    overflow: hidden;
}
.pp-hero__inner{position:relative;min-height:520px;display:flex;flex-direction:column;justify-content:center;}
.pp-hero__inner--bg{background-image:var(--pp-hero-img);background-size:65% auto;background-position:center right;background-repeat:no-repeat;border-radius:24px;padding:56px 48px;}
.pp-hero__h1{font-size:var(--pp-fs-11xl, 56px);font-weight:800;color:#fff;line-height:1.08;margin:0 0 20px;text-transform:uppercase;letter-spacing:-.01em;}
.pp-hero__h1-orange{color:var(--pp-orange);}
.pp-hero__desc{font-size:var(--pp-fs-xl, 16px);color:#94A3B8;line-height:1.65;margin:0 0 36px;max-width:480px;}
.pp-hero__btns{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:48px;}
.pp-hero__left{position:relative;z-index:2;max-width:600px;}
.pp-hero__img-mobile{display:none;}
.pp-hero__stats{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:0;row-gap:16px;border-top:1px solid rgba(255,255,255,.1);padding-top:24px;margin-top:20px;flex-wrap:nowrap;position:relative;z-index:2;}
.pp-hero__stat{display:flex;align-items:center;gap:10px;padding-right:20px;flex-shrink:0;}
.pp-hero__stat strong{font-size:var(--pp-fs-2xl, 18px);font-weight:800;color:#fff;display:block;line-height:1;}
.pp-hero__stat span{font-size:var(--pp-fs-2xs, 11px);color:#94A3B8;margin-top:2px;display:block;}
.pp-hero__stat-sep{width:1px;height:36px;background:rgba(255,255,255,.1);flex-shrink:0;margin-right:20px;}
.pp-hero__img-hint{position:absolute;top:16px;right:16px;z-index:2;display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);border:1px solid rgba(249,115,22,.3);border-radius:10px;padding:8px 14px;font-size:var(--pp-fs-xs, 12px);font-weight:600;color:rgba(255,255,255,.5);}
/* Зображення — фіксований шар праворуч, що НЕ зменшується, а заходить під контент */
.pp-hero__rating{position:absolute;bottom:24px;right:32px;z-index:3;background:#fff;border-radius:14px;padding:10px 16px;box-shadow:0 8px 32px rgba(0,0,0,.25);}
.pp-hero__rating-score{font-size:var(--pp-fs-3xl, 20px);font-weight:800;color:var(--pp-dark);line-height:1;}
.pp-hero__rating-stars{position:relative;display:inline-block;font-size:var(--pp-fs-md, 14px);color:#E5E7EB;margin-top:2px;line-height:1;}
.pp-hero__rating-stars::before{content:"★★★★★";}
.pp-hero__rating-stars-on{position:absolute;left:0;top:0;overflow:hidden;white-space:nowrap;color:var(--pp-orange);}
.pp-hero__rating-sub{font-size:var(--pp-fs-3xs, 10px);color:#9CA3AF;margin-top:2px;}
/* Calc bar */
.pp-calc-wrap{position:relative;z-index:20;margin-top:-36px;padding:0 0 24px;}
.pp-calc{background:#fff;border-radius:var(--pp-radius-lg);box-shadow:var(--pp-shadow-float);padding:18px 28px;display:flex;align-items:center;gap:48px;flex-wrap:wrap;}
.pp-calc__result{margin-left:auto;}
.pp-calc__label strong{font-size:var(--pp-fs-lg, 15px);font-weight:800;color:var(--pp-dark);display:block;white-space:nowrap;text-transform:uppercase;letter-spacing:.01em;}
.pp-calc__label span{font-size:var(--pp-fs-2xs, 11px);color:#9CA3AF;display:block;margin-top:2px;white-space:nowrap;}
.pp-calc__sep{width:1px;height:40px;background:var(--pp-border);flex-shrink:0;}
.pp-calc__step{display:flex;align-items:flex-end;gap:8px;flex-shrink:0;}
.pp-calc__step[hidden]{display:none !important;}
.pp-calc__step-num{width:26px;height:26px;border-radius:50%;background:var(--pp-orange);color:#fff;font-size:var(--pp-fs-xs, 12px);font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-bottom:5px;}
.pp-calc__step-label{font-size:var(--pp-fs-3xs, 10px);font-weight:700;color:#9CA3AF;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;white-space:nowrap;}
.pp-calc__select{border:1.5px solid var(--pp-border);border-radius:8px;padding:7px 10px;font-size:var(--pp-fs-md, 14px);font-weight:600;font-family:var(--pp-font);color:var(--pp-dark);background:#fff;cursor:pointer;appearance:none;outline:none;transition:border-color .2s;min-width:120px;}
.pp-calc__select:focus{border-color:var(--pp-orange);}
.pp-calc__arrow{flex-shrink:0;}
.pp-calc__price-label{font-size:var(--pp-fs-3xs, 10px);color:#9CA3AF;font-weight:700;text-transform:uppercase;letter-spacing:.08em;}
.pp-calc__price{font-size:var(--pp-fs-8xl, 34px);font-weight:800;color:var(--pp-dark);line-height:1;margin-top:2px;white-space:nowrap;}
.pp-calc__price span{font-size:var(--pp-fs-2xl, 18px);}
.pp-calc__price .pp-calc__status{font-size:.6em;font-weight:600;line-height:1.25;white-space:normal;}
.pp-calc__select:disabled{cursor:not-allowed;opacity:.62;}
.pp-calc__cta{flex-shrink:0;justify-content:space-between;min-width:210px;margin-left:24px;}
.pp-calc__cta-arrow{font-size:var(--pp-fs-4xl, 22px);line-height:1;}
/* Homepage calculator: semantic fixed slots, not auto-fit.
   Desktop fills the canonical container with exactly the visible controls;
   category calculators keep the shared .pp-calc contract above. */
.pp-calc-wrap .pp-calc{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));justify-content:stretch;align-items:stretch;gap:12px;padding:20px 22px;}
.pp-calc-wrap .pp-calc:where(:has(#pp-calc-step-terms[hidden])){grid-template-columns:repeat(4,minmax(0,1fr));}
.pp-calc-wrap .pp-calc__label{grid-column:1/-1;display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 12px;padding:0 2px 4px;min-width:0;}
.pp-calc-wrap .pp-calc__label strong{font-size:var(--pp-fs-3xl,20px);line-height:1.2;white-space:normal;}
.pp-calc-wrap .pp-calc__label span{margin:0;font-size:var(--pp-fs-sm,13px);line-height:1.4;white-space:normal;}
.pp-calc-wrap .pp-calc__sep,.pp-calc-wrap .pp-calc__arrow{display:none;}
.pp-calc-wrap .pp-calc__step{min-width:0;display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--pp-border);border-radius:12px;background:#F8FAFC;}
.pp-calc-wrap .pp-calc__step>div:not(.pp-calc__step-num){flex:1;min-width:0;}
.pp-calc-wrap .pp-calc__step-num{width:30px;height:30px;margin:0;}
.pp-calc-wrap .pp-calc__step-label{display:block;margin-bottom:5px;white-space:normal;line-height:1.25;}
.pp-calc-wrap .pp-calc__select{display:block;width:100%;min-width:0;height:42px;padding:7px 34px 7px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;}
.pp-calc-wrap .pp-calc__result{min-width:0;margin:0;padding:12px 14px;border:1px solid var(--pp-border);border-radius:12px;background:#fff;display:flex;flex-direction:column;justify-content:center;}
.pp-calc-wrap .pp-calc__price{font-size:clamp(26px,2.5vw,34px);white-space:normal;overflow-wrap:anywhere;}
.pp-calc-wrap .pp-calc__cta{width:100%;min-width:0;margin:0;align-self:stretch;}
/* Categories */
.pp-cats{background:var(--pp-bg);padding:28px 0;}
.pp-cats__card{background:#fff;border:1px solid var(--pp-border);border-radius:var(--pp-radius-lg);padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:8px;overflow-x:auto;scrollbar-width:none;}
.pp-cat-item{display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;min-width:78px;text-decoration:none;flex-shrink:0;}
.pp-cat-item:hover .pp-cat-icon{background:var(--pp-orange-light);}
.pp-cat-icon{width:78px;height:78px;border-radius:21px;display:flex;align-items:center;justify-content:center;transition:background .2s;}
.pp-cat-icon .pp-cat-icon-img{width:60%;height:60%;object-fit:contain;display:block;}
.pp-cat-item span{font-size:var(--pp-fs-xs, 12px);font-weight:600;color:#374151;text-align:center;}
.pp-cat-all{flex-shrink:0;padding-left:16px;border-left:1px solid var(--pp-border);text-decoration:none;}
.pp-cat-all svg{display:block;margin:0 auto 6px;}
.pp-cat-all span{font-size:var(--pp-fs-xs, 12px);font-weight:700;color:var(--pp-orange);text-align:center;line-height:1.3;}
/* Kreator + Templates */
.pp-kt{background:var(--pp-bg);padding:56px 0;}
.pp-kt__grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
.pp-kreator{background:linear-gradient(135deg,#1e1b4b 0%,#312e81 50%,#4338ca 100%);border-radius:24px;padding:36px;position:relative;overflow:hidden;display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;}
.pp-kreator__glow{position:absolute;top:-60px;right:-60px;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(99,102,241,.25) 0%,transparent 70%);pointer-events:none;}
.pp-kreator__content{min-width:0;position:relative;z-index:1;display:flex;flex:0.94 1 240px;flex-direction:column;}
.pp-kreator__badge{display:inline-flex;align-self:flex-start;background:var(--pp-orange);color:#fff;font-size:var(--pp-fs-3xs, 10px);font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;border-radius:20px;margin-bottom:18px;}
.pp-kreator__h3{font-size:var(--pp-fs-6xl, 28px);font-weight: 800;color:#fff;margin:0 0 8px;line-height:1.15;}
.pp-kreator__desc{color:#C7D2FE;font-size:var(--pp-fs-sm, 13px);line-height:1.5;margin:0 0 20px;}
.pp-kreator__list{list-style:none;margin:0 0 32px;display:flex;flex-direction:column;gap:10px;flex:1;}
.pp-kreator__list li{display:flex;align-items:center;gap:8px;font-size:var(--pp-fs-sm, 13px);font-weight:400;color:#E0E7FF;cursor:pointer;transition:color .25s,font-weight .25s,transform .25s;}
.pp-kreator__list li.is-active{color:#fff;font-weight:800;transform:translateX(3px);}
.pp-kreator__list li::before{content:'✓';color:var(--pp-orange);font-weight:800;flex-shrink:0;}
.pp-kreator__content .pp-btn-primary{align-self:flex-start;}
/* Візуалізація: browser-frame + слайдер + мініатюри */
.pp-kreator__media{position:relative;z-index:1;min-width:0;display:flex;flex:1.06 1 280px;flex-direction:column;gap:8px;align-self:center;}
.pp-kreator__window{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.5);display:flex;flex:0 0 auto;flex-direction:column;width:100%;}
.pp-kreator__bar{background:#F3F4F6;padding:7px 10px;display:flex;align-items:center;gap:5px;flex-shrink:0;}
.pp-kreator__dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.pp-kreator__bar-url{flex:1;height:4px;border-radius:3px;background:#E5E7EB;margin:0 8px;}
.pp-kreator__bar-accent{width:40px;height:4px;border-radius:3px;background:#6366F1;flex-shrink:0;}
.pp-kreator__screen{position:relative;flex:0 0 auto;min-height:0;aspect-ratio:4/3;overflow:hidden;background:#fff;}
/* inset:0 дає слайдеру ВИЗНАЧЕНУ висоту від 4/3-екрана. Без цього height:100%
   по ланцюгу swiper не резолвиться, <img> бере власну квадратну пропорцію
   (299×299) і вилазить за 299×224 → обрізається overflow:hidden. */
.pp-kreator__main{position:absolute;inset:0;}
.pp-kreator__main .swiper-wrapper{height:100%;}
.pp-kreator__slide{position:relative;height:100%;background:#fff;}
/* The image fills the definite slider box; the global image reset stays weak. */
.pp-kreator__main .pp-kreator__slide img{display:block;width:100%;height:100%;object-fit:contain;}
.pp-kreator__mockup{display:block;width:100%;height:auto;}
.pp-kreator__thumbs{flex-shrink:0;}
.pp-kreator__thumb{width:auto;height:34px;aspect-ratio:16/9;border-radius:6px;overflow:hidden;cursor:pointer;opacity:.55;border:2px solid transparent;box-sizing:border-box;background:#fff;transition:opacity .15s,border-color .15s;}
.pp-kreator__thumbs .pp-kreator__thumb img{width:100%;height:100%;object-fit:contain;padding:3px;display:block;}
.pp-kreator__thumb.swiper-slide-thumb-active{opacity:1;border-color:rgba(255,255,255,.85);}
/* Картка Szablony */
.pp-kt .pp-templates{background:#fff;border:1.5px solid #E9EAEC;border-radius:24px;padding:32px;display:flex;flex-direction:column;container-type:inline-size;container-name:pp-templates;}
.pp-kt .pp-templates__header{display:flex;align-items:flex-start;gap:16px;margin-bottom:4px;}
.pp-kt .pp-templates__titles{flex:1;min-width:0;}
.pp-kt .pp-templates__h3{font-size:var(--pp-fs-4xl, 22px);font-weight: 800;color:#111827;line-height:1.2;letter-spacing:-.02em;margin:0 0 4px;}
.pp-kt .pp-templates__sub{color:#6B7280;font-size:var(--pp-fs-sm, 13px);margin:0;}
.pp-kt .pp-templates__search{display:flex;align-items:center;gap:8px;background:#F8FAFC;border:1.5px solid #E5E7EB;border-radius:10px;padding:8px 14px;flex-shrink:0;margin:0;}
.pp-kt .pp-templates__search input{border:none;background:transparent;font-size:var(--pp-fs-sm, 13px);font-family:var(--pp-font);color:#111827;outline:none;width:140px;max-width:100%;-webkit-appearance:none;appearance:none;}
.pp-kt .pp-templates .screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.pp-kt .pp-templates__body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);gap:24px;flex:1;margin-top:20px;align-items:start;}
.pp-kt .pp-templates__left{display:flex;flex-direction:column;gap:12px;min-width:0;}
.pp-kt .pp-templates__cats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.pp-kt .pp-templates__cat{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:10px;border:1px solid #E5E7EB;font-size:var(--pp-fs-sm, 13px);font-weight:600;color:#374151;text-decoration:none;background:#fff;white-space:normal;min-width:0;transition:border-color .15s;}
.pp-kt .pp-templates__cat:hover,.pp-kt .pp-templates__cat.is-active{border-color:var(--pp-orange);}
.pp-kt .pp-templates__cat.is-active{background:#FFF7ED;color:#9A3412;}
.pp-kt .pp-templates__cat-ic{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--pp-orange);}
.pp-kt .pp-templates__cat-ic img{display:block;width:18px;height:18px;max-width:100%;object-fit:contain;}
.pp-kt .pp-templates__more{display:inline-flex;align-items:center;gap:6px;font-size:var(--pp-fs-sm, 13px);font-weight:700;color:var(--pp-orange);text-decoration:none;align-self:flex-start;}
.pp-kt .pp-templates__cta{text-align:center;justify-content:center;border-radius:10px;padding:14px 20px;font-size:var(--pp-fs-sm, 13px);margin-top:4px;}
.pp-kt .pp-templates__thumbs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr));gap:10px;min-width:0;transition:opacity .18s ease;}
.pp-kt .pp-templates__thumbs.is-loading{opacity:.5;pointer-events:none;}
.pp-kt .pp-templates__thumb{display:block;position:relative;border-radius:10px;aspect-ratio:3/2;overflow:hidden;background:#EEF2F7;border:1px solid #E5E7EB;text-decoration:none;}
.pp-kt .pp-templates__thumb img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;}
.pp-kt .pp-templates__empty{grid-column:1/-1;display:flex;align-items:center;justify-content:center;min-height:180px;margin:0;padding:20px;border:1px dashed #D1D5DB;border-radius:10px;color:#6B7280;font-size:var(--pp-fs-sm, 13px);text-align:center;}
/* Szablony: komponent sam reaguje na dostępną szerokość. Nie pozwalamy lewej
   kolumnie z tagami ścisnąć podglądów do zera; gdy karta robi się wąska,
   podglądy przechodzą pod filtry niezależnie od szerokości całego viewportu. */
@container pp-templates (max-width:820px){
  .pp-kt .pp-templates__body{grid-template-columns:1fr;}
}

/* Products */
.pp-products{background:#fff;padding:56px 0;}
.pp-products__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;}
.pp-products__title{font-size:var(--pp-fs-6xl, 28px);font-weight:800;color:var(--pp-dark);margin:0;}
.pp-products__all{font-size:var(--pp-fs-sm, 13px);font-weight:700;color:var(--pp-orange);text-decoration:none;display:flex;align-items:center;gap:5px;}
.pp-products__label{font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:var(--pp-orange);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px;}
.pp-prod-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;}
/* Products slider */
.pp-prod-slider{position:relative;}
.pp-prod-track{display:flex;align-items:stretch;gap:18px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding:14px 6px 48px;margin:-14px -6px -34px;}
.pp-prod-track::-webkit-scrollbar{display:none;}
.pp-prod-track>.pp-prod-card{flex:0 0 calc((100% - 90px)/6);scroll-snap-align:start;}
.pp-prod-nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;min-width:44px;max-width:44px;padding:0;margin:0;box-sizing:border-box;line-height:0;font-size:0;flex-shrink:0;border-radius:50%;background:#fff;border:1px solid var(--pp-border);box-shadow:0 6px 18px rgba(0,0,0,.12);display:flex;align-items:center;justify-content:center;color:var(--pp-dark);cursor:pointer;z-index:5;transition:background .2s,color .2s,opacity .2s,box-shadow .2s;}
.pp-prod-nav svg{display:block;width:20px;height:20px;stroke:currentColor;}
.pp-prod-nav:hover{background:var(--pp-orange);color:#fff;border-color:var(--pp-orange);box-shadow:0 8px 22px rgba(249,115,22,.35);}
.pp-prod-nav--prev{left:-16px;}
.pp-prod-nav--next{right:-16px;}
.pp-prod-nav.is-hidden{opacity:0;pointer-events:none;}
.pp-prod-card{position:relative;background:var(--pp-product-card-bg);border-radius:var(--pp-radius-lg);border:1px solid var(--pp-border);overflow:hidden;cursor:pointer;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease;display:flex;flex-direction:column;min-width:0;}
.pp-prod-card:hover{transform:translateY(-6px);box-shadow:var(--pp-shadow-hover);}
.pp-prod-card__img{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:var(--pp-product-card-media-bg);overflow:hidden;padding:12px;box-sizing:border-box;}
.pp-prod-card__img img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.pp-prod-card__body{display:flex;flex:1 1 auto;flex-direction:column;min-width:0;padding:14px;}
.pp-prod-card__title{min-height:38px;font-size:var(--pp-fs-lg, 15px);font-weight:700;color:var(--pp-dark);margin:0;line-height:1.35;}
.pp-prod-card__price{display:flex;align-items:baseline;justify-content:space-between;gap:10px;min-width:0;margin-top:11px;padding-top:11px;border-top:1px solid var(--pp-border);font-size:var(--pp-fs-xs, 12px);color:#6B7280;}
.pp-prod-card__price strong{display:block;min-width:0;margin-top:2px;font-size:var(--pp-fs-xl, 16px);font-weight:800;color:var(--pp-dark);text-align:right;}

/* Prevent price number and currency from breaking onto separate lines */
.pp-prod-card__price .woocommerce-Price-amount bdi{white-space:nowrap;}

/* Compact PrintConstructor defaults are metadata, not a single unbreakable label.
   Let long option sets wrap inside cards instead of forcing horizontal overflow. */
.pc-default-values--compact{display:block;min-width:0;max-width:100%;white-space:normal;font-size:0;line-height:1.5;color:var(--pp-text-muted);overflow-wrap:anywhere;}
.pc-default-values--compact .pc-default-values__item{display:inline;max-width:100%;white-space:normal;font-size:var(--pp-fs-3xs,10px);line-height:inherit;overflow-wrap:anywhere;}

/* Keep default-price markup (price + "za szt." context) together across templates */
.pc-default-price{white-space:nowrap;}
.pc-default-price bdi{white-space:nowrap;}
.pc-default-price .pc-default-price-context{white-space:nowrap;display:inline-block;margin-left:6px;color:#6B7280;font-size:var(--pp-fs-3xs,11px);}

/* New structure: main price+unit inline, run (nakład) on its own line */
.pc-default-price{display:inline-flex;flex-direction:column;align-items:flex-start;gap:4px;}
.pc-default-price-main{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap;font-weight:600;color:var(--pp-dark);font-size:var(--pp-fs-xl,16px);font-family:var(--pp-font);}
.pc-default-price-main .woocommerce-Price-amount bdi{display:inline-flex;align-items:baseline;gap:0.25ch;}
.pc-default-unit{font-size:var(--pp-fs-xl,16px);font-family:var(--pp-font);}
.pc-default-price-run{padding-left:0;font-family:inherit;}

/* Пробіл перед символом валюти дає САМ WooCommerce (Ustawienia → Waluta → pozycja
   „po cenie ze spacją”, format %2$s&nbsp;%1$s). Тут раніше стояв ::before{content:"\00a0"},
   який складався з margin-left нижче — виходив подвійний зазор «14.60  zł». І головне:
   на цінах, які малює JS калькулятора (плоский текст, без span.currencySymbol), обидва
   хаки не діяли взагалі — бейджі опцій виходили злиплими «+0.30zł». */

/* Small controlled gap between currency and slash, and unify font */
.pc-default-price-main .pc-default-unit{margin-left:0.25ch; font-family:inherit; font-size:var(--pp-fs-xl,16px);}

/* Force consistent line-height to avoid visual jumps */
.pc-default-price-main, .pc-default-price-main .woocommerce-Price-amount, .pc-default-price-main .pc-default-unit{line-height:1.05;}

/* Default-price typography for PRODUCT CARDS only.
   Single-product price is a different semantic component and is owned by
   single-product.css; never force its font-size from a listing rule. */
body.pp-body .pp-product-card .pc-default-price .pc-default-price-main,
body.pp-body ul.products li.product.pp-product-card .pc-default-price .pc-default-price-main {
  font-family: var(--pp-font);
  font-weight: 600;
  font-size: var(--pp-fs-xl,16px);
  line-height: 1.05;
}

/* (зазор перед валютою — з налаштування WooCommerce, див. коментар вище) */

/* Unit label displayed inline with price ("/ szt.") */
.pc-default-unit{display:inline-block;white-space:nowrap;margin-left:6px;font-weight:600;color:var(--pp-dark);}
.pc-default-price-run{display:block;margin-top:4px;font-size:var(--pp-fs-3xs,11px);color:#6B7280}

/* Broader selectors for various product lists/search areas */
.price .woocommerce-Price-amount bdi, .woocommerce-Price-amount.amount bdi, .woocommerce-Price-currencySymbol{white-space:nowrap;}
.pp-card-price .price, .pp-card-price .pc-default-price{white-space:nowrap;}
.pp-prod-card__link{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:var(--pp-button-height-sm);margin-top:auto;color:#fff;background:var(--pp-orange);border-radius:var(--pp-button-radius-sm);font-size:var(--pp-button-font-size);font-weight:800;letter-spacing:0;text-transform:none;text-decoration:none;transition:background-color var(--pp-ui-transition);}
.pp-product-card:hover .pp-prod-card__link{background:var(--pp-orange-hover,#ea580c);}
/* Stats + AI */
.pp-stats-ai{background:#fff;padding:56px 0;}
.pp-stats-ai__inner{display:grid;grid-template-columns:3fr 2fr;gap:28px;align-items:stretch;}
.pp-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);background:#111827;border-radius:18px;overflow:hidden;}
.pp-stat-box{position:relative;padding:36px 20px;text-align:center;display:flex;flex-direction:column;justify-content:center;}
.pp-stat-box+.pp-stat-box::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:1px;height:70px;background:rgba(255,255,255,.1);}
.pp-stat-box__ico{display:block;width:56px;height:56px;margin:0 auto 14px;background:var(--pp-orange);-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat;}
.pp-stat-box__num{font-size:var(--pp-fs-7xl, 32px);font-weight:800;color:#fff;margin-bottom:6px;}
.pp-stat-box__label{font-size:var(--pp-fs-sm, 13px);color:#fff;}
.pp-ai-card{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;background:linear-gradient(135deg,#3730A3,#1E1B4B);border:1px solid rgba(129,140,248,.25);border-radius:18px;padding:28px;min-height:240px;}
.pp-ai-card__title{position:relative;z-index:2;max-width:60%;font-size:var(--pp-fs-3xl, 20px);font-weight:800;letter-spacing:.02em;color:#fff;margin-bottom:12px;}
.pp-ai-card__desc{position:relative;z-index:2;max-width:60%;font-size:var(--pp-fs-md, 14px);color:#fff;line-height:1.6;margin-bottom:20px;}
.pp-ai-card__btn{position:relative;z-index:2;}
.pp-ai-card__robot{position:absolute;right:20px;top:50%;transform:translateY(-50%);width:auto;height:auto;max-height:calc(100% - 24px);max-width:38%;object-fit:contain;z-index:1;pointer-events:none;filter:drop-shadow(0 8px 24px rgba(0,0,0,.35));}
.pp-ai-card--no-image .pp-ai-card__title,.pp-ai-card--no-image .pp-ai-card__desc{max-width:100%;}
/* Why us */
.pp-why-us{background:var(--pp-bg);padding:56px 0;}
.pp-why-us__title{font-size:var(--pp-fs-5xl, 26px);font-weight:800;color:var(--pp-dark);text-align:center;text-transform:uppercase;letter-spacing:.04em;margin:0 0 40px;}
.pp-why-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
.pp-why-card{display:flex;align-items:flex-start;gap:10px;min-width:0;background:#fff;border:1px solid var(--pp-border);border-radius:var(--pp-radius-lg);padding:14px;}
.pp-why-card>div{min-width:0;}
.pp-why-icon{width:70px;height:70px;border-radius:14px;background:var(--pp-orange-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pp-why-icon svg{width:50px;height:50px;}
.pp-why-text__title{font-size:var(--pp-fs-lg, 15px);font-weight:700;color:var(--pp-dark);margin:0 0 3px;line-height:1.3;overflow-wrap:break-word;}
.pp-why-text__sub{font-size:var(--pp-fs-sm, 13px);color:#9CA3AF;line-height:1.4;overflow-wrap:break-word;}
/* Portfolio */
.pp-portfolio{background:#fff;padding:56px 0;}
.pp-portfolio__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px;}
.pp-portfolio__title{font-size:var(--pp-fs-6xl, 28px);font-weight:800;color:var(--pp-dark);margin:0;}
.pp-portfolio__all{font-size:var(--pp-fs-sm, 13px);font-weight:700;color:var(--pp-orange);text-decoration:none;}
.pp-tabs{display:flex;gap:6px;margin-bottom:24px;flex-wrap:wrap;}
.pp-tab{padding:7px 18px;border-radius:18px;font-size:var(--pp-fs-sm, 13px);font-weight:600;cursor:pointer;border:none;background:transparent;color:#6B7280;transition:.2s;font-family:var(--pp-font);}
.pp-tab.active,.pp-tab:hover{background:var(--pp-orange);color:#fff;}
.pp-portfolio__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;}
.pp-portfolio-item{aspect-ratio:1;border-radius:var(--pp-radius-lg);overflow:hidden;cursor:pointer;background:#F3F4F6;transition:transform .25s;position:relative;display:flex;align-items:center;justify-content:center;}
.pp-portfolio-item:hover{transform:scale(1.03);}
.pp-portfolio-item img{width:100%;height:100%;object-fit:cover;}
/* Blog */
/* ——— Секція «Opinie klientów» (оболонка навколо слайдера CusRev) ——— */
.pp-opinie{background:#fff;padding:56px 0;}
.pp-opinie__header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:32px;}
.pp-opinie__label{font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:var(--pp-orange);text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px;}
.pp-opinie__title{font-size:var(--pp-fs-6xl, 28px);font-weight:800;color:var(--pp-dark);margin:0;}
.pp-opinie__rating{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:var(--pp-fs-md, 14px);color:var(--pp-text-2);}
.pp-opinie__rating strong{font-size:var(--pp-fs-4xl, 22px);font-weight:800;color:var(--pp-dark);line-height:1;}
.pp-opinie__stars{display:inline-flex;gap:1px;}
.pp-opinie__all{flex-shrink:0;font-size:var(--pp-fs-sm, 13px);font-weight:700;color:var(--pp-orange);text-decoration:none;}
.pp-opinie__all:hover{text-decoration:underline;}
/* Картки слайдера плагіна під радіуси/тіні теми (розмітка CusRev: .cr-review-card). */
/* CusRev slider internals are owned by reviews.css; keep only the section shell here. */
@media(max-width:768px){
  .pp-opinie{padding:36px 0;}
  .pp-opinie__header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:22px;}
}

.pp-blog{background:var(--pp-bg);padding:56px 0;}
.pp-blog__header{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;}
.pp-blog__title{font-size:var(--pp-fs-6xl, 28px);font-weight:800;color:var(--pp-dark);margin:0;}
.pp-blog__all{font-size:var(--pp-fs-sm, 13px);font-weight:700;color:var(--pp-orange);text-decoration:none;}
.pp-blog__label{font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:var(--pp-orange);text-transform:uppercase;letter-spacing:.12em;margin-bottom:6px;}
.pp-blog-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;}
.pp-blog-card{background:var(--pp-product-card-bg);border-radius:var(--pp-radius-lg);border:1px solid var(--pp-border);overflow:hidden;cursor:pointer;text-decoration:none;transition:box-shadow .25s,transform .25s;display:block;}
.pp-blog-card:hover{transform:translateY(-4px);box-shadow:var(--pp-shadow-hover);}
.pp-blog-card__img{aspect-ratio:3/2;background:var(--pp-product-card-media-bg);overflow:hidden;display:flex;align-items:center;justify-content:center;}
.pp-blog-card__img img{width:100%;height:100%;object-fit:cover;}
.pp-blog-card__body{padding:14px;}
.pp-blog-cat{font-size:var(--pp-fs-3xs, 10px);font-weight:700;text-transform:uppercase;letter-spacing:.1em;padding:3px 8px;border-radius:5px;background:var(--pp-orange-light);color:var(--pp-orange);display:inline-block;margin-bottom:6px;}
.pp-blog-date{font-size:var(--pp-fs-2xs, 11px);color:#9CA3AF;margin-bottom:4px;}
.pp-blog-title{font-size:var(--pp-fs-md, 14px);font-weight:700;color:var(--pp-dark);line-height:1.4;margin-bottom:8px;}
.pp-blog-more{font-size:var(--pp-fs-xs, 12px);font-weight:700;color:var(--pp-orange);}
/* CTA bottom */
.pp-cta-bottom{background:#111827;padding:40px 0;}
.pp-cta-bottom__inner{display:grid;grid-template-columns:1fr auto auto;gap:28px;align-items:center;}
.pp-cta-bottom__h2{font-size:var(--pp-fs-7xl, 32px);font-weight:800;color:#fff;margin:0 0 10px;line-height:1.2;}
.pp-cta-bottom__desc{font-size:var(--pp-fs-lg, 15px);color:#94A3B8;line-height:1.6;max-width:500px;margin:0;}
/* Кнопки CTA: раніше геометрія жила в інлайн-style у pp-cta-bottom.php і не
   піддавалась темі. Тепер — тут, тож font-size іде через шкалу. */
.pp-cta-bottom__btn{flex-shrink:0;}
/* Trust + Newsletter */
.pp-trust-bar{background:#111827;border-top:1px solid rgba(255,255,255,.06);padding:28px 0;}
/* overflow-x:auto ховав переповнення в горизонтальний скрол: на 1280 за краєм
   лишалось 239px промо-бейджа, і про смугу прокрутки всередині футерної стрічки
   ніхто не здогадується. Переповнення має ПЕРЕНОСИТИСЬ, а не ховатись — це ще й
   страхує від довших рядків у PL/UA. */
.pp-trust-bar__inner{display:flex;align-items:center;flex-wrap:wrap;gap:18px 0;overflow:visible;}
.pp-trust-item{display:flex;align-items:center;gap:10px;white-space:nowrap;}
.pp-trust-item__icon{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
/* white-space:nowrap живе на .pp-trust-item заради іконки; текст мусить
   переноситись, інакше у вузькій доріжці сітки він виїздить за колонку. */
.pp-trust-item__title{font-size:var(--pp-fs-xs, 12px);font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.05em;white-space:normal;}
.pp-trust-item__sub{font-size:var(--pp-fs-2xs, 11px);color:#94A3B8;margin-top:1px;white-space:normal;}
.pp-trust-sep{width:1px;height:40px;background:rgba(255,255,255,.1);flex-shrink:0;margin:0 28px;}
.pp-newsletter{flex:1;min-width:280px;}
.pp-newsletter__title{font-size:var(--pp-fs-md, 14px);font-weight:700;color:#fff;margin-bottom:8px;white-space:nowrap;}
.pp-newsletter__title span{color:var(--pp-orange);}
.pp-newsletter__form{display:flex;gap:8px;}
.pp-newsletter__input{flex:1;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.15);border-radius:10px;padding:10px 14px;font-size:var(--pp-fs-sm, 13px);font-family:var(--pp-font);color:#fff;outline:none;min-width:0;}
.pp-newsletter__btn{flex-shrink:0;}
/* Згода на marketing (RODO) — обов'язкова умова підписки, тож стоїть при формі. */
.pp-consent{display:flex;align-items:flex-start;gap:8px;margin-top:8px;font-size:var(--pp-fs-2xs, 11px);line-height:1.45;color:#94A3B8;cursor:pointer;}
.pp-consent input{flex-shrink:0;margin-top:2px;width:15px;height:15px;accent-color:var(--pp-orange);cursor:pointer;}
.pp-consent a{color:#CBD5E1;text-decoration:underline;}
.pp-consent a:hover{color:var(--pp-orange);}
.pp-newsletter__msg{margin:8px 0 0;font-size:var(--pp-fs-xs, 12px);font-weight:600;}
.pp-newsletter__msg--ok{color:#4ADE80;}
.pp-newsletter__msg--err{color:#FCA5A5;}
.pp-promo-badge{display:flex;align-items:center;gap:10px;padding-left:28px;border-left:1px solid rgba(255,255,255,.1);margin-left:28px;flex-shrink:0;}
.pp-promo-badge__icon{width:44px;height:44px;border-radius:50%;border:2px solid var(--pp-orange);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pp-promo-badge__text{font-size:var(--pp-fs-xs, 12px);color:#94A3B8;line-height:1.5;max-width:180px;}
/* Footer */
.pp-footer{background:#0F172A;padding:48px 0 0;}
.pp-footer__layout{margin-bottom:40px;color:#94A3B8;}
/* Розкладку колонок футера тримає секція «Футер: сітка колонок» у кінці файла:
   flex тут не працював — див. там причину й заміри. */
.pp-footer__layout .wp-block-heading{font-size:var(--pp-fs-xs,12px);font-weight:700;color:#fff;margin:0 0 14px;text-transform:uppercase;letter-spacing:.07em;}
.pp-footer__layout p{font-size:var(--pp-fs-sm,13px);line-height:1.6;margin:0 0 8px;}
.pp-footer__layout p>a,.pp-footer__layout li>a{color:#94A3B8;text-decoration:none;transition:color .2s;}
.pp-footer__layout p>a:hover,.pp-footer__layout li>a:hover{color:var(--pp-orange);}
.pp-footer__layout .wp-block-shortcode{margin:0;}
.pp-footer__brand-link{display:block;margin-bottom:4px;text-decoration:none;}
.pp-footer__logo-piuro{font-size:var(--pp-fs-3xl, 20px);font-weight:800;color:#fff;}
.pp-footer__logo-print{font-size:var(--pp-fs-3xl, 20px);font-weight:800;color:var(--pp-orange);}
.pp-footer__logo-sub{font-size:var(--pp-fs-3xs, 10px);font-weight:600;color:#4B5563;text-transform:uppercase;letter-spacing:.15em;display:block;margin-top:2px;margin-bottom:12px;}
.pp-footer__desc{font-size:var(--pp-fs-sm, 13px);color:#94A3B8;line-height:1.7;margin-bottom:18px;max-width:260px;}
.pp-footer__socials{display:flex;gap:10px;margin-bottom:20px;}
.pp-footer__social{width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s;text-decoration:none;}
.pp-footer__social img{width:18px;height:18px;object-fit:contain;display:block;}
.pp-footer__social:hover{background:var(--pp-orange);}
.pp-footer__langs{display:flex;align-items:center;gap:8px;font-size:var(--pp-fs-sm, 13px);}
.pp-footer__langs a{color:#94A3B8;font-weight:600;text-decoration:none;cursor:pointer;transition:color .2s;}
.pp-footer__langs a.current{color:var(--pp-orange);font-weight:700;}
.pp-footer__langs a:hover{color:var(--pp-orange);}
.pp-footer__lang-sep{color:rgba(255,255,255,.2);}
.pp-footer__col-title{font-size:var(--pp-fs-xs, 12px);font-weight:700;color:#fff;margin-bottom:14px;text-transform:uppercase;letter-spacing:.07em;}
.pp-footer__link{font-size:var(--pp-fs-sm, 13px);color:#94A3B8;display:block;margin-bottom:8px;text-decoration:none;transition:color .2s;}
.pp-footer__link:hover{color:var(--pp-orange);}
.pp-footer__link-highlight{color:var(--pp-orange);font-weight:700;}
/* Швидкі канали зв'язку в колонці «Kontakt»: та сама плитка, що й .pp-footer__socials
   у брендовій колонці (колір іде через currentColor, тож SVG не задають свій stroke). */
.pp-footer__contact-icons{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 14px;color:#E5E7EB;}
.pp-footer__contact-icons .pp-footer__social{width:34px;height:34px;color:inherit;}
.pp-footer__contact-icons .pp-footer__social:hover{color:#fff;}
.pp-footer__follow-label{margin:16px 0 8px;font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.08em;}
.pp-footer__contact-item{display:flex;align-items:flex-start;gap:8px;margin-bottom:10px;font-size:var(--pp-fs-sm, 13px);color:#94A3B8;}
.pp-footer__contact-item svg{flex-shrink:0;margin-top:2px;}
.pp-footer__contact-item a{color:inherit;text-decoration:none;overflow-wrap:anywhere;}
.pp-footer__contact-item a:hover{color:var(--pp-orange);}
.pp-footer__contact-btn{width:100%;justify-content:center;margin-bottom:8px;}
.pp-footer__contact-btn-outline{width:100%;justify-content:center;}
.pp-footer__payments-title{font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:#4B5563;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}
.pp-footer__pay-badge{background:#fff;border-radius:5px;padding:4px 8px;font-size:var(--pp-fs-2xs, 11px);font-weight:800;line-height:1;}
.pp-footer__delivery-badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.pp-footer__del-badge{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:5px;padding:4px 10px;font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:#E5E7EB;}
.pp-footer__pay-logos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;align-items:stretch;}
/* Перевізників чотири — у сітці з 3 колонок четвертий лишався сиротою в новому
   ряду. 2×2 заповнює блок рівно і дає лого вдвічі більший розмір. */
.pp-footer__del-logos{grid-template-columns:repeat(2,1fr);}
.pp-footer__paydel-label{font-size:var(--pp-fs-2xs, 11px);font-weight:700;color:#94A3B8;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}
.pp-footer__del-label{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.09);}
.pp-footer__del-logos{margin-top:0;}
/* Лого відштовхуються від висоти плитки, а не навпаки: частина SVG у наборі без власних
   розмірів, і при height:auto вони схлопуються в нуль. */
.pp-pay-logo{background:transparent;border-radius:8px;padding:3px 3px;height:50px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;}
.pp-pay-logo img{height:100%;max-height:100%;width:auto;max-width:100%;object-fit:contain;display:block;}
.pp-footer__bottom{background:#020617;padding:18px 0;border-top:1px solid rgba(255,255,255,.05);}
.pp-footer__bottom-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.pp-footer__copy{font-size:var(--pp-fs-xs, 12px);color:#94A3B8;}
.pp-footer__legal{display:flex;gap:20px;flex-wrap:wrap;}
.pp-footer__legal a{font-size:var(--pp-fs-xs, 12px);color:#94A3B8;text-decoration:none;transition:color .2s;}
.pp-footer__legal a:hover{color:var(--pp-orange);}
/* FAQ */
.pp-faq-item{border-bottom:1px solid var(--pp-border);}
.pp-faq-q{display:flex;justify-content:space-between;align-items:center;padding:18px 0;cursor:pointer;font-size:var(--pp-fs-lg, 15px);font-weight:600;color:var(--pp-dark);gap:16px;}
.pp-faq-a{font-size:var(--pp-fs-md, 14px);color:#6B7280;line-height:1.65;padding-bottom:18px;display:none;}
.pp-faq-a.open{display:block;}
/* Header scrolled */
.pp-header--scrolled{box-shadow:0 4px 24px rgba(0,0,0,.12);}
/* Responsive */
/* ХЕДЕР — плавне стискання замість сходинок.
   Причина переробки: сходинки (1600/1400) міряли лише польську. Найширша мова —
   українська/англійська: меню 8 пунктів = 808px на 18px шрифті, лого 264,
   пошук 274, дії 256, 3 gap 96 → 1824 при .pp-wrap max-width:1800.
   Тобто «просторий» стан не вміщався НІКОЛИ, і CTA виїздила за межі (баг).
   Тепер усі розміри — clamp() від vw: обмеження лінійні по vw, тож якщо вміщається
   на одній ширині, вміщається на всіх. Ховаємо максимально пізно: спершу
   стискаємо шрифт, потім CTA лишається іконкою, потім згортається пошук,
   і лише в кінці — бургер. min-width:0 обов'язковий: без нього flex:1 на .pp-nav
   не вміє стискатись (пункти nowrap) і виштовхує дії за .pp-wrap. */
.pp-header__inner{gap:clamp(10px,1.2vw,32px);min-width:0;}
.pp-logo{min-width:0;}
.pp-logo__piuro,.pp-logo__print{font-size:clamp(26px,1.95vw,37px);}
.pp-logo__sub{font-size:clamp(8px,.61vw,12px);}
/* Стеля 16px/18px, а не 18px/26px: вище ~1936 .pp-wrap упирається в max-width:1800,
   тож ширина рядка перестає рости разом з екраном. Бюджет меню там сталий — 910px,
   а 18px+26px давали 990 (меню обрізалось на 2560). 16px+18px = 852, із запасом. */
.pp-nav{gap:clamp(6px,.95vw,18px);min-width:0;}
.pp-nav a{font-size:clamp(12px,.85vw,16px);}
.pp-search-form{flex-shrink:1;min-width:0;}
.pp-search-form input[type=search]{width:clamp(60px,9vw,210px);}
/* CTA «ZAMÓW ONLINE» не стискаємо доти, доки рядок має робочий desktop-бюджет.
   Лише нижче 1250px одночасно прибираємо інлайн-пошук і переводимо CTA в компактну
   іконку. Так немає проміжного стану, де велика кнопка поступово «здавлюється». */
@media(min-width:1250px){
  /* Full CTA keeps the exact original .pp-cta-desktop/.pp-btn-primary styling. */
  .pp-cta-desktop .pp-cta-icon{display:none;}
  .pp-cta-desktop .pp-cta-label{display:inline;}
}
@media(max-width:1249.98px){
  /* Below 1250 the CTA becomes a plain action icon, matching search instead of
     shrinking the orange primary button into an arbitrary orange square. */
  .pp-cta-desktop{display:inline-flex;width:40px;height:40px;min-height:40px;padding:0;border:0;border-radius:0;background:transparent;color:#6B7280;justify-content:center;flex:0 0 40px;}
  .pp-cta-desktop:hover{border-color:transparent;background:transparent;color:var(--pp-orange);}
  .pp-cta-desktop .pp-cta-label{display:none;}
  .pp-cta-desktop .pp-cta-icon{display:block;}
  .pp-search-desktop{display:none;}
  /* Лупа й order icon — єдині контекстні дії основного хедера до mobile menu. */
  .pp-header__actions .pp-search-toggle{display:flex;order:-1;}
  .pp-mobile-search[data-open="true"]{display:block;padding-bottom:12px;}
  .pp-mobile-search .pp-search-form{width:100%;margin:0;}
  .pp-mobile-search .pp-search-form input[type=search]{width:100%;}
}
/* Хедер: бургер-меню, коли посилання перестають вміщатися в рядок.
   Поріг узгоджений з matchMedia у piuroprint.js (перенос пошуку в дровер).
   Опущено 1280→1060: після переходу на clamp меню на мінімальному шрифті
   (12.5px) + лупа + іконка-CTA ще вміщаються в 0.93vw аж до ~1060. */
@media(max-width:1060px){
  .pp-nav-desktop,.pp-search-desktop{display:none;}
  .pp-cta-desktop{display:inline-flex;}
  .pp-header__actions .pp-search-toggle,.pp-burger{display:flex;}
  .pp-header__inner{gap:14px;height:80px;}
  .pp-logo__piuro,.pp-logo__print{font-size:27px;}
  .pp-logo__sub{font-size:9px;}
  .pp-header__actions{margin-left:auto;}
  .pp-header__actions{gap:8px;}
  .pp-mobile-search{padding-bottom:12px;}
  .pp-mobile-search[data-open="true"]{display:block;}
  .pp-mobile-search .pp-search-form{width:100%;margin:0;}
  .pp-mobile-search .pp-search-form input[type=search]{width:100%;}
  /* Дровер меню = плаваюча картка під хедером: закруглений низ + м'яка
     багатошарова тінь. Border-top прибрано — хедер уже має свій border-bottom
     і тінь, разом виходила подвійна лінія («топорно»). */
  .pp-mobile-panel{flex-direction:column;align-items:stretch;gap:0;padding-top:6px;padding-bottom:14px;background:#fff;border-radius:0 0 18px 18px;box-shadow:0 26px 46px -20px rgba(15,23,42,.30),0 10px 20px -12px rgba(15,23,42,.16);max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px);overflow-y:auto;}
  .pp-mobile-panel[data-open="true"]{display:flex;}
  .pp-mobile-panel>a{position:relative;display:flex;align-items:center;gap:6px;width:100%;padding:13px 4px;border-bottom:1px solid #F1F3F5;color:var(--pp-dark);font-size:var(--pp-fs-xl, 16px);font-weight:700;letter-spacing:.01em;text-decoration:none;text-transform:uppercase;}
  .pp-mobile-panel>a:hover{color:var(--pp-orange);}
  .pp-mobile-panel>a .pp-badge-count,.pp-mobile-panel>a .pp-badge-new{position:static;transform:none;margin-left:8px;}
  .pp-mobile-panel>a.pp-btn-primary{justify-content:center;margin-top:12px;}
}
/* Мобільний хедер: смуга «ZAMÓW ONLINE» дублює кошик+бургер і давала гориз. overflow
   (actions ~429px > 390 viewport) → ховаємо її на телефонах. Смуга переваг у 2 колонки
   замість рядка з горизонт. скролом (без обрізання пунктів). */
@media(max-width:600px){
  .pp-ann-bar{padding:8px 0;}
  .pp-ann-bar__inner{flex-direction:column;align-items:stretch;gap:8px;overflow:visible;}
  .pp-ann-bar__items{display:grid;grid-template-columns:1fr 1fr;gap:7px 14px;overflow:visible;font-size:var(--pp-fs-2xs, 11px);}
  .pp-ann-bar__items .pp-sep,.pp-ann-bar__items .pp-ann-sep{display:none;}
  .pp-ann-item{align-items:flex-start;gap:6px;white-space:normal;line-height:1.3;min-width:0;}
  .pp-ann-item svg{margin-top:1px;}
  .pp-ann-bar__right{justify-content:flex-end;gap:10px;overflow:visible;}
  /* Hero-CTA: на телефоні дві кнопки не вміщались у рядок (193+168+16 > 375) і
     переносились у стовпчик → тримаємо їх в один ряд рівними половинами. */
  .pp-hero__btns{flex-wrap:nowrap;gap:10px;}
  .pp-hero__btns>a{flex:1 1 0;min-width:0;justify-content:center;}
}
@media(max-width:1200px){
  .pp-kt__grid{grid-template-columns:1fr;}
  .pp-hero__inner--bg{padding:48px 36px;}
  .pp-prod-grid,.pp-blog-grid{grid-template-columns:repeat(3,1fr);}
  .pp-prod-track>.pp-prod-card{flex:0 0 calc((100% - 54px)/4);}
  .pp-why-grid,.pp-portfolio__grid{grid-template-columns:repeat(3,1fr);}
  .pp-stats-ai__inner{grid-template-columns:1fr;}
  .pp-stats-grid{grid-template-columns:repeat(2,1fr);}
  .pp-cta-bottom__inner{grid-template-columns:1fr;text-align:center;}
  /* Trust-bar: замість горизонтального скролу — акуратний перенос у рядки */
  .pp-trust-bar__inner{flex-wrap:wrap;overflow:visible;gap:20px 28px;}
  .pp-trust-sep{display:none;}
  .pp-newsletter{flex:1 1 340px;min-width:300px;}
  .pp-promo-badge{padding-left:20px;}
}
@media(max-width:768px){
  .pp-hero__h1{font-size:var(--pp-fs-8xl, 34px);}
  .pp-hero__stats{width:100%;flex-wrap:wrap;justify-content:flex-start;}
  .pp-hero__stat-sep{display:none;}
  /* Мобільний банер: фон-зображення ховалося за кнопками → показуємо реальним блоком НАД кнопками */
  .pp-hero__inner--bg{padding:36px 0;background-image:none;min-height:0;}
  .pp-hero__img-mobile{display:block;width:100%;height:auto;margin:8px 0 28px;border-radius:16px;}
  .pp-hero__rating{position:static;display:inline-block;margin-top:24px;}
  .pp-prod-grid,.pp-blog-grid{grid-template-columns:repeat(2,1fr);}
  .pp-prod-track>.pp-prod-card{flex:0 0 calc((100% - 36px)/3);}
  .pp-ai-card__title,.pp-ai-card__desc{max-width:100%;}
  /* position:static сам по собі НЕ скасовує transform із базового правила:
     translateY(-50%) далі тягнув картинку вгору на пів висоти, а знизу лишався
     порожній слід її боксу (margin:44px був компенсацією). Скидаємо transform,
     top/right і max-width — тоді це звичайний центрований блок. */
  .pp-ai-card__robot{position:static;transform:none;top:auto;right:auto;width:auto;height:auto;max-width:100%;max-height:168px;margin:16px auto 8px;display:block;}
  .pp-ai-card{flex-direction:column;justify-content:flex-start;text-align:center;align-items:center;min-height:auto;padding:28px 22px 22px;}
  .pp-ai-card__btn{margin-top:24px;}
  .pp-kreator{padding:28px;}
  .pp-kreator__content,.pp-kreator__media{flex-basis:100%;}
  .pp-kreator__media{max-width:480px;margin:8px auto 0;width:100%;}
  .pp-kt .pp-templates__header{flex-direction:column;}
  .pp-kt .pp-templates__search{width:100%;}
  .pp-kt .pp-templates__search input{width:auto;flex:1;}
  .pp-kt .pp-templates__body{grid-template-columns:1fr;}
  .pp-kt .pp-templates__cats{grid-template-columns:repeat(2,1fr);}
  .pp-why-grid{grid-template-columns:repeat(2,1fr);}
  /* Trust-bar на планшеті/мобі: усе в стовпчик */
  .pp-trust-item{flex:1 1 46%;}
  .pp-newsletter{flex:1 1 100%;min-width:0;}
  .pp-newsletter__form{max-width:520px;}
  .pp-promo-badge{flex:1 1 100%;border-left:none;padding-left:0;}
}
@media(max-width:480px){
  .pp-kreator{padding:22px 18px;}
  .pp-kreator__h3{font-size:clamp(24px,8vw,28px);}
  .pp-kreator__list{margin-bottom:24px;}
  .pp-kreator__content .pp-btn-primary{width:100%;justify-content:center;}
  .pp-kreator__thumb{height:40px;}
  .pp-prod-grid,.pp-blog-grid{grid-template-columns:1fr 1fr;}
  .pp-prod-track{gap:12px;}
  .pp-prod-track>.pp-prod-card{flex:0 0 calc((100% - 12px)/2);}
  /* min/max-width:44px з базового правила ігнорують width:38px → 44×38 овал.
     Перевизначаємо всі три, щоб лишалось коло. */
  .pp-prod-nav{width:38px;height:38px;min-width:38px;max-width:38px;}
  .pp-prod-nav--prev{left:-6px;}
  .pp-prod-nav--next{right:-6px;}
  .pp-why-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .pp-why-card{flex-direction:column;align-items:center;text-align:center;padding:14px;gap:10px;}
  .pp-why-icon{width:48px;height:48px;border-radius:12px;}
  .pp-why-icon svg{width:30px;height:30px;}
}
/* Найвужчі телефони (320–400): лого на 32px + лупа/кошик/бургер не вміщались у
   .pp-wrap (0.93×320 = 298px), і блок дій виїздив за межі. Стискаємо лого й відступи. */
@media(max-width:400px){
  .pp-header__inner{gap:8px;}
  .pp-header__actions{gap:2px;}
  .pp-logo__piuro,.pp-logo__print{font-size:20px;}
  .pp-logo__sub{font-size:8px;letter-spacing:.08em;}
  .pp-icon-btn{width:34px;}
  .pp-burger{width:38px;}
}
/* Калькулятор ціни: планшет — кроки в рядок, декор ховаємо */
@media(max-width:1100px){
  .pp-calc{gap:16px 20px;}
  .pp-calc__arrow,.pp-calc__sep{display:none;}
  .pp-calc__label{flex:1 1 100%;}
  .pp-calc__step{flex:1 1 calc(33.333% - 20px);align-items:center;min-width:200px;}
  .pp-calc__step>div:not(.pp-calc__step-num){flex:1;min-width:0;}
  .pp-calc__select{width:100%;min-width:0;}
  .pp-calc__result{flex:1 1 auto;margin-left:0;}
  .pp-calc__cta{margin-left:auto;}
}
/* Калькулятор ціни: мобільний — усе в стовпчик, кнопка на всю ширину */
@media(max-width:600px){
  .pp-calc{flex-direction:column;align-items:stretch;gap:14px;padding:16px 18px;}
  .pp-calc__step{flex:none;width:100%;min-width:0;}
  .pp-calc__result{flex:none;width:100%;display:flex;align-items:baseline;gap:10px;margin-left:0;}
  .pp-calc__price{margin-top:0;}
  .pp-calc__cta{width:100%;margin-left:0;margin-top:2px;}
}
/* Категорії: планшет — переносимо в рядки, нічого не ховаємо */
@media(max-width:1100px){
  .pp-cats__card{flex-wrap:wrap;justify-content:center;gap:22px 8px;overflow-x:visible;}
  .pp-cat-all{border-left:none;padding-left:0;}
}
/* Категорії: мобільний — сітка по 4, менші іконки */
@media(max-width:600px){
  .pp-cats{padding:20px 0;}
  .pp-cats__card{gap:18px 6px;padding:16px 10px;}
  .pp-cat-item{min-width:0;flex:0 0 calc(25% - 6px);}
  .pp-cat-icon{width:56px;height:56px;border-radius:16px;}
  .pp-cat-icon svg{width:30px;height:30px;}
  .pp-cat-item span{font-size:var(--pp-fs-2xs, 11px);}
  .pp-cat-all{flex:1 1 100%;text-align:center;padding-top:6px;}
}
/* ===== Мега-меню «Usługi» — усі товари за алфавітом ===== */
.pp-nav__services{cursor:pointer;gap:5px;}
.pp-nav__caret{transition:transform .2s ease;flex-shrink:0;}
.pp-nav__services[aria-expanded="true"]{color:var(--pp-orange);}
.pp-nav__services[aria-expanded="true"] .pp-nav__caret{transform:rotate(180deg);}
.pp-services-menu{position:absolute;top:100%;left:0;right:0;z-index:190;padding-top:1px;}
.pp-services-menu[hidden]{display:none;}
.pp-services-menu__card{background:#fff;border:1px solid var(--pp-border);border-top:2px solid var(--pp-orange);border-radius:0 0 var(--pp-radius-lg) var(--pp-radius-lg);box-shadow:var(--pp-shadow-float);padding:28px 36px 32px;max-height:calc(100vh - 130px);max-height:calc(100dvh - 130px);overflow:auto;}
.pp-services-menu__head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--pp-border);}
.pp-services-menu__title{display:flex;align-items:center;gap:12px;font-size:var(--pp-fs-5xl, 26px);font-weight:800;color:var(--pp-dark);letter-spacing:-.01em;}
.pp-services-menu__title svg{color:var(--pp-orange);flex-shrink:0;}
.pp-services-menu__close{box-sizing:border-box;width:38px;height:38px;min-width:38px;max-width:38px;padding:0;flex:0 0 auto;border:none;background:var(--pp-product-card-bg);border-radius:50%;color:var(--pp-text-2);cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:0;transition:background .2s,color .2s;}
.pp-services-menu__close svg{width:16px;height:16px;margin:0;flex:0 0 auto;stroke:currentColor;}
.pp-services-menu__close:hover{background:var(--pp-orange-light);color:var(--pp-orange);}
.pp-services-menu__grid{column-count:5;column-gap:26px;}
@media(max-width:1600px){.pp-services-menu__grid{column-count:4;}}
@media(max-width:1200px){.pp-services-menu__grid{column-count:3;}}
@media(max-width:820px){.pp-services-menu__grid{column-count:2;}}
@media(max-width:520px){.pp-services-menu__grid{column-count:1;}}
.pp-services-item{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:8px;align-items:start;margin-bottom:11px;break-inside:avoid;-webkit-column-break-inside:avoid;}
.pp-services-item--newletter{margin-top:6px;}
.pp-services-item:not(.pp-services-item--newletter)::before{content:'';grid-column:1;grid-row:1;}
.pp-services-letter{position:static;grid-column:1;grid-row:1;display:inline-block;min-width:24px;text-align:center;font-size:var(--pp-fs-xl, 16px);font-weight:800;line-height:1;text-transform:uppercase;color:var(--pp-orange);background:var(--pp-orange-light);padding:4px 6px;border-radius:6px;}
.pp-services-item a{grid-column:2;font-size:var(--pp-fs-xl, 16px);font-weight:600;line-height:1.35;color:var(--pp-text);text-decoration:none;text-transform:none;letter-spacing:0;transition:color .2s;}
.pp-services-item a:hover{color:var(--pp-orange);text-decoration:underline;}
/* Tablet/mobile: the products panel becomes a real viewport drawer.
   Never switch it to position:static inside the sticky header: that old mode
   collapsed the header flow and made the panel appear to disappear. */
@media(max-width:1060px){
  body.pp-services-open{overflow:hidden;}
  .pp-services-menu:not([hidden]){display:block;position:fixed;inset:0;z-index:1600;padding:0;overflow:auto;-webkit-overflow-scrolling:touch;background:rgba(15,23,42,.58);backdrop-filter:blur(3px);}
  .pp-services-menu>.pp-wrap{width:100%;max-width:none;margin:0;padding:0;}
  .pp-services-menu__card{width:min(720px,100%);min-height:100dvh;max-height:none;margin-left:auto;padding:22px 24px 42px;border:0;border-radius:22px 0 0 22px;box-shadow:-20px 0 60px rgba(15,23,42,.24);}
  .pp-services-menu__head{position:sticky;top:0;z-index:3;margin:-22px -24px 22px;padding:19px 24px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--pp-border);backdrop-filter:blur(12px);}
  .pp-services-menu__grid{column-count:2;column-gap:24px;}
}
@media(max-width:560px){
  .pp-services-menu__card{width:100%;padding:18px 16px 34px;border-radius:0;}
  .pp-services-menu__head{margin:-18px -16px 18px;padding:16px;}
  .pp-services-menu__grid{column-count:1;}
}

/* --- Сучасний тост «додано в кошик» --------------------------------------
   Лише на товарі та в каталозі. На кошику/checkout нотиси лишаються інлайн
   (у них власні scoped-стилі .woocommerce-cart / .pp-checkout). */
.pp-single-product .woocommerce-notices-wrapper,
.tax-product_cat .woocommerce-notices-wrapper,
.post-type-archive-product .woocommerce-notices-wrapper{position:fixed;top:92px;right:16px;left:auto;z-index:1300;width:min(360px,calc(100vw - 32px));margin:0;pointer-events:none;}
.pp-single-product .woocommerce-message,
.tax-product_cat .woocommerce-message,
.post-type-archive-product .woocommerce-message{pointer-events:auto;display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:0 0 10px;padding:13px 15px;border:1px solid var(--pp-border);border-left:3px solid var(--pp-orange);border-radius:14px;background:#fff;box-shadow:0 16px 44px rgba(15,23,42,.17);transform:translateX(125%);opacity:0;transition:transform .38s cubic-bezier(.22,1,.36,1),opacity .38s;}
.woocommerce-message.pp-cart-toast--in{transform:none;opacity:1;}
.woocommerce-message.pp-cart-toast--out{transform:translateX(125%);opacity:0;}
.pp-cart-toast__icon{flex:0 0 auto;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--pp-orange-light);color:var(--pp-orange);}
.pp-cart-toast__text{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.25;}
.pp-cart-toast__text strong{font-size:var(--pp-fs-md,14px);color:var(--pp-dark);}
.pp-cart-toast__name{margin-top:1px;font-size:var(--pp-fs-xs,12px);color:var(--pp-text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pp-single-product .woocommerce-message .pp-cart-toast__btn,
.tax-product_cat .woocommerce-message .pp-cart-toast__btn,
.post-type-archive-product .woocommerce-message .pp-cart-toast__btn{flex:0 0 auto;margin:0 0 0 auto;}
@media(max-width:520px){
  .pp-single-product .woocommerce-notices-wrapper,
  .tax-product_cat .woocommerce-notices-wrapper,
  .post-type-archive-product .woocommerce-notices-wrapper{top:auto;bottom:14px;right:12px;left:12px;width:auto;}
}
/* Розмітку тоста дає ГЛОБАЛЬНИЙ фільтр wc_add_to_cart_message_html (icon•text•btn),
   тож базова розкладка «в один ряд» має діяти скрізь, а не лише на товарі/каталозі.
   На кошику/checkout без цього кнопка падала другим рядком, а base ::before давав
   другу іконку. Плаваючий тост-оверлей вище лишається тільки на товарі/каталозі. */
.woocommerce-notices-wrapper .woocommerce-message:has(.pp-cart-toast__btn){display:flex;align-items:center;gap:11px;flex-wrap:nowrap;padding:14px 16px 14px 52px;}
/* .pp-cart-toast__icon — порожнє коло: інлайн-SVG галочки вирізає wp_kses меседжа,
   тож робочу іконку дає base ::before (data-URI, стійкий до kses). Ховаємо порожнє
   коло і центруємо ::before у зарезервованому лівому полі. */
.woocommerce-notices-wrapper .woocommerce-message:has(.pp-cart-toast__btn) .pp-cart-toast__icon{display:none;}
.woocommerce-notices-wrapper .woocommerce-message:has(.pp-cart-toast__btn)::before{top:50%;left:18px;transform:translateY(-50%);}
.woocommerce-message a.pp-cart-toast__btn{flex:0 0 auto;width:auto;margin:0 0 0 auto;float:none;white-space:nowrap;}

/* --- Trust-bar від планшета до ноутбука (641–1550) ---------------------------
   Вміст стрічки потребує ~1415px, тож на 1280/1366/1440 останній блок
   (промо-бейдж) не вміщався. Замість flex-переносу, який лишав би його самотнім
   у другому ряду, тут сітка: ряд 1 — три переваги рівними колонками,
   ряд 2 — форма підписки на дві колонки + бейдж у третій. */
@media(min-width:641px) and (max-width:1550px){
  /* Раніше ця сітка починалась із 993px, і діапазон 641–992 лишався на flex:
     на 768 виходило 2 переваги + третя сама на всю ширину, а промо-бейдж стояв
     зі зсувом 28px (базовий margin-left скидався аж на ≤600). */
  .pp-trust-bar__inner{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 28px;align-items:center;}
  .pp-trust-sep{display:none;}
  .pp-trust-item{min-width:0;}
  .pp-newsletter{grid-column:1 / 3;min-width:0;}
  .pp-newsletter__form{max-width:560px;} /* на дві колонки поле розтягувалось до 785px */
  .pp-promo-badge{grid-column:3;margin-left:0;padding-left:28px;border-left:1px solid rgba(255,255,255,.1);}
}
/* Плаваючий бейдж відгуків (CusRev) сидить у правому нижньому куті в'юпорта і
   накривав праву частину нижнього рядка футера. Сам бейдж ховається лише на ≤560,
   тож і компенсація мусить починатись звідти, а не з 769 (на 561–768 накривав). */
@media(min-width:561px){
  body:has(#cr_floatingtrustbadge) .pp-footer__bottom-inner{padding-right:150px;}
}

/* --- Стрічка переваг і нижній рядок на телефоні ----------------------------
   Поріг узгоджений із сіткою колонок футера (640): вище — три доріжки, нижче —
   стовпчик. Тут же гасимо десктопні відступи, які на вузькому екрані читаються
   як пустоти, і вирівнюємо правові посилання (flex+wrap клав їх рвано). */
@media(max-width:640px){
  .pp-trust-bar{padding:20px 0;}
  .pp-trust-bar__inner{gap:14px;}
  .pp-trust-item{flex:1 1 100%;min-width:0;}
  .pp-newsletter__title{white-space:normal;}
  .pp-newsletter__form{max-width:none;}
  .pp-promo-badge{margin-left:0;}
  .pp-promo-badge__text{max-width:none;}

  .pp-footer__bottom{padding:14px 0;}
  .pp-footer__bottom-inner{flex-direction:column;align-items:flex-start;gap:10px;}
  .pp-footer__legal{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;width:100%;}
}

/* CusRev floating trust badge is global, so its collision policy belongs to the
   global storefront layer rather than reviews.css (it also appears in catalog). */
body.pp-body #cr_floatingtrustbadge{max-width:150px;transform-origin:right bottom;}
@media(max-width:900px){body.pp-body #cr_floatingtrustbadge{transform:scale(.82);transform-origin:right bottom;}}
@media(max-width:560px){body.pp-body #cr_floatingtrustbadge{display:none!important;}}
/* Keep overlay navigation above third-party floating widgets. */
body.pp-services-open .pp-header{z-index:2200;}
body.pp-services-open #cr_floatingtrustbadge{opacity:0;pointer-events:none;}

@media (max-width:760px){
  .pp-co-header__inner{min-height:64px;gap:16px;}
  .pp-co-header__back{margin-left:auto;padding-left:0;border:0;font-size:var(--pp-fs-xs, 12px);}
}



@media(max-width:1200px){
  .pp-calc-wrap .pp-calc{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pp-calc-wrap .pp-calc__label,.pp-calc-wrap .pp-calc__cta{grid-column:1/-1;}
}

/* Homepage Kreator / calculator responsive guardrails. */
@media(max-width:600px){
  .pp-calc-wrap{margin-top:-24px;padding-bottom:20px;}
  .pp-calc-wrap .pp-calc{grid-template-columns:1fr;gap:10px;padding:16px;}
  .pp-calc-wrap .pp-calc__label{display:block;padding-bottom:2px;}
  .pp-calc-wrap .pp-calc__label span{margin-top:4px;}
  .pp-calc-wrap .pp-calc__step{width:auto;padding:12px;}
  .pp-calc-wrap .pp-calc__result{width:auto;display:flex;flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px;}
}

/* === 2026-08-18 Footer / newsletter desktop stability =====================
   The trust strip used one long flex row on wide screens. Its newsletter had
   flex:1, so intermediate desktop widths could squeeze neighbouring copy and
   make the email field visually run into the text on the left. Give every
   desktop section an explicit grid track instead of letting flex negotiate it.
   Social buttons are also fully scoped here so generic link/SVG rules cannot
   strip their tile geometry. */
@media (min-width:1551px){
  .pp-trust-bar__inner{
    display:grid;
    grid-template-columns:
      minmax(170px,.92fr)
      minmax(170px,.92fr)
      minmax(170px,.92fr)
      minmax(360px,1.55fr)
      minmax(230px,.9fr);
    column-gap:clamp(20px,1.7vw,34px);
    row-gap:18px;
    align-items:center;
  }
  .pp-trust-sep{display:none;}
  .pp-trust-item,
  .pp-newsletter,
  .pp-promo-badge{min-width:0;}
  .pp-newsletter{grid-column:auto; width:100%;}
  .pp-newsletter__title{white-space:normal;}
  .pp-newsletter__form{width:100%;max-width:none;min-width:0;}
  .pp-newsletter__input{width:100%;min-width:0;}
  .pp-promo-badge{grid-column:auto;margin-left:0;padding-left:clamp(18px,1.5vw,28px);}
}

/* Social tiles: keep them as real 36x36 buttons even if another stylesheet
   applies generic footer/link/SVG declarations later in the cascade. */
body.pp-body .pp-footer .pp-footer__social{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 36px;
  width:36px;
  min-width:36px;
  max-width:36px;
  height:36px;
  min-height:36px;
  padding:0;
  margin:0;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.08);
  border-radius:9px;
  background:rgba(255,255,255,.07);
  color:#fff;
  line-height:1;
  text-decoration:none;
  overflow:hidden;
}
body.pp-body .pp-footer .pp-footer__social svg{
  display:block;
  flex:0 0 16px;
  width:16px;
  height:16px;
  max-width:16px;
  max-height:16px;
  stroke:currentColor !important;
}
body.pp-body .pp-footer .pp-footer__social:hover,
body.pp-body .pp-footer .pp-footer__social:focus-visible{
  background:var(--pp-orange);
  border-color:var(--pp-orange);
  color:#fff;
}
body.pp-body .pp-footer .pp-footer__contact-icons .pp-footer__social{
  flex-basis:34px;
  width:34px;
  min-width:34px;
  max-width:34px;
  height:34px;
  min-height:34px;
}

/* === 2026-08-18 Footer trust icons ========================================
   The controlled footer SVG set uses stroke="currentColor". The trust tile
   previously had no explicit color, so it inherited a dark page/link color
   and looked like a flat grey/black placeholder on the dark footer. Keep this
   styling scoped to the three trust items only. */
body.pp-body .pp-trust-bar .pp-trust-item__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 40px;
  width:40px;
  min-width:40px;
  height:40px;
  min-height:40px;
  padding:0;
  box-sizing:border-box;
  border:1px solid rgba(249,115,22,.34);
  border-radius:10px;
  background:rgba(249,115,22,.12);
  color:var(--pp-orange,#F97316);
  box-shadow:inset 0 0 0 1px rgba(249,115,22,.035);
}
body.pp-body .pp-trust-bar .pp-trust-item__icon svg{
  display:block;
  flex:0 0 20px;
  width:20px;
  height:20px;
  max-width:20px;
  max-height:20px;
  color:inherit;
  stroke:currentColor;
  fill:none;
}

/* === 2026-09-01 Футер: сітка колонок ======================================
   Колонки футера — це документ Gutenberg (склад і ширини редагуються в
   адмінці), і саме тому вони не могли їхати на flex: правило ядра
   `.wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column` має вищу
   специфічність за тему і нав'язує СВОЮ flex-basis — 0 на ≥782px і 100% нижче.
   Тобто `flex:1 1 125px` із теми ніколи не працював. Заміряно на стенді до
   правки:
     1440 — бренд 527px проти 139px у кожної з решти п'яти колонок;
     1024 — п'ять колонок у рядку + «Оплата та доставка» сама в другому на 948px;
      900 — 4 і 2 колонки з різною шириною;
     ≤768 — усі шість блоків одним стовпцем (висота футера ~1800px).
   Grid ігнорує flex-* у дітей, тож достатньо перевести контейнер у grid — ядро
   більше не втручається, і жодного !important не треба.
   Доріжки рахує footer.php із самого документа (--pp-ftracks: width-wide →
   1.7fr, contact/methods → 1.2fr, решта → 1fr), бо CSS не має звідки знати,
   скільки колонок автор лишив. Якщо змінна не приїхала — фолбек auto-fit.
   Щаблі: один рядок (≥1200) → 3 колонки → 2 колонки (≤640). Саме 3 і 2, бо
   шість колонок діляться на них без осиротілих рядків. */
.pp-footer__layout>.wp-block-columns{
  display:grid;
  grid-template-columns:var(--pp-ftracks,repeat(auto-fit,minmax(150px,1fr)));
  align-items:start;
  gap:36px 28px;
  margin:0;
}
/* min-width:125px із flex-версії в сітці лише ламав би вузькі доріжки. */
.pp-footer__layout .wp-block-column{min-width:0;min-inline-size:0;}
.pp-footer__layout .wp-block-column.pp-footer__col--width-full{grid-column:1 / -1;}

@media(max-width:1199.98px){
  .pp-footer__layout>.wp-block-columns{grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 26px;}
  .pp-footer__layout{margin-bottom:32px;}
}
@media(max-width:640px){
  .pp-footer{padding-top:32px;}
  .pp-footer__layout{margin-bottom:26px;}
  .pp-footer__layout>.wp-block-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 20px;}
  /* Бренд і «Оплата та доставка» — на всю ширину: перший інакше жме опис у
     8 рядків, другий тримає плитки лого читабельного розміру. Списки посилань
     і «Контакти» стають парами, тож осиротілих півколонок не лишається. */
  .pp-footer__layout .wp-block-column.pp-footer__col--brand,
  .pp-footer__layout .wp-block-column.pp-footer__col--methods{grid-column:1 / -1;}
  .pp-footer__desc{max-width:none;margin-bottom:14px;}
  .pp-footer__socials{margin-bottom:14px;}
  /* Кнопки «Контактів» стоять у півколонці (~164px на 375): у розмірі sm
     (13px + паддінги 16px) підпис ламався на два рядки. */
  .pp-footer .pp-footer__contact-btn,
  .pp-footer .pp-footer__contact-btn-outline{--pp-btn-padding-inline:10px;--pp-btn-font-size:var(--pp-fs-xs,12px);white-space:normal;line-height:1.25;}
}

/* PIUROPRINT mobile hero close-out (2026-09-17)
   Keep the desktop/tablet contract untouched. On phones the previous flex
   layout made the stats fall into a tall one-item-per-row column and the
   CTA block kept too much vertical whitespace. */
@media (max-width:600px){
  .pp-hero__inner--bg{
    /* .pp-wrap already owns the canonical shell gutter. Do not add a
       second horizontal gutter on the same element on phones. */
    padding:28px 0 32px;
    border-radius:18px;
  }

  .pp-hero__desc{
    margin-bottom:20px;
  }

  .pp-hero__img-mobile{
    margin:4px 0 22px;
    border-radius:12px;
  }

  .pp-hero__btns{
    gap:10px;
    margin-bottom:24px;
  }

  .pp-hero__btns>a{
    min-height:48px;
    padding-inline:10px;
    font-size:13px;
    line-height:1.1;
    white-space:nowrap;
  }

  .pp-hero__stats{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:18px;
    row-gap:20px;
    align-items:start;
    margin-top:0;
    padding-top:24px;
  }

  .pp-hero__stat{
    min-width:0;
    padding-right:0;
    gap:8px;
    align-items:flex-start;
  }

  .pp-hero__stat strong{
    font-size:20px;
    line-height:1.05;
  }

  .pp-hero__stat span{
    font-size:11px;
    line-height:1.3;
    overflow-wrap:anywhere;
  }

  /* Current homepage has five metrics; the last, text-heavy delivery metric,
     reads better as a full-width final row. */
  .pp-hero__stat:last-child{
    grid-column:1/-1;
  }

  .pp-hero__rating{
    display:block;
    width:100%;
    margin-top:22px;
    padding:14px 16px;
    border-radius:14px;
  }
}

@media (max-width:360px){
  .pp-hero__inner--bg{padding-inline:0;}
  .pp-hero__btns{gap:8px;}
  .pp-hero__btns>a{padding-inline:7px;font-size:12px;}
  .pp-hero__stats{column-gap:12px;row-gap:18px;}
}
