/* Presta4You Theme - Custom CSS (wierny szablon) */

/* Czcionka Inter - nadpisanie Manrope z classic theme */
html, body {
  font-family: 'Inter', sans-serif !important;
}

/* Nadpisanie globalnego koloru linkow z classic theme (#24b9d7) */
a {
  color: inherit !important;
  text-decoration: none;
}

a:hover {
  color: #44c27a !important;
  text-decoration: none !important;
}

/* Plynne przewijanie + zapobieganie poziomemu scrollowi przy full-bleed sekcjach */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }

/* Top bar */
.p4y-top-bar {
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #e5e7eb !important;
}

.p4y-top-bar > div {
  display: flex !important;
  justify-content: space-between !important;
  width: 100%;
}

/* ===== Selektory waluty i jezyka w top barze ===== */
.p4y-topbar-currency,
.p4y-topbar-language {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.p4y-selector {
  position: relative;
}

.p4y-selector-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3em;
  font-size: 0.75rem;
  font-weight: 500;
  color: #475569;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  line-height: 1;
  outline: none !important;
  box-shadow: none !important;
}

.p4y-selector-btn:focus,
.p4y-selector-btn:focus-visible,
.p4y-selector-btn:active {
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

.p4y-selector-btn:hover {
  color: #44c27a !important;
}

.p4y-selector-arrow {
  font-size: 0.5rem;
  opacity: 0.6;
  transition: transform 0.2s;
}

.p4y-selector.open .p4y-selector-arrow {
  transform: rotate(180deg);
}

.p4y-selector-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  padding: 0.25rem 0;
  min-width: 100px;
  z-index: 200;
  list-style: none;
  margin: 0;
}

.p4y-selector.open .p4y-selector-dropdown {
  display: block;
}

.p4y-selector-dropdown li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.p4y-selector-dropdown li a {
  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.4rem 0.75rem;
  font-size: 0.75rem;
  color: #475569 !important;
  white-space: nowrap;
  transition: background 0.15s;
}

.p4y-selector-dropdown li a:hover {
  background: #f1f5f9;
  color: #44c27a !important;
}

.p4y-selector-dropdown li.current a {
  color: #44c27a !important;
  font-weight: 600;
}

.p4y-topbar-flag {
  width: 16px;
  height: 12px;
  border-radius: 2px;
  object-fit: cover;
}

/* Breadcrumb */
.p4y-breadcrumb-bar {
  background: white;
  border-bottom: none;
  padding: 0.75rem 0 0.75rem 0;
}

.p4y-breadcrumb {
  display: flex;
  align-items: center;
  font-size: 0.75rem;
  color: #64748b;
}

.p4y-breadcrumb-link {
  color: #64748b;
  text-decoration: none;
  transition: color 0.2s;
}

.p4y-breadcrumb-link:hover {
  color: #44c27a;
  text-decoration: none;
}

.p4y-breadcrumb-sep {
  margin: 0 0.5rem;
  color: #cbd5e1;
}

.p4y-breadcrumb-current {
  color: #1e293b;
  font-weight: 600;
}

/* Ukryj domyslny breadcrumb PS */
nav.breadcrumb {
  display: none !important;
}

/* Efekt szkla na headerze */
.glass-header {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: none !important;
}

/* Usun cien z #header (classic theme) */
#header {
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

/* Logo w headerze */
.p4y-header-logo {
  height: 40px;
  width: auto;
  display: block;
}

/* Nadpisanie koloru linkow z classic theme (#24b9d7 -> slate-600) */
footer a {
  color: #475569 !important;
  transition: color 0.2s;
}

footer a:hover {
  color: #44c27a !important;
}

/* Newsletter w footerze */
.p4y-newsletter-form {
  margin: 0;
}

.p4y-newsletter-input-row {
  display: flex;
  align-items: stretch;
  gap: 0;
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid #d1d5db;
  background: white;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.p4y-newsletter-input-row:focus-within {
  border-color: #44c27a;
  box-shadow: 0 0 0 1px #44c27a;
}

.p4y-newsletter-input {
  flex: 1;
  padding: 0.75rem 1rem !important;
  border: none !important;
  background: white !important;
  font-size: 0.875rem !important;
  color: #1e293b !important;
  outline: none !important;
  box-shadow: none !important;
  min-width: 0;
}

.p4y-newsletter-input::placeholder {
  color: #9ca3af;
}

.p4y-newsletter-btn {
  flex-shrink: 0;
  padding: 0.75rem 1rem !important;
  background: #44c27a !important;
  color: white !important;
  border: none !important;
  cursor: pointer;
  transition: background-color 0.2s;
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.p4y-newsletter-btn:hover {
  background: #36af68 !important;
}

.p4y-newsletter-conditions {
  font-size: 0.7rem;
  color: #94a3b8;
  margin-top: 0.5rem;
  line-height: 1.4;
}

.p4y-newsletter-msg {
  font-size: 0.8rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  margin-bottom: 0.75rem;
}

.p4y-newsletter-success {
  background: #f0fdf4;
  color: #15803d;
  border: 1px solid #bbf7d0;
}

.p4y-newsletter-error {
  background: #fef2f2;
  color: #dc2626;
  border: 1px solid #fecaca;
}

/* GDPR checkbox w newsletter */
.p4y-newsletter .gdpr_module_consent {
  margin-top: 0.5rem;
  font-size: 0.7rem;
  color: #94a3b8;
  display: flex;
  align-items: flex-start;
  gap: 0.375rem;
}

.p4y-newsletter .gdpr_module_consent input[type="checkbox"] {
  accent-color: #44c27a;
  margin-top: 0.125rem;
}

/* Logo w footerze */
.p4y-footer-logo {
  height: 36px;
  width: auto;
  display: block;
}

/* Badge wersji (bialy) */
.badge-version {
  background-color: rgba(255, 255, 255, 0.95);
  color: #334155;
  font-size: 0.75rem;
  padding: 4px 8px;
  border-radius: 6px;
  font-weight: 700;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Zoom zdjecia produktu */
.product-image-container {
  background-color: #f1f5f9;
  transition: transform 0.3s ease;
}
.group:hover .product-image-container img {
  transform: scale(1.05);
}

/* Wzor tla (szary) */
.pattern-dots {
  background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
  background-size: 20px 20px;
}

/* ===== Ukrycie domyslnych elementow classic theme ===== */
/* Ukrywamy oryginalne elementy headera classic */
#header .header-banner,
#header .header-nav,
#header .header-top {
  display: none !important;
}

/* Ukryj wrapper z classic (row itp) */
#wrapper > .container,
#wrapper > .container-fluid {
  max-width: 100%;
  padding: 0;
}

/* ===== Glowny layout strony ===== */
#wrapper {
  background: #fff;
  padding-top: 0;
}

.p4y-page-wrapper {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

.p4y-columns-row {
  display: flex;
  flex-wrap: wrap;
}

.p4y-left-column {
  flex: 0 0 250px;
  width: 250px;
  padding-right: 1.5rem;
}

.p4y-content-wrapper {
  flex: 1;
  min-width: 0;
}

.p4y-right-column {
  flex: 0 0 250px;
  width: 250px;
  padding-left: 1.5rem;
}

/* Full width - brak kolumn bocznych */
.p4y-full-width {
  width: 100%;
}

@media (max-width: 767px) {
  .p4y-left-column,
  .p4y-right-column {
    flex: 0 0 100%;
    width: 100%;
    padding: 0;
  }
}

/* Ukryj breadcrumb na stronie glownej */
.page-home .breadcrumb {
  display: none;
}

/* ===== Nadpisania Bootstrap ===== */
/* Wiecej szerokosci dla content-wrapper na stronie glownej */
.page-home #content-wrapper {
  padding: 0;
  margin: 0;
}

/* Ukryj footer classic (displayFooter hooks) jesli sa poza naszym footem */
#footer .footer-container {
  display: none;
}

/* ===== Wyszukiwarka w headerze ===== */
#header .search-widgets .p4y-search-form,
.glass-header .search-widgets .p4y-search-form {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
}

#header .search-widgets .p4y-search-form input[type="text"].p4y-search-input,
.glass-header .search-widgets .p4y-search-form input[type="text"].p4y-search-input {
  width: 100% !important;
  min-width: 200px !important;
  padding: 0.5rem 2.5rem 0.5rem 1rem !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 9999px !important;
  background-color: #f8fafc !important;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  outline: none !important;
  transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;
  color: #334155 !important;
  box-shadow: none !important;
}

#header .search-widgets .p4y-search-form input[type="text"].p4y-search-input::placeholder {
  color: #9ca3af;
}

#header .search-widgets .p4y-search-form input[type="text"].p4y-search-input:focus,
.glass-header .search-widgets .p4y-search-form input[type="text"].p4y-search-input:focus {
  border-color: #44c27a !important;
  box-shadow: 0 0 0 1px #44c27a !important;
  background-color: white !important;
  outline: none !important;
}

#header .search-widgets .p4y-search-form .p4y-search-btn,
.glass-header .search-widgets .p4y-search-form .p4y-search-btn {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  background: none !important;
  border: none !important;
  color: #9ca3af;
  cursor: pointer;
  padding: 0 !important;
  font-size: 0.875rem;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

#header .search-widgets .p4y-search-form .p4y-search-btn:hover {
  color: #44c27a;
}

/* Ukryj material-icons w starym/nowym szablonie search */
.glass-header .search-widget .material-icons,
.glass-header .search-widgets .material-icons,
#header .search-widgets .material-icons {
  display: none !important;
}

/* Ukryj naglowek h4 z modulu newsletter (mamy wlasny) */
.p4y-newsletter-wrapper .p4y-newsletter h4 {
  display: none;
}

/* ===== Koszyk w headerze ===== */
#p4y-cart-wrapper .blockcart {
  display: flex;
  align-items: center;
}

#p4y-cart-wrapper .blockcart .header {
  display: block;
}

#p4y-cart-wrapper .blockcart .header a {
  position: relative;
  display: flex;
  align-items: center;
  color: #475569;
  text-decoration: none;
  transition: color 0.2s;
  font-size: 1.25rem;
}

#p4y-cart-wrapper .blockcart .header a:hover {
  color: #44c27a;
}

#p4y-cart-wrapper .blockcart a .material-icons.shopping-cart {
  font-size: 1.5rem;
}

/* Ukryj tekst "Koszyk" */
#p4y-cart-wrapper .blockcart a .hidden-sm-down {
  display: none !important;
}

/* Badge z liczba produktow */
#p4y-cart-wrapper .blockcart .cart-products-count {
  position: absolute;
  top: -8px;
  right: -10px;
  background: #44c27a;
  color: white;
  font-size: 0.65rem;
  font-weight: 700;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid white;
}

#p4y-cart-wrapper .blockcart .body {
  display: none;
}

/* ===== Dropdown koszyka (hover) ===== */
#p4y-cart-wrapper {
  position: relative;
}

#p4y-cart-wrapper .cart-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 1000;
  padding-top: 10px;
}

#p4y-cart-wrapper:hover .cart-dropdown,
#p4y-cart-wrapper .cart-dropdown:hover {
  display: block;
}

#p4y-cart-wrapper .cart-dropdown-inner {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.10);
  min-width: 280px;
  max-width: 320px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
}

.cart-dropdown-header {
  padding: 10px 14px;
  border-bottom: 1px solid #f1f5f9;
  background: #f8fafc;
}

.cart-dropdown-title {
  font-weight: 600;
  font-size: 0.75rem;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.cart-dropdown-items {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 280px;
  overflow-y: auto;
}

.cart-dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid #f1f5f9;
  transition: background 0.15s;
}

.cart-dropdown-item:last-child {
  border-bottom: none;
}

.cart-dropdown-item:hover {
  background: #f8fafc;
}

.cart-dropdown-item-img {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 6px;
  overflow: hidden;
  background: #f1f5f9;
}

.cart-dropdown-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cart-dropdown-item-info {
  flex: 1;
  min-width: 0;
}

.cart-dropdown-item-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: 0.76rem;
  font-weight: 400;
  color: #334155 !important;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none !important;
}

.cart-dropdown-item-name:hover {
  color: #44c27a !important;
}

.cart-dropdown-item-details {
  margin-top: 3px;
  font-size: 0.72rem;
  color: #64748b;
}

.cart-dropdown-item-qty {
  margin-right: 4px;
}

.cart-dropdown-item-price {
  font-weight: 500;
  color: #1e293b;
}

.cart-dropdown-item-tax-label {
  font-size: 0.65rem;
  color: #94a3b8;
  margin-left: 2px;
}

.cart-dropdown-item-remove {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #94a3b8 !important;
  transition: all 0.15s;
  font-size: 0.65rem;
}

.cart-dropdown-item-remove:hover {
  background: #fee2e2;
  color: #ef4444 !important;
}

.cart-dropdown-totals {
  padding: 10px 14px;
  border-top: 1px solid #e5e7eb;
  background: #f8fafc;
}

.cart-dropdown-total-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.8rem;
  font-weight: 500;
  color: #1e293b;
}

.cart-dropdown-total-gross {
  font-size: 0.72rem;
  font-weight: 400;
  color: #94a3b8;
  margin-top: 3px;
}

.cart-dropdown-total-gross .cart-dropdown-total-value {
  color: #94a3b8;
  font-size: 0.72rem;
  font-weight: 400;
}

.cart-dropdown-total-value {
  color: #44c27a;
  font-size: 0.85rem;
  font-weight: 600;
}

.cart-dropdown-actions {
  padding: 10px 14px;
}

.cart-dropdown-btn-checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 8px 14px;
  background: #44c27a;
  color: #fff !important;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.2s;
}

.cart-dropdown-btn-checkout:hover {
  background: #38a869;
  color: #fff !important;
}

/* Scrollbar stylizacja w dropdown */
.cart-dropdown-items::-webkit-scrollbar {
  width: 4px;
}

.cart-dropdown-items::-webkit-scrollbar-track {
  background: transparent;
}

.cart-dropdown-items::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

/* Ukryj dropdown na mobile */
@media (max-width: 767px) {
  #p4y-cart-wrapper .cart-dropdown {
    display: none !important;
  }
}

/* ===== Moje konto ikona w headerze ===== */
.p4y-user-icon-wrapper .user-info {
  display: flex;
  align-items: center;
}

.p4y-user-icon-wrapper .user-info a {
  color: #475569;
  text-decoration: none;
  display: flex;
  align-items: center;
  transition: color 0.2s;
  position: relative;
  font-size: 1.25rem;
}

.p4y-user-icon-wrapper .user-info a:hover {
  color: #44c27a;
}

/* Ukryj pusta ikone material-icons */
.p4y-user-icon-wrapper .user-info a .material-icons {
  display: none;
}

/* Ukryj tekst "Zaloguj" */
.p4y-user-icon-wrapper .user-info a span {
  display: none;
}

/* Ukryj "Wyloguj" w headerze desktop */
.p4y-user-icon-wrapper .user-info a.logout {
  display: none !important;
}

/* Pokaz ikone FA user (tylko na linku .account / jedynym linku) */
.p4y-user-icon-wrapper .user-info a.account::before,
.p4y-user-icon-wrapper .user-info a:only-child::before {
  content: '\f007';
  font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free';
  font-weight: 400;
  font-size: 1.25rem;
}

/* ===== Menu glowne PS inline w headerze ===== */
.p4y-inline-menu .menu,
.p4y-inline-menu #_desktop_top_menu {
  display: flex !important;
}

.p4y-inline-menu {
  display: flex;
  align-items: stretch;
  align-self: stretch;
}

.p4y-inline-menu #top-menu {
  display: flex;
  align-items: stretch;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 0;
}

.p4y-inline-menu #top-menu > li {
  position: relative;
  display: flex;
  align-items: center;
}

.p4y-inline-menu #top-menu > li > a {
  display: flex;
  align-items: center;
  padding: 0 0.75rem;
  height: 100%;
  color: #475569;
  font-weight: 600;
  font-size: 0.875rem;
  text-decoration: none;
  transition: color 0.2s;
  white-space: nowrap;
}

.p4y-inline-menu #top-menu > li > a:hover,
.p4y-inline-menu #top-menu > li.current > a {
  color: #44c27a;
}

/* Strzalka przy pozycji z podmenu */
.p4y-inline-menu #top-menu > li.has-submenu > a::after {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  margin-left: 5px;
  margin-bottom: 2px;
  opacity: 0.6;
  transition: transform 0.2s, opacity 0.2s;
}

.p4y-inline-menu #top-menu > li.has-submenu:hover > a::after,
.p4y-inline-menu #top-menu > li.has-submenu.p4y-submenu-open > a::after {
  opacity: 1;
  transform: rotate(-135deg);
}

/* Podmenu (dropdown) — nadpisanie collapse z theme.css/bootstrap */
.p4y-inline-menu .popover.sub-menu,
.p4y-inline-menu .popover.sub-menu.collapse {
  position: absolute;
  top: 100%;
  left: -0.5rem;
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  min-width: 280px;
  padding: 0.5rem 0;
  z-index: 100;
  display: none !important;
  visibility: hidden;
  opacity: 0;
  height: auto;
}

/* Niewidoczny most — zapobiega znikaniu dropdown przy przesuwaniu kursora */
.p4y-inline-menu .popover.sub-menu::before {
  content: '';
  position: absolute;
  top: -20px;
  left: -10px;
  right: -10px;
  height: 20px;
}

.p4y-inline-menu #top-menu > li:hover > .popover.sub-menu,
.p4y-inline-menu #top-menu > li:hover > .popover.sub-menu.collapse,
.p4y-inline-menu .popover.sub-menu.p4y-open {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}

.p4y-inline-menu .popover.sub-menu .top-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-inline-menu .popover.sub-menu .top-menu a {
  display: block;
  padding: 0.5rem 1.25rem;
  color: #475569;
  text-transform: none;
  font-size: 0.875rem;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.p4y-inline-menu .popover.sub-menu .top-menu a:hover {
  background: #f1f5f9;
  color: #44c27a;
}

/* Ukryj float/toggle domyslne elementy z ps_mainmenu */
.p4y-inline-menu .navbar-toggler,
.p4y-inline-menu .float-xs-right,
.p4y-inline-menu #top-menu > li > .material-icons {
  display: none !important;
}

/* ===== Mobile menu styling ===== */
.p4y-mobile-menu-wrapper #top-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-mobile-menu-wrapper #top-menu li a {
  display: block;
  padding: 0.625rem 0;
  color: #334155;
  font-weight: 500;
  font-size: 0.875rem;
  text-decoration: none;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-mobile-menu-wrapper #top-menu li a:hover {
  color: #44c27a;
}

.p4y-mobile-menu-wrapper .popover.sub-menu {
  position: static;
  box-shadow: none;
  border: none;
  padding-left: 1rem;
}

.p4y-mobile-menu-wrapper .navbar-toggler {
  display: none;
}

.p4y-user-info-mobile .user-info {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.p4y-user-info-mobile .user-info a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #334155;
  font-size: 0.875rem;
  text-decoration: none;
}

.p4y-user-info-mobile .user-info a:hover {
  color: #44c27a;
}

/* ===== Strona kategorii ===== */

/* Listing page wrapper */
.p4y-listing-page {
  padding: 0;
}

/* --- Category Header (breadcrumb + title area) --- */
.p4y-category-header {
  background: white;
  padding: 2rem 0 0;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
  border-bottom: 1px solid #e5e7eb;
}

.p4y-category-header > .container {
  padding-left: 0;
  padding-right: 0;
}

#js-product-list-header {
  margin-bottom: 2em;
}

.p4y-category-title {
  font-size: 2rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}

.p4y-category-desc {
  color: #64748b;
  margin-top: 0.5rem;
  max-width: 42rem;
  font-size: 0.9rem;
  line-height: 1.6;
}

/* Products section - light gray bg */
.p4y-listing-products-area {
  background: #f1f5f9;
  padding: 2rem 0 3rem;
  min-height: 400px;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

.p4y-listing-products-area > .container {
  padding-left: 0;
  padding-right: 0;
}

/* --- Subcategory Pills --- */
.p4y-subcategories {
  margin-top: 1.5rem;
  margin-bottom: 0;
}

.p4y-subcategories-label {
  font-size: 0.7rem;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
}

.p4y-subcategories-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 1em;
}

.p4y-subcategory-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.625rem 1.25rem;
  border-radius: 9999px;
  background: white;
  border: 1px solid #e5e7eb;
  color: #475569 !important;
  font-size: 0.875rem;
  font-weight: 600;
  transition: all 0.2s;
  text-decoration: none !important;
}

.p4y-subcategory-pill:hover {
  border-color: #44c27a;
  color: #44c27a !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.p4y-subcategory-pill.active,
.p4y-subcategory-pill:active {
  background: #1e293b;
  color: white !important;
  border-color: #1e293b;
  box-shadow: 0 4px 12px rgba(30, 41, 59, 0.2);
}

/* --- Products Toolbar --- */
.p4y-products-toolbar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: white;
  padding: 1rem 1.25rem;
  border-radius: 0.75rem;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  margin-bottom: 2rem;
}

@media (min-width: 640px) {
  .p4y-products-toolbar {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }
}

.p4y-toolbar-count {
  font-size: 0.875rem;
  color: #64748b;
}

.p4y-toolbar-count p {
  margin-bottom: 0;
}

.p4y-toolbar-count-num {
  font-weight: 700;
  color: #0f172a;
}

.p4y-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.p4y-toolbar-filter-btn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #475569;
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: all 0.2s;
}

.p4y-toolbar-filter-btn:hover {
  border-color: #44c27a;
  color: #44c27a;
}

/* --- Sort select --- */
.p4y-sort-select-wrapper {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.p4y-sort-label {
  font-size: 0.875rem;
  color: #64748b;
  white-space: nowrap;
}

.p4y-sort-select {
  border: none;
  background: transparent;
  font-size: 0.875rem;
  font-weight: 700;
  color: #0f172a;
  cursor: pointer;
  padding: 0.25rem 0;
  outline: none;
}

.p4y-sort-select:focus {
  outline: none;
}

/* Breadcrumb */
.p4y-breadcrumb a {
  text-decoration: none;
}

/* Karty produktow na stronie kategorii */
#js-product-list .products {
  display: grid !important;
  grid-template-columns: repeat(1, 1fr);
  gap: 1.5rem;
}

@media (min-width: 768px) {
  #js-product-list .products {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  #js-product-list .products {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1280px) {
  #js-product-list .products {
    grid-template-columns: repeat(4, 1fr);
  }
}

#js-product-list .products .js-product {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  padding: 0 !important;
}

#js-product-list .products .product-miniature {
  background: white;
  border-radius: 1rem;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  transition: all 0.3s;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

#js-product-list .products .product-miniature:hover {
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

#js-product-list .products .thumbnail-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

#js-product-list .products .thumbnail-top {
  position: relative;
  overflow: hidden;
}

/* Compatibility version badges */
.p4y-compat-badges {
  position: absolute;
  bottom: 0.5rem;
  right: 0.5rem;
  display: flex;
  gap: 0.25rem;
  z-index: 5;
}

.p4y-compat-badge {
  background: rgba(255, 255, 255, 0.92);
  color: #334155;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.2rem 0.45rem;
  border-radius: 0.35rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  line-height: 1;
}

.p4y-compat-badge-latest {
  background: rgba(68, 194, 122, 0.15);
  color: #16a34a;
}

#js-product-list .products .product-thumbnail {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 14rem;
  background: white;
  overflow: hidden;
  padding: 1rem;
}

#js-product-list .products .product-thumbnail img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  transition: transform 0.5s ease;
}

#js-product-list .products .product-miniature:hover .product-thumbnail img {
  transform: scale(1.05);
}

/* Hover overlay */
.p4y-card-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.05);
  opacity: 0;
  transition: opacity 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
}

#js-product-list .products .product-miniature:hover .p4y-card-overlay {
  opacity: 1;
}

.p4y-card-overlay-btn {
  background: white;
  color: #0f172a;
  padding: 0.5rem 1.25rem;
  border-radius: 9999px;
  font-size: 0.8rem;
  font-weight: 700;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transform: translateY(0.75rem);
  transition: all 0.3s;
  opacity: 0;
}

#js-product-list .products .product-miniature:hover .p4y-card-overlay-btn {
  transform: translateY(0);
  opacity: 1;
}

.p4y-card-overlay-btn:hover {
  background: #44c27a;
  color: white !important;
}

#js-product-list .products .product-description {
  padding: 1.25rem;
  flex: 1;
  display: flex;
  flex-direction: column;
  text-align: left;
}

/* Category label above title */
.p4y-card-category {
  font-size: 0.625rem;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25rem;
}

#js-product-list .products .product-title,
.product-miniature .product-title {
  margin: 0 0 0.25rem;
  font-size: 1.05rem;
  text-align: left;
}

#js-product-list .products .product-title a {
  color: #1e293b;
  text-decoration: none;
  font-weight: 700;
  transition: color 0.2s;
}

#js-product-list .products .product-title a:hover {
  color: #44c27a;
}

#js-product-list .products .product-price-and-shipping {
  margin-top: auto;
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

/* Add to cart button on card */
.p4y-card-cart-form {
  margin: 0;
  flex-shrink: 0;
}

.p4y-card-cart-btn {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 9999px;
  background: #f1f5f9;
  color: #475569;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
  font-size: 1rem;
}

.p4y-card-cart-btn:hover {
  background: #44c27a;
  color: white;
  box-shadow: 0 4px 12px rgba(68, 194, 122, 0.3);
}

#js-product-list .products .product-price-and-shipping .price {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}

#js-product-list .products .product-price-and-shipping .regular-price {
  font-size: 0.875rem;
  color: #94a3b8;
  text-decoration: line-through;
}

#js-product-list .products .product-price-and-shipping .discount-percentage,
#js-product-list .products .product-price-and-shipping .discount-amount {
  background: #ef4444;
  color: white;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 0.15rem 0.5rem;
  border-radius: 0.25rem;
}

/* Flagi produktow */
#js-product-list .products .product-flags {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

#js-product-list .products .product-flags .product-flag {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 700;
  border-radius: 0.25rem;
  text-transform: uppercase;
}

#js-product-list .products .product-flags .product-flag.new {
  background: #f97316;
  color: white;
}

#js-product-list .products .product-flags .product-flag.on-sale,
#js-product-list .products .product-flags .product-flag.discount {
  background: #ef4444;
  color: white;
}

/* Sortowanie */
.p4y-sort-wrapper .products-sort-order {
  position: relative;
}

.p4y-sort-wrapper .select-title {
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  color: #334155;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 200px;
}

.p4y-sort-wrapper .select-title:hover {
  border-color: #44c27a;
}

.p4y-sort-wrapper .select-title .material-icons {
  margin-left: auto;
  font-size: 1.25rem;
  color: #94a3b8;
}

.p4y-sort-wrapper .dropdown-menu {
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
  padding: 0.25rem 0;
  min-width: 200px;
  z-index: 100;
}

.p4y-sort-wrapper .dropdown-menu .select-list {
  display: block;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  color: #475569;
  text-decoration: none;
  transition: background 0.15s;
}

.p4y-sort-wrapper .dropdown-menu .select-list:hover,
.p4y-sort-wrapper .dropdown-menu .select-list.current {
  background: #f1f5f9;
  color: #44c27a;
}

/* Paginacja */
.p4y-pagination .pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 0;
}

.p4y-pagination .page-list {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  gap: 0.25rem;
}

.p4y-pagination .page-list li a,
.p4y-pagination .page-list li span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #475569;
  text-decoration: none;
  transition: all 0.2s;
  border: 1px solid transparent;
}

.p4y-pagination .page-list li a:hover {
  background: #f1f5f9;
  border-color: #e5e7eb;
}

.p4y-pagination .page-list li.current a {
  background: #44c27a;
  color: white;
  border-color: #44c27a;
}

.p4y-pagination .page-list li a.disabled {
  opacity: 0.4;
  pointer-events: none;
}

.p4y-pagination .page-list li a .material-icons {
  font-size: 1.25rem;
}

/* Filtry (facets) */
.p4y-facets .facet {
  margin-bottom: 1.5rem;
}

.p4y-facets .facet .facet-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.p4y-facets .facet ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-facets .facet li {
  margin-bottom: 0.375rem;
}

.p4y-facets .facet li label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #475569;
  cursor: pointer;
  transition: color 0.2s;
}

.p4y-facets .facet li label:hover {
  color: #44c27a;
}

.p4y-facets .facet .magnitude {
  font-size: 0.75rem;
  color: #94a3b8;
}

.p4y-facets .facet input[type="checkbox"] {
  accent-color: #44c27a;
}

/* Aktywne filtry */
.p4y-active-filters .active-filter-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.p4y-active-filters ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-active-filters li a {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.75rem;
  background: #f1f5f9;
  border-radius: 9999px;
  font-size: 0.75rem;
  color: #475569;
  text-decoration: none;
  transition: all 0.2s;
}

.p4y-active-filters li a:hover {
  background: #fee2e2;
  color: #ef4444;
}

/* Strona kategorii uzywa layout-full-width (bez kolumn bocznych) */

/* Breadcrumb styl na stronach wew */
.breadcrumb {
  background: transparent !important;
  padding: 0.75rem 0 !important;
  margin: 0 !important;
  font-size: 0.8rem;
}

.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.breadcrumb li {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  color: #94a3b8;
}

.breadcrumb li a {
  color: #64748b;
  text-decoration: none;
}

.breadcrumb li a:hover {
  color: #44c27a;
}

/* ============================================================
   KARTA PRODUKTU - Layout 8/12 + 4/12 ze sticky sidebar
   ============================================================ */

/* -------- RESET STYLI CLASSIC THEME --------
   Classic theme CSS interferuje z layoutem produktu.
   Nadpisujemy wszystkie problematyczne reguły.
   ------------------------------------------- */

/* #main .page-content { margin-bottom: 10rem } */
.p4y-product-page #content.page-content,
.p4y-product-page .page-content,
#main.p4y-product-page .page-content {
  margin-bottom: 0 !important;
}

/* #main .page-header { margin: 2rem 0 3rem } */
.p4y-product-page .page-header,
#main.p4y-product-page .page-header {
  margin: 0 !important;
}

/* #main ul { display: flex; flex-wrap: wrap } — psuje nasze listy */
.p4y-product-page ul {
  display: revert !important;
  flex-wrap: revert !important;
}
/* Przywracamy flex tam gdzie chcemy */
.p4y-product-page .p4y-check-list,
.p4y-product-page .p4y-product-flags,
.p4y-product-page .p4y-tabs-nav,
.p4y-product-page .p4y-color-list,
.p4y-product-page .p4y-radio-list,
.p4y-product-page .p4y-compat-tags {
  display: flex !important;
}

/* .images-container { display: flex; min-height: 21.88rem } */
.p4y-product-page .p4y-images-container,
.p4y-product-page .js-images-container {
  display: block !important;
  min-height: auto !important;
}

/* .js-qv-mask { overflow: hidden; white-space: nowrap } */
/* .js-qv-mask.scroll { width: calc(100% - 60px); margin: 0 auto } */
.p4y-product-page .js-qv-mask,
.p4y-product-page .js-qv-mask.scroll,
.p4y-product-page .mask,
.p4y-product-page .mask.scroll {
  overflow: visible !important;
  white-space: normal !important;
  width: 100% !important;
  margin: 0 !important;
}

/* .product-cover { position: relative; margin-bottom: 1.25rem } */
.p4y-product-page .product-cover {
  margin-bottom: 0 !important;
}

/* .product-flags { position: absolute; width: 100%; ... } */
.p4y-product-page .product-flags {
  width: auto !important;
}
.p4y-product-page .product-flags li.product-flag {
  font-size: 0.7rem !important;
  min-width: auto !important;
  min-height: auto !important;
  margin-top: 0 !important;
  background: transparent !important;
}

/* .tabs { padding: ...; margin-top: 2rem; background: #fff } */
.p4y-product-page .tabs {
  padding: 0 !important;
  margin-top: 0 !important;
  background: transparent !important;
}
.p4y-product-page .tabs .nav-tabs {
  border-bottom: none !important;
}
.p4y-product-page .tabs .nav-tabs .nav-link {
  border: none !important;
  color: inherit !important;
}
.p4y-product-page .tabs .nav-tabs .nav-link.active,
.p4y-product-page .tabs .nav-tabs .nav-link:hover {
  border: none !important;
  border-bottom: none !important;
}

/* .product-actions .add-to-cart { height: 2.75rem } */
.p4y-product-page .product-actions .add-to-cart {
  height: auto !important;
  padding: 0 !important;
  line-height: inherit !important;
}

/* .product-description { position: relative; bottom: 0; height: auto; padding: ...; background: #fff } */
.p4y-product-page .product-description {
  position: static !important;
  padding: 0 !important;
  background: transparent !important;
}
.p4y-product-page .product-description::after {
  display: none !important;
}

/* .product-information { font-size: .9375rem; color: #232323 } */
.p4y-product-page .product-information {
  font-size: inherit !important;
  color: inherit !important;
}

/* .product-cover img { width: 100%; height: auto } - ok, ale cover background */
.p4y-product-page .product-cover-modal,
.p4y-product-page .product-cover img {
  background: transparent !important;
}

/* .images-container .product-images > li.thumb-container .thumb */
.p4y-product-page .p4y-thumbs-list {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 0.5rem !important;
}

/* .product-flags li.product-flag.on-sale — nadpisanie */
.p4y-product-page .product-flags li.product-flag.on-sale {
  width: auto !important;
  text-align: left !important;
}

/* row i col-md-6 z classic product.tpl – na wypadek gdyby Bootstrap Grid interferował */
.p4y-product-page .product-container {
  display: block !important;
}

/* --- KONIEC RESETU CLASSIC --- */

/* Strona produktu */
.p4y-product-page {
  padding: 0;
  background: white;
}

/* === HERO SECTION === */
.p4y-hero-section {
  padding: 2rem 0 3rem;
  border-bottom: 1px solid #f1f5f9;
}

/* Glowny grid: 8/12 + 4/12 */
.p4y-product-grid {
  display: grid !important;
  grid-template-columns: 1fr;
  gap: 2rem;
  align-items: start;
}

@media (min-width: 992px) {
  .p4y-product-grid {
    grid-template-columns: 8fr 4fr;
    gap: 2.5rem;
  }
}

/* === LEWA KOLUMNA (8/12) === */
.p4y-product-left {
  min-width: 0;
}

/* Galeria + intro obok siebie */
.p4y-product-top-row {
  display: flex !important;
  flex-direction: column;
  gap: 2.5rem;
}

@media (min-width: 768px) {
  .p4y-product-top-row {
    flex-direction: row;
    gap: 2.5rem;
  }
}

/* Galeria: 5/12 lewej kolumny */
.p4y-product-gallery {
  flex: 0 0 42%;
  max-width: 42%;
  min-width: 0;
}

/* Intro: 5/12 lewej kolumny */
.p4y-product-intro {
  flex: 1;
  min-width: 0;
}

@media (max-width: 767px) {
  .p4y-product-gallery {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* === CONTENT SECTION (pod hero, centrowana) === */
.p4y-content-section {
  padding: 3rem 0;
}

.p4y-content-centered {
  max-width: 100%;
}

/* --- Zdjecia produktu --- */
.p4y-images-container {
  position: relative;
}

.p4y-product-cover {
  position: relative;
  background: #f8fafc;
  border-radius: 1rem;
  overflow: hidden;
  border: 1px solid #f1f5f9;
}

.p4y-product-cover img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  aspect-ratio: 3 / 4;
}

.p4y-zoom-layer {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 2.5rem;
  height: 2.5rem;
  background: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.2s;
  opacity: 0;
  font-size: 1rem;
  color: #475569;
}

.p4y-product-cover:hover .p4y-zoom-layer {
  opacity: 1;
}

.p4y-zoom-layer:hover {
  background: #44c27a;
  color: white;
  transform: scale(1.1);
}

/* Miniaturki - grid 4 kolumny pod zdjeciem glownym */
.p4y-product-thumbs {
  margin-top: 1.5rem !important;
  padding-top: 0.5rem;
  overflow: hidden;
}

.p4y-thumbs-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-thumb-item {
  overflow: hidden;
}

.p4y-thumb-item img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 0.5rem;
  border: 2px solid #e5e7eb;
  cursor: pointer;
  transition: border-color 0.2s;
}

.p4y-thumb-item img:hover,
.p4y-thumb-item img.selected {
  border-color: #44c27a;
}

/* Flagi na stronie produktu */
.p4y-product-flags {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-flag {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 700;
  border-radius: 0.375rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.p4y-flag-new { background: #f97316; color: white; }
.p4y-flag-on-sale,
.p4y-flag-discount { background: #ef4444; color: white; }
.p4y-flag-pack { background: #8b5cf6; color: white; }

/* --- Intro: tytul + krotki opis --- */
.p4y-product-title {
  font-size: 1.75rem;
  font-weight: 800;
  color: #1e293b;
  line-height: 1.3;
  margin: 0 0 0.75rem;
}

.p4y-product-ref {
  font-size: 0.8rem;
  color: #94a3b8;
  margin: 0 0 1rem;
}

/* Check list (cechy w intro) */
.p4y-check-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.p4y-check-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.85rem;
  color: #475569;
  line-height: 1.5;
}

.p4y-check-icon {
  flex-shrink: 0;
  width: 1.125rem;
  height: 1.125rem;
  color: #44c27a;
  margin-top: 0.125rem;
}

/* Tagi kompatybilności i multistore */
.p4y-compat-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-bottom: 1rem;
}

.p4y-tag {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.7rem;
  font-weight: 700;
  border-radius: 999px;
  border: 1px solid transparent;
}

.p4y-tag-blue {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: #dbeafe;
}

.p4y-tag-purple {
  background: #faf5ff;
  color: #7e22ce;
  border-color: #f3e8ff;
}

/* === PRAWA KOLUMNA (4/12) - STICKY SIDEBAR === */
.p4y-product-right {
  min-width: 0;
}

.p4y-sidebar-sticky {
  position: sticky;
  top: 100px;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* Karta zakupowa */
.p4y-purchase-card {
  background: white;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 2rem;
  box-shadow: 0 20px 50px rgba(100, 116, 139, 0.12);
}

/* Licencja badge row */
.p4y-license-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}

.p4y-license-label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #64748b;
}

.p4y-license-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: #f0fdf4;
  color: #15803d;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
  border: 1px solid #bbf7d0;
}

.p4y-license-badge i {
  font-size: 0.7rem;
}

/* Demo buttons */
.p4y-demo-buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-top: 1rem;
}

.p4y-demo-buttons:has(> :only-child) {
  grid-template-columns: 1fr;
}

.p4y-demo-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  color: #334155;
  font-size: 0.75rem;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.2s;
}

.p4y-demo-btn:hover {
  border-color: #1e293b;
  color: #1e293b;
  text-decoration: none;
}

.p4y-demo-btn i {
  color: #94a3b8;
}

/* Info box pod przyciskiem */
.p4y-purchase-info-box {
  background: #f8fafc;
  border-radius: 0.75rem;
  padding: 1rem;
  border: 1px solid #f1f5f9;
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.p4y-purchase-info-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #475569;
}

.p4y-purchase-info-item i {
  width: 1.5rem;
  text-align: center;
}

.p4y-info-icon-yellow { color: #eab308; }
.p4y-info-icon-blue { color: #3b82f6; }
.p4y-info-icon-green { color: #22c55e; }

/* Cross-sell card */
.p4y-crosssell-card {
  margin-top: 1.5rem;
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 1.5rem;
}

.p4y-crosssell-title {
  font-size: 0.75rem;
  font-weight: 700;
  color: #1e293b;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 1rem;
}

.p4y-crosssell-items {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

.p4y-crosssell-thumb {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
  object-fit: cover;
}

.p4y-crosssell-plus {
  color: #cbd5e1;
  font-size: 0.75rem;
}

.p4y-crosssell-btn {
  width: 100%;
  padding: 0.5rem;
  background: #1e293b;
  color: white;
  font-size: 0.75rem;
  font-weight: 700;
  border: none;
  border-radius: 0.375rem;
  cursor: pointer;
  transition: background 0.2s;
}

.p4y-crosssell-btn:hover {
  background: #334155;
}

/* --- Cena w sidebar --- */
.p4y-product-prices {
  margin-bottom: 2rem;
}

.p4y-current-price-wrapper {
  display: flex;
  align-items: flex-end;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.25rem;
}

.p4y-price {
  font-size: 2.25rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1;
}

.p4y-price-suffix {
  font-size: 0.875rem;
  font-weight: 500;
  color: #94a3b8;
  padding-bottom: 0.25rem;
}

.p4y-price-suffix-mini {
  font-size: 0.7rem;
  font-weight: 500;
  color: #94a3b8;
  margin-left: 0.2rem;
}

.p4y-regular-price {
  font-size: 1.125rem;
  color: #94a3b8;
  text-decoration: line-through;
}

.p4y-discount-badge {
  display: inline-block;
  background: #ef4444;
  color: white;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.2rem 0.6rem;
  border-radius: 0.375rem;
}

.p4y-unit-price {
  font-size: 0.8rem;
  color: #64748b;
  margin: 0.25rem 0 0;
}

.p4y-price-no-tax,
.p4y-pack-price,
.p4y-ecotax {
  font-size: 0.8rem;
  color: #64748b;
  margin: 0.25rem 0 0;
}

.p4y-tax-shipping {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-bottom: 2rem;
}

.p4y-tax-label {
  margin-right: 0.25rem;
}

.p4y-brutto-price {
  color: #94a3b8;
}

.p4y-delivery-info {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

/* --- Krotki opis --- */
.p4y-product-desc-short {
  font-size: 0.9rem;
  line-height: 1.7;
  color: #475569;
  margin-bottom: 1.25rem;
}

/* Nadpisanie inline styli z description_short (stare dane z PS 1.7) */
.p4y-product-desc-short div,
.p4y-product-desc-short p,
.p4y-product-desc-short span {
  white-space: normal !important;
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  background-color: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
}

.p4y-product-desc-short div + div {
  margin-top: 0.5rem !important;
}

.p4y-product-desc-short ul,
.p4y-product-desc-short ol {
  padding-left: 1.25rem;
}

/* --- Warianty w sidebar --- */
.p4y-variants {
  margin-bottom: 1rem;
}

.p4y-variant-group {
  margin-bottom: 0.75rem;
}

.p4y-variant-label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.375rem;
}

.p4y-variant-select {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  font-size: 0.8rem;
  color: #334155;
  background: white;
  cursor: pointer;
  transition: border-color 0.2s;
}

.p4y-variant-select:focus {
  outline: none;
  border-color: #44c27a;
  box-shadow: 0 0 0 1px #44c27a;
}

.p4y-color-list {
  display: flex;
  gap: 0.375rem;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.p4y-color-swatch {
  display: block;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  border: 2px solid #e5e7eb;
  cursor: pointer;
  transition: all 0.2s;
}

.p4y-color-item input:checked + .p4y-color-swatch {
  border-color: #44c27a;
  box-shadow: 0 0 0 2px white, 0 0 0 4px #44c27a;
}

.p4y-radio-list {
  display: flex;
  gap: 0.375rem;
  list-style: none;
  padding: 0;
  margin: 0;
  flex-wrap: wrap;
}

.p4y-radio-label {
  display: inline-block;
  padding: 0.375rem 0.75rem;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  font-size: 0.8rem;
  cursor: pointer;
  transition: all 0.2s;
}

.p4y-radio-item input:checked + .p4y-radio-label {
  border-color: #44c27a;
  background: #f0fdf4;
  color: #16a34a;
  font-weight: 600;
}

.p4y-radio-item input {
  position: absolute;
  opacity: 0;
}

.p4y-color-item input {
  position: absolute;
  opacity: 0;
}

/* --- Ilosc + Dodaj do koszyka w sidebar --- */
.p4y-add-to-cart {
  margin-bottom: 0;
}

.p4y-cart-actions {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.p4y-add-btn {
  width: 100%;
}

.p4y-btn-cart,
.p4y-purchase-card .p4y-btn-cart,
button.p4y-btn-cart,
.btn.p4y-btn-cart {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
  background: #44c27a !important;
  color: white !important;
  border: none !important;
  border-radius: 0.75rem !important;
  padding: 1.125rem 1.5rem !important;
  font-size: 1.125rem !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition: all 0.2s !important;
  box-shadow: 0 8px 20px rgba(68, 194, 122, 0.3);
  white-space: nowrap;
  line-height: 1.2 !important;
  min-height: 3.5rem;
}

.p4y-btn-cart:hover {
  background: #36af68 !important;
  box-shadow: 0 10px 30px rgba(68, 194, 122, 0.4);
  transform: translateY(-2px);
}

.p4y-btn-cart:disabled {
  background: #94a3b8 !important;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

.p4y-btn-cart .fa,
.p4y-btn-cart .fas {
  font-size: 1.1rem;
}

.p4y-btn-cart .material-icons {
  font-size: 1.25rem;
}

.p4y-qty-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.p4y-qty-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: #64748b;
  white-space: nowrap;
}

.p4y-qty-input input,
#main .p4y-qty-input input.form-control {
  width: 3.5rem;
  text-align: center;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #334155;
  padding: 0.375rem 0.5rem;
  transition: border-color 0.2s;
}

.p4y-qty-input input:focus {
  outline: none;
  border-color: #44c27a;
  box-shadow: 0 0 0 1px #44c27a;
}

/* --- Dostepnosc --- ukryte w karcie zakupowej */
.p4y-purchase-card .p4y-availability {
  display: none;
}

.p4y-stock {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  font-size: 0.8rem;
  font-weight: 500;
}

.p4y-stock-ok {
  background: #f0fdf4;
  color: #16a34a;
}

.p4y-stock-warn {
  background: #fffbeb;
  color: #d97706;
}

.p4y-stock-out {
  background: #fef2f2;
  color: #dc2626;
}

.p4y-stock-sub {
  display: block;
  font-size: 0.75rem;
  color: #94a3b8;
  margin-top: 0.25rem;
}

.p4y-minimal-qty {
  font-size: 0.75rem;
  color: #94a3b8;
}

/* --- Karta pomocy w sidebar --- */
.p4y-help-card {
  background: #f8fafc;
  border: 1px solid #e5e7eb;
  border-radius: 1rem;
  padding: 1.5rem;
  text-align: center;
}

.p4y-help-icon {
  width: 3rem;
  height: 3rem;
  margin: 0 auto 0.75rem;
  background: #ecfdf5;
  border-radius: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.p4y-help-icon svg {
  width: 1.5rem;
  height: 1.5rem;
  color: #44c27a;
}

.p4y-help-title {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 0.375rem;
}

.p4y-help-text {
  font-size: 0.8rem;
  color: #64748b;
  margin: 0 0 0.75rem;
  line-height: 1.5;
}

.p4y-help-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #44c27a;
  font-size: 0.8rem;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.2s;
}

.p4y-help-link:hover {
  color: #36af68;
}

.p4y-arrow-icon {
  width: 1rem;
  height: 1rem;
}

/* --- Nawigacja sekcji --- */
.p4y-tabs-nav-wrapper {
  position: sticky;
  top: 0;
  background: white;
  z-index: 10;
  border-bottom: 1px solid #e5e7eb;
  margin-bottom: 2.5rem;
}

.p4y-tabs-nav {
  display: flex !important;
  gap: 2rem;
  padding: 0;
  margin: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.p4y-tabs-nav::-webkit-scrollbar {
  display: none;
}

.p4y-tab-link {
  display: block;
  padding: 1rem 0;
  font-size: 0.875rem;
  font-weight: 500;
  color: #64748b;
  text-decoration: none !important;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
  background: transparent !important;
  transition: color 0.2s, border-color 0.2s;
  cursor: pointer;
}

.p4y-tab-link:hover {
  color: #1e293b;
}

.p4y-tab-link.active {
  color: #44c27a;
  font-weight: 700;
  border-bottom-color: #44c27a;
}

.p4y-tabs-content {
  padding: 0;
}

/* Sekcje ciagłe (wszystkie widoczne, scroll-to) */
.p4y-section {
  padding: 0 0 3rem;
  margin-bottom: 3rem;
  scroll-margin-top: 120px;
}

.p4y-section:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

.p4y-section-heading {
  font-size: 1.5rem;
  font-weight: 800;
  color: #1e293b;
  margin: 0 0 1.5rem;
}

.p4y-section-heading-center {
  text-align: center;
  font-size: 1.75rem;
  margin-bottom: 2.5rem;
}

/* FAQ: wezszy kontener */
.p4y-section-narrow {
  max-width: 768px;
  margin-left: auto;
  margin-right: auto;
}

/* --- Obrazki w opisie produktu --- */
.p4y-desc-img {
  margin: 2rem 0;
  text-align: center;
}

.p4y-desc-img img {
  max-width: 100%;
  height: auto;
  border-radius: 0.75rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  border: 1px solid #e5e7eb;
}

/* Opis - naglowki h3 */
.p4y-section h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
  margin: 2rem 0 1rem;
}

.p4y-section h3:first-child {
  margin-top: 0;
}

/* Opis - listy */
.p4y-section ul {
  padding-left: 1.25rem;
  margin: 1rem 0;
}

.p4y-section ul li {
  margin-bottom: 0.5rem;
  line-height: 1.7;
  color: #475569;
}

/* Ukrycie "W magazynie" w karcie zakupowej */
.p4y-purchase-card .p4y-availability,
.p4y-purchase-card .p4y-minimal-qty {
  display: none;
}

/* --- Sekcja Funkcje: grid 2-kolumnowy z kartami ikon --- */
.p4y-features-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 768px) {
  .p4y-features-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.p4y-feature-card {
  display: flex;
  gap: 1rem;
  padding: 1.5rem;
  background: #f8fafc;
  border-radius: 1rem;
  border: 1px solid #f1f5f9;
  transition: box-shadow 0.2s, border-color 0.2s;
}

.p4y-feature-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  border-color: #e2e8f0;
}

.p4y-feature-icon {
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  font-size: 1.25rem;
}

.p4y-feature-icon.icon-green  { color: #44c27a; }
.p4y-feature-icon.icon-purple { color: #8b5cf6; }
.p4y-feature-icon.icon-blue   { color: #3b82f6; }
.p4y-feature-icon.icon-orange { color: #f97316; }
.p4y-feature-icon.icon-red    { color: #ef4444; }
.p4y-feature-icon.icon-teal   { color: #14b8a6; }

.p4y-feature-card h4 {
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 0.375rem;
}

.p4y-feature-card p {
  font-size: 0.875rem;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

/* Opis produktu w sekcji */
.p4y-product-description {
  font-size: 0.95rem;
  line-height: 1.8;
  color: #334155;
}

.p4y-product-description h2,
.p4y-product-description h3,
.p4y-product-description h4 {
  color: #1e293b;
  margin: 1.5rem 0 0.75rem;
}

.p4y-product-description p {
  margin-bottom: 1rem;
}

.p4y-product-description img {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p4y-product-description ul,
.p4y-product-description ol {
  padding-left: 1.5rem;
  margin-bottom: 1rem;
}

.p4y-product-description table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1rem;
}

.p4y-product-description table th,
.p4y-product-description table td {
  padding: 0.5rem 0.75rem;
  border: 1px solid #e5e7eb;
  text-align: left;
}

.p4y-product-description table th {
  background: #f8fafc;
  font-weight: 600;
}

/* --- Changelog: tabela --- */
.p4y-changelog {
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  overflow: hidden;
}

.p4y-changelog table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
  text-align: left;
}

.p4y-changelog thead {
  background: #f8fafc;
  border-bottom: 1px solid #e5e7eb;
}

.p4y-changelog thead th {
  padding: 0.75rem 1.5rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.p4y-changelog tbody tr {
  border-bottom: 1px solid #f1f5f9;
  transition: background-color 0.15s;
}

.p4y-changelog tbody tr:last-child {
  border-bottom: none;
}

.p4y-changelog tbody tr:hover {
  background: #f8fafc;
}

.p4y-changelog tbody td {
  padding: 1rem 1.5rem;
  vertical-align: top;
}

.p4y-changelog tbody td:first-child {
  font-weight: 700;
  color: #1e293b;
  white-space: nowrap;
}

.p4y-changelog tbody td:nth-child(2) {
  color: #64748b;
  white-space: nowrap;
}

.p4y-changelog tbody td:nth-child(3) {
  color: #475569;
}

@media (max-width: 640px) {
  .p4y-changelog thead { display: none; }
  .p4y-changelog tbody tr {
    display: block;
    padding: 1rem 1.25rem;
  }
  .p4y-changelog tbody td {
    display: block;
    padding: 0.125rem 0;
  }
  .p4y-changelog tbody td:first-child {
    font-size: 1rem;
  }
  .p4y-changelog tbody td:nth-child(2) {
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
  }
}

/* --- FAQ: accordion --- */
.p4y-faq-item {
  background: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 0.75rem;
  margin-bottom: 1rem;
  overflow: hidden;
  transition: all 0.3s;
}

.p4y-faq-item[open] {
  background: white;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  border-color: #e5e7eb;
}

.p4y-faq-item summary {
  padding: 1.25rem;
  font-size: 0.9rem;
  font-weight: 700;
  color: #1e293b;
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  user-select: none;
}

.p4y-faq-item summary::-webkit-details-marker {
  display: none;
}

.p4y-faq-item summary .p4y-faq-chevron {
  color: #44c27a;
  font-size: 0.875rem;
  transition: transform 0.3s;
}

.p4y-faq-item[open] summary .p4y-faq-chevron {
  transform: rotate(180deg);
}

.p4y-faq-item > div {
  padding: 0 1.25rem 1.25rem;
  font-size: 0.875rem;
  color: #475569;
  line-height: 1.7;
  border-top: 1px solid #f1f5f9;
}

/* Szczegoly produktu w tabie */
.p4y-detail-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid #f8fafc;
}

.p4y-detail-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: #64748b;
  min-width: 8rem;
}

.p4y-detail-value {
  font-size: 0.875rem;
  color: #334155;
}

.p4y-detail-value a {
  color: #44c27a;
  text-decoration: none;
}

.p4y-detail-value a:hover {
  text-decoration: underline;
}

.p4y-manufacturer-logo {
  max-height: 3rem;
}

/* Cechy (data sheet) */
.p4y-features {
  margin-top: 1.5rem;
}

.p4y-features-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.75rem;
}

.p4y-data-sheet {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 0;
}

.p4y-data-sheet dt {
  padding: 0.625rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #64748b;
  background: #f8fafc;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-data-sheet dd {
  padding: 0.625rem 1rem;
  font-size: 0.875rem;
  color: #334155;
  margin: 0;
  border-bottom: 1px solid #f1f5f9;
}

/* Rabaty ilosciowe */
.p4y-product-page .product-discounts {
  margin: 0.75rem 0;
}

.p4y-product-page .product-discounts-title {
  font-size: 0.8rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.375rem;
}

.p4y-product-page .table-product-discounts {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.p4y-product-page .table-product-discounts th {
  background: #f8fafc;
  padding: 0.375rem 0.5rem;
  text-align: left;
  font-weight: 600;
  color: #64748b;
  border-bottom: 1px solid #e5e7eb;
}

.p4y-product-page .table-product-discounts td {
  padding: 0.375rem 0.5rem;
  border-bottom: 1px solid #f1f5f9;
  color: #334155;
}

/* Produkty powiazane */
.p4y-product-accessories {
  margin-top: 3rem;
  padding: 2.5rem 0;
  background: #f8fafc;
  border-radius: 1rem;
}

.p4y-accessories-header {
  text-align: center;
  margin-bottom: 2rem;
}

.p4y-section-title {
  font-size: 1.5rem;
  font-weight: 800;
  color: #1e293b;
  margin: 0;
}

.p4y-accessories-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
  padding: 0 1.5rem;
}

@media (min-width: 768px) {
  .p4y-accessories-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .p4y-accessories-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Aksesoria - karty produktow */
.p4y-accessories-grid .product-miniature {
  background: white;
  border-radius: 1rem;
  border: 1px solid #f1f5f9;
  overflow: hidden;
  transition: all 0.3s;
}

.p4y-accessories-grid .product-miniature:hover {
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

/* Modal ze zdjeciami */
.p4y-product-page .modal-content {
  border-radius: 1rem;
  border: none;
  overflow: hidden;
}

.p4y-product-page .modal-body {
  padding: 1.5rem;
}

.p4y-product-page .product-cover-modal {
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p4y-product-page #thumbnails .thumb {
  width: 4rem;
  height: 4rem;
  object-fit: cover;
  border-radius: 0.375rem;
  border: 2px solid #e5e7eb;
  cursor: pointer;
  transition: border-color 0.2s;
}

.p4y-product-page #thumbnails .thumb:hover {
  border-color: #44c27a;
}

/* Reassurance (hook) w sidebar */
.p4y-purchase-card .blockreassurance_product {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #f1f5f9;
}

/* Scroll-box arrows - ukryj domyslne */
.p4y-product-page .scroll-box-arrows {
  display: none;
}

/* Additional info (share buttons etc) */
.p4y-product-page .product-additional-info {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
  font-size: 0.8rem;
}

/* Customization form */
.p4y-product-page .product-customization {
  margin-bottom: 1rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 0.75rem;
}

.p4y-product-page .product-customization label {
  font-size: 0.8rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.375rem;
}

.p4y-product-page .product-customization textarea {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  font-size: 0.8rem;
  resize: vertical;
  transition: border-color 0.2s;
}

.p4y-product-page .product-customization textarea:focus {
  outline: none;
  border-color: #44c27a;
  box-shadow: 0 0 0 1px #44c27a;
}

/* === STICKY BOTTOM BAR === */
.p4y-sticky-bottom-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-top: 1px solid #e5e7eb;
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.05);
  z-index: 50;
  padding: 0.75rem 1rem;
  transform: translateY(100%);
  transition: transform 0.5s ease;
}

.p4y-sticky-bottom-bar.p4y-sticky-visible {
  transform: translateY(0);
}

.p4y-sticky-bottom-inner {
  max-width: 1536px;
  margin: 0 auto;
  padding: 0 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.p4y-sticky-bottom-info {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.p4y-sticky-thumb {
  height: 3rem;
  width: 3rem;
  object-fit: contain;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
}

.p4y-sticky-name {
  font-weight: 700;
  color: #1e293b;
  font-size: 0.9rem;
}

.p4y-sticky-bottom-action {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.p4y-sticky-price {
  font-weight: 800;
  font-size: 1.25rem;
  color: #1e293b;
  white-space: nowrap;
  min-width: fit-content;
}

.p4y-sticky-cart-btn {
  padding: 0.625rem 1.5rem !important;
  font-size: 0.875rem !important;
  white-space: nowrap;
}

/* Responsywnosc: mobile stacking */
@media (max-width: 767px) {
  .p4y-product-title {
    font-size: 1.375rem;
  }

  .p4y-price {
    font-size: 1.625rem;
  }

  .p4y-data-sheet {
    grid-template-columns: 1fr;
  }

  .p4y-data-sheet dt {
    border-bottom: none;
  }

  .p4y-sidebar-sticky {
    position: static;
  }

  .p4y-demo-buttons {
    grid-template-columns: 1fr;
  }

  .p4y-tabs-nav-wrapper {
    position: static;
  }

  .p4y-content-centered {
    padding: 0 1rem;
  }

  .p4y-sticky-bottom-info img {
    display: none;
  }

  .p4y-section-heading-center {
    font-size: 1.25rem;
  }
}

/* ================================================================
   HOMEPAGE STYLES
   ================================================================ */

/* === Wspolne naglowki sekcji === */
.p4y-home-section-title {
  font-size: 1.875rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1rem;
}

.p4y-home-section-subtitle {
  color: #64748b;
  font-size: 1rem;
}

/* === HERO SLIDER === */
.p4y-hero-slider {
  position: relative;
  height: 550px;
  overflow: hidden;
  background: #f8fafc;
  /* full-bleed from p4y-page-wrapper */
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

@media (min-width: 1024px) {
  .p4y-hero-slider {
    height: 600px;
  }
}

.p4y-slide {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  opacity: 0;
  z-index: 0;
  transition: opacity 0.7s ease;
}

.p4y-slide-active {
  opacity: 1;
  z-index: 10;
}

.p4y-slide-active .p4y-slide-content {
  opacity: 1;
  transform: translateY(0);
}

.p4y-slide-content {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.8s ease-out;
}

/* Blobs */
.p4y-slide-blob {
  position: absolute;
  filter: blur(50px);
  z-index: 0;
  opacity: 0.6;
  width: 24rem;
  height: 24rem;
  border-radius: 9999px;
}

.p4y-blob-green {
  background: #bbf7d0;
  top: 0;
  left: 0;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-blob-blue {
  background: #bfdbfe;
  bottom: 0;
  right: 0;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

.p4y-blob-orange {
  background: #fed7aa;
  top: 5rem;
  right: 5rem;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

.p4y-blob-blue-top {
  background: #bfdbfe;
  top: 0;
  right: 10rem;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

.p4y-blob-violet {
  background: #ddd6fe;
  bottom: 0;
  left: 5rem;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

.p4y-blob-amber {
  background: #fde68a;
  top: 0;
  left: 0;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-blob-yellow {
  background: #fef08a;
  bottom: 0;
  right: 5rem;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

.p4y-blob-teal {
  background: #99f6e4;
  top: 0;
  left: 0;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-blob-cyan {
  background: #a5f3fc;
  bottom: 0;
  right: 0;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

.p4y-blob-purple {
  background: #c4b5fd;
  top: 0;
  left: 0;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-blob-indigo {
  background: #a5b4fc;
  bottom: 0;
  right: 5rem;
  mix-blend-mode: multiply;
  filter: blur(48px);
  opacity: 0.3;
}

@keyframes pulse {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.5; }
}

/* Slide grid */
.p4y-slide-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
  position: relative;
  z-index: 10;
}

@media (min-width: 1024px) {
  .p4y-slide-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Slide badge */
.p4y-slide-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
  background: white;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  font-size: 0.75rem;
  font-weight: 700;
  color: #64748b;
  margin-bottom: 1.5rem;
}

.p4y-badge-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 9999px;
}

.p4y-badge-dot-green {
  background: #10b981;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-badge-dot-orange {
  background: #f97316;
}

.p4y-badge-dot-blue {
  background: #6366f1;
}

.p4y-badge-dot-amber {
  background: #f59e0b;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-badge-dot-teal {
  background: #14b8a6;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-badge-dot-purple {
  background: #7c3aed;
  animation: pulse 2s ease-in-out infinite;
}

/* Slide title */
.p4y-slide-title {
  font-size: 3rem;
  font-weight: 800;
  color: #0f172a;
  letter-spacing: -0.02em;
  line-height: 1.1;
  margin-bottom: 1.5rem;
}

@media (min-width: 1024px) {
  .p4y-slide-title {
    font-size: 4.25rem;
  }
}

.p4y-slide-gradient-text {
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.p4y-gradient-green {
  background-image: linear-gradient(to right, #10b981, #059669);
}

.p4y-gradient-orange {
  background-image: linear-gradient(to right, #f97316, #f59e0b);
}

.p4y-gradient-blue {
  background-image: linear-gradient(to right, #6366f1, #3b82f6);
}

.p4y-gradient-amber {
  background-image: linear-gradient(to right, #d97706, #b45309);
}

.p4y-gradient-teal {
  background-image: linear-gradient(to right, #14b8a6, #0d9488);
}

.p4y-gradient-purple {
  background-image: linear-gradient(to right, #8b5cf6, #a855f7);
}

/* Slide description */
.p4y-slide-desc {
  font-size: 1.125rem;
  color: #64748b;
  margin-bottom: 2rem;
  max-width: 32rem;
  line-height: 1.7;
}

/* Slide buttons */
.p4y-slide-actions {
  display: flex;
  gap: 1rem;
}

.p4y-slide-btn-primary {
  padding: 1rem 2rem;
  background: #0f172a;
  color: white !important;
  border-radius: 0.75rem;
  font-weight: 700;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  transition: all 0.3s;
  text-decoration: none !important;
}

.p4y-slide-btn-primary:hover {
  background: #1e293b;
  transform: translateY(-2px);
  box-shadow: 0 15px 35px rgba(0,0,0,0.2);
  color: white !important;
}

.p4y-slide-btn-primary.p4y-btn-orange {
  background: #f97316;
  box-shadow: 0 10px 25px rgba(249, 115, 22, 0.3);
}

.p4y-slide-btn-primary.p4y-btn-orange:hover {
  background: #ea580c;
  box-shadow: 0 15px 35px rgba(249, 115, 22, 0.4);
}

.p4y-slide-btn-primary.p4y-btn-blue {
  background: #6366f1;
  box-shadow: 0 10px 25px rgba(99, 102, 241, 0.3);
}

.p4y-slide-btn-primary.p4y-btn-blue:hover {
  background: #4f46e5;
  box-shadow: 0 15px 35px rgba(99, 102, 241, 0.4);
}

.p4y-slide-btn-primary.p4y-btn-amber {
  background: #f59e0b;
  box-shadow: 0 10px 25px rgba(245, 158, 11, 0.3);
}

.p4y-slide-btn-primary.p4y-btn-amber:hover {
  background: #d97706;
  box-shadow: 0 15px 35px rgba(245, 158, 11, 0.4);
}

.p4y-slide-btn-primary.p4y-btn-teal {
  background: #14b8a6;
  box-shadow: 0 10px 25px rgba(20, 184, 166, 0.3);
}

.p4y-slide-btn-primary.p4y-btn-teal:hover {
  background: #0d9488;
  box-shadow: 0 15px 35px rgba(20, 184, 166, 0.4);
}

.p4y-slide-btn-primary.p4y-btn-purple {
  background: #7c3aed;
  box-shadow: 0 10px 25px rgba(124, 58, 237, 0.3);
}

.p4y-slide-btn-primary.p4y-btn-purple:hover {
  background: #6d28d9;
  box-shadow: 0 15px 35px rgba(124, 58, 237, 0.4);
}

.p4y-slide-btn-secondary {
  padding: 1rem 2rem;
  background: white;
  color: #334155 !important;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  font-weight: 700;
  transition: all 0.3s;
  text-decoration: none !important;
}

.p4y-slide-btn-secondary:hover {
  background: #f8fafc;
  color: #334155 !important;
}

/* Slide visual */
.p4y-slide-visual {
  display: none;
  position: relative;
}

@media (min-width: 1024px) {
  .p4y-slide-visual {
    display: block;
  }
}

.p4y-slide-img-wrapper {
  position: relative;
  z-index: 10;
  background: white;
  padding: 0.5rem;
  border-radius: 1rem;
  border: 1px solid #f1f5f9;
  box-shadow: 0 25px 50px rgba(0,0,0,0.15);
  transition: transform 0.5s;
}

.p4y-slide-img-wrapper:hover {
  transform: rotate(0deg) !important;
}

.p4y-rotate-2 {
  transform: rotate(2deg);
}

.p4y-rotate-neg2 {
  transform: rotate(-2deg);
}

.p4y-rotate-3 {
  transform: rotate(3deg);
}

.p4y-rotate-neg3 {
  transform: rotate(-3deg);
}

.p4y-slide-img-wrapper img {
  border-radius: 0.75rem;
  width: 100%;
  height: auto;
  display: block;
}

/* Floating element */
.p4y-slide-floating {
  position: absolute;
  top: -2.5rem;
  right: -2.5rem;
  background: white;
  padding: 1rem;
  border-radius: 0.75rem;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  z-index: 20;
  border: 1px solid #f8fafc;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.p4y-slide-floating-bottom {
  top: auto;
  right: auto;
  bottom: -1.5rem;
  left: -1.5rem;
}

.p4y-floating-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
}

.p4y-floating-icon-green {
  background: #dcfce7;
  color: #16a34a;
}

.p4y-floating-icon-orange {
  background: #ffedd5;
  color: #ea580c;
}

.p4y-floating-icon-blue {
  background: #e0e7ff;
  color: #4f46e5;
}

.p4y-floating-icon-amber {
  background: #fef3c7;
  color: #d97706;
}

.p4y-floating-icon-teal {
  background: #ccfbf1;
  color: #0d9488;
}

.p4y-floating-icon-purple {
  background: #ede9fe;
  color: #7c3aed;
}

.p4y-floating-label {
  font-size: 0.625rem;
  color: #94a3b8;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0;
}

.p4y-floating-value {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}

/* Float animation */
@keyframes p4yFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-20px); }
}

.p4y-float-anim {
  animation: p4yFloat 6s ease-in-out infinite;
}

.p4y-float-delay {
  animation-delay: 1s;
}

/* Slider dots */
.p4y-slider-dots {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.75rem;
  z-index: 20;
}

.p4y-slider-dot {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 9999px;
  background: #cbd5e1;
  border: none;
  cursor: pointer;
  transition: all 0.3s;
  padding: 0;
}

.p4y-slider-dot:hover {
  background: #0f172a;
}

.p4y-slider-dot-active {
  width: 2rem;
  background: #0f172a;
}

/* === Slide 1: Migration Dashboard visual === */
.p4y-migration-dashboard {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* Header */
.p4y-mgr-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.p4y-mgr-header-left {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.p4y-mgr-logo {
  width: 2rem;
  height: 2rem;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 0.75rem;
}

.p4y-mgr-title {
  font-weight: 700;
  font-size: 0.875rem;
  color: #0f172a;
  line-height: 1.2;
}

.p4y-mgr-subtitle {
  font-size: 0.625rem;
  color: #94a3b8;
  font-weight: 500;
}

.p4y-mgr-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.25rem 0.625rem;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  border-radius: 9999px;
  font-size: 0.625rem;
  font-weight: 600;
  color: #059669;
}

.p4y-mgr-status-pulse {
  width: 0.375rem;
  height: 0.375rem;
  background: #10b981;
  border-radius: 9999px;
  animation: pulse 2s ease-in-out infinite;
}

/* Version bar */
.p4y-mgr-version-bar {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.75rem;
  background: #fafafa;
  border-radius: 0.625rem;
  border: 1px solid #f1f5f9;
}

.p4y-mgr-ver {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.625rem;
  border-radius: 0.375rem;
  font-size: 0.6875rem;
  font-weight: 600;
  white-space: nowrap;
}

.p4y-mgr-ver i {
  font-size: 0.625rem;
}

.p4y-mgr-ver-old {
  background: #f1f5f9;
  color: #94a3b8;
}

.p4y-mgr-ver-mid {
  background: #fef3c7;
  color: #92400e;
}

.p4y-mgr-ver-new {
  background: #d1fae5;
  color: #065f46;
}

.p4y-mgr-ver-arrow {
  display: flex;
  align-items: center;
  gap: 0;
  color: #cbd5e1;
  font-size: 0.5rem;
  flex: 1;
  min-width: 1rem;
}

.p4y-mgr-ver-line {
  flex: 1;
  height: 1px;
  background: #e2e8f0;
}

/* Progress */
.p4y-mgr-progress-section {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.p4y-mgr-progress-header {
  display: flex;
  justify-content: space-between;
  font-size: 0.6875rem;
  font-weight: 600;
  color: #475569;
}

.p4y-mgr-progress-pct {
  color: #059669;
}

.p4y-mgr-progress-track {
  height: 0.375rem;
  background: #f1f5f9;
  border-radius: 9999px;
  overflow: hidden;
}

.p4y-mgr-progress-fill {
  height: 100%;
  width: 100%;
  background: linear-gradient(to right, #f59e0b, #10b981);
  border-radius: 9999px;
  animation: p4yProgressFill 2s ease-out;
}

@keyframes p4yProgressFill {
  from { width: 0; }
  to { width: 100%; }
}

/* Checklist */
.p4y-mgr-checklist {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.375rem;
}

.p4y-mgr-check {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.6875rem;
  font-weight: 500;
  color: #64748b;
  padding: 0.375rem 0.5rem;
  border-radius: 0.375rem;
  background: #f8fafc;
}

.p4y-mgr-check i {
  font-size: 0.75rem;
}

.p4y-mgr-check-done {
  color: #065f46;
  background: #ecfdf5;
}

.p4y-mgr-check-done i {
  color: #10b981;
}

/* Stats row */
.p4y-mgr-stats {
  display: flex;
  gap: 0.5rem;
}

.p4y-mgr-stat {
  flex: 1;
  text-align: center;
  padding: 0.5rem;
  background: #fffbeb;
  border-radius: 0.5rem;
  border: 1px solid #fef3c7;
}

.p4y-mgr-stat-value {
  font-size: 1rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}

.p4y-mgr-stat-label {
  font-size: 0.5625rem;
  color: #94a3b8;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* === Slide 2: Support visual === */
.p4y-slide-support-visual {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.5rem;
}

.p4y-support-card {
  background: #f0fdfa;
  border: 1px solid #99f6e4;
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  transition: transform 0.3s;
}

.p4y-support-card:hover {
  transform: translateX(4px);
}

.p4y-support-card-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-weight: 600;
  font-size: 0.9rem;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.p4y-support-card-header i {
  color: #14b8a6;
  font-size: 1rem;
  width: 1.25rem;
  text-align: center;
}

.p4y-support-card-status {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: #059669;
  font-weight: 600;
  padding-left: 2rem;
}

.p4y-support-status-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 9999px;
  background: #10b981;
}

/* ======================================================
   MODULES VISUAL (Slide 1 — Moduły)
   ====================================================== */
.p4y-modvis {
  position: relative;
  padding: 2rem;
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Decorative background */
.p4y-modvis-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: 1.5rem;
  background: linear-gradient(135deg, #ede9fe 0%, #f5f3ff 40%, #faf5ff 100%);
  z-index: 0;
}

.p4y-modvis-circle {
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
}

.p4y-modvis-c1 {
  width: 200px;
  height: 200px;
  background: #ddd6fe;
  top: -60px;
  right: -40px;
  animation: pulse 3s ease-in-out infinite;
}

.p4y-modvis-c2 {
  width: 140px;
  height: 140px;
  background: #c4b5fd;
  bottom: -30px;
  left: -20px;
  animation: pulse 3s ease-in-out infinite 1s;
}

.p4y-modvis-c3 {
  width: 80px;
  height: 80px;
  background: #a78bfa;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0.15;
}

/* Two cards side by side */
.p4y-modvis-cards {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  width: 100%;
}

.p4y-modvis-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  overflow: hidden;
  text-decoration: none !important;
  color: inherit !important;
  box-shadow: 0 8px 30px rgba(124, 58, 237, 0.1);
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
}

.p4y-modvis-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(124, 58, 237, 0.18);
  border-color: #c4b5fd;
  color: inherit !important;
}

.p4y-modvis-card-img {
  width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
  background: #f8fafc;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-modvis-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.p4y-modvis-card:hover .p4y-modvis-card-img img {
  transform: scale(1.05);
}

.p4y-modvis-card-body {
  padding: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.p4y-modvis-card-name {
  font-size: 0.8rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.p4y-modvis-card-meta {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.p4y-modvis-card-compat {
  font-size: 0.65rem;
  color: #059669;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.2rem;
}

.p4y-modvis-card-compat i {
  font-size: 0.55rem;
}

.p4y-modvis-card-stars {
  display: flex;
  gap: 0.1rem;
  color: #f59e0b;
  font-size: 0.55rem;
}

/* Floating deco icons */
.p4y-modvis-float {
  position: absolute;
  z-index: 2;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.p4y-modvis-f1 {
  top: 0.5rem;
  right: 0.5rem;
  background: #ede9fe;
  color: #7c3aed;
  animation: floatSlow 4s ease-in-out infinite;
}

.p4y-modvis-f2 {
  bottom: 1.5rem;
  left: 0;
  background: #d1fae5;
  color: #059669;
  animation: floatSlow 4s ease-in-out infinite 1.3s;
}

.p4y-modvis-f3 {
  top: 45%;
  right: -0.5rem;
  background: #fef3c7;
  color: #d97706;
  animation: floatSlow 4s ease-in-out infinite 2.5s;
}

@keyframes floatSlow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

/* ======================================================
   CART MODAL (po dodaniu produktu)
   ====================================================== */
.p4y-cart-modal .modal-dialog {
  max-width: 720px;
  margin: 2rem auto;
}

.p4y-modal-content {
  border: none;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);
}

/* Modal header */
.p4y-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  background: #ecfdf5;
  border-bottom: 1px solid #d1fae5;
}

.p4y-modal-header-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.p4y-modal-check {
  width: 2rem;
  height: 2rem;
  background: #10b981;
  color: white;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  flex-shrink: 0;
}

.p4y-modal-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: #065f46;
  margin: 0;
  line-height: 1.3;
}

.p4y-modal-close {
  background: none;
  border: none;
  color: #64748b;
  font-size: 1.125rem;
  cursor: pointer;
  padding: 0.25rem;
  transition: color 0.2s;
}

.p4y-modal-close:hover {
  color: #0f172a;
}

/* Modal body */
.p4y-modal-body {
  padding: 1.5rem;
}

.p4y-modal-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 576px) {
  .p4y-modal-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Product in modal */
.p4y-modal-product {
  display: flex;
  gap: 1rem;
}

.p4y-modal-product-img {
  width: 100px;
  flex-shrink: 0;
}

.p4y-modal-product-img img {
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
  border: 1px solid #f1f5f9;
}

.p4y-modal-product-name {
  font-size: 0.9rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 0.375rem;
  line-height: 1.3;
}

.p4y-modal-product-price {
  font-size: 1rem;
  font-weight: 800;
  color: #44c27a;
  margin-bottom: 0.375rem;
}

.p4y-modal-product-attr {
  font-size: 0.75rem;
  color: #64748b;
  margin-bottom: 0.125rem;
}

.p4y-attr-value {
  font-weight: 600;
  color: #334155;
}

.p4y-modal-product-qty {
  font-size: 0.75rem;
  color: #64748b;
  margin-top: 0.5rem;
}

.p4y-modal-product-qty strong {
  color: #0f172a;
}

/* Summary in modal */
.p4y-modal-summary {
  background: #f8fafc;
  border-radius: 0.75rem;
  padding: 1rem;
  border: 1px solid #e2e8f0;
}

.p4y-modal-summary-header {
  font-size: 0.8rem;
  font-weight: 600;
  color: #475569;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.p4y-modal-summary-header i {
  color: #44c27a;
}

.p4y-modal-summary-lines {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #e2e8f0;
  margin-bottom: 0.75rem;
}

.p4y-modal-summary-line {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  color: #64748b;
}

.p4y-summary-value {
  font-weight: 600;
  color: #334155;
}

.p4y-modal-summary-total {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.p4y-total-line {
  font-weight: 700;
  color: #0f172a;
  font-size: 0.95rem;
}

.p4y-total-value {
  font-weight: 800;
  color: #0f172a;
  font-size: 1.125rem;
}

/* Modal footer */
.p4y-modal-footer {
  display: flex;
  gap: 0.75rem;
  padding: 1rem 1.5rem;
  border-top: 1px solid #e2e8f0;
  background: #fafafa;
}

.p4y-modal-btn-secondary {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  background: white;
  color: #475569 !important;
  border: 1px solid #e2e8f0;
  border-radius: 0.625rem;
  font-weight: 600;
  font-size: 0.85rem;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none !important;
}

.p4y-modal-btn-secondary:hover {
  background: #f8fafc;
  color: #0f172a !important;
  border-color: #cbd5e1;
}

.p4y-modal-btn-primary {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.25rem;
  background: #44c27a;
  color: white !important;
  border: none;
  border-radius: 0.625rem;
  font-weight: 700;
  font-size: 0.85rem;
  text-decoration: none !important;
  transition: all 0.2s;
  box-shadow: 0 4px 12px rgba(68, 194, 122, 0.3);
}

.p4y-modal-btn-primary:hover {
  background: #36af68;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(68, 194, 122, 0.4);
  color: white !important;
}

/* ======================================================
   CART PAGE (strona koszyka)
   ====================================================== */
.p4y-cart-page {
  padding: 2rem 0;
  max-width: 1200px;
  margin: 0 auto;
}

.p4y-cart-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 992px) {
  .p4y-cart-grid {
    grid-template-columns: 1fr 380px;
  }
}

/* Cart card */
.p4y-cart-card {
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  overflow: hidden;
}

.p4y-cart-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-cart-title {
  font-size: 1.25rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.p4y-cart-title i {
  color: #44c27a;
  font-size: 1.125rem;
}

.p4y-cart-count {
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  background: #f1f5f9;
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
}

/* Cart items list */
.p4y-cart-page .cart-overview {
  padding: 0;
}

.p4y-cart-page .cart-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.p4y-cart-page .cart-item {
  border-bottom: 1px solid #f1f5f9;
}

.p4y-cart-page .cart-item:last-child {
  border-bottom: none;
}

.p4y-cart-page .no-items {
  display: block;
  padding: 3rem;
  text-align: center;
  color: #94a3b8;
  font-size: 0.95rem;
}

/* Cart item row */
.p4y-cart-item {
  display: grid;
  grid-template-columns: 80px 1fr auto;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  align-items: start;
}

@media (min-width: 768px) {
  .p4y-cart-item {
    grid-template-columns: 100px 1fr auto;
    gap: 1.5rem;
  }
}

/* Cart item image */
.p4y-cart-item-img {
  border-radius: 0.625rem;
  overflow: hidden;
  border: 1px solid #f1f5f9;
  background: #fafafa;
}

.p4y-cart-item-img img {
  width: 100%;
  height: auto;
  display: block;
}

/* Cart item details */
.p4y-cart-item-name {
  font-size: 0.9rem;
  font-weight: 700;
  color: #0f172a !important;
  text-decoration: none !important;
  display: block;
  margin-bottom: 0.375rem;
  line-height: 1.3;
}

.p4y-cart-item-name:hover {
  color: #44c27a !important;
}

.p4y-cart-item-attr {
  font-size: 0.75rem;
  color: #64748b;
  margin-bottom: 0.125rem;
}

.p4y-cart-attr-value {
  font-weight: 600;
  color: #475569;
}

.p4y-cart-item-unit-price {
  margin-top: 0.5rem;
}

.p4y-cart-regular-price {
  text-decoration: line-through;
  color: #94a3b8;
  font-size: 0.8rem;
  margin-right: 0.375rem;
}

.p4y-cart-discount-badge {
  display: inline-block;
  background: #fef2f2;
  color: #ef4444;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
  margin-right: 0.375rem;
}

.p4y-cart-price {
  font-weight: 700;
  color: #0f172a;
  font-size: 0.9rem;
}

.p4y-cart-unit-price-full {
  font-size: 0.7rem;
  color: #94a3b8;
}

.p4y-cart-customization-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  color: #6366f1 !important;
  margin-top: 0.375rem;
}

/* Cart item actions (right side) */
.p4y-cart-item-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.5rem;
  min-width: 100px;
}

.p4y-cart-qty-input {
  width: 3.5rem;
  text-align: center;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.375rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #0f172a;
  background: #fafafa;
  transition: border-color 0.2s;
}

.p4y-cart-qty-input:focus {
  outline: none;
  border-color: #44c27a;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.15);
  background: white;
}

.p4y-cart-item-total-price {
  font-size: 1rem;
  font-weight: 800;
  color: #0f172a;
}

.p4y-cart-gift-label {
  font-size: 0.8rem;
  font-weight: 600;
  color: #44c27a;
  background: #ecfdf5;
  padding: 0.25rem 0.75rem;
  border-radius: 9999px;
}

.p4y-cart-remove-btn {
  color: #94a3b8 !important;
  font-size: 0.875rem;
  transition: color 0.2s;
  text-decoration: none !important;
}

.p4y-cart-remove-btn:hover {
  color: #ef4444 !important;
}

/* Continue shopping link */
.p4y-cart-continue {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.25rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #64748b !important;
  text-decoration: none !important;
  transition: color 0.2s;
}

.p4y-cart-continue:hover {
  color: #44c27a !important;
}

/* Cart sidebar / summary */
.p4y-cart-summary-card {
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  overflow: hidden;
  position: sticky;
  top: 6rem;
}

.p4y-cart-summary-title {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 1.25rem 1.5rem;
  font-size: 1rem;
  font-weight: 800;
  color: #0f172a;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-cart-summary-title i {
  color: #44c27a;
}

/* Summary lines */
.p4y-cart-summary-card .cart-detailed-totals {
  padding: 0;
}

.p4y-cart-summary-card .cart-detailed-subtotals {
  padding: 1rem 1.5rem;
}

.p4y-cart-summary-card .cart-summary-line {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  padding: 0.375rem 0;
  font-size: 0.85rem;
  color: #64748b;
  clear: none !important;
  margin-bottom: 0 !important;
}

.p4y-cart-summary-card .cart-summary-line::after {
  display: none !important;
}

.p4y-cart-summary-card .cart-summary-line .label {
  font-weight: 500;
  float: none !important;
  padding-left: 0;
}

.p4y-cart-summary-card .cart-summary-line .value {
  font-weight: 600;
  color: #334155;
  float: none !important;
  text-align: right;
  margin-left: auto;
}

.p4y-cart-summary-card .cart-summary-line > div:last-child {
  display: none;
}

/* Cart total */
.p4y-cart-summary-card .cart-total {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.5rem;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
}

.p4y-cart-summary-card .cart-total::after {
  display: none !important;
}

.p4y-cart-summary-card .cart-total .label {
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f172a;
}

.p4y-cart-summary-card .cart-total .value {
  font-size: 1.25rem;
  font-weight: 800;
  color: #0f172a;
}

/* Voucher section */
.p4y-cart-summary-card .block-promo {
  padding: 1rem 1.5rem;
  border-top: 1px solid #f1f5f9;
}

.p4y-cart-summary-card .block-promo .promo-name {
  font-size: 0.8rem;
}

.p4y-cart-summary-card .block-promo input[type="text"] {
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.85rem;
  width: 100%;
}

.p4y-cart-summary-card .block-promo input[type="text"]:focus {
  outline: none;
  border-color: #44c27a;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.15);
}

/* Checkout button */
.p4y-cart-checkout-btn {
  padding: 1rem 1.5rem;
}

.p4y-btn-checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.875rem 1.5rem;
  background: #44c27a;
  color: white !important;
  border: none;
  border-radius: 0.75rem;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(68, 194, 122, 0.3);
}

.p4y-btn-checkout:hover {
  background: #36af68;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(68, 194, 122, 0.4);
  color: white !important;
}

.p4y-btn-checkout.disabled,
.p4y-btn-checkout:disabled {
  background: #94a3b8;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

/* Cart alert */
.p4y-cart-alert {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 0.5rem;
  font-size: 0.8rem;
  color: #92400e;
  margin-bottom: 0.75rem;
}

.p4y-cart-alert i {
  color: #f59e0b;
}

/* Reassurance block */
.p4y-cart-reassurance {
  margin-top: 1rem;
}

.p4y-cart-reassurance .block-reassurance {
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  overflow: hidden;
}

/* === FEATURED PRODUCTS (HOMEPAGE) === */
.p4y-home-products {
  padding: 5rem 0;
  background: white;
  /* full-bleed */
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

.p4y-home-products-header {
  text-align: center;
  margin-bottom: 4rem;
}

/* Highlight grid - 2 kolumny */
.p4y-highlight-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-bottom: 5rem;
}

@media (min-width: 1024px) {
  .p4y-highlight-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.p4y-highlight-card {
  background: #f8fafc;
  border-radius: 1.5rem;
  border: 1px solid #e2e8f0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: box-shadow 0.3s;
}

.p4y-highlight-card:hover {
  box-shadow: 0 10px 40px -10px rgba(0,0,0,0.08);
}

@media (min-width: 768px) {
  .p4y-highlight-card {
    flex-direction: row;
  }
}

.p4y-highlight-info {
  padding: 2rem;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 10;
}

.p4y-highlight-badge {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.p4y-highlight-badge-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.5rem;
  background: white;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  border: 1px solid #f1f5f9;
}

.p4y-highlight-badge-green {
  color: #22c55e;
}

.p4y-highlight-badge-orange {
  color: #f97316;
}

.p4y-highlight-badge-label {
  font-weight: 700;
  color: #0f172a;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.p4y-highlight-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.75rem;
  transition: color 0.3s;
}

.p4y-highlight-card:hover .p4y-highlight-title a {
  color: #10b981 !important;
}

.p4y-highlight-card:hover .p4y-highlight-title-orange a {
  color: #f97316 !important;
}

.p4y-highlight-title a {
  color: #0f172a !important;
  text-decoration: none !important;
}

.p4y-highlight-desc {
  color: #64748b;
  font-size: 0.875rem;
  margin-bottom: 1.5rem;
  line-height: 1.7;
}

.p4y-highlight-link {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  color: #0f172a !important;
  font-size: 0.875rem;
  text-decoration: none !important;
  transition: color 0.3s;
  gap: 0.5rem;
}

.p4y-highlight-link:hover {
  color: #10b981 !important;
}

.p4y-highlight-link-orange:hover {
  color: #f97316 !important;
}

/* Highlight visual */
.p4y-highlight-visual {
  flex: 0 0 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  position: relative;
  overflow: hidden;
}

.p4y-highlight-visual-green {
  background: linear-gradient(to bottom right, #f0fdf4, rgba(209, 250, 229, 0.3));
}

.p4y-highlight-visual-orange {
  background: linear-gradient(to bottom right, #fff7ed, rgba(254, 215, 170, 0.3));
}

.p4y-highlight-visual::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.4);
  filter: blur(20px);
}

.p4y-highlight-img {
  position: relative;
  z-index: 10;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  border-radius: 0.5rem;
  width: 100%;
  height: auto;
  object-fit: contain;
  transition: all 0.5s;
}

.p4y-highlight-card:hover .p4y-highlight-img {
  transform: scale(1.05) rotate(0deg) !important;
}

/* Remaining products header */
.p4y-remaining-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 2rem;
}

.p4y-remaining-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}

.p4y-remaining-link {
  font-size: 0.875rem;
  font-weight: 700;
  color: #64748b !important;
  text-decoration: none !important;
  transition: color 0.3s;
}

.p4y-remaining-link:hover {
  color: #10b981 !important;
}

/* Home product grid - 4 kolumny */
.p4y-home-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 640px) {
  .p4y-home-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .p4y-home-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.p4y-home-card {
  background: white;
  border: 1px solid #f1f5f9;
  border-radius: 1rem;
  padding: 1rem;
  transition: all 0.3s;
}

.p4y-home-card:hover {
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
  transform: translateY(-4px);
}

.p4y-home-card-img {
  height: 14rem;
  background: white;
  border-radius: 0.75rem;
  margin-bottom: 1rem;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.p4y-home-card-img img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

.p4y-home-card-noimg {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  color: #cbd5e1;
}

.p4y-home-card-category {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #3b82f6;
  margin-bottom: 0.25rem;
}

.p4y-home-card-title {
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
  font-size: 0.95rem;
  transition: color 0.3s;
}

.p4y-home-card:hover .p4y-home-card-title a {
  color: #3b82f6 !important;
}

.p4y-home-card-title a {
  color: #0f172a !important;
  text-decoration: none !important;
}

.p4y-home-card-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.75rem;
}

.p4y-home-card-price {
  font-weight: 700;
  color: #334155;
}

.p4y-home-card-cart-form {
  margin: 0;
}

.p4y-home-card-cart-btn {
  width: 2rem;
  height: 2rem;
  border-radius: 9999px;
  background: #f1f5f9;
  color: #475569;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
  font-size: 0.75rem;
}

.p4y-home-card-cart-btn:hover {
  background: #10b981;
  color: white;
}

/* === BLOG / BAZA WIEDZY (HOMEPAGE) === */
.p4y-home-blog {
  padding: 5rem 0;
  background: #f8fafc;
  border-top: 1px solid rgba(226, 232, 240, 0.6);
  /* full-bleed */
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

.p4y-home-blog-header {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 3rem;
}

@media (min-width: 768px) {
  .p4y-home-blog-header {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-end;
  }
}

.p4y-home-blog-subtitle {
  max-width: 36rem;
}

.p4y-home-blog-all-link {
  padding: 0.75rem 1.5rem;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  font-weight: 700;
  color: #475569 !important;
  text-decoration: none !important;
  transition: all 0.3s;
  white-space: nowrap;
  font-size: 0.875rem;
}

.p4y-home-blog-all-link:hover {
  color: #10b981 !important;
  border-color: #10b981;
}

/* Blog grid */
.p4y-home-blog-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 768px) {
  .p4y-home-blog-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.p4y-home-blog-card {
  background: white;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  transition: box-shadow 0.3s;
}

.p4y-home-blog-card:hover {
  box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.p4y-home-blog-card-img {
  height: 13rem;
  overflow: hidden;
  position: relative;
  background: #0f172a;
}

.p4y-home-blog-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.5s ease;
}

.p4y-home-blog-card:hover .p4y-home-blog-card-img img {
  transform: scale(1.04);
}

.p4y-home-blog-card-tag {
  position: absolute;
  top: 1rem;
  left: 1rem;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 0.25rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: #334155;
  z-index: 2;
  letter-spacing: 0.02em;
}

.p4y-home-blog-card-body {
  padding: 1.5rem;
}

.p4y-home-blog-card-date {
  font-size: 0.75rem;
  color: #94a3b8;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.p4y-home-blog-card-title {
  font-weight: 700;
  font-size: 1.125rem;
  color: #0f172a;
  margin-bottom: 0.75rem;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  transition: color 0.3s;
}

.p4y-home-blog-card:hover .p4y-home-blog-card-title {
  color: #10b981;
}

.p4y-home-blog-card-excerpt {
  color: #64748b;
  font-size: 0.875rem;
  margin-bottom: 1rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.6;
}

.p4y-home-blog-card-link {
  font-size: 0.875rem;
  font-weight: 700;
  color: #0f172a !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  transition: color 0.3s;
}

.p4y-home-blog-card-link:hover {
  color: #10b981 !important;
}

.p4y-home-blog-card-link i {
  font-size: 0.625rem;
  transition: transform 0.3s;
}

.p4y-home-blog-card:hover .p4y-home-blog-card-link i {
  transform: translateX(4px);
}

/* === BLOG LIST + SINGLE PAGE === */
.p4y-blog-list .p4y-home-blog-grid {
  margin-bottom: 2rem;
}

.p4y-blog-pagination {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 2rem;
}

.p4y-blog-page-link,
.p4y-blog-page-current {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.5rem;
  font-weight: 700;
  font-size: 0.875rem;
  text-decoration: none;
}

.p4y-blog-page-link {
  background: white;
  border: 1px solid #e2e8f0;
  color: #475569 !important;
  transition: all 0.3s;
}

.p4y-blog-page-link:hover {
  border-color: #10b981;
  color: #10b981 !important;
}

.p4y-blog-page-current {
  background: #10b981;
  color: white;
  border: 1px solid #10b981;
}

.p4y-blog-single-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-bottom: 2rem;
  font-size: 0.875rem;
  color: #94a3b8;
}

.p4y-blog-single-meta i {
  margin-right: 0.25rem;
}

.p4y-blog-single-category {
  background: #f1f5f9;
  padding: 0.25rem 0.75rem;
  border-radius: 0.375rem;
  font-weight: 700;
  color: #334155;
  font-size: 0.75rem;
}

.p4y-blog-single-cover {
  margin-bottom: 2rem;
  border-radius: 1rem;
  overflow: hidden;
  max-width: 600px;
}

.p4y-blog-single-cover img {
  width: 100%;
  height: auto;
  display: block;
}

.p4y-blog-single-content {
  font-size: 1rem;
  line-height: 1.8;
  color: #334155;
  margin-bottom: 3rem;
}

.p4y-blog-single-content * {
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-stretch: inherit !important;
}

.p4y-blog-single-content h1,
.p4y-blog-single-content h2,
.p4y-blog-single-content h3 {
  color: #0f172a;
  margin-top: 2rem;
  margin-bottom: 1rem;
  font-size: revert !important;
}

.p4y-blog-single-content p {
  margin-bottom: 1rem;
}

.p4y-blog-single-content ul,
.p4y-blog-single-content ol {
  margin-bottom: 1rem;
  padding-left: 1.5rem;
}

.p4y-blog-single-content li {
  margin-bottom: 0.5rem;
}

.p4y-blog-single-content img {
  max-width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p4y-blog-single-back {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px solid #e2e8f0;
}

.p4y-home-blog-card-img-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}

/* === NEWSLETTER / CTA CIEMNA SEKCJA === */
.p4y-home-newsletter-cta {
  padding: 5rem 0;
  background: #0f172a;
  position: relative;
  overflow: hidden;
  text-align: center;
  /* full-bleed */
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

.p4y-home-newsletter-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom right, #0f172a, #1e293b);
}

.p4y-home-newsletter-cta::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 24rem;
  height: 24rem;
  border-radius: 9999px;
  background: #10b981;
  mix-blend-mode: overlay;
  filter: blur(48px);
  opacity: 0.1;
}

.p4y-home-newsletter-cta .container {
  position: relative;
  z-index: 10;
}

.p4y-home-newsletter-title {
  font-size: 1.875rem;
  font-weight: 700;
  color: white;
  margin-bottom: 1.5rem;
}

@media (min-width: 1024px) {
  .p4y-home-newsletter-title {
    font-size: 2.25rem;
  }
}

.p4y-home-newsletter-desc {
  color: #94a3b8;
  margin-bottom: 2.5rem;
  max-width: 36rem;
  margin-left: auto;
  margin-right: auto;
}

.p4y-home-newsletter-form-wrapper {
  max-width: 28rem;
  margin: 0 auto;
}

/* Override newsletter form styles inside dark section */
.p4y-home-newsletter-cta .p4y-newsletter-form {
  margin: 0;
}

.p4y-home-newsletter-cta .p4y-newsletter-input-row {
  background: rgba(255,255,255,0.1) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  border-radius: 0.75rem !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-input-row:focus-within {
  background: rgba(255,255,255,0.2) !important;
  border-color: rgba(255,255,255,0.2) !important;
  box-shadow: none !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-input {
  background: transparent !important;
  color: white !important;
  border: none !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-input::placeholder {
  color: #94a3b8 !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-btn {
  background: #10b981 !important;
  color: white !important;
  border-radius: 0.75rem !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-btn:hover {
  background: #059669 !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-btn[disabled],
.p4y-newsletter .p4y-newsletter-btn[disabled] {
  opacity: 0.4;
  cursor: not-allowed;
}

.p4y-home-newsletter-cta .p4y-newsletter-conditions,
.p4y-home-newsletter-cta .gdpr_module_consent {
  color: #94a3b8;
}

.p4y-home-newsletter-cta .custom-checkbox,
.p4y-home-newsletter-cta .custom-checkbox label,
.p4y-home-newsletter-cta .psgdpr_consent_message,
.p4y-home-newsletter-cta .psgdpr_consent_message > span:last-child {
  color: #94a3b8 !important;
  font-size: 0.75rem;
}

.p4y-newsletter .custom-checkbox,
.p4y-newsletter .custom-checkbox label,
.p4y-newsletter .psgdpr_consent_message,
.p4y-newsletter .psgdpr_consent_message > span:last-child {
  color: #94a3b8 !important;
  font-size: 0.7rem;
}

/* GDPR checkbox visual fix for dark newsletter section (homepage) */
.p4y-home-newsletter-cta .custom-checkbox input[type="checkbox"] + span {
  border-color: rgba(255,255,255,0.4) !important;
  background: rgba(255,255,255,0.05);
}

.p4y-home-newsletter-cta .custom-checkbox input[type="checkbox"]:checked + span {
  background: #44c27a !important;
  border-color: #44c27a !important;
}

.p4y-home-newsletter-cta .custom-checkbox input[type="checkbox"]:checked + span .checkbox-checked {
  color: #fff !important;
}

/* GDPR checkbox visual fix for footer (light background) */
.p4y-newsletter .custom-checkbox input[type="checkbox"] + span {
  border-color: #cbd5e1 !important;
}

.p4y-newsletter .custom-checkbox input[type="checkbox"]:checked + span {
  background: #44c27a !important;
  border-color: #44c27a !important;
}

.p4y-newsletter .custom-checkbox input[type="checkbox"]:checked + span .checkbox-checked {
  color: #fff !important;
}

.p4y-home-newsletter-cta .p4y-newsletter-conditions a {
  color: #cbd5e1 !important;
}

.p4y-home-newsletter-privacy {
  color: #64748b;
  font-size: 0.75rem;
  margin-top: 1.5rem;
}

/* === SEKCJA PARTNERZY === */
.p4y-home-partners {
  padding: 4rem 0;
  background: white;
  border-top: 1px solid #f1f5f9;
  /* full-bleed */
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

.p4y-home-partners-title {
  text-align: center;
  margin-bottom: 2.5rem;
}

.p4y-home-partners-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 3rem;
  opacity: 0.8;
}

@media (min-width: 768px) {
  .p4y-home-partners-row {
    gap: 5rem;
  }
}

.p4y-home-partner {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}

.p4y-home-partner-logo {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  filter: grayscale(100%);
  transition: filter 0.5s;
}

.p4y-home-partner:hover .p4y-home-partner-logo {
  filter: grayscale(0%);
}

.p4y-home-partner-logo i {
  font-size: 2.25rem;
  color: #334155;
}

.p4y-home-partner-logo .fas.fa-credit-card {
  color: #3b82f6;
}

.p4y-home-partner-logo span {
  font-size: 1.875rem;
  font-weight: 700;
  color: #1e293b;
}

.p4y-home-partner-icon-circle {
  width: 3rem;
  height: 3rem;
  background: #0f172a;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 1.25rem;
}

.p4y-home-partner-badge {
  margin-top: 0.5rem;
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 700;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
}

.p4y-partner-badge-blue {
  color: #2563eb;
  background: #eff6ff;
}

.p4y-partner-badge-yellow {
  color: #a16207;
  background: #fef9c3;
}

.p4y-partner-badge-slate {
  color: #64748b;
  background: #f1f5f9;
}

/* === SEKCJA CTA === */
.p4y-home-cta {
  padding: 5rem 0;
  background: white;
  text-align: center;
  position: relative;
  overflow: hidden;
  border-top: 1px solid #f1f5f9;
  /* full-bleed */
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}

.p4y-home-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #f8fafc;
  opacity: 0.5;
}

.p4y-home-cta .container {
  position: relative;
  z-index: 10;
}

.p4y-home-cta-title {
  font-size: 1.875rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
  .p4y-home-cta-title {
    font-size: 2.25rem;
  }
}

.p4y-home-cta-desc {
  color: #475569;
  max-width: 42rem;
  margin: 0 auto 2.5rem;
  font-size: 1.125rem;
}

.p4y-home-cta-btn {
  display: inline-block;
  padding: 1rem 2.5rem;
  background: #10b981;
  color: white !important;
  font-weight: 700;
  border-radius: 0.5rem;
  text-decoration: none !important;
  transition: all 0.3s;
  box-shadow: 0 10px 25px rgba(16, 185, 129, 0.2);
}

.p4y-home-cta-btn:hover {
  background: #059669;
  color: white !important;
  box-shadow: 0 15px 35px rgba(16, 185, 129, 0.3);
}

/* ============================================================
   CMS Services Landing Page (page-11)
   ============================================================ */

.p4y-cms-services {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  width: 100vw;
  overflow-x: hidden;
}

/* --- Hero Section --- */
.p4y-srv-hero {
  position: relative;
  padding: 5rem 0 4rem;
  background: linear-gradient(135deg, #f0f4ff 0%, #f8fafc 50%, #eef2ff 100%);
  overflow: hidden;
}

.p4y-srv-hero-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.p4y-srv-blob-1 {
  position: absolute;
  top: -120px;
  right: -80px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(99,102,241,0.12) 0%, transparent 70%);
  border-radius: 50%;
}

.p4y-srv-blob-2 {
  position: absolute;
  bottom: -100px;
  left: -60px;
  width: 350px;
  height: 350px;
  background: radial-gradient(circle, rgba(16,185,129,0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.p4y-srv-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
  max-width: 1280px;
  margin: 0 auto;
}

.p4y-srv-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: white;
  border: 1px solid #e0e7ff;
  padding: 0.4rem 1rem;
  border-radius: 9999px;
  font-size: 0.8rem;
  font-weight: 600;
  color: #4f46e5;
  margin-bottom: 1.5rem;
}

.p4y-srv-badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #6366f1;
  animation: p4y-pulse-dot 2s infinite;
}

.p4y-srv-hero-title {
  font-size: 3.2rem;
  font-weight: 800;
  line-height: 1.15;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.p4y-srv-gradient-text {
  background: linear-gradient(135deg, #6366f1, #3b82f6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.p4y-srv-hero-desc {
  font-size: 1.15rem;
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

.p4y-srv-hero-list {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.p4y-srv-hero-list li {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.95rem;
  color: #334155;
}

.p4y-srv-hero-list li i {
  color: #10b981;
  font-size: 1rem;
}

.p4y-srv-hero-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.p4y-srv-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 2rem;
  background: linear-gradient(135deg, #6366f1, #4f46e5);
  color: white !important;
  border-radius: 0.6rem;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none !important;
  transition: all 0.3s;
  box-shadow: 0 8px 25px rgba(99,102,241,0.25);
}

.p4y-srv-btn-primary:hover {
  background: linear-gradient(135deg, #4f46e5, #4338ca);
  box-shadow: 0 12px 35px rgba(99,102,241,0.35);
  transform: translateY(-1px);
}

.p4y-srv-btn-secondary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.85rem 2rem;
  background: white;
  color: #4f46e5 !important;
  border: 1.5px solid #c7d2fe;
  border-radius: 0.6rem;
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none !important;
  transition: all 0.3s;
}

.p4y-srv-btn-secondary:hover {
  background: #eef2ff;
  border-color: #a5b4fc;
}

.p4y-srv-hero-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}

.p4y-srv-hero-img-wrapper {
  width: 100%;
  max-width: 520px;
}

.p4y-srv-hero-img-wrapper img {
  width: 100%;
  height: auto;
  border-radius: 1rem;
  filter: drop-shadow(0 20px 40px rgba(99,102,241,0.12));
}

/* --- Credential Section --- */
.p4y-srv-credential {
  padding: 3rem 0;
  background: white;
}

.p4y-srv-credential-box {
  display: flex;
  align-items: center;
  gap: 2rem;
  max-width: 1280px;
  margin: 0 auto;
  padding: 2rem 2.5rem;
  background: linear-gradient(135deg, #faf5ff 0%, #eef2ff 100%);
  border-radius: 1rem;
  border: 1px solid #e0e7ff;
}

.p4y-srv-credential-icon {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #6366f1, #a855f7);
  border-radius: 1rem;
  color: white;
  font-size: 1.5rem;
}

.p4y-srv-credential-info h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 0.3rem;
}

.p4y-srv-credential-info p {
  font-size: 0.9rem;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
}

.p4y-srv-credential-badges {
  flex-shrink: 0;
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.p4y-srv-tech-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.75rem;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 0.4rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: #475569;
}

/* --- Section Header (shared) --- */
.p4y-srv-section-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 3.5rem;
}

.p4y-srv-section-title {
  font-size: 2.2rem;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 0.75rem;
}

.p4y-srv-section-subtitle {
  font-size: 1.05rem;
  color: #64748b;
  line-height: 1.6;
}

/* --- Services Section --- */
.p4y-srv-services {
  padding: 5rem 0;
  background: white;
}

.p4y-srv-services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1280px;
  margin: 0 auto;
}

.p4y-srv-card {
  padding: 2rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  transition: all 0.3s;
}

.p4y-srv-card:hover {
  background: white;
  border-color: #c7d2fe;
  box-shadow: 0 12px 30px rgba(99,102,241,0.08);
  transform: translateY(-4px);
}

.p4y-srv-card-icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.75rem;
  font-size: 1.2rem;
  margin-bottom: 1.2rem;
}

.p4y-srv-icon-blue { background: #eff6ff; color: #3b82f6; }
.p4y-srv-icon-green { background: #ecfdf5; color: #10b981; }
.p4y-srv-icon-orange { background: #fff7ed; color: #f97316; }
.p4y-srv-icon-violet { background: #faf5ff; color: #8b5cf6; }
.p4y-srv-icon-red { background: #fef2f2; color: #ef4444; }
.p4y-srv-icon-teal { background: #f0fdfa; color: #14b8a6; }

.p4y-srv-card-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.6rem;
}

.p4y-srv-card-desc {
  font-size: 0.9rem;
  color: #64748b;
  line-height: 1.6;
  margin-bottom: 1rem;
}

.p4y-srv-card-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.p4y-srv-card-list li {
  font-size: 0.82rem;
  color: #475569;
  padding-left: 1rem;
  position: relative;
}

.p4y-srv-card-list li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: #94a3b8;
}

/* --- Pricing Section --- */
.p4y-srv-pricing {
  padding: 5rem 0;
  background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
}

.p4y-srv-pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1100px;
  margin: 0 auto;
  align-items: start;
}

.p4y-srv-pricing-card {
  position: relative;
  padding: 2.5rem 2rem;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 1.2rem;
  transition: all 0.3s;
}

.p4y-srv-pricing-card:hover {
  box-shadow: 0 12px 30px rgba(0,0,0,0.06);
  transform: translateY(-4px);
}

.p4y-srv-pricing-featured {
  border: 2px solid #6366f1;
  box-shadow: 0 8px 30px rgba(99,102,241,0.12);
  transform: scale(1.03);
}

.p4y-srv-pricing-featured:hover {
  transform: scale(1.03) translateY(-4px);
  box-shadow: 0 16px 40px rgba(99,102,241,0.18);
}

.p4y-srv-pricing-badge {
  position: absolute;
  top: -12px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #6366f1, #4f46e5);
  color: white;
  padding: 0.3rem 1.2rem;
  border-radius: 9999px;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.p4y-srv-pricing-header h3 {
  font-size: 1.3rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.3rem;
}

.p4y-srv-pricing-desc {
  font-size: 0.88rem;
  color: #64748b;
  margin-bottom: 1.5rem;
}

.p4y-srv-pricing-price {
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-srv-pricing-amount {
  display: block;
  font-size: 2rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}

.p4y-srv-pricing-unit {
  font-size: 0.85rem;
  color: #94a3b8;
}

.p4y-srv-pricing-features {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.p4y-srv-pricing-features li {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 0.9rem;
  color: #334155;
}

.p4y-srv-pricing-features li i {
  color: #10b981;
  font-size: 0.85rem;
}

.p4y-srv-pricing-btn {
  display: block;
  text-align: center;
  padding: 0.8rem 1.5rem;
  border: 1.5px solid #e2e8f0;
  border-radius: 0.6rem;
  color: #475569 !important;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none !important;
  transition: all 0.3s;
}

.p4y-srv-pricing-btn:hover {
  border-color: #6366f1;
  color: #4f46e5 !important;
  background: #f8fafc;
}

.p4y-srv-pricing-btn-primary {
  background: linear-gradient(135deg, #6366f1, #4f46e5);
  color: white !important;
  border-color: #6366f1;
}

.p4y-srv-pricing-btn-primary:hover {
  background: linear-gradient(135deg, #4f46e5, #4338ca);
  color: white !important;
  box-shadow: 0 8px 20px rgba(99,102,241,0.3);
}

/* --- Process Section --- */
.p4y-srv-process {
  padding: 5rem 0;
  background: white;
}

.p4y-srv-process-steps {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  max-width: 1100px;
  margin: 0 auto;
}

.p4y-srv-step {
  flex: 1;
  text-align: center;
  padding: 0 1.5rem;
  max-width: 260px;
}

.p4y-srv-step-number {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #6366f1, #4f46e5);
  color: white;
  font-size: 1.2rem;
  font-weight: 800;
  border-radius: 50%;
  margin-bottom: 1rem;
}

.p4y-srv-step-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.p4y-srv-step-desc {
  font-size: 0.88rem;
  color: #64748b;
  line-height: 1.6;
}

.p4y-srv-step-connector {
  flex-shrink: 0;
  width: 60px;
  height: 2px;
  background: #e0e7ff;
  margin-top: 24px;
  position: relative;
}

.p4y-srv-step-connector::after {
  content: '';
  position: absolute;
  right: -3px;
  top: -3px;
  width: 8px;
  height: 8px;
  border-right: 2px solid #c7d2fe;
  border-top: 2px solid #c7d2fe;
  transform: rotate(45deg);
}

/* --- Testimonials Section --- */
.p4y-srv-testimonials {
  padding: 5rem 0;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.p4y-srv-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1280px;
  margin: 0 auto;
}

.p4y-srv-testimonial {
  padding: 2rem;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  transition: all 0.3s;
}

.p4y-srv-testimonial:hover {
  box-shadow: 0 8px 25px rgba(0,0,0,0.05);
  transform: translateY(-2px);
}

.p4y-srv-testimonial-stars {
  display: flex;
  gap: 0.2rem;
  margin-bottom: 1rem;
  color: #fbbf24;
  font-size: 0.9rem;
}

.p4y-srv-testimonial-text {
  font-size: 0.92rem;
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
  font-style: italic;
}

.p4y-srv-testimonial-author {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.p4y-srv-testimonial-avatar {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #eef2ff, #e0e7ff);
  border-radius: 50%;
  font-size: 0.8rem;
  font-weight: 700;
  color: #4f46e5;
}

.p4y-srv-testimonial-name {
  font-size: 0.9rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.p4y-srv-testimonial-role {
  font-size: 0.78rem;
  color: #94a3b8;
  margin: 0;
}

/* --- Additional Services Section --- */
.p4y-srv-additional {
  padding: 5rem 0;
  background: white;
}

.p4y-srv-additional-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1280px;
  margin: 0 auto;
}

.p4y-srv-additional-card {
  padding: 2rem;
  border-radius: 1rem;
  transition: all 0.3s;
}

.p4y-srv-additional-card:hover {
  transform: translateY(-4px);
}

.p4y-srv-add-blue {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid #bfdbfe;
}

.p4y-srv-add-green {
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border: 1px solid #a7f3d0;
}

.p4y-srv-add-orange {
  background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 100%);
  border: 1px solid #fdba74;
}

.p4y-srv-additional-icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  border-radius: 0.75rem;
  font-size: 1.2rem;
  margin-bottom: 1.2rem;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.p4y-srv-add-blue .p4y-srv-additional-icon { color: #3b82f6; }
.p4y-srv-add-green .p4y-srv-additional-icon { color: #10b981; }
.p4y-srv-add-orange .p4y-srv-additional-icon { color: #f97316; }

.p4y-srv-additional-card h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.6rem;
}

.p4y-srv-additional-card p {
  font-size: 0.9rem;
  color: #475569;
  line-height: 1.6;
  margin-bottom: 1rem;
}

.p4y-srv-additional-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: #4f46e5 !important;
  text-decoration: none !important;
  transition: gap 0.3s;
}

.p4y-srv-additional-link:hover {
  gap: 0.7rem;
}

/* --- Contact CTA Section --- */
.p4y-srv-contact-cta {
  padding: 5rem 0;
  background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%);
}

.p4y-srv-contact-box {
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}

.p4y-srv-contact-box h2 {
  font-size: 2rem;
  font-weight: 800;
  color: white;
  margin-bottom: 0.75rem;
}

.p4y-srv-contact-box p {
  font-size: 1.05rem;
  color: #a5b4fc;
  line-height: 1.6;
  margin-bottom: 2rem;
}

.p4y-srv-contact-actions {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.p4y-srv-contact-cta .p4y-srv-btn-primary {
  background: white;
  color: #4f46e5 !important;
  box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}

.p4y-srv-contact-cta .p4y-srv-btn-primary:hover {
  background: #f8fafc;
  box-shadow: 0 12px 35px rgba(0,0,0,0.3);
}

.p4y-srv-contact-cta .p4y-srv-btn-secondary {
  background: transparent;
  color: #c7d2fe !important;
  border-color: rgba(199,210,254,0.3);
}

.p4y-srv-contact-cta .p4y-srv-btn-secondary:hover {
  background: rgba(255,255,255,0.05);
  border-color: rgba(199,210,254,0.5);
  color: white !important;
}

/* ============================================================
   CMS Services — Theme: Orange (page-16: Aktualizacja PrestaShop)
   ============================================================ */
.p4y-srv-theme-orange .p4y-srv-blob-1 {
  background: radial-gradient(circle, rgba(249,115,22,0.12) 0%, transparent 70%);
}
.p4y-srv-theme-orange .p4y-srv-blob-2 {
  background: radial-gradient(circle, rgba(251,146,60,0.1) 0%, transparent 70%);
}
.p4y-srv-theme-orange .p4y-srv-hero-badge {
  border-color: #fed7aa;
  color: #ea580c;
}
.p4y-srv-theme-orange .p4y-srv-badge-dot {
  background: #f97316;
}
.p4y-srv-theme-orange .p4y-srv-gradient-text {
  background: linear-gradient(135deg, #f97316, #ea580c);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.p4y-srv-theme-orange .p4y-srv-btn-primary {
  background: linear-gradient(135deg, #f97316, #ea580c);
  box-shadow: 0 8px 25px rgba(249,115,22,0.25);
}
.p4y-srv-theme-orange .p4y-srv-btn-primary:hover {
  background: linear-gradient(135deg, #ea580c, #c2410c);
  box-shadow: 0 12px 35px rgba(249,115,22,0.35);
}
.p4y-srv-theme-orange .p4y-srv-btn-secondary {
  color: #ea580c !important;
  border-color: #fdba74;
}
.p4y-srv-theme-orange .p4y-srv-btn-secondary:hover {
  background: #fff7ed;
  border-color: #f97316;
}
.p4y-srv-theme-orange .p4y-srv-hero-img-wrapper img {
  filter: drop-shadow(0 20px 40px rgba(249,115,22,0.12));
}
.p4y-srv-theme-orange .p4y-srv-credential-box {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border-color: #fed7aa;
}
.p4y-srv-theme-orange .p4y-srv-credential-icon {
  background: linear-gradient(135deg, #f97316, #ea580c);
}
.p4y-srv-theme-orange .p4y-srv-card:hover {
  border-color: #fdba74;
  box-shadow: 0 12px 30px rgba(249,115,22,0.08);
}
.p4y-srv-theme-orange .p4y-srv-pricing-featured {
  border-color: #f97316;
  box-shadow: 0 8px 30px rgba(249,115,22,0.12);
}
.p4y-srv-theme-orange .p4y-srv-pricing-featured:hover {
  box-shadow: 0 16px 40px rgba(249,115,22,0.18);
}
.p4y-srv-theme-orange .p4y-srv-pricing-badge {
  background: linear-gradient(135deg, #f97316, #ea580c);
}
.p4y-srv-theme-orange .p4y-srv-pricing-btn:hover {
  border-color: #f97316;
  color: #ea580c !important;
}
.p4y-srv-theme-orange .p4y-srv-pricing-btn-primary {
  background: linear-gradient(135deg, #f97316, #ea580c);
  border-color: #f97316;
}
.p4y-srv-theme-orange .p4y-srv-pricing-btn-primary:hover {
  background: linear-gradient(135deg, #ea580c, #c2410c);
  box-shadow: 0 8px 20px rgba(249,115,22,0.3);
}
.p4y-srv-theme-orange .p4y-srv-step-number {
  background: linear-gradient(135deg, #f97316, #ea580c);
}
.p4y-srv-theme-orange .p4y-srv-step-connector {
  background: #fed7aa;
}
.p4y-srv-theme-orange .p4y-srv-step-connector::after {
  border-color: #fdba74;
}
.p4y-srv-theme-orange .p4y-srv-testimonial-avatar {
  background: linear-gradient(135deg, #fff7ed, #fed7aa);
  color: #ea580c;
}
.p4y-srv-theme-orange .p4y-srv-additional-link {
  color: #ea580c !important;
}
.p4y-srv-theme-orange .p4y-srv-contact-cta {
  background: linear-gradient(135deg, #7c2d12 0%, #9a3412 100%);
}
.p4y-srv-theme-orange .p4y-srv-contact-box p {
  color: #fdba74;
}
.p4y-srv-theme-orange .p4y-srv-contact-cta .p4y-srv-btn-primary {
  background: white;
  color: #ea580c !important;
  box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}
.p4y-srv-theme-orange .p4y-srv-contact-cta .p4y-srv-btn-primary:hover {
  background: #f8fafc;
  box-shadow: 0 12px 35px rgba(0,0,0,0.3);
}
.p4y-srv-theme-orange .p4y-srv-contact-cta .p4y-srv-btn-secondary {
  color: #fdba74 !important;
  border-color: rgba(253,186,116,0.3);
}
.p4y-srv-theme-orange .p4y-srv-contact-cta .p4y-srv-btn-secondary:hover {
  background: rgba(255,255,255,0.05);
  border-color: rgba(253,186,116,0.5);
  color: white !important;
}

/* ============================================================
   CMS Services — Theme: Teal (page-17: Utrzymanie sklepu)
   ============================================================ */
.p4y-srv-theme-teal .p4y-srv-blob-1 {
  background: radial-gradient(circle, rgba(20,184,166,0.12) 0%, transparent 70%);
}
.p4y-srv-theme-teal .p4y-srv-blob-2 {
  background: radial-gradient(circle, rgba(45,212,191,0.1) 0%, transparent 70%);
}
.p4y-srv-theme-teal .p4y-srv-hero-badge {
  border-color: #99f6e4;
  color: #0d9488;
}
.p4y-srv-theme-teal .p4y-srv-badge-dot {
  background: #14b8a6;
}
.p4y-srv-theme-teal .p4y-srv-gradient-text {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.p4y-srv-theme-teal .p4y-srv-btn-primary {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  box-shadow: 0 8px 25px rgba(20,184,166,0.25);
}
.p4y-srv-theme-teal .p4y-srv-btn-primary:hover {
  background: linear-gradient(135deg, #0d9488, #0f766e);
  box-shadow: 0 12px 35px rgba(20,184,166,0.35);
}
.p4y-srv-theme-teal .p4y-srv-btn-secondary {
  color: #0d9488 !important;
  border-color: #5eead4;
}
.p4y-srv-theme-teal .p4y-srv-btn-secondary:hover {
  background: #f0fdfa;
  border-color: #14b8a6;
}
.p4y-srv-theme-teal .p4y-srv-hero-img-wrapper img {
  filter: drop-shadow(0 20px 40px rgba(20,184,166,0.12));
}
.p4y-srv-theme-teal .p4y-srv-credential-box {
  background: linear-gradient(135deg, #f0fdfa 0%, #ccfbf1 100%);
  border-color: #99f6e4;
}
.p4y-srv-theme-teal .p4y-srv-credential-icon {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
}
.p4y-srv-theme-teal .p4y-srv-card:hover {
  border-color: #5eead4;
  box-shadow: 0 12px 30px rgba(20,184,166,0.08);
}
.p4y-srv-theme-teal .p4y-srv-pricing-featured {
  border-color: #14b8a6;
  box-shadow: 0 8px 30px rgba(20,184,166,0.12);
}
.p4y-srv-theme-teal .p4y-srv-pricing-featured:hover {
  box-shadow: 0 16px 40px rgba(20,184,166,0.18);
}
.p4y-srv-theme-teal .p4y-srv-pricing-badge {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
}
.p4y-srv-theme-teal .p4y-srv-pricing-btn:hover {
  border-color: #14b8a6;
  color: #0d9488 !important;
}
.p4y-srv-theme-teal .p4y-srv-pricing-btn-primary {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  border-color: #14b8a6;
}
.p4y-srv-theme-teal .p4y-srv-pricing-btn-primary:hover {
  background: linear-gradient(135deg, #0d9488, #0f766e);
  box-shadow: 0 8px 20px rgba(20,184,166,0.3);
}
.p4y-srv-theme-teal .p4y-srv-step-number {
  background: linear-gradient(135deg, #14b8a6, #0d9488);
}
.p4y-srv-theme-teal .p4y-srv-step-connector {
  background: #99f6e4;
}
.p4y-srv-theme-teal .p4y-srv-step-connector::after {
  border-color: #5eead4;
}
.p4y-srv-theme-teal .p4y-srv-testimonial-avatar {
  background: linear-gradient(135deg, #f0fdfa, #99f6e4);
  color: #0d9488;
}
.p4y-srv-theme-teal .p4y-srv-additional-link {
  color: #0d9488 !important;
}
.p4y-srv-theme-teal .p4y-srv-contact-cta {
  background: linear-gradient(135deg, #134e4a 0%, #115e59 100%);
}
.p4y-srv-theme-teal .p4y-srv-contact-box p {
  color: #5eead4;
}
.p4y-srv-theme-teal .p4y-srv-contact-cta .p4y-srv-btn-primary {
  background: white;
  color: #0d9488 !important;
  box-shadow: 0 8px 25px rgba(0,0,0,0.2);
}
.p4y-srv-theme-teal .p4y-srv-contact-cta .p4y-srv-btn-primary:hover {
  background: #f8fafc;
  box-shadow: 0 12px 35px rgba(0,0,0,0.3);
}
.p4y-srv-theme-teal .p4y-srv-contact-cta .p4y-srv-btn-secondary {
  color: #5eead4 !important;
  border-color: rgba(94,234,212,0.3);
}
.p4y-srv-theme-teal .p4y-srv-contact-cta .p4y-srv-btn-secondary:hover {
  background: rgba(255,255,255,0.05);
  border-color: rgba(94,234,212,0.5);
  color: white !important;
}

/* --- Responsive: CMS Services --- */
@media (max-width: 1024px) {
  .p4y-srv-hero-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .p4y-srv-hero-visual {
    order: -1;
  }

  .p4y-srv-hero-img-wrapper {
    max-width: 400px;
    margin: 0 auto;
  }

  .p4y-srv-hero-title {
    font-size: 2.5rem;
  }

  .p4y-srv-services-grid,
  .p4y-srv-testimonials-grid,
  .p4y-srv-additional-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .p4y-srv-pricing-grid {
    grid-template-columns: 1fr;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }

  .p4y-srv-pricing-featured {
    transform: none;
    order: -1;
  }

  .p4y-srv-pricing-featured:hover {
    transform: translateY(-4px);
  }

  .p4y-srv-credential-box {
    flex-direction: column;
    text-align: center;
  }

  .p4y-srv-credential-badges {
    justify-content: center;
  }

  .p4y-srv-process-steps {
    flex-direction: column;
    align-items: center;
    gap: 0;
  }

  .p4y-srv-step {
    max-width: 100%;
  }

  .p4y-srv-step-connector {
    width: 2px;
    height: 30px;
    margin: 0.5rem 0;
  }

  .p4y-srv-step-connector::after {
    right: -3px;
    top: auto;
    bottom: -3px;
    transform: rotate(135deg);
  }
}

@media (max-width: 640px) {
  .p4y-srv-hero {
    padding: 3rem 0 2.5rem;
  }

  .p4y-srv-hero-title {
    font-size: 2rem;
  }

  .p4y-srv-hero-desc {
    font-size: 1rem;
  }

  .p4y-srv-hero-actions {
    flex-direction: column;
  }

  .p4y-srv-hero-actions a {
    text-align: center;
    justify-content: center;
  }

  .p4y-srv-section-title {
    font-size: 1.7rem;
  }

  .p4y-srv-services-grid,
  .p4y-srv-testimonials-grid,
  .p4y-srv-additional-grid {
    grid-template-columns: 1fr;
  }

  .p4y-srv-services,
  .p4y-srv-pricing,
  .p4y-srv-process,
  .p4y-srv-testimonials,
  .p4y-srv-additional,
  .p4y-srv-contact-cta {
    padding: 3rem 0;
  }

  .p4y-srv-contact-box h2 {
    font-size: 1.5rem;
  }

  .p4y-srv-contact-actions {
    flex-direction: column;
  }

  .p4y-srv-contact-actions a {
    text-align: center;
    justify-content: center;
  }
}

/* ============================================================
   CMS Services — Sub-page variants (pages 12, 13, 14)
   ============================================================ */

/* --- Hero icon box (replaces image on sub-pages) --- */
.p4y-srv-hero-icon-box {
  width: 200px;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #eef2ff, #e0e7ff);
  border-radius: 2.5rem;
  font-size: 5rem;
  color: #6366f1;
  box-shadow: 0 20px 50px rgba(99,102,241,0.15);
  margin: 0 auto;
}

.p4y-srv-icon-box-green {
  background: linear-gradient(135deg, #ecfdf5, #d1fae5);
  color: #10b981;
  box-shadow: 0 20px 50px rgba(16,185,129,0.15);
}

.p4y-srv-icon-box-orange {
  background: linear-gradient(135deg, #fff7ed, #fed7aa);
  color: #f97316;
  box-shadow: 0 20px 50px rgba(249,115,22,0.15);
}

/* --- Hero color variants --- */
.p4y-srv-hero-green .p4y-srv-hero-badge {
  color: #059669;
  border-color: #a7f3d0;
}

.p4y-srv-hero-green .p4y-srv-badge-dot {
  background: #10b981;
}

.p4y-srv-hero-orange .p4y-srv-hero-badge {
  color: #c2410c;
  border-color: #fed7aa;
}

.p4y-srv-hero-orange .p4y-srv-badge-dot {
  background: #f97316;
}

/* --- Gradient text variants --- */
.p4y-srv-gradient-green {
  background: linear-gradient(135deg, #10b981, #059669);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.p4y-srv-gradient-orange {
  background: linear-gradient(135deg, #f97316, #ea580c);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* --- Button variants --- */
.p4y-srv-btn-green {
  background: linear-gradient(135deg, #10b981, #059669);
  box-shadow: 0 8px 25px rgba(16,185,129,0.25);
}

.p4y-srv-btn-green:hover {
  background: linear-gradient(135deg, #059669, #047857);
  box-shadow: 0 12px 35px rgba(16,185,129,0.35);
}

.p4y-srv-btn-orange {
  background: linear-gradient(135deg, #f97316, #ea580c);
  box-shadow: 0 8px 25px rgba(249,115,22,0.25);
}

.p4y-srv-btn-orange:hover {
  background: linear-gradient(135deg, #ea580c, #c2410c);
  box-shadow: 0 12px 35px rgba(249,115,22,0.35);
}

/* --- Deliverables grid (Audyt UX / PageSpeed) --- */
.p4y-srv-deliverables-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  max-width: 900px;
  margin: 0 auto;
}

.p4y-srv-deliverable {
  padding: 2rem;
  background: white;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  transition: all 0.3s;
}

.p4y-srv-deliverable:hover {
  box-shadow: 0 8px 25px rgba(0,0,0,0.05);
  transform: translateY(-2px);
}

.p4y-srv-deliverable-num {
  font-size: 2rem;
  font-weight: 800;
  color: #e0e7ff;
  margin-bottom: 0.75rem;
  line-height: 1;
}

.p4y-srv-deliverable h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.5rem;
}

.p4y-srv-deliverable p {
  font-size: 0.9rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Responsive: Sub-pages --- */
@media (max-width: 640px) {
  .p4y-srv-hero-icon-box {
    width: 140px;
    height: 140px;
    font-size: 3.5rem;
    border-radius: 1.5rem;
  }

  .p4y-srv-deliverables-grid {
    grid-template-columns: 1fr;
  }
}


/* =============================================================================
   CONTACT PAGE
   ============================================================================= */

.p4y-contact-page {
  margin-left: calc(-50vw + 50%);
  width: 100vw;
  overflow: hidden;
}

/* --- Hero Header --- */
.p4y-contact-hero {
  position: relative;
  padding: 4rem 0 6rem;
  background: #f8fafc;
  border-bottom: 1px solid rgba(226, 232, 240, 0.6);
}

.p4y-contact-hero-bg {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
  background-size: 24px 24px;
  opacity: 0.5;
}

.p4y-contact-hero-fade {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6rem;
  background: linear-gradient(to top, #fff, transparent);
}

.p4y-contact-hero-badge {
  display: block;
  color: #10b981;
  font-weight: 700;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 0.5rem;
}

.p4y-contact-hero-title {
  font-size: 2.5rem;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 1.5rem;
  line-height: 1.2;
}

.p4y-contact-hero-desc {
  font-size: 1.1rem;
  color: #64748b;
  max-width: 40rem;
  margin: 0 auto;
  line-height: 1.7;
}

/* --- Main Content --- */
.p4y-contact-main {
  padding: 4rem 0;
  background: #fff;
  position: relative;
  z-index: 2;
  margin-top: -3rem;
}

/* Grid: left info + right form */
.p4y-contact-grid {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 3rem;
}

/* --- Left: Info Column --- */
.p4y-contact-info-col {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.p4y-contact-info-card {
  background: #fff;
  padding: 2rem;
  border-radius: 1rem;
  box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.08);
  border: 1px solid #f1f5f9;
  transition: border-color 0.3s ease;
}

.p4y-contact-info-card:hover {
  border-color: rgba(16, 185, 129, 0.3);
}

.p4y-contact-info-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  margin-bottom: 1.5rem;
  transition: transform 0.3s ease;
}

.p4y-contact-info-card:hover .p4y-contact-info-icon {
  transform: scale(1.1);
}

.p4y-contact-icon-green {
  background: #ecfdf5;
  color: #10b981;
}

.p4y-contact-icon-blue {
  background: #eff6ff;
  color: #3b82f6;
}

.p4y-contact-info-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.p4y-contact-info-desc {
  font-size: 0.875rem;
  color: #64748b;
  margin-bottom: 1rem;
  line-height: 1.6;
}

.p4y-contact-info-company {
  font-size: 0.875rem;
  color: #64748b;
  font-weight: 600;
  margin-bottom: 1rem;
}

.p4y-contact-info-phone {
  display: block;
  font-size: 1.125rem;
  font-weight: 700;
  color: #0f172a !important;
  margin-bottom: 0.25rem;
  transition: color 0.3s ease;
}

.p4y-contact-info-phone:hover {
  color: #10b981 !important;
}

.p4y-contact-info-email {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #64748b !important;
  transition: color 0.3s ease;
}

.p4y-contact-info-email:hover {
  color: #10b981 !important;
}

.p4y-contact-info-hours {
  font-size: 0.75rem;
  color: #94a3b8;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #f1f5f9;
}

.p4y-contact-info-nip {
  font-size: 0.75rem;
  color: #94a3b8;
  font-family: 'Courier New', monospace;
}

/* Social links */
.p4y-contact-socials {
  display: flex;
  justify-content: center;
  gap: 1rem;
  padding-top: 1rem;
}

.p4y-contact-social-link {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  background: #f8fafc;
  color: #94a3b8 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.p4y-contact-social-link:hover {
  color: #fff !important;
}

.p4y-contact-social-link:nth-child(1):hover {
  background: #3b5998;
}

.p4y-contact-social-link:nth-child(2):hover {
  background: #0077b5;
}

/* --- Right: Form Box --- */
.p4y-contact-form-col {
  min-width: 0;
}

.p4y-contact-form-box {
  background: #fff;
  border-radius: 1.5rem;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1);
  border: 1px solid #f1f5f9;
  padding: 2.5rem 3rem;
}

/* --- Contact Form Styles --- */
.p4y-contactform-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 1.5rem;
}

.p4y-contactform-form {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.p4y-contactform-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.p4y-contactform-field {
  display: flex;
  flex-direction: column;
}

.p4y-contactform-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  color: #334155;
  margin-bottom: 0.5rem;
  text-align: left !important;
}

.p4y-contactform-input,
.p4y-contactform-select,
.p4y-contactform-textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  font-size: 0.9rem;
  font-family: 'Inter', sans-serif;
  color: #334155;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
  outline: none;
}

.p4y-contactform-input:focus,
.p4y-contactform-select:focus,
.p4y-contactform-textarea:focus {
  border-color: #10b981;
  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.15);
}

.p4y-contactform-input::placeholder,
.p4y-contactform-textarea::placeholder {
  color: #94a3b8;
}

.p4y-contactform-textarea {
  resize: none;
  min-height: 120px;
}

.p4y-contactform-file {
  padding: 0.75rem 1rem;
  background: #f8fafc;
  border: 1px dashed #e2e8f0;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  color: #64748b;
  cursor: pointer;
}

.p4y-contactform-file:hover {
  border-color: #10b981;
}

/* GDPR consent styling override */
.p4y-contactform .gdpr_module,
.p4y-contact-form-box .gdpr_module {
  margin-top: 0.5rem;
}

.p4y-contactform .gdpr_module label,
.p4y-contact-form-box .gdpr_module label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.5;
}

.p4y-contactform .gdpr_module input[type="checkbox"],
.p4y-contact-form-box .gdpr_module input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin-top: 0.125rem;
  flex-shrink: 0;
  accent-color: #10b981;
}

/* Submit button */
.p4y-contactform-footer {
  display: flex;
  justify-content: flex-start;
}

.p4y-contactform-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 1rem 2rem;
  background: #0f172a;
  color: #fff;
  font-weight: 700;
  font-size: 0.95rem;
  border-radius: 0.75rem;
  border: none;
  cursor: pointer;
  transition: background 0.3s ease;
  font-family: 'Inter', sans-serif;
}

.p4y-contactform-submit:hover {
  background: #10b981;
}

.p4y-contactform-submit i {
  font-size: 0.85rem;
}

/* Notifications */
.p4y-contactform-notification {
  padding: 1rem 1.5rem;
  border-radius: 0.75rem;
  margin-bottom: 1rem;
  font-size: 0.875rem;
}

.p4y-contactform-notification ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-notif-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #dc2626;
}

.p4y-notif-success {
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #059669;
}

/* --- Process / How We Work Section --- */
.p4y-contact-process {
  margin-top: 5rem;
  padding-top: 4rem;
  border-top: 1px solid #f1f5f9;
}

.p4y-contact-process-header {
  text-align: center;
  margin-bottom: 3rem;
}

.p4y-contact-process-header h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.p4y-contact-process-header p {
  color: #64748b;
  font-size: 0.95rem;
}

.p4y-contact-process-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  text-align: center;
  position: relative;
}

/* Connecting line (desktop) */
.p4y-contact-process-line {
  display: none;
}

@media (min-width: 769px) {
  .p4y-contact-process-line {
    display: block;
    position: absolute;
    top: 3rem;
    left: 20%;
    right: 20%;
    height: 2px;
    background: linear-gradient(to right, #e2e8f0, rgba(16, 185, 129, 0.3), #e2e8f0);
    z-index: 0;
  }
}

.p4y-contact-process-step {
  position: relative;
  z-index: 1;
}

.p4y-contact-step-circle {
  width: 6rem;
  height: 6rem;
  border-radius: 9999px;
  background: #fff;
  border: 2px solid #f1f5f9;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
  font-size: 1.75rem;
  color: #94a3b8;
  position: relative;
  transition: all 0.3s ease;
}

.p4y-contact-process-step:hover .p4y-contact-step-circle {
  border-color: #10b981;
  box-shadow: 0 0 20px rgba(16, 185, 129, 0.3);
}

.p4y-contact-process-step:hover .p4y-contact-step-circle i {
  color: #10b981;
}

.p4y-contact-process-step:nth-child(3):hover .p4y-contact-step-circle {
  border-color: #3b82f6;
  box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
}

.p4y-contact-process-step:nth-child(3):hover .p4y-contact-step-circle i {
  color: #3b82f6;
}

.p4y-contact-step-num {
  position: absolute;
  top: -0.5rem;
  right: -0.5rem;
  width: 2rem;
  height: 2rem;
  background: #0f172a;
  color: #fff;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 700;
  border: 2px solid #fff;
}

.p4y-contact-process-step h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.5rem;
}

.p4y-contact-process-step p {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  padding: 0 1rem;
}

/* --- Responsive: Contact Page --- */
@media (max-width: 1024px) {
  .p4y-contact-grid {
    grid-template-columns: 1fr;
  }

  .p4y-contact-info-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
  }

  .p4y-contact-socials {
    grid-column: 1 / -1;
  }

  .p4y-contact-form-box {
    padding: 2rem;
  }
}

@media (max-width: 768px) {
  .p4y-contact-hero {
    padding: 3rem 0 5rem;
  }

  .p4y-contact-hero-title {
    font-size: 2rem;
  }

  .p4y-contact-hero-desc {
    font-size: 1rem;
  }

  .p4y-contact-info-col {
    grid-template-columns: 1fr;
  }

  .p4y-contactform-row {
    grid-template-columns: 1fr;
  }

  .p4y-contact-form-box {
    padding: 1.5rem;
    border-radius: 1rem;
  }

  .p4y-contact-process-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .p4y-contact-step-circle {
    width: 5rem;
    height: 5rem;
    font-size: 1.5rem;
  }

  .p4y-contactform-submit {
    width: 100%;
  }
}

/* ===================================================================
   CHECKOUT PAGE - Presta4You
   =================================================================== */

/* --- Checkout Page Layout --- */
.p4y-checkout-page {
  padding: 2rem 0 4rem;
  background: #f8fafc;
  min-height: 60vh;
}

.p4y-checkout-header {
  margin-bottom: 2rem;
}

.p4y-checkout-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1e293b;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.5rem;
}

.p4y-checkout-title i {
  color: #44c27a;
  font-size: 1.5rem;
}

.p4y-checkout-breadcrumb {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #94a3b8;
}

.p4y-checkout-breadcrumb a {
  color: #64748b !important;
  text-decoration: none;
}

.p4y-checkout-breadcrumb a:hover {
  color: #44c27a !important;
}

.p4y-checkout-breadcrumb-active {
  color: #44c27a;
  font-weight: 600;
}

.p4y-checkout-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 2rem;
  align-items: start;
}

/* --- Checkout Steps --- */
.p4y-step {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  margin-bottom: 1rem;
  overflow: hidden;
  transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

.p4y-step.-current {
  border-color: #44c27a;
  box-shadow: 0 4px 20px rgba(68, 194, 122, 0.1);
}

.p4y-step.-complete {
  border-color: #e2e8f0;
  background: #f8fafc;
}

.p4y-step.-complete .p4y-step-header {
  cursor: pointer;
}

.p4y-step-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  position: relative;
}

.p4y-step-number-wrap {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1rem;
  flex-shrink: 0;
  background: #f1f5f9;
  color: #64748b;
  transition: all 0.3s ease;
}

.p4y-step.-current .p4y-step-number-wrap {
  background: #44c27a;
  color: #fff;
}

.p4y-step.-complete .p4y-step-number-wrap {
  background: #e2e8f0;
  color: #475569;
}

.p4y-step .p4y-step-check {
  display: none;
}

.p4y-step.-complete .p4y-step-check {
  display: block;
}

.p4y-step.-complete .p4y-step-number {
  display: none;
}

.p4y-step-title {
  font-size: 1.1rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0;
  flex: 1;
}

.p4y-step.-complete .p4y-step-title {
  color: #64748b;
}

.p4y-step-edit {
  display: none;
  font-size: 0.85rem;
  color: #64748b !important;
  cursor: pointer;
  transition: color 0.2s;
  white-space: nowrap;
}

.p4y-step-edit:hover {
  color: #44c27a !important;
}

.p4y-step.-complete.-reachable .p4y-step-edit {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}

/* Step content */
.p4y-step .p4y-step-content {
  padding: 0 1.5rem 1.5rem;
}

.p4y-step:not(.-current) .p4y-step-content {
  display: none;
}

.p4y-step.-current .p4y-step-content {
  display: block;
}

/* --- Checkout Forms Styling --- */
.p4y-checkout-page .form-group {
  margin-bottom: 1.25rem;
}

.p4y-checkout-page .form-control,
.p4y-checkout-page input[type="text"],
.p4y-checkout-page input[type="email"],
.p4y-checkout-page input[type="password"],
.p4y-checkout-page input[type="tel"],
.p4y-checkout-page input[type="number"],
.p4y-checkout-page select,
.p4y-checkout-page textarea {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  color: #1e293b;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%;
  box-sizing: border-box;
}

.p4y-checkout-page .form-control:focus,
.p4y-checkout-page input:focus,
.p4y-checkout-page select:focus,
.p4y-checkout-page textarea:focus {
  border-color: #44c27a;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.15);
  outline: none;
}

.p4y-checkout-page label {
  font-size: 0.875rem;
  font-weight: 500;
  color: #475569;
  margin-bottom: 0.375rem;
}

/* Checkbox custom */
.p4y-checkout-page .custom-checkbox input[type="checkbox"] + span {
  border-color: #cbd5e1;
  border-radius: 0.375rem;
}

.p4y-checkout-page .custom-checkbox input[type="checkbox"]:checked + span {
  background: #44c27a;
  border-color: #44c27a;
}

/* Buttons in checkout steps */
.p4y-checkout-page .btn-primary,
.p4y-checkout-page .continue {
  background: #44c27a !important;
  border-color: #44c27a !important;
  color: #fff !important;
  border-radius: 0.75rem;
  padding: 0.75rem 2rem;
  font-weight: 600;
  font-size: 0.95rem;
  transition: all 0.2s ease;
  text-transform: none;
  letter-spacing: 0;
}

.p4y-checkout-page .btn-primary:hover,
.p4y-checkout-page .continue:hover {
  background: #38a569 !important;
  border-color: #38a569 !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(68, 194, 122, 0.3);
}

/* Radio buttons / delivery options */
.p4y-checkout-page .delivery-option {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 1rem;
  margin-bottom: 0.75rem;
  transition: border-color 0.2s, box-shadow 0.2s;
  background: #fff;
}

.p4y-checkout-page .delivery-option:hover {
  border-color: #44c27a;
}

.p4y-checkout-page .delivery-option label {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

/* Payment options */
.p4y-checkout-page .payment-option {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  margin-bottom: 0.75rem;
  background: #fff;
  transition: border-color 0.2s;
}

.p4y-checkout-page .payment-option:hover {
  border-color: #44c27a;
}

/* Conditions to approve */
.p4y-checkout-page .condition-label {
  font-size: 0.85rem;
  color: #64748b;
}

.p4y-checkout-page .condition-label a {
  color: #44c27a !important;
  text-decoration: underline;
}

/* --- Cart Summary Sidebar --- */
.p4y-checkout-summary {
  position: sticky;
  top: 6rem;
}

.p4y-summary-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
}

.p4y-summary-header {
  background: linear-gradient(135deg, #44c27a, #38a569);
  padding: 1rem 1.5rem;
  border-radius: 1rem 1rem 0 0;
}

.p4y-summary-title {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.p4y-summary-body {
  padding: 1.25rem 1.5rem;
}

.p4y-summary-count {
  font-size: 0.95rem;
  color: #475569;
  font-weight: 500;
}

.p4y-summary-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.85rem;
  color: #44c27a !important;
  cursor: pointer;
  margin-top: 0.25rem;
  text-decoration: none !important;
}

.p4y-summary-toggle:hover {
  color: #38a569 !important;
}

/* Product list in summary */
.p4y-summary-product-list {
  list-style: none;
  padding: 0;
  margin: 1rem 0 0;
}

.p4y-summary-product-item {
  display: grid;
  grid-template-columns: 50px 1fr auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem 0;
  border-bottom: 1px solid #f1f5f9;
}

.p4y-summary-product-item:last-child {
  border-bottom: none;
}

.p4y-summary-product-img img {
  width: 50px;
  height: 50px;
  object-fit: cover;
  border-radius: 0.5rem;
  border: 1px solid #e2e8f0;
}

.p4y-summary-product-name {
  font-size: 0.85rem;
  font-weight: 500;
  color: #1e293b !important;
  text-decoration: none !important;
  display: block;
  line-height: 1.3;
}

.p4y-summary-product-qty {
  font-size: 0.8rem;
  color: #94a3b8;
}

.p4y-summary-product-attr {
  font-size: 0.75rem;
  color: #94a3b8;
}

.p4y-summary-product-price {
  font-size: 0.9rem;
  font-weight: 600;
  color: #1e293b;
  white-space: nowrap;
}

/* Subtotals */
.p4y-summary-subtotals {
  padding-top: 1rem;
  border-top: 1px solid #f1f5f9;
}

.p4y-summary-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.4rem 0;
}

.p4y-summary-line-label {
  font-size: 0.9rem;
  color: #64748b;
}

.p4y-summary-line-value {
  font-size: 0.9rem;
  font-weight: 600;
  color: #1e293b;
}

/* Totals */
.p4y-summary-totals {
  padding: 1rem 1.5rem;
  border-top: 2px solid #e2e8f0;
  background: #f8fafc;
}

.p4y-summary-total .p4y-summary-line-label {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1e293b;
}

.p4y-summary-total .p4y-summary-line-value {
  font-size: 1.25rem;
  font-weight: 700;
  color: #44c27a;
}

.p4y-summary-tax .p4y-summary-line-label,
.p4y-summary-tax .p4y-summary-line-value {
  font-size: 0.8rem;
  color: #94a3b8;
  font-weight: 400;
}

/* Voucher / Promo code */
.p4y-summary-voucher {
  padding: 1rem 1.5rem;
  border-top: 1px solid #e2e8f0;
}

.p4y-voucher-list {
  list-style: none;
  padding: 0;
  margin: 0 0 0.75rem;
}

.p4y-voucher-remove {
  color: #ef4444 !important;
  margin-left: 0.5rem;
  font-size: 0.8rem;
}

.p4y-promo-link {
  font-size: 0.9rem;
  color: #44c27a !important;
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  text-decoration: none !important;
}

.p4y-promo-link:hover {
  color: #38a569 !important;
}

.p4y-promo-form-wrap {
  margin-top: 0.75rem;
}

.p4y-promo-form {
  display: flex;
  gap: 0.5rem;
}

.p4y-promo-input {
  flex: 1;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.85rem;
}

.p4y-promo-input:focus {
  border-color: #44c27a;
  outline: none;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.15);
}

.p4y-promo-btn {
  background: #44c27a;
  color: #fff;
  border: none;
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  transition: background 0.2s;
}

.p4y-promo-btn:hover {
  background: #38a569;
}

.p4y-promo-cancel {
  font-size: 0.8rem;
  color: #94a3b8 !important;
  margin-top: 0.5rem;
  display: inline-block;
}

.p4y-promo-available {
  margin-top: 0.75rem;
}

.p4y-promo-available-label {
  font-size: 0.85rem;
  color: #64748b;
  margin-bottom: 0.25rem;
}

.p4y-promo-available-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.p4y-promo-available-list li {
  font-size: 0.85rem;
  color: #475569;
  padding: 0.25rem 0;
}

.p4y-promo-code {
  background: #f0fdf4;
  color: #44c27a;
  font-weight: 600;
  padding: 0.15rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.8rem;
  margin-right: 0.25rem;
}

/* --- Checkout Footer --- */
.p4y-checkout-footer {
  padding: 2rem 0;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  margin-top: 2rem;
}

.p4y-checkout-footer-inner {
  text-align: center;
}

.p4y-checkout-tos {
  display: block;
  font-size: 0.8rem;
  color: #94a3b8;
  margin-bottom: 0.5rem;
}

.p4y-checkout-tos a {
  color: #44c27a !important;
}

.p4y-checkout-footer-copy {
  font-size: 0.8rem;
  color: #94a3b8;
}

/* --- Address cards --- */
.p4y-checkout-page .address-item {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 1rem;
  transition: border-color 0.2s;
}

.p4y-checkout-page .address-item:hover {
  border-color: #44c27a;
}

.p4y-checkout-page .address-item.selected {
  border-color: #44c27a;
  background: #f0fdf4;
}

/* Override classic theme material icons */
.p4y-checkout-page .material-icons {
  display: none !important;
}

/* Override classic card styles */
.p4y-checkout-page .card {
  border: none;
  box-shadow: none;
  background: transparent;
}

.p4y-checkout-page .card-block {
  padding: 0;
}

/* --- Responsive --- */
@media (max-width: 991px) {
  .p4y-checkout-grid {
    grid-template-columns: 1fr;
  }

  .p4y-checkout-summary {
    position: static;
  }
}

@media (max-width: 767px) {
  .p4y-checkout-page {
    padding: 1rem 0 2rem;
  }

  .p4y-checkout-title {
    font-size: 1.35rem;
  }

  .p4y-step-header {
    padding: 1rem;
  }

  .p4y-step .p4y-step-content {
    padding: 0 1rem 1rem;
  }

  .p4y-step-number-wrap {
    width: 2rem;
    height: 2rem;
    font-size: 0.85rem;
  }

  .p4y-step-title {
    font-size: 0.95rem;
  }

  .p4y-summary-body {
    padding: 1rem;
  }

  .p4y-summary-totals {
    padding: 1rem;
  }

  .p4y-summary-voucher {
    padding: 1rem;
  }
}

/* ===================================================================
   CMS PAGE: MODUŁ NA ZAMÓWIENIE
   =================================================================== */

.p4y-custmod-page {
  background: #fff;
}

/* --- Hero --- */
.p4y-custmod-hero {
  position: relative;
  padding: 5rem 0 4rem;
  text-align: center;
  overflow: hidden;
  background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 50%, #f5f3ff 100%);
}

.p4y-custmod-hero-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.p4y-custmod-blob {
  position: absolute;
  border-radius: 50%;
  opacity: 0.4;
  filter: blur(60px);
}

.p4y-custmod-blob-1 {
  width: 400px;
  height: 400px;
  background: #c4b5fd;
  top: -100px;
  right: -100px;
  animation: pulse 3s ease-in-out infinite;
}

.p4y-custmod-blob-2 {
  width: 300px;
  height: 300px;
  background: #a78bfa;
  bottom: -80px;
  left: -80px;
}

.p4y-custmod-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.85rem;
  border-radius: 9999px;
  background: #fff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  font-size: 0.8rem;
  font-weight: 700;
  color: #64748b;
  margin-bottom: 1.5rem;
}

.p4y-custmod-badge-dot {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #7c3aed;
  animation: pulse 2s ease-in-out infinite;
}

.p4y-custmod-hero-title {
  font-size: 2.75rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 1.5rem;
}

@media (min-width: 768px) {
  .p4y-custmod-hero-title {
    font-size: 3.5rem;
  }
}

.p4y-custmod-gradient-text {
  background-image: linear-gradient(to right, #8b5cf6, #a855f7);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.p4y-custmod-hero-desc {
  font-size: 1.1rem;
  color: #64748b;
  max-width: 36rem;
  margin: 0 auto;
  line-height: 1.7;
}

/* --- Section title --- */
.p4y-custmod-section-title {
  font-size: 2rem;
  font-weight: 800;
  color: #0f172a;
  text-align: center;
  margin-bottom: 3rem;
  letter-spacing: -0.02em;
}

@media (min-width: 768px) {
  .p4y-custmod-section-title {
    font-size: 2.5rem;
  }
}

/* --- Features grid --- */
.p4y-custmod-features {
  padding: 5rem 0;
  background: #f8fafc;
}

.p4y-custmod-features-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}

@media (min-width: 768px) {
  .p4y-custmod-features-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .p4y-custmod-features-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.p4y-custmod-feature-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  padding: 2rem 1.5rem;
  transition: all 0.3s ease;
  text-align: center;
}

.p4y-custmod-feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(124, 58, 237, 0.08);
  border-color: #c4b5fd;
}

.p4y-custmod-feature-icon {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  margin-bottom: 1.25rem;
}

.p4y-custmod-feature-card h3 {
  font-size: 1.05rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 0.75rem;
}

.p4y-custmod-feature-card p {
  font-size: 0.9rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Process --- */
.p4y-custmod-process {
  padding: 5rem 0;
}

.p4y-custmod-process-steps {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}

@media (min-width: 768px) {
  .p4y-custmod-process-steps {
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
  }
}

.p4y-custmod-step {
  text-align: center;
  position: relative;
  padding: 0 1rem;
}

.p4y-custmod-step-num {
  font-size: 2.5rem;
  font-weight: 800;
  background-image: linear-gradient(to bottom, #8b5cf6, #c4b5fd);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 1rem;
  line-height: 1;
}

.p4y-custmod-step-line {
  display: none;
}

@media (min-width: 768px) {
  .p4y-custmod-step-line {
    display: block;
    position: absolute;
    top: 2.75rem;
    right: -50%;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, #c4b5fd, #e2e8f0);
    z-index: 0;
  }

  .p4y-custmod-step:last-child .p4y-custmod-step-line {
    display: none;
  }
}

.p4y-custmod-step h3 {
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 0.5rem;
}

.p4y-custmod-step p {
  font-size: 0.85rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Contact form section --- */
.p4y-custmod-contact {
  padding: 5rem 0;
  background: #f8fafc;
}

.p4y-custmod-contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: start;
}

@media (min-width: 1024px) {
  .p4y-custmod-contact-grid {
    grid-template-columns: 1fr 1.2fr;
  }
}

.p4y-custmod-contact-info h2 {
  font-size: 2rem;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
  margin: 0 0 1.25rem;
}

@media (min-width: 768px) {
  .p4y-custmod-contact-info h2 {
    font-size: 2.25rem;
  }
}

.p4y-custmod-contact-info > p {
  font-size: 1rem;
  color: #64748b;
  line-height: 1.7;
  margin-bottom: 2rem;
}

.p4y-custmod-contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.p4y-custmod-contact-list li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.95rem;
  color: #475569;
  font-weight: 500;
}

.p4y-custmod-contact-list li i {
  width: 2rem;
  height: 2rem;
  background: #ede9fe;
  color: #7c3aed;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  flex-shrink: 0;
}

/* Form */
.p4y-custmod-form-wrap {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1.25rem;
  padding: 2rem;
  box-shadow: 0 8px 30px rgba(0,0,0,0.05);
}

.p4y-custmod-form-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 1rem;
}

@media (min-width: 640px) {
  .p4y-custmod-form-row {
    grid-template-columns: 1fr 1fr;
  }
}

.p4y-custmod-form-group {
  display: flex;
  flex-direction: column;
}

.p4y-custmod-form-full {
  margin-bottom: 1rem;
}

.p4y-custmod-form-group label {
  font-size: 0.85rem;
  font-weight: 600;
  color: #475569;
  margin-bottom: 0.375rem;
}

.p4y-custmod-form-group label span {
  color: #ef4444;
}

.p4y-custmod-form-group input,
.p4y-custmod-form-group textarea {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  color: #1e293b;
  background: #fafbfc;
  transition: border-color 0.2s, box-shadow 0.2s;
  font-family: 'Inter', sans-serif;
  width: 100%;
  box-sizing: border-box;
}

.p4y-custmod-form-group input:focus,
.p4y-custmod-form-group textarea:focus {
  border-color: #8b5cf6;
  box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.15);
  outline: none;
  background: #fff;
}

.p4y-custmod-form-group input::placeholder,
.p4y-custmod-form-group textarea::placeholder {
  color: #94a3b8;
}

.p4y-custmod-form-consent {
  margin-bottom: 1.25rem;
}

.p4y-custmod-form-consent label {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.8rem;
  color: #64748b;
  cursor: pointer;
  line-height: 1.5;
}

.p4y-custmod-form-consent input[type="checkbox"] {
  margin-top: 0.2rem;
  accent-color: #7c3aed;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
}

.p4y-custmod-form-consent a {
  color: #7c3aed !important;
  text-decoration: underline;
}

.p4y-custmod-form-submit {
  width: 100%;
  padding: 0.85rem 2rem;
  background: linear-gradient(135deg, #7c3aed, #6d28d9);
  color: #fff;
  border: none;
  border-radius: 0.75rem;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: 'Inter', sans-serif;
}

.p4y-custmod-form-submit:hover {
  background: linear-gradient(135deg, #6d28d9, #5b21b6);
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(124, 58, 237, 0.3);
}

.p4y-custmod-form-submit:disabled {
  opacity: 0.7;
  cursor: wait;
  transform: none;
}

/* Messages */
.p4y-custmod-form-msg {
  padding: 0.85rem 1rem;
  border-radius: 0.75rem;
  font-size: 0.9rem;
  font-weight: 500;
  margin-bottom: 1rem;
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.p4y-custmod-msg-success {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  color: #16a34a;
}

.p4y-custmod-msg-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #dc2626;
}

/* --- Responsive --- */
@media (max-width: 767px) {
  .p4y-custmod-hero {
    padding: 3rem 0;
  }

  .p4y-custmod-hero-title {
    font-size: 2rem;
  }

  .p4y-custmod-features,
  .p4y-custmod-process,
  .p4y-custmod-contact {
    padding: 3rem 0;
  }

  .p4y-custmod-section-title {
    font-size: 1.75rem;
  }

  .p4y-custmod-form-wrap {
    padding: 1.5rem;
  }

  .p4y-custmod-contact-info h2 {
    font-size: 1.5rem;
  }
}

/* =============================================================================
   Authentication Page (login / register)
   ============================================================================= */

.p4y-auth-page {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  width: 100vw;
  overflow-x: hidden;
}

/* --- Hero --- */
.p4y-auth-hero {
  position: relative;
  padding: 3.5rem 0 2.5rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  text-align: center;
}

.p4y-auth-hero-bg,
.p4y-auth-hero-fade {
  display: none;
}

.p4y-auth-hero-title {
  font-size: 2.25rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 1rem;
  line-height: 1.2;
}

.p4y-auth-hero-desc {
  font-size: 1.05rem;
  color: #64748b;
  max-width: 36rem;
  margin: 0 auto;
  line-height: 1.7;
}

/* --- Content area --- */
.p4y-auth-content {
  padding: 3rem 0 4rem;
}

.p4y-auth-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 2rem;
  max-width: 900px;
  margin: 0 auto;
  align-items: start;
}

/* --- Cards --- */
.p4y-auth-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  overflow: hidden;
}

.p4y-auth-card-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1.25rem 1.5rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.p4y-auth-card-header i {
  font-size: 1.1rem;
  color: #44c27a !important;
}

.p4y-auth-card-header h2 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}

.p4y-auth-card-header-green {
  background: linear-gradient(135deg, #44c27a, #38a569);
  border-bottom: none;
}

.p4y-auth-card-header-green i,
.p4y-auth-card-header-green h2 {
  color: #fff !important;
}

.p4y-auth-card-body {
  padding: 1.5rem;
}

/* --- Override classic theme blue (#24b9d7) inside auth page --- */
.p4y-auth-page a {
  color: #44c27a;
}

.p4y-auth-page a:hover {
  color: #38a569;
  text-decoration: none;
}

.p4y-auth-page .btn-primary,
.p4y-auth-page .btn-primary:hover,
.p4y-auth-page .btn-primary:focus,
.p4y-auth-page .btn-primary:active {
  background-color: #44c27a !important;
  border-color: #44c27a !important;
  color: #fff !important;
  text-transform: none !important;
}

.p4y-auth-page .btn-primary:hover {
  background-color: #38a569 !important;
  border-color: #38a569 !important;
  box-shadow: 0 4px 15px rgba(68, 194, 122, 0.3) !important;
}

.p4y-auth-page .custom-checkbox input[type="checkbox"]:checked + span {
  background-color: #44c27a;
  border-color: #44c27a;
}

/* --- Override classic form styles inside auth card --- */
.p4y-auth-card .login-form .form-group {
  margin-bottom: 1.25rem;
}

.p4y-auth-card .login-form .form-group.row {
  display: flex;
  flex-direction: column;
  margin-left: 0;
  margin-right: 0;
}

.p4y-auth-card .login-form .form-control-label {
  font-size: 0.85rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.375rem;
  max-width: 100% !important;
  width: 100% !important;
  flex: 0 0 100% !important;
  padding-left: 0;
  padding-right: 0;
}

.p4y-auth-card .login-form .js-input-column {
  max-width: 100% !important;
  width: 100% !important;
  flex: 0 0 100% !important;
  padding-left: 0;
  padding-right: 0;
}

.p4y-auth-card .login-form .form-control-comment {
  display: none !important;
}

.p4y-auth-card .login-form .form-control {
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.625rem 0.875rem;
  font-size: 0.9rem;
  transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%;
}

.p4y-auth-card .login-form .form-control:focus {
  border-color: #44c27a;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.1);
  outline: none;
}

.p4y-auth-card .login-form .input-group {
  display: flex;
}

.p4y-auth-card .login-form .input-group .form-control {
  border-radius: 0.5rem 0 0 0.5rem;
}

.p4y-auth-card .login-form .input-group .input-group-btn .btn {
  border: 1px solid #e2e8f0;
  border-left: none;
  border-radius: 0 0.5rem 0.5rem 0;
  background: #f8fafc;
  color: #64748b;
  font-size: 0.8rem;
  padding: 0.625rem 0.75rem;
  cursor: pointer;
}

.p4y-auth-card .login-form .input-group .input-group-btn .btn:hover {
  background: #f1f5f9;
}

.p4y-auth-card .forgot-password {
  margin-top: -0.25rem;
  margin-bottom: 1rem;
}

.p4y-auth-card .forgot-password a {
  color: #44c27a !important;
  font-size: 0.85rem;
  text-decoration: none;
}

.p4y-auth-card .forgot-password a:hover {
  color: #38a569 !important;
  text-decoration: underline;
}

.p4y-auth-card .form-footer {
  text-align: left;
  padding: 0;
  margin: 0;
}

.p4y-auth-card #submit-login {
  display: inline-flex !important;
  align-items: center;
  gap: 0.5rem;
  background: #44c27a !important;
  background-color: #44c27a !important;
  color: #fff !important;
  border: none !important;
  border-color: #44c27a !important;
  border-radius: 0.5rem;
  padding: 0.75rem 2rem !important;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s;
  width: 100%;
  justify-content: center;
  text-transform: none !important;
}

.p4y-auth-card #submit-login:hover,
.p4y-auth-card #submit-login:focus,
.p4y-auth-card #submit-login:active {
  background: #38a569 !important;
  background-color: #38a569 !important;
  border-color: #38a569 !important;
  box-shadow: 0 4px 15px rgba(68, 194, 122, 0.3) !important;
  color: #fff !important;
}

/* --- Register CTA card --- */
.p4y-auth-register-body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.p4y-auth-register-desc {
  font-size: 0.9rem;
  color: #475569;
  margin-bottom: 1.5rem;
  line-height: 1.6;
}

.p4y-auth-register-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: #fff !important;
  color: #44c27a !important;
  border: 2px solid #44c27a !important;
  border-radius: 0.5rem;
  padding: 0.75rem 1.5rem;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none !important;
  margin-top: auto;
  width: 100%;
}

.p4y-auth-register-btn:hover {
  background: #44c27a !important;
  color: #fff !important;
  box-shadow: 0 4px 15px rgba(68, 194, 122, 0.3);
  text-decoration: none !important;
}

/* --- Responsive --- */
@media (max-width: 767px) {
  .p4y-auth-hero {
    padding: 3rem 0 2rem;
  }

  .p4y-auth-hero-title {
    font-size: 1.75rem;
  }

  .p4y-auth-grid {
    grid-template-columns: 1fr;
  }

  .p4y-auth-content {
    padding: 2rem 0 3rem;
  }
}

/* ==========================================================================
   GLOBAL PAGE & FORM OVERRIDES (all account, registration, order pages)
   ========================================================================== */

/* --- Constrain #main on account pages to container width --- */
.page-customer-account #main,
.page-my-account #main,
.page-addresses #main,
.page-order-detail #main,
.page-guest-tracking #main {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
}

/* --- Page header --- */
.page-customer-account #main > .page-header,
.page-my-account #main > .page-header,
.page-addresses #main > .page-header,
.page-order-detail #main > .page-header,
.page-guest-tracking #main > .page-header {
  margin: 0;
  padding: 2.5rem 0 2rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
  text-align: center;
}

.page-customer-account #main > .page-header h1,
.page-my-account #main > .page-header h1,
.page-addresses #main > .page-header h1,
.page-order-detail #main > .page-header h1,
.page-guest-tracking #main > .page-header h1 {
  font-size: 1.75rem;
  font-weight: 800;
  color: #0f172a;
  margin: 0;
  letter-spacing: -0.02em;
}

/* --- Page content card --- */
.page-customer-account #main .page-content,
.page-my-account #main .page-content,
.page-addresses #main .page-content,
.page-order-detail #main .page-content,
.page-guest-tracking #main .page-content {
  border: none;
  box-shadow: none;
  background: transparent;
  padding: 2rem 0;
}

/* --- Global link color override (kill classic blue #24b9d7) --- */
.page-customer-account #main a,
.page-addresses #main a,
.page-order-detail #main a,
.page-guest-tracking #main a {
  color: #44c27a;
}

.page-customer-account #main a:hover,
.page-addresses #main a:hover,
.page-order-detail #main a:hover,
.page-guest-tracking #main a:hover {
  color: #38a569;
  text-decoration: none;
}

/* --- Global btn-primary (green instead of blue) --- */
.page-customer-account #main .btn-primary,
.page-customer-account #main .btn-primary:visited,
.page-addresses #main .btn-primary,
.page-addresses #main .btn-primary:visited,
.page-order-detail #main .btn-primary,
.page-order-detail #main .btn-primary:visited,
.page-guest-tracking #main .btn-primary,
.page-guest-tracking #main .btn-primary:visited {
  background-color: #44c27a !important;
  border-color: #44c27a !important;
  color: #fff !important;
  border-radius: 0.5rem;
  padding: 0.75rem 2rem;
  font-weight: 600;
  font-size: 0.95rem;
  text-transform: none !important;
  letter-spacing: 0;
  transition: all 0.2s ease;
}

.page-customer-account #main .btn-primary:hover,
.page-customer-account #main .btn-primary:focus,
.page-customer-account #main .btn-primary:active,
.page-addresses #main .btn-primary:hover,
.page-addresses #main .btn-primary:focus,
.page-addresses #main .btn-primary:active,
.page-order-detail #main .btn-primary:hover,
.page-order-detail #main .btn-primary:focus,
.page-order-detail #main .btn-primary:active,
.page-guest-tracking #main .btn-primary:hover,
.page-guest-tracking #main .btn-primary:focus,
.page-guest-tracking #main .btn-primary:active {
  background-color: #38a569 !important;
  border-color: #38a569 !important;
  color: #fff !important;
  box-shadow: 0 4px 15px rgba(68, 194, 122, 0.3) !important;
  transform: translateY(-1px);
}

/* --- Forms: full-width inputs --- */
#main .form-group.row {
  display: flex !important;
  flex-direction: column !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 1.25rem;
}

#main .form-group.row > .form-control-label,
#main .form-group.row > label[class*="col-md"] {
  max-width: 100% !important;
  width: 100% !important;
  flex: 0 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  font-size: 0.85rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.375rem;
  text-align: left !important;
}

#main .form-group.row > .js-input-column,
#main .form-group.row > div[class*="col-md"]:not(.form-control-comment) {
  max-width: 100% !important;
  width: 100% !important;
  flex: 0 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#main .form-group.row > .form-control-comment,
#main .form-group .form-control-comment {
  display: none !important;
}

/* --- Form controls --- */
#main .form-control:not(.p4y-cart-qty-input) {
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.625rem 0.875rem;
  font-size: 0.9rem;
  transition: border-color 0.2s, box-shadow 0.2s;
  width: 100%;
  background: #fff;
  color: #0f172a;
}

#main .form-control:focus {
  border-color: #44c27a !important;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.1) !important;
  outline: none;
}

/* --- Password input group --- */
#main .input-group {
  display: flex;
}

#main .input-group .form-control {
  border-radius: 0.5rem 0 0 0.5rem;
}

#main .input-group .input-group-btn .btn {
  border: 1px solid #e2e8f0;
  border-left: none;
  border-radius: 0 0.5rem 0.5rem 0;
  background: #f8fafc !important;
  color: #64748b !important;
  font-size: 0.8rem;
  padding: 0.625rem 0.75rem;
  cursor: pointer;
  text-transform: none !important;
}

#main .input-group .input-group-btn .btn:hover {
  background: #f1f5f9 !important;
}

/* --- Custom checkbox (green instead of blue) --- */
#main .custom-checkbox input[type="checkbox"] + span {
  border: 2px solid #cbd5e1;
  border-radius: 0.25rem;
  width: 1.25rem;
  height: 1.25rem;
  transition: all 0.15s ease;
}

#main .custom-checkbox input[type="checkbox"]:checked + span {
  background-color: #44c27a !important;
  border-color: #44c27a !important;
}

/* --- Custom radio (green) --- */
#main .custom-radio input[type="radio"]:checked + span {
  border-color: #44c27a;
}

#main .custom-radio input[type="radio"]:checked + span i {
  color: #44c27a;
}

/* --- Select dropdown --- */
#main select.form-control {
  appearance: auto;
  padding-right: 2rem;
}

/* --- Form footer --- */
#main .form-footer {
  padding: 1rem 0 0;
  margin-top: 0.5rem;
  text-align: right;
}

#main .form-footer .btn {
  float: none !important;
}

/* --- Forgot password link --- */
#main .forgot-password a,
#main .send-renew-password-link,
#main .no-account a {
  color: #44c27a !important;
}

#main .forgot-password a:hover,
#main .no-account a:hover {
  color: #38a569 !important;
}

/* --- Page footer links (Back to account / Home) --- */
.page-customer-account #main .page-footer,
.page-my-account #main .page-footer,
.page-addresses #main .page-footer,
.page-order-detail #main .page-footer {
  padding: 1.5rem 0 0;
  margin-top: 1rem;
}

.page-customer-account #main .page-footer .account-link,
.page-my-account #main .page-footer .account-link,
.page-addresses #main .page-footer .account-link,
.page-order-detail #main .page-footer .account-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  color: #44c27a !important;
  font-size: 0.9rem;
  font-weight: 500;
  text-decoration: none;
  margin-right: 1.5rem;
}

.page-customer-account #main .page-footer .account-link:hover,
.page-my-account #main .page-footer .account-link:hover,
.page-addresses #main .page-footer .account-link:hover,
.page-order-detail #main .page-footer .account-link:hover {
  color: #38a569 !important;
}

.page-customer-account #main .page-footer .account-link i,
.page-my-account #main .page-footer .account-link i,
.page-addresses #main .page-footer .account-link i,
.page-order-detail #main .page-footer .account-link i {
  font-size: 1.1rem;
  color: inherit !important;
}

/* --- My Account dashboard cards --- */
.page-my-account #main .links {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.page-my-account #main .links a {
  display: block;
  padding: 0;
  margin-bottom: 0;
  text-align: left;
  text-transform: none;
  color: #334155 !important;
  font-weight: 600;
  font-size: 0.95rem;
  /* Reset Bootstrap col-* classes */
  max-width: 100% !important;
  width: 100% !important;
  flex: none !important;
}

.page-my-account #main .links a .link-item,
.page-my-account #content .links a span.link-item {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 1.25rem;
  padding: 1.5rem 1.75rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  transition: all 0.25s ease;
  height: 100%;
  min-height: 80px;
  position: relative;
  overflow: hidden;
}

.page-my-account #main .links a .link-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #44c27a;
  border-radius: 4px 0 0 4px;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.page-my-account #main .links a:hover .link-item {
  border-color: #c6f0d6;
  box-shadow: 0 8px 25px rgba(68, 194, 122, 0.12);
  transform: translateY(-3px);
}

.page-my-account #main .links a:hover .link-item::before {
  opacity: 1;
}

.page-my-account #main .links a:hover {
  color: #1e293b !important;
  text-decoration: none !important;
}

.page-my-account #main .links a i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  min-width: 3.25rem;
  border-radius: 0.75rem;
  background: linear-gradient(135deg, #f0fdf4, #dcfce7);
  color: #44c27a !important;
  font-size: 1.5rem !important;
  padding: 0;
  transition: all 0.25s ease;
}

.page-my-account #main .links a:hover i {
  background: linear-gradient(135deg, #44c27a, #38a569);
  color: #fff !important;
  transform: scale(1.05);
}

/* --- Registration form "Already have account" text --- */
#main .register-form > p {
  font-size: 0.9rem;
  color: #64748b;
  margin-bottom: 1.5rem;
}

/* --- Alert boxes --- */
#main .ps-alert-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 1.5rem;
  list-style: none;
}

#main .ps-alert-error li {
  color: #dc2626;
  font-size: 0.9rem;
}

#main .ps-alert-success {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 1.5rem;
}

/* --- Tables (order history, order-slip, etc.) --- */
.page-customer-account #main table,
.page-order-detail #main table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  overflow: hidden;
  font-size: 0.9rem;
}

.page-customer-account #main table thead th,
.page-order-detail #main table thead th {
  background: #f8fafc;
  color: #334155;
  font-weight: 600;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e2e8f0;
}

.page-customer-account #main table tbody td,
.page-order-detail #main table tbody td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #f1f5f9;
  color: #475569;
  vertical-align: middle;
}

.page-customer-account #main table tbody tr:last-child td,
.page-order-detail #main table tbody tr:last-child td {
  border-bottom: none;
}

.page-customer-account #main table tbody tr:hover,
.page-order-detail #main table tbody tr:hover {
  background: #f8fafc;
}

/* --- Address cards --- */
.page-customer-account #main .address,
.page-addresses #main .address {
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 1.25rem;
  background: #fff;
  margin-bottom: 1rem;
}

.page-customer-account #main .address .address-header,
.page-addresses #main .address .address-header {
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 0.75rem;
  font-size: 1rem;
}

.page-customer-account #main .address .address-body,
.page-addresses #main .address .address-body {
  color: #475569;
  font-size: 0.9rem;
  line-height: 1.6;
}

.page-customer-account #main .address .address-footer,
.page-addresses #main .address .address-footer {
  margin-top: 1rem;
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
}

.page-customer-account #main .address .address-footer a,
.page-addresses #main .address .address-footer a {
  font-size: 0.85rem;
  margin-right: 1rem;
}

/* --- Notifications --- */
#main .notifications .alert {
  border-radius: 0.5rem;
  border: none;
  font-size: 0.9rem;
}

/* --- Gender radio buttons (registration) --- */
#main .form-group .radio-inline {
  margin-right: 1rem;
}

/* --- Guest tracking form --- */
#main .center-email-fields {
  display: flex !important;
  flex-direction: column !important;
}

#main .center-email-fields > label[class*="col-md"] {
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding-left: 0 !important;
}

#main .center-email-fields > div[class*="col-md"],
#main .center-email-fields > .email {
  max-width: 100% !important;
  flex: 0 0 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-bottom: 1rem;
}

#main .center-email-fields .btn-primary {
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}

/* --- Sign out link on my-account --- */
.page-my-account #main .page-footer .text-sm-center {
  text-align: center !important;
  padding-top: 1rem;
}

.page-my-account #main .page-footer .text-sm-center a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #94a3b8 !important;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0.5rem 1.5rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  transition: all 0.2s ease;
}

.page-my-account #main .page-footer .text-sm-center a:hover {
  color: #ef4444 !important;
  border-color: #fecaca;
  background: #fef2f2;
}

/* --- Responsive global --- */
/* --- 2-column form layout for address & identity --- */
.js-address-form .form-fields,
.page-identity #main .page-content form > .form-fields {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 1.5rem;
}

.js-address-form .form-fields > input[type="hidden"] {
  display: none;
}

.js-address-form .form-fields > .form-group,
.page-identity #main .page-content form > .form-fields > .form-group {
  margin-bottom: 1.25rem;
}

/* Full-width fields in address form */
.js-address-form .form-fields > .form-group:has(input[name="alias"]),
.js-address-form .form-fields > .form-group:has(input[name="address1"]),
.js-address-form .form-fields > .form-group:has(input[name="address2"]) {
  grid-column: 1 / -1;
}

/* Full-width fields in identity form (email, password, new-password) */
.page-identity #main .form-fields > .form-group:has(input[type="email"]),
.page-identity #main .form-fields > .form-group:has(input[type="password"]) {
  grid-column: 1 / -1;
}

/* Address/identity form button container */
.js-address-form .form-footer,
.page-identity #main .page-content form > .form-footer {
  max-width: none !important;
  margin: 0.5rem 0 0;
}

@media (max-width: 767px) {
  .js-address-form .form-fields,
  .page-identity #main .page-content form > .form-fields {
    grid-template-columns: 1fr;
  }
}

/* Tablet landscape (≤1024px): 2 columns */
@media (max-width: 1024px) {
  .page-my-account #main .links {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}

/* Tablet portrait & small (≤767px) */
@media (max-width: 767px) {
  .page-customer-account #main > .page-header,
  .page-my-account #main > .page-header,
  .page-addresses #main > .page-header,
  .page-order-detail #main > .page-header {
    padding: 1.5rem 0 1.25rem;
  }

  .page-customer-account #main > .page-header h1,
  .page-my-account #main > .page-header h1,
  .page-addresses #main > .page-header h1,
  .page-order-detail #main > .page-header h1 {
    font-size: 1.35rem;
  }

  .page-my-account #main .links {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }

  .page-my-account #main .links a .link-item,
  .page-my-account #content .links a span.link-item {
    padding: 1rem 1.25rem !important;
    gap: 1rem !important;
    min-height: 64px !important;
    border-radius: 0.75rem;
  }

  .page-my-account #main .links a i {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    font-size: 1.25rem !important;
    border-radius: 0.625rem;
  }

  .page-my-account #main .links a {
    font-size: 0.875rem;
  }

  .page-my-account #main .page-content,
  .page-customer-account #main .page-content.card {
    padding: 1.25rem 0;
  }

  .page-my-account #main .page-footer .text-sm-center a {
    font-size: 0.85rem;
    padding: 0.4rem 1.25rem;
  }
}

/* Phone (≤480px): single column */
@media (max-width: 480px) {
  .page-my-account #main .links {
    grid-template-columns: 1fr;
    gap: 0.625rem;
  }

  .page-my-account #main .links a .link-item,
  .page-my-account #content .links a span.link-item {
    padding: 0.875rem 1rem !important;
    gap: 0.875rem !important;
    min-height: auto !important;
  }

  .page-my-account #main .links a i {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    font-size: 1.15rem !important;
    border-radius: 0.5rem;
  }

  .page-my-account #main .links a {
    font-size: 0.85rem;
  }

  .page-my-account #main .links a:hover .link-item {
    transform: none;
  }
}

/* ========================================
   P4U Modules Manager — Download Modules Page
   ======================================== */

/* --- Info banner --- */
.p4u-info-banner {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
  border: 1px solid #bbf7d0;
  border-radius: 0.75rem;
  margin-bottom: 1.5rem;
  font-size: 0.875rem;
  color: #166534;
  line-height: 1.5;
}
.p4u-info-banner i {
  font-size: 1.25rem;
  color: #44c27a;
  margin-top: 1px;
  flex-shrink: 0;
}

/* --- Section card --- */
.p4u-section {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  margin-bottom: 1.5rem;
  overflow: hidden;
}

.p4u-section-header {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 1.25rem 1.5rem;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}
.p4u-section-header h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
}
.p4u-section-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.625rem;
  background: linear-gradient(135deg, #f0fdf4, #dcfce7);
  flex-shrink: 0;
}
.p4u-section-icon i {
  font-size: 1.25rem;
  color: #44c27a;
}

.p4u-section-body {
  padding: 1.5rem;
}
.p4u-section-body-flush {
  padding: 0;
}

/* --- Domains list --- */
.p4u-domains-list {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  margin-bottom: 1.5rem;
}
.p4u-domain-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.875rem 1.125rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 0.625rem;
  transition: border-color 0.2s;
}
.p4u-domain-item:hover {
  border-color: #c6f0d6;
}
.p4u-domain-name {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  color: #0f172a;
  font-size: 0.925rem;
}
.p4u-domain-name i {
  font-size: 1.125rem;
  color: #44c27a;
}
.p4u-domain-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.p4u-domain-modules {
  display: flex;
  gap: 0.375rem;
  flex-wrap: wrap;
}
.p4u-domain-date {
  font-size: 0.8rem;
  color: #94a3b8;
}

/* --- Badges --- */
.p4u-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
}
.p4u-badge-green {
  background: #dcfce7;
  color: #166534;
}
.p4u-badge-red {
  background: #fef2f2;
  color: #dc2626;
}

/* --- Empty state --- */
.p4u-empty-state {
  text-align: center;
  padding: 2rem 1rem;
  color: #94a3b8;
}
.p4u-empty-state i {
  font-size: 2.5rem;
  margin-bottom: 0.75rem;
  color: #cbd5e1;
}
.p4u-empty-state p {
  font-size: 0.925rem;
  margin-bottom: 0;
  max-width: 400px;
  margin-left: auto;
  margin-right: auto;
}
.p4u-empty-state-full {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 1rem;
  padding: 3rem 1.5rem;
  margin-bottom: 1.5rem;
}
.p4u-empty-state-full p {
  margin-bottom: 1.5rem;
}

/* --- Add domain form --- */
.p4u-add-domain {
  border-top: 1px solid #f1f5f9;
  padding-top: 1.25rem;
}
.p4u-add-domain h4 {
  font-size: 0.95rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.75rem;
}
.p4u-input-group {
  display: flex;
  gap: 0.5rem;
  max-width: 550px;
}
.p4u-input {
  flex: 1;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.625rem 0.875rem;
  font-size: 0.9rem;
  color: #0f172a;
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.p4u-input:focus {
  border-color: #44c27a;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.1);
  outline: none;
}
.p4u-input::placeholder {
  color: #94a3b8;
}

/* --- Buttons --- */
.p4u-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.625rem 1.25rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none !important;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
  line-height: 1.4;
}
.p4u-btn i {
  font-size: 1.125rem;
}
.p4u-btn-primary {
  background: #44c27a;
  color: #fff !important;
}
.p4u-btn-primary:hover {
  background: #38a569;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(68, 194, 122, 0.3);
  transform: translateY(-1px);
}
.p4u-btn-download {
  background: #f0fdf4;
  color: #166534 !important;
  border: 1px solid #bbf7d0;
  padding: 0.5rem 1rem;
  font-size: 0.8rem;
}
.p4u-btn-download:hover {
  background: #dcfce7;
  color: #166534 !important;
  border-color: #86efac;
}
.p4u-btn-disabled {
  background: #f8fafc !important;
  color: #94a3b8 !important;
  border-color: #e2e8f0 !important;
  cursor: not-allowed;
  opacity: 0.6;
}
.p4u-btn-disabled:hover {
  transform: none;
  box-shadow: none;
}

/* --- Select --- */
.p4u-select {
  width: 100%;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  padding: 0.625rem 0.875rem;
  font-size: 0.9rem;
  color: #0f172a;
  background: #fff;
  appearance: auto;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.p4u-select:focus {
  border-color: #44c27a;
  box-shadow: 0 0 0 3px rgba(68, 194, 122, 0.1);
  outline: none;
}

/* --- Assign form --- */
.p4u-assign-row {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 1rem;
  align-items: end;
}
.p4u-assign-field label,
.p4u-assign-action label {
  display: block;
  font-size: 0.85rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.375rem;
}
.p4u-text-muted {
  color: #94a3b8;
  font-size: 0.875rem;
}
.p4u-mb-3 {
  margin-bottom: 1rem;
}

/* --- Module card (download section) --- */
.p4u-module-card {
  padding: 1.5rem;
  border-bottom: 1px solid #f1f5f9;
}
.p4u-module-card:last-child {
  border-bottom: none;
}

.p4u-module-info {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.p4u-module-icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
  background: linear-gradient(135deg, #f0fdf4, #dcfce7);
  flex-shrink: 0;
}
.p4u-module-icon-wrap i {
  font-size: 1.5rem;
  color: #44c27a;
}
.p4u-module-name {
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
}
.p4u-module-technical {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-top: 2px;
}

.p4u-module-meta-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 0.625rem;
}
.p4u-meta-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #64748b;
  margin-bottom: 0.25rem;
}
.p4u-meta-value {
  font-size: 0.9rem;
  color: #0f172a;
}
.p4u-license-code {
  font-size: 0.8rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  padding: 0.125rem 0.5rem;
  border-radius: 0.25rem;
  font-family: 'SF Mono', 'Fira Code', monospace;
  color: #334155;
  word-break: break-all;
}
.p4u-ps-lock {
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
  font-size: 0.75rem;
  color: #64748b;
}
.p4u-ps-lock i {
  font-size: 0.75rem;
}
.p4u-sub-date {
  display: block;
  font-size: 0.8rem;
  color: #64748b;
  margin-top: 0.125rem;
}
.p4u-renew-link {
  display: inline-block;
  font-size: 0.8rem;
  color: #44c27a !important;
  margin-top: 0.25rem;
}
.p4u-renew-link:hover {
  color: #38a569 !important;
}

.p4u-module-download {
  display: flex;
  align-items: center;
}
.p4u-download-buttons {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.p4u-infinity {
  font-size: 0.875rem !important;
  margin-left: 0.125rem;
}

/* --- Navigation footer --- */
.p4u-nav-footer {
  display: flex;
  gap: 1rem;
  padding-top: 1rem;
}
.p4u-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: #44c27a !important;
  font-weight: 500;
  font-size: 0.9rem;
  text-decoration: none !important;
  transition: color 0.2s;
}
.p4u-nav-link:hover {
  color: #38a569 !important;
}
.p4u-nav-link i {
  font-size: 1.125rem;
  color: inherit !important;
}

/* --- Responsive: P4U modules --- */
@media (max-width: 767px) {
  .p4u-domain-item {
    flex-direction: column;
    align-items: flex-start;
  }
  .p4u-domain-meta {
    justify-content: flex-start;
  }
  .p4u-assign-row {
    grid-template-columns: 1fr;
  }
  .p4u-module-meta-row {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }
  .p4u-input-group {
    flex-direction: column;
    max-width: 100%;
  }
  .p4u-section-header {
    padding: 1rem 1.25rem;
  }
  .p4u-section-body {
    padding: 1.25rem;
  }
  .p4u-module-card {
    padding: 1.25rem;
  }
  .p4u-download-buttons {
    flex-direction: column;
  }
  .p4u-download-buttons .p4u-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ========================================
   CMS Category Page - Service Listing
   ======================================== */

/* --- Hero Section --- */
.p4y-cat-hero {
  position: relative;
  padding: 5rem 0 4rem;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 50%, #faf5ff 100%);
  overflow: hidden;
  text-align: center;
}

.p4y-cat-hero-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.p4y-cat-hero-content {
  position: relative;
  z-index: 2;
  max-width: 700px;
  margin: 0 auto;
}

.p4y-cat-hero-content .p4y-srv-hero-badge {
  display: inline-flex;
  margin-bottom: 1.5rem;
}

.p4y-cat-hero-content .p4y-srv-hero-title {
  margin-bottom: 1.2rem;
}

.p4y-cat-hero-content .p4y-srv-hero-desc {
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
}

/* --- Service Cards Grid --- */
.p4y-cat-listing {
  padding: 4rem 0;
  background: white;
}

.p4y-cat-listing + .p4y-cat-listing {
  padding-top: 0;
}

.p4y-cat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1280px;
  margin: 0 auto;
}

/* --- Service Card --- */
.p4y-cat-card {
  display: flex;
  flex-direction: column;
  padding: 2.5rem 2rem 2rem;
  border-radius: 1rem;
  transition: all 0.3s ease;
  text-decoration: none !important;
  position: relative;
  overflow: hidden;
}

.p4y-cat-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  border-radius: 1rem 1rem 0 0;
  opacity: 0;
  transition: opacity 0.3s;
}

.p4y-cat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.08);
}

.p4y-cat-card:hover::before {
  opacity: 1;
}

/* Color variants */
.p4y-cat-color-blue {
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid #bfdbfe;
}

.p4y-cat-color-blue::before {
  background: linear-gradient(90deg, #3b82f6, #6366f1);
}

.p4y-cat-color-blue:hover {
  border-color: #93c5fd;
  box-shadow: 0 20px 40px rgba(59,130,246,0.12);
}

.p4y-cat-color-orange {
  background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 100%);
  border: 1px solid #fdba74;
}

.p4y-cat-color-orange::before {
  background: linear-gradient(90deg, #f97316, #ef4444);
}

.p4y-cat-color-orange:hover {
  border-color: #fb923c;
  box-shadow: 0 20px 40px rgba(249,115,22,0.12);
}

.p4y-cat-color-green {
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  border: 1px solid #a7f3d0;
}

.p4y-cat-color-green::before {
  background: linear-gradient(90deg, #10b981, #059669);
}

.p4y-cat-color-green:hover {
  border-color: #6ee7b7;
  box-shadow: 0 20px 40px rgba(16,185,129,0.12);
}

/* --- Card Icon --- */
.p4y-cat-card-icon {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white;
  border-radius: 0.875rem;
  font-size: 1.4rem;
  margin-bottom: 1.5rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  transition: transform 0.3s;
}

.p4y-cat-card:hover .p4y-cat-card-icon {
  transform: scale(1.08);
}

.p4y-cat-color-blue .p4y-cat-card-icon { color: #3b82f6; }
.p4y-cat-color-orange .p4y-cat-card-icon { color: #f97316; }
.p4y-cat-color-green .p4y-cat-card-icon { color: #10b981; }

/* --- Card Title --- */
.p4y-cat-card-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 0.75rem;
  line-height: 1.3;
}

/* --- Card Description --- */
.p4y-cat-card-desc {
  font-size: 0.92rem;
  color: #475569;
  line-height: 1.7;
  margin-bottom: 1.5rem;
  flex-grow: 1;
}

/* --- Card Link --- */
.p4y-cat-card-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  transition: gap 0.3s;
  margin-top: auto;
}

.p4y-cat-card:hover .p4y-cat-card-link {
  gap: 0.8rem;
}

.p4y-cat-color-blue .p4y-cat-card-link { color: #4f46e5; }
.p4y-cat-color-orange .p4y-cat-card-link { color: #ea580c; }
.p4y-cat-color-green .p4y-cat-card-link { color: #059669; }

/* --- Subcategory card style --- */
.p4y-cat-card-sub {
  background: linear-gradient(135deg, #faf5ff 0%, #eef2ff 100%);
  border: 1px solid #e0e7ff;
}

.p4y-cat-card-sub::before {
  background: linear-gradient(90deg, #8b5cf6, #6366f1);
}

.p4y-cat-card-sub:hover {
  border-color: #c4b5fd;
  box-shadow: 0 20px 40px rgba(139,92,246,0.12);
}

.p4y-cat-card-sub .p4y-cat-card-icon { color: #7c3aed; }
.p4y-cat-card-sub .p4y-cat-card-link { color: #6d28d9; }

/* --- Responsive --- */
@media (max-width: 991px) {
  .p4y-cat-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  .p4y-cat-hero {
    padding: 3.5rem 0 3rem;
  }

  .p4y-cat-listing {
    padding: 3rem 0;
  }
}

@media (max-width: 767px) {
  .p4y-cat-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
    max-width: 480px;
    margin: 0 auto;
  }

  .p4y-cat-hero {
    padding: 2.5rem 0 2rem;
  }

  .p4y-cat-hero-content .p4y-srv-hero-title {
    font-size: 1.8rem;
  }

  .p4y-cat-listing {
    padding: 2rem 0;
  }

  .p4y-cat-card {
    padding: 2rem 1.5rem 1.5rem;
  }
}

/* =============================================
   Paynow return / confirmation page
   ============================================= */
#module-paynow-return .paynow-return {
  padding: 2rem 0;
}

#module-paynow-return .paynow-return h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1e293b;
  margin-bottom: 1rem;
}

#module-paynow-return .paynow-return .order-data p {
  color: #475569;
  font-size: 1rem;
  margin-bottom: 0.75rem;
}

#module-paynow-return .btn-primary,
#module-paynow-return .btn-primary:visited,
#module-paynow-return a.btn-primary,
#module-paynow-return a.btn-primary:visited {
  background-color: #44c27a !important;
  border-color: #44c27a !important;
  color: #fff !important;
  border-radius: 0.75rem !important;
  padding: 0.75rem 2rem !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  transition: all 0.2s ease;
  display: inline-block;
}

#module-paynow-return .btn-primary:hover,
#module-paynow-return .btn-primary:focus,
#module-paynow-return .btn-primary:active,
#module-paynow-return a.btn-primary:hover,
#module-paynow-return a.btn-primary:focus,
#module-paynow-return a.btn-primary:active {
  background-color: #38a569 !important;
  border-color: #38a569 !important;
  color: #fff !important;
  box-shadow: 0 4px 15px rgba(68, 194, 122, 0.3) !important;
  transform: translateY(-1px);
  text-decoration: none !important;
}