:root {
--color-primary: #0a6a94;
--color-primary-600: #0a3552;
--color-primary-700: #082c44;
--color-primary-hover: #0b3d5e;
--color-primary-active: #095b80;
--btn-shadow: 0 6px 14px rgba(0,0,0,0.15);
--btn-shadow-hover: 0 10px 22px rgba(0,0,0,0.20);
--color-accent: #ff9800;
--color-accent-600: #f08a00;
--color-bg: #f5f7f9;
--color-surface: #ffffff;
--color-surface-2: #f8fafc;
--color-text: #1f2933;
--color-text-muted: #000000;
--color-border: #e6e9ec;
--color-success: #16a34a;
--color-warning: #f59e0b;
--color-danger: #ef4444;
--color-info: #2563eb;
--color-link: var(--color-primary);
--color-link-hover: var(--color-primary-700);
--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--text-xs: 12px;
--text-sm: 14px;
--text-md: 16px;
--text-lg: 18px;
--text-xl: 22px;
--text-2xl: 28px;
--line-height: 1.55;
--container-max: 1480px;
--container-pad: 24px;
--header-height: 72px;
--header-height-mobile: 60px;
--space-0: 0;
--space-1: 4px;
--space-2: 8px;
--space-3: 12px;
--space-4: 16px;
--space-5: 20px;
--space-6: 24px;
--space-7: 32px;
--space-8: 40px;
--space-9: 48px;
--space-10: 64px;
--radius-xs: 6px;
--radius-sm: 10px;
--radius-md: 14px;
--radius-lg: 18px;
--radius-xl: 24px;
--radius-pill: 999px;
--border-width: 1px;
--shadow-sm: 0 2px 10px rgba(0,0,0,0.06);
--shadow-md: 0 10px 30px rgba(0,0,0,0.08);
--shadow-lg: 0 18px 50px rgba(0,0,0,0.12);
--btn-height: 52px;
--btn-height-sm: 40px;
--btn-radius: var(--radius-md);
--btn-font-weight: 700;
--input-height: 46px;
--input-radius: var(--radius-md);
--input-bg: #ffffff;
--input-border: var(--color-border);
--input-border-focus: rgba(11, 61, 94, 0.45); /* primary-ish */
--input-ring: 0 0 0 4px rgba(11, 61, 94, 0.12);
--card-radius: var(--radius-lg);
--card-border: var(--color-border);
--card-shadow: var(--shadow-md);
--card-pad: 24px;
--hero-radius: var(--radius-xl);
--hero-overlay: rgba(0,0,0,0.35);
--ease: cubic-bezier(.2,.8,.2,1);
--t-fast: 120ms var(--ease);
--t: 180ms var(--ease);
--z-header: 50;
--z-modal: 100;
--z-toast: 120;
--bp-sm: 640px;
--bp-md: 820px;
--bp-lg: 1024px;
--bp-xl: 1240px;
--mobile-nav-height:68px;
--color-bg:#f3f4f6;
--color-line:#d1d5db;
--color-text:#374151;
--color-active:#16a34a;
--color-white:#ffffff;
}


*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
 margin: 0;
 font-family: var(--font-sans);
 font-size: var(--text-md);
 line-height: var(--line-height);
 color: var(--color-text);
 background: var(--color-bg);
}

img { max-width: 100%; height: auto; display: block; }

a {
 color: var(--color-link);
 text-decoration: none;
 transition: color var(--t);
}
a:hover { color: var(--color-link-hover); }

button, input, select, textarea {
 font: inherit;
}

::selection {
 background: rgba(255,152,0,0.25);
}

.h1 { font-size: var(--text-2xl); line-height: 1.2; margin: 0; }
.h2 { font-size: var(--text-xl); line-height: 1.25; margin: 0; }
.muted { color: var(--color-text-muted); }
.small { font-size: var(--text-sm); }

.section{
padding:60px 0;
}

.site-main{
padding-left:var(--container-pad);
padding-right:var(--container-pad);
}

.btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 height: var(--btn-height);
 padding: 0 var(--space-6);
 border-radius: var(--btn-radius);
 border: 0;
 cursor: pointer;
 font-weight: var(--btn-font-weight);
 transition:
 background var(--t),
 box-shadow var(--t),
 transform 120ms ease;
 user-select: none;
 letter-spacing:0.3px;
}

.btn:hover{
 transform: translateY(-1px);
}

.btn:active { transform: translateY(1px); }

.btn--primary{
 background: var(--color-primary);
 color:#fff;
 box-shadow: var(--btn-shadow);
}

.btn--primary:hover{
 background: var(--color-primary-hover);
 box-shadow: var(--btn-shadow-hover);
}

.btn--primary:active{
 background: var(--color-primary-active);
 transform: translateY(1px);
}

.btn--accent {
 background: var(--color-accent);
 color: #1b1b1b;
}
.btn--accent:hover { background: var(--color-accent-600); }

.btn--ghost {
 background: transparent;
 color: var(--color-primary);
 border: var(--border-width) solid var(--color-border);
}
.btn--ghost:hover {
 background: rgba(11, 61, 94, 0.06);
 border-color: rgba(11, 61, 94, 0.22);
}

.btn--sm {
 height: var(--btn-height-sm);
 padding: 0 var(--space-4);
 border-radius: var(--radius-sm);
 font-weight: 600;
}

.btn--block { width: 100%; }

.btn--danger{
background:var(--color-danger);
color:#fff;
}

.btn--danger:hover{
background:#dc2626;
}
.btn-catalog.btn-green {
    background: #28a745;
}

.btn-catalog.btn-green:hover {
    background: #218838;
}

.btn-catalog.btn-green:focus {
    outline-color: #28a745;
}

:focus-visible {
 outline: none;
 box-shadow: var(--input-ring);
 border-radius: var(--radius-sm);
}

.input,
.select,
.textarea {
 width: 100%;
 border: var(--border-width) solid var(--input-border);
 background: var(--input-bg);
 border-radius: var(--input-radius);
 padding: 0 var(--space-4);
 transition: border-color var(--t), box-shadow var(--t);
}

.input,
.select { height: var(--input-height); }

.textarea {
 padding: var(--space-4);
 min-height: 120px;
 resize: vertical;
}

.input:focus,
.select:focus,
.textarea:focus {
 outline: none;
 border-color: var(--input-border-focus);
 box-shadow: var(--input-ring);
}

#sort{
scroll-margin-top:90px;
}

.container,
.header-inner{
 max-width: var(--container-max);
 margin: 0 auto;
 padding-left: var(--container-pad);
 padding-right: var(--container-pad);
}
.container-full
{
 max-width: var(--container-max);
 margin: 0 auto;
}

@media (max-width: 820px) {
 :root {
 --container-pad: 8px;
 --card-pad: 18px;
 --btn-height: 46px;
 --input-height: 44px;
 }
 .section { padding-top: var(--space-8); padding-bottom: var(--space-8); }
}

.site-header{
position:sticky;
top:0;
z-index:1000;
background:#fff;
border-bottom:1px solid var(--color-border);
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.header-inner{
max-width:var(--container-max);
margin:0 auto;
padding:0 var(--container-pad);
height:var(--header-height);
transition:height .25s ease;
display:grid;
grid-template-columns:auto auto 1fr auto;
align-items:center;
gap:20px;
position:relative;
}

.site-header.shrink .header-inner{
height:56px;
}

.logo{
display:flex;
align-items:center;
text-decoration:none;
font-family:"Segoe UI", system-ui, sans-serif;
font-size:32px;
font-weight:500;
transform:scaleX(0.8);
transform-origin:left;
letter-spacing:2px;
color:#5e7380;
grid-column:1;
transition:transform .25s ease;
}

.site-header.shrink .logo{
transform:scale(.85) scaleX(.8);
}

.logo-text{
font-weight:500;
}

.logo-mark{
font-size:44px;
line-height:1;

position:relative;
top:-4px;

color:#cccccc;
}

.header-nav{
display:flex;
justify-content:center;
gap:28px;
grid-column:2;
padding-left:80px;
}

.header-nav a{
text-decoration:none;
color:var(--color-text);
font-size:15px;
}

.header-right{
display:flex;
align-items:center;
gap:14px;
margin-left:auto;
grid-column:4;
justify-self:end;
}

.header-cart-btn{
display:flex;
align-items:center;
gap:8px;
background:var(--color-primary);
color:#fff;
padding:10px 18px;
border-radius:10px;
font-weight:600;
text-decoration:none;
position:relative;
}

.header-cart-btn:hover{
background:var(--color-primary-hover);
color:#fff;
}

.header-cart-btn .cart-count {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #e53935;
  color: #fff;
  font-size: 11px;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px #fff;
}

.header-account{
display:flex;
align-items:center;
justify-content:center;
width:40px;
height:40px;
border-radius:8px;
}

.header-account:hover{
background:#f5f7f9;
}

.header-account .icon{
width:24px;
height:24px;
stroke:var(--color-primary);
stroke-width:2;
fill:none;
}

.header-search{
position:relative;
}

.search-input{
height:48px;
padding:0 56px 0 16px;
border-radius:12px;
border:1px solid var(--color-border);
background:#f5f7f9;
font-size:16px;
outline:none;
}

.search-input:focus{
border-color:var(--color-primary);
background:#fff;
}

.search-btn{
position:absolute;
right:8px;
top:50%;
transform:translateY(-50%);
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
border-radius:10px;
background:none;
border:0;
cursor:pointer;
}

.search-icon{
width:20px;
height:20px;
stroke:var(--color-primary);
stroke-width:2;
fill:none;
stroke-linecap:round;
stroke-linejoin:round;
}

.header-contact{
text-decoration:none;
color:var(--color-text);
font-size:15px;
margin-right:10px;
margin-left:20px;
display:none;
}

@media (max-width:900px){

.header-search.open{
border-top:1px solid var(--color-border);
position:absolute;
top:100%;
left:0;
right:0;
width:100%;
padding:12px var(--container-pad);
background:#fff;
box-shadow:0 10px 25px rgba(0,0,0,0.12);
}

.header-search.open .search-input{
height:44px;
font-size:16px;
display:block;
width:100%;
padding:10px 44px 10px 16px;
}

}
.header-search{
min-width:40px;
}

@media (max-width:900px){

.search-input{
display:none;
}

}

.mobile-nav{
position:fixed;
bottom:0;
left:0;
right:0;
height:68px;
background:#ffffff;
border-top:1px solid #e6e9ec;
display:grid;
grid-template-columns:repeat(5,1fr);
align-items:center;
padding-bottom:env(safe-area-inset-bottom);
z-index:999;
}

.mobile-item{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
text-decoration:none;
color:#1f2933;
font-size:11px;
font-weight:500;
}

.mobile-item span{
margin-top:4px;
}

.mobile-nav .icon{
width:26px;
height:26px;
stroke:var(--color-primary);
stroke-width:2;
fill:none;
stroke-linecap:round;
stroke-linejoin:round;
}

.mobile-cart .cart-count{
  position: absolute;
  top: -6px;
  right: -6px;
  background: #e53935;
  color: #fff;
  font-size: 11px;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px #fff;
}

.cart-count:empty{
display:none;
}

.mobile-item.active{
color:var(--color-primary);
}

.mobile-item.active .icon{
stroke:var(--color-primary);
}

.mobile-cart.has-items .icon{
stroke:#ff6a00;
}
.mobile-icon-wrap{
position:relative;
display:flex;
align-items:center;
justify-content:center;
}

@media (max-width:1200px){

.header-nav{
padding-left:0;
}
}

@media (max-width:1100px){

.header-nav{
display:none;
}
.header-inner{

grid-template-columns:auto auto 1fr auto;

}

.header-contact{
display:block;
}

}
@media (max-width:900px){

.search-input{
display:none;
}

.header-search{
width:40px;
}

}
@media (max-width:668px){

.header-cart-btn{
display:none;
}

.header-account{
display:none;
}

.header-contact{
display:none;
}

.header-nav{
display:none;
}

.header-inner{
height:var(--header-height-mobile);
}

.site-header{
position:fixed;
top:0;
left:0;
right:0;

transition:transform .25s ease;
}

.site-header.hide{
transform:translateY(-100%);
}

}

@media (min-width:668px){

.mobile-nav{
display:none;
}

}

.hero{
background:linear-gradient(135deg,#2f3b52,#5f6b7a);
padding:60px 20px;
color:#fff;
}

.hero-container{
max-width:1200px;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:100px;
align-items:center;
}

.hero-text h1{
font-size:38px;
line-height:1.2;
margin-bottom:20px;
}

.hero-subtitle{
font-size:18px;
color:rgba(255,255,255,0.9);
margin-bottom:30px;
}

.btn-primary{
display:inline-block;
padding:14px 26px;
background:#fff;
color:#0a3552;
border-radius:10px;
font-weight:600;
text-decoration:none;
margin-bottom:30px;
}

.hero-benefits{
display:flex;
gap:30px;
font-size:15px;
opacity:0.9;
}

.hero-benefits li{
list-style:none;
}

.hero-image img{
width:100%;
border-radius:16px;
box-shadow:0 20px 40px rgba(0,0,0,0.25);
}
@media (max-width:900px){

.hero-container{
grid-template-columns:1fr;
gap:40px;
}

.hero-text h1{
font-size:32px;
}

.hero-benefits{
display:flex;
flex-direction:column;
gap:10px;
align-items:flex-start;
margin:0;
padding:0;
}

.hero-benefits li{
list-style:none;
display:flex;
align-items:center;
gap:8px;
}

}

.check{
font-weight:700;
}


.category-cta{
display:flex;
justify-content:center;
text-align:center;
}

.sub-category-cta{
display:flex;
justify-content:flex-start;
text-align:left;
width:fit-content;
margin:20px 0;
}
@media (max-width:668px){
.sub-category-cta{
width:100%;
display: block;
}
}

.category-grid-2{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:22px;
}

@media (max-width:1000px){
.category-grid-2{
grid-template-columns:repeat(2,1fr);
}
}

@media (max-width:640px){
.category-grid-2{
grid-template-columns:1fr;
gap:12px;
}
}

.category-cta-2{
background:#fff;
border-radius:12px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
transition:all .2s ease;
}

.category-cta-2-link{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
padding:32px 20px;
font-size:16px;
font-weight:500;
color:var(--color-primary);
text-decoration:none;
height:100%;
}

.category-cta-2:hover{
transform:translateY(-2px);
box-shadow:0 8px 20px rgba(0,0,0,0.08);
}

@media (max-width:640px){

.category-cta-2-link{
padding:16px 16px;
font-size:15px;
}

}

.category-dropdown{
position:relative;
margin:0 auto;
text-align:left;
}

.category-dropdown-btn{
width:100%;
background:var(--color-primary);
color:#fff;
padding:14px 22px;
border-radius:12px;
border:none;
font-size:16px;
font-weight:600;
cursor:pointer;
box-shadow:var(--btn-shadow);
display:flex;
align-items:center;
justify-content:center;
gap:8px;
}

.dropdown-arrow{
width:16px;
height:16px;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' stroke='white' fill='none' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' stroke-width='2'/%3E%3C/svg%3E") center no-repeat;
}

.category-dropdown-menu{
position:absolute;
top:110%;
left:0;
background:#fff;
border-radius:12px;
box-shadow:0 20px 40px rgba(0,0,0,0.15);
min-width:260px;
padding:10px 0;
display:none;
z-index:100;
width:100%;
max-height:420px;
overflow-y:auto;
}

.category-dropdown-menu.open{
display:block;
}

.category-dropdown-menu.open-up{
top:auto;
bottom:110%;
}

.dropdown-item{
display:block;
padding:12px 20px;
color:var(--color-text);
text-decoration:none;
}

.dropdown-item:hover{
background:#f5f7f9;
}
.category-dropdown-menu.open{
display:block;
}

.section-categories{
background:#f5f7f9;
}

.category-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;

}
@media (max-width:1000px){

.category-grid{
grid-template-columns:repeat(3,1fr);
gap:8px;
}

}

@media (max-width:640px){

.category-grid{
grid-template-columns:repeat(2,1fr);

}

.category-card{
padding:16px;
}

}

.category-card{
display:flex;
flex-direction:column;
background:#fff;
border-radius:14px;
padding:10px;
text-decoration:none;
color:var(--color-text);
box-shadow:0 6px 18px rgba(0,0,0,0.06);
border:1px solid var(--color-border);
height:100%;
cursor:pointer;
transition:
box-shadow .25s ease,
border-color .25s ease;
}
.category-card:hover .category-card-image img{
transform:scale(1.06);
transition:all .2s ease;
}

.category-card-title{
font-size:18px;
font-weight:600;
margin-top:0;
margin-bottom:4px;
}


.category-card-content{
display:flex;
flex-direction:column;
flex-grow:1;
}

.category-card-btn{ 
display:block;
text-align:center;
padding:10px 16px;
border:1px solid var(--color-primary);
border-radius:8px;
text-decoration:none;
color:var(--color-primary);
font-size:14px;
font-weight:500;
transition:all .2s ease;
margin-top:auto;
}

.category-card-btn:hover{
background:var(--color-primary);
color:#fff;
}

.category-card-image{
aspect-ratio:1/1;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
margin-bottom:5px;
overflow:hidden;
}

.category-card-desc{
font-size:14px;
color:var(--color-text-muted);
margin-bottom:8px;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
}

.contact-box{
max-width:var(--bp-xl);
margin:30px auto;
border-radius:14px;
background:#fff;
padding:20px 25px;
border:1px solid var(--color-border);
text-align:center;
}

.contact-title{
font-size:16px;
font-weight:600;
margin-bottom:14px;
}

.contact-items{
display:flex;
flex-wrap:wrap;
gap:20px;
justify-content:center;
}

.contact-item{
display:flex;
align-items:center;
justify-content:center;
gap:8px;
color:var(--color-text);
text-decoration:none;
font-size:15px;
cursor:pointer;
background:none;
border:0;
}

.contact-item:hover{
color:var(--color-primary);
}

.contact-icon{
font-size:20px;
}

@media (max-width:600px){

.contact-items{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
}

.contact-item{
padding:10px;
border:1px solid var(--color-border);
border-radius:10px;
background:#fff;
min-height:44px;
}

}

.modal-overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.35);
display:none;
align-items:center;
justify-content:center;
z-index:9999;
}

.modal-overlay.active{
display:flex;
}

.modal{
background:#fff;
width:600px;
max-width:92%;
border-radius:16px;
padding:30px;
position:relative;
box-shadow:0 20px 60px rgba(0,0,0,0.2);
}
.modal-map{
    margin-top:20px;
    border-radius:12px;
    overflow:hidden;
    margin-left:30px;
    margin-right:30px;
}

.modal-map iframe{
    width:100%;
    height:300px;
    border:0;
    display:block;
}

.modal-title{
font-size:20px;
font-weight:600;
display:flex;
align-items:center;
}

.modal-icon{
font-size:22px;
margin-right:5px;
}

.modal-header{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:20px;

}

.modal-close{
position:static;
font-size:18px;
opacity:0.6;
cursor:pointer;

}

.modal-close:hover{
opacity:1;
}

.modal input,
.modal textarea{
width:100%;
padding:12px 14px;
margin-bottom:8px;
border-radius:5px;
border:1px solid var(--color-border);
font-size:14px;
outline:none;
}

.modal textarea{
min-height:100px;
resize:vertical;
}

.modal-submit{
width:100%;
padding:13px;
border-radius:10px;
background:var(--color-primary);
color:#fff;
border:0;
font-size:15px;
cursor:pointer;
}

.modal-submit:hover{
background:var(--color-primary-hover);
}

.modal-success{
display:none;
color:green;
margin-top:10px;
font-size:14px;
}
.form-hp{
display:none;
}

.modal-success{
display:none;
color:green;
margin-top:10px;
}

.home-seo{
 max-width: var(--container-max);
 margin: 0 auto;
 padding: var(--container-pad);
margin-top:60px;
margin-bottom:40px;
background:#fff;

border-radius:14px;
border:1px solid var(--color-border);
box-shadow:0 6px 18px rgba(0,0,0,0.05);
}

.home-seo-inner{
max-width:820px;
}

.home-seo h2{
font-size:22px;
margin-bottom:12px;
}

.home-seo h3{
font-size:18px;
margin-top:18px;
margin-bottom:8px;
}

.home-seo p{
font-size:15px;
line-height:1.65;
color:var(--color-text-muted);
}

.product-sort{
display:flex;
justify-content:flex-end;
align-items:center;
gap:10px;
}

.catalog-toolbar{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:20px;
margin-bottom:20px;
}

.catalog-count{
font-size:14px;
color:var(--color-text-muted);
}

.product-sort label{
font-size:15px;
color:var(--color-text);
}

.product-sort select{
appearance:none;
-webkit-appearance:none;
-moz-appearance:none;
padding:8px 36px 8px 12px;
border:0;
border-radius:10px;
background-color:var(--color-primary);
color:#fff;
font-size:14px;
line-height:1.2;
cursor:pointer;
transition:all .2s ease;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 5 7 9 11 5'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:right 12px center;
background-size:14px;
}

.product-sort select:hover{
background-color:var(--color-primary-hover);
}

.product-sort select:focus{
outline:none;
box-shadow:0 0 0 3px rgba(10,106,148,0.25);
}

.products-related{
background:#F0F9FF;
padding:25px 0;
margin-top:30px;
margin-bottom:-30px;
}

.products-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
}

@media (max-width:1200px){

.products-grid{
grid-template-columns:repeat(3,1fr);
}

}

@media (max-width:800px){

.products-grid{
grid-template-columns:repeat(2,1fr);
gap:8px;
}

}

@media (max-width:340px){

.products-grid{
grid-template-columns:1fr;
}

}

.product-card{
position:relative;
display:flex;
flex-direction:column;
height:100%;
background:#fff;
border-radius:12px;
padding:20px;
box-shadow:0 2px 8px rgba(0,0,0,0.05);
transition:all .2s ease;
}

.product-card:hover{
box-shadow:0 12px 26px rgba(0,0,0,0.12);
}

.product-badges{
position:absolute;
top:16px;
left:16px;
display:flex;
flex-direction:column;
gap:6px;
z-index:2;
}

.badge{
display:inline-block;
padding:6px 12px;
border-radius:20px;
font-size:13px;
font-weight:600;
line-height:1;
white-space:nowrap;
}

.badge-green{
background:#15803d;
color:#fff;
}

.product-image{
display:flex;
justify-content:center;
align-items:center;
height:180px;
margin-bottom:16px;
}

.product-image img{
max-width:100%;
max-height:100%;
object-fit:contain;
}

.product-card:hover .product-image img{
transition:all .2s ease;
transform:scale(1.06);

}

.product-title{
font-size:18px;
font-weight:600;
line-height:1;
margin-top:0;
margin-bottom:4px;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
min-height:72px;
}
.product-title a{
color:var(--color-text);
font-size:18px;
line-height:1;
text-decoration:none;
}

.product-title a:hover{
color:var(--color-primary);
}

.product-description{
font-size:14px;
color:var(--color-text-muted);
line-height:1.5;
margin-bottom:8px;
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;
min-height:60px;
}

.product-price{
font-size:20px;
font-weight:700;
line-height:20px;
margin-bottom:0;
}

.product-price-vat{
font-size:13px;
color:var(--color-text-muted);
margin-bottom:8px;
min-height:12px;
}

.product-price strong{
font-size:20px;
color:var(--color-text);
}

.product-price span{
font-size:12px;
color:var(--color-text-muted);
}


.product-btn{
margin-top:auto;
display:flex;
justify-content:center;
align-items:center;
padding:10px 14px;
border:1px solid var(--color-primary);
border-radius:8px;
color:var(--color-primary);
text-decoration:none;
font-weight:500;
transition:all .2s ease;
}

.product-btn:hover{
background:var(--color-primary);
color:#fff;
}

.product-meta{
font-size:13px;
color:var(--color-text-muted);
margin-top:12px;
}

.product-stock{
font-size:11px;
line-height:13px;
color:#166534;
margin-top:5px;
}

.product-kod{
font-size:14px;
color:var(--color-text-muted);
}

.products-more{
text-align:center;
margin-top:40px;
}

.btn-catalog{
display:inline-flex;
align-items:center;
justify-content:center;
padding:14px 28px;
background:var(--color-primary);
color:#fff;
font-size:16px;
font-weight:600;
line-height:1;
border-radius:10px;
text-decoration:none;
border:none;
margin:0;
font-family:inherit;
cursor:pointer;
appearance:none;
-webkit-appearance:none;
transition:all .2s ease;
}

.btn-catalog:hover{
background:var(--color-primary-hover);
color:#fff;
}

.btn-catalog:focus{
outline:2px solid var(--color-primary);
outline-offset:2px;
}

.btn-catalog:disabled{
opacity:0.6;
cursor:not-allowed;
}

.pagination{
grid-column:1 / -1;
width:100%;
display:flex;
justify-content:center;
gap:8px;
margin-top:30px;
}

.pagination-link{
display:flex;
align-items:center;
justify-content:center;
width:36px;
height:36px;
border-radius:8px;
background:#fff;
border:1px solid var(--color-border);
text-decoration:none;
color:var(--color-text);
font-size:14px;
transition:all .2s ease;
}

@media (max-width:640px){

.pagination-link{
width:42px;
height:42px;
font-size:16px;
}
}

.pagination-link:hover{
border-color:var(--color-primary);
color:var(--color-primary);
}

.pagination-link.active{
background:var(--color-primary);
color:#fff;
border-color:var(--color-primary);
}

#parametre{
display:flex;
flex-wrap:wrap;
gap:8px;
margin-top:10px;
margin-bottom:10px;
}

.adiv1{
display:inline-block;
}

.filter_btn{
display:flex;
align-items:center;
gap:6px;
padding:6px 12px;
border-radius:6px;
border:1px solid #d6dbe1;
background:#ffffff;
color:#1c5a85;
text-decoration:none;
font-size:14px;
transition:all .15s ease;
}

.filter_btn:hover{
background:#f3f6f9;
border-color:#cbd3da;
}

.selected_param{
border-color:#0b6fb8;
background:#eef6ff;
}

.close_param{
display:inline-flex;
align-items:center;
justify-content:center;
width:16px;
height:16px;
font-size:12px;
border-radius:50%;
background:#d9534f;
color:white;
line-height:1;
cursor:pointer;
}

.product-layout{
display:grid;
grid-template-columns: 42% 58%; 
gap:20px;
align-items:start;
}

.product-title{
font-size:26px;
font-weight:600;
margin-bottom:10px;
}

.product-short{
color:#555;
font-size:15px;
}

.show-more{
display:block;
margin-top:8px;
color:var(--color-primary);
font-weight:500;
cursor:pointer;
text-decoration:none;
}

.show-more:hover{
text-decoration:underline;
}

.badge{
display:inline-flex;
align-items:center;
gap:8px;
padding:8px 12px;
border-radius:20px;
font-size:14px;
font-weight:500;
white-space:normal;
flex-wrap:wrap;
}

.product-badges-detail{
display:flex;
flex-direction:column;
gap:8px;
}

.badge-icon{
display:inline-flex;
align-items:center;
justify-content:center;
width:20px;
min-width:20px;
font-size:14px;
}

.badge-text{
flex:1;
}

.badge-green{ 
background:#e6f7ec; 
color:#15803d; 
border:1px solid #86efac;
}

.badge-red{ 
background:#fde8e8; 
color:#b91c1c; 
border:1px solid #fca5a5;
}

.badge-yellow{ 
background:#fff7e6; 
color:#b45309; 
border:1px solid #fcd34d;
}

.badge-blue{ 
background:#e6f0ff; 
color:#1d4ed8; 
border:1px solid #93c5fd;
}

.btn-add-to-cart{
width:100%;
margin-top:16px;
padding:16px;
border-radius:12px;
border:0;
background:linear-gradient(135deg,#2563eb,#1d4ed8);
color:#fff;
font-size:16px;
font-weight:600;
cursor:pointer;
transition:all .2s ease;
}
.btn-add-to-cart:hover{
transform:translateY(-1px);
box-shadow:0 6px 20px rgba(37,99,235,0.3);
}

.product-code{
font-size:13px;
color:#6b7280;
margin-top:12px;
margin-bottom:12px;
}

.product-price-box{
margin-bottom:20px;
}

.price-label{
font-size:14px;
color:#6b7280;
margin-bottom:4px;
}

.price-main{
font-size:34px;
font-weight:700;
color:#111827;
line-height:1.2;
}

.price-vat{
font-size:13px;
color:#6b7280;
margin-top:4px;
}

.product-qty-box label{
display:block;
font-size:14px;
margin-bottom:6px;
color:#374151;
}

.qty-control{
display:flex;
align-items:center;
border:1px solid #d1d5db;
border-radius:10px;
overflow:hidden;
width:140px;
}

.qty-control button{
width:40px;
height:40px;
border:0;
background:#f9fafb;
cursor:pointer;
font-size:18px;
}

.qty-input{
width:60px;
text-align:center;
border:0;
font-size:16px;
outline:none;
}

.tabs-nav{
display:flex;
gap:20px;
border-bottom:1px solid #ddd;
margin-bottom:20px;
}

.tab-btn{
background:none;
border:0;
padding:12px;
cursor:pointer;
font-weight:500;
}

.tab-btn.active{
border-bottom:2px solid var(--color-primary);
}

.tab-content{
display:none;
}

.tab-content.active{
display:block;
}

@media(max-width:1000px){
.product-layout{
grid-template-columns:1fr;
}
}

.product-params{
width:100%;
border-collapse:collapse;
font-size:14px;
}

.product-params tr{
border-bottom:1px solid #e5e7eb;
}

.product-params td{
padding:10px 12px;
vertical-align:top;
}

.param-label{
color:#6b7280;
width:40%;
white-space:nowrap;
}

.param-value{
color:#111827;
font-weight:500;
}
.product-params tr:nth-child(even){
background:#f9fafb;
}

.video-wrapper{
position:relative;
padding-bottom:56.25%;
height:0;
overflow:hidden;
border-radius:12px;
margin-bottom:15px;
}

.video-wrapper iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border:0;
}

.mobile-price-bar{
position:fixed;
bottom:68px;
left:0;
right:0;
display:flex;
align-items:center;
justify-content:space-between;
padding:12px 16px;
background:#fff;
border-top:1px solid #e5e7eb;
z-index:999;
box-shadow:0 -4px 20px rgba(0,0,0,0.08);
}

.mobile-cart-bar{
position:fixed;
bottom:68px; 
left:0;
right:0;
background:#fff;
border-top:1px solid #e5e7eb;
padding:10px 12px;
z-index:999;
box-shadow:0 -6px 20px rgba(0,0,0,0.08);
}

.product-price-line{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
flex-wrap:wrap;
margin-bottom:6px;
}

.product-code-mobile{
margin-top:10px;
font-size:13px;
color:#6b7280;
}

.product-price-wrap{
display:flex;
align-items:baseline;
gap:6px;
text-align:right;
}
.product-price-wrap .price-main{
font-size:20px;
font-weight:700;
color:#111827;
}

.product-price-wrap .price-vat{
font-size:13px;
color:#6b7280;
}

@media (max-width:380px){

.product-price-line{
flex-direction:column;
align-items:flex-start;
}

.product-price-wrap{
width:100%;
justify-content:flex-start;
}

}

.mobile-cart-bottom{
display:flex;
gap:10px;
align-items:center;
}

.qty-control{
display:flex;
align-items:center;
border:1px solid #d1d5db;
border-radius:10px;
overflow:hidden;
width:110px;
flex-shrink:0;
}

.qty-control button{
width:34px;
height:36px;
background:#f9fafb;
border:0;
font-size:18px;
}

.qty-input{
width:40px;
text-align:center;
border:0;
font-size:14px;
}

.mobile-cart-bar .btn-add-to-cart{
flex:1;
margin:0;
padding:12px;
font-size:15px;
border-radius:10px;
}

.site-footer{
background:#071a2e;
color:#cfd9e3;
padding:60px 0;
margin-top:30px;
}

@media (max-width:5px){ /*668px*/
.product-qty-box .qty-control{
display:none;
}
.product-qty-box label{
display:none;
}
.product-buy-box .btn-add-to-cart {
display:none;
}
.site-footer{
padding:60px 0 180px;
}
.btn-add-to-cart{
padding:8px !important;
}
}

@media (min-width:5px){
.mobile-cart-bar{
display:none;
}

}

.product-gallery{
display:flex;
flex-direction:column;
gap:12px;
}
.product-gallery p
{
margin:0;padding:0;
}

.product-gallery h2, .product-gallery h3
{
margin:0;
margin-top:10px;
line-height:16px;
}
#map{
    width:100%;
    height:300px;
    border-radius:12px;
    overflow:hidden;
    padding:20px;
}

.gallery-main{
border-radius:12px;
overflow:hidden;
background:#fff;
cursor:pointer;
}

.gallery-main img{
width:100%;
height:auto;
display:block;
object-fit:contain;
transition:transform .25s ease, opacity .25s ease;
}

.gallery-thumbs{
display:flex;
gap:10px;
}

.thumb{
flex:1;
border:1px solid #e5e7eb;
border-radius:8px;
overflow:hidden;
cursor:pointer;
transition:all .2s ease;
}

.thumb:hover{
border-color:#111827;
}

.thumb img{
width:100%;
height:80px;
object-fit:cover;
display:block;
}

.product-gallery-all{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:12px;
}

.gallery-all-item{
cursor:pointer;
border-radius:10px;
overflow:hidden;
border:1px solid #e5e7eb;
transition:.2s;
background:#fff;
}

.gallery-all-item:hover{
transform:translateY(-2px);
box-shadow:0 8px 20px rgba(0,0,0,0.08);
}

.gallery-all-item img{
width:100%;
height:120px;
object-fit:cover;
display:block;
}

.gallery-modal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.92);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
opacity:0;
visibility:hidden;
transition:all .25s ease;
z-index:9999;
}

.gallery-modal.active{
opacity:1;
visibility:visible;
}


.gallery-modal-content{
position:relative;
display:flex;
align-items:center;
justify-content:center;
max-width:90%;
max-height:80vh;
margin-bottom:20px;
}

.gallery-modal img{
max-width:100%;
max-height:80vh;
object-fit:contain;
border-radius:10px;
background:#fff;
}

.gallery-close{
position:absolute;
top:20px;
right:30px;
font-size:34px;
color:#fff;
cursor:pointer;
z-index:10;
}

.gallery-nav{
position:absolute;
top:50%;
transform:translateY(-50%);
background:rgba(255,255,255,0.1);
border:none;
color:#fff;
font-size:40px;
padding:10px 16px;
cursor:pointer;
border-radius:8px;
transition:.2s;
}

.gallery-nav:hover{
background:rgba(255,255,255,0.25);
}

.gallery-nav.left{
left:20px;
}

.gallery-nav.right{
right:20px;
}

.gallery-counter{
position:absolute;
bottom:20px;
left:50%;
transform:translateX(-50%);

color:#fff;
font-size:13px;

background:rgba(0,0,0,0.5);
padding:6px 14px;
border-radius:20px;
}

.gallery-modal-thumbs{
display:flex;
gap:10px;
justify-content:center;
align-items:center;
width:90%;
backdrop-filter:blur(10px);
padding:10px;
border-radius:14px;
margin:0 auto;
overflow-x:auto;
scrollbar-width:none;
}

.gallery-modal-thumbs::-webkit-scrollbar{
display:none;
}

.gallery-modal-thumb{
height:60px;
flex:0 0 auto;
border-radius:8px;
cursor:pointer;
opacity:0.5;
transition:all .2s ease;
border:2px solid transparent;
}

.gallery-modal-thumb:hover{
opacity:1;
transform:scale(1.08);
}

.gallery-modal-thumb.active{
opacity:1;
border-color:#fff;
transform:scale(1.1);
}

@media (max-width:768px){

.product-gallery-all{
grid-template-columns:repeat(2,1fr);
}

.gallery-modal img{
max-height:65vh;
}

.gallery-modal-thumbs{
max-width:90%;
}

.gallery-modal-thumb{
height:50px;
}

.gallery-nav{
font-size:28px;
padding:6px 10px;
}

}

.cart-modal{
position:fixed;
inset:0;
background:rgba(0,0,0,0.5);
display:none;
align-items:center;
justify-content:center;
z-index:9999;
}

.cart-modal-box{
background:#fff;
border-radius:16px;
padding:30px;
max-width:480px;
width:90%;
position:relative;
text-align:center;
}

.cart-modal-close{
position:absolute;
top:12px;
right:12px;
border:none;
background:none;
font-size:20px;
cursor:pointer;
}

.cart-modal-header{
font-size:20px;
font-weight:600;
margin-bottom:20px;
}

.cart-modal-product{
display:flex;
gap:15px;
align-items:center;
margin-bottom:20px;
text-align:left;
}

.cart-modal-img{
width:70px;
height:auto;
border-radius:8px;
}

.cart-modal-title{
font-weight:600;
margin-bottom:5px;
}

.cart-modal-code{
font-size:13px;
color:#6b7280;
}

.cart-modal-success{
color:#16a34a;
font-size:18px;
font-weight:600;
margin-bottom:20px;
}

.cart-modal-actions{
display:flex;
gap:10px;
}

.btn-primary-kosik{
background:var(--color-primary);
color:#fff;
padding:12px;
border-radius:10px;
text-decoration:none;
flex:1;
}

.btn-secondary{
background:#e5e7eb;
padding:12px;
border-radius:10px;
border:none;
flex:1;
cursor:pointer;
max-width:150px;
}

.cart-modal.active{
display:flex;
}



.footer-inner{
max-width: var(--container-max);
margin:auto;
display:grid;
grid-template-columns:1fr 1fr 1.6fr 1fr;
gap:60px;
padding:0 20px;
}

.footer-about p{
max-width:260px;
}

.footer-col h2{
color:#fff;
font-size:22px;
margin-bottom:16px;
}

.footer-col h3{
color:#fff;
font-size:18px;
margin-bottom:18px;
}

.footer-col p{
line-height:1.6;
font-size:14px;
}

.footer-col ul{
list-style:none;
padding:0;
margin:0;
}

.footer-col li{
margin-bottom:10px;
}

.footer-col a{
color:#cfd9e3;
text-decoration:none;
transition:color .2s;
}

.footer-col a:hover{
color:#ffffff;
}

.footer-scroll{
font-size:13px;
columns:3;
}

.footer-scroll::-webkit-scrollbar{
width:6px;
}

.footer-scroll::-webkit-scrollbar-thumb{
background:#3a526d;
border-radius:4px;
}

@media (max-width:1000px){

.footer-inner{
grid-template-columns:1fr 1fr;
gap:40px;
}

}

@media (max-width:640px){

.footer-inner{
grid-template-columns:1fr;
}

.footer-about p{
max-width:100%;
}

}
.footer-bottom{
border-top:1px solid rgba(255,255,255,0.08);
margin-top:40px;
padding:22px 0;
font-size:14px;
color:#8fa3b8;
}

.footer-bottom-inner{
max-width:1300px;
margin:auto;
display:flex;
flex-direction:column;
align-items:center;
gap:8px;
padding:0 20px;
text-align:center;
}

.footer-links a{
color:#8fa3b8;
text-decoration:none;
}

.footer-links a:hover{
color:#ffffff;
}

.footer-sep{
margin:0 6px;
opacity:0.6;
}

@media (max-width:700px){

.footer-bottom-inner{
flex-direction:column;
gap:10px;
text-align:center;
}

}

.breadcrumbs{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:8px;
font-size:14px;
margin:18px 0 24px;
color:var(--color-text-muted);
}

@media (max-width:668px){

.breadcrumbs{
font-size:13px;
margin:76px 0 18px;
}

}

.breadcrumbs a{
display:inline-flex;
align-items:center;
gap:6px;
color:var(--color-text);
text-decoration:none;
}

.breadcrumbs a:hover{
color:var(--color-primary);
}

.breadcrumb-home svg{
width:18px;
height:18px;
flex:0 0 18px;
}

.breadcrumb-sep{
color:var(--color-text-muted);
}

.page-intro{
 max-width: var(--container-max);
 margin: 0 auto;
 padding: var(--container-pad);
background:#fff;
border-radius:14px;
border:1px solid var(--color-border);
box-shadow:0 6px 18px rgba(0,0,0,0.05);
}

.product-tabs{
 max-width: var(--container-max);
 margin: 0 auto;
 
 margin-top:25px;
 padding: var(--container-pad);
background:#fff;

border-radius:14px;
border:1px solid var(--color-border);
box-shadow:0 6px 18px rgba(0,0,0,0.05);
}

.page-intro-header{

display:flex;
justify-content:space-between;
align-items:center;

gap:10px;

margin-bottom:10px;

}

.page-intro h1{

font-size:32px;
margin:0;
line-height: 1.1;
}

.page-intro-text{

color:var(--color-text-muted);

line-height:1.6;

}

.share-btn{
background:none;
border:0;
cursor:pointer;
color:var(--color-primary);
padding:6px;
border-radius:8px;
transition:.2s;
}

.share-btn:hover{
background:#e9eef3;
}

.catalog-layout{
display:grid;
grid-template-columns:260px 1fr;
gap:30px;

}

.catalog-sidebar{
background:#fff;
border-radius:12px;
padding:20px;
box-shadow:0 4px 10px rgba(0,0,0,0.05);
height:fit-content;
}

.catalog-sidebar-title{
font-size:18px;
font-weight:600;
margin-bottom:15px;
padding-bottom:10px;
border-bottom:2px solid var(--color-primary);
}

.catalog-menu{
list-style:none;
padding:0;
margin:0;
}

.catalog-menu li{
border-bottom:1px solid var(--color-border);
}

.catalog-menu li:last-child{
border-bottom:0;
}

.catalog-menu a{
display:flex;
justify-content:space-between;
padding:10px 0 0;
text-decoration:none;
color:var(--color-text);
}

.catalog-menu .active-parent > a{
font-weight:600;
color:var(--color-primary);
}

.catalog-submenu{
list-style:none;
padding-left:15px;
margin: 0 0 5px 0;
}

.catalog-submenu .active a{
color:var(--color-primary);
font-weight:600;
}

.menu-arrow{
color:var(--color-text-muted);
font-size:18px;
}

.catalog-content{
min-width:0;
}

@media (max-width:900px){
.catalog-layout{
grid-template-columns:1fr;
}

.catalog-sidebar{
display:none;
}

}

.cart-steps{
position:relative;
display:flex;
align-items:center;
width:100%;

padding:25px 40px 0 40px;
background:var(--color-bg);
}

@media (max-width:668px){

.cart-steps{
margin-top:var(--header-height-mobile);
}

}

.cart-steps::before{
content:"";
position:absolute;

top:42px;
left:40px;
right:40px;

height:5px;
background:var(--color-line);

z-index:1;
}

.step{
flex:1;
position:relative;
z-index:2;
}

.step:first-child{
text-align:left;
}

.step:nth-child(2){
text-align:center;
}

.step:last-child{
text-align:right;
}

.step span{
display:inline-flex;
align-items:center;
justify-content:center;
width:34px;
height:34px;
border-radius:50%;
background:var(--color-line);
color:#fff;
font-weight:600;
box-shadow:0 0 0 6px var(--color-bg);
}
.step.active span{
background:var(--color-active);
}

.step p{
margin-top:6px;
font-size:13px;
color:var(--color-text);
}
.cart-steps::after{
content:"";
position:absolute;
top:42px;
left:40px;
width:50%;
height:5px;
background:var(--color-active);
z-index:1;
}
.cart-steps::after{
content:"";
position:absolute;
top:42px;
left:40px;

height:5px;
background:var(--color-active);
z-index:1;

width:0;
transition:width .3s ease;
}

.cart-steps.step-2-active::after{
width:calc(50% - 17px);
}

.cart-steps.step-3-active::after{
width:calc(100% - 100px);
}

.step.active span{
background:var(--color-active);
box-shadow:0 0 0 6px var(--color-bg), 0 0 0 2px var(--color-active);
}

.cart-empty{
margin-top:30px;

background:var(--color-white);
border-radius:16px;

padding:80px 20px;

text-align:center;

box-shadow:0 2px 12px rgba(0,0,0,0.06);
}

.cart-empty h1{
font-size:28px;
font-weight:700;
color:var(--color-text);

margin-bottom:10px;
}
.cart-empty p{
color:var(--color-muted);
font-size:15px;

margin-bottom:25px;
}


.cart-page{
display:flex;
gap:30px;
align-items:flex-start;
}

.cart-left{
flex:2;
}

.cart-right{
 flex:1;
 position:sticky;
 top:120px;
 z-index:1;
}

.cart-box{
background:#fff;
padding:20px;
border-radius:12px;
}

.cart-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:20px;
height:35px;
}

.cart-header-right{
font-size:14px;
color:#6b7280;
}

.cart-item{
display:flex;
align-items:center;
gap:20px;
padding:20px 0;
border-bottom:1px solid #e5e7eb;
}

.cart-img img{
width:70px;
}

.cart-info{
flex:1;
}

.cart-name{
font-weight:600;
font-size:16px;
}

.cart-code{
font-size:13px;
color:#6b7280;
margin-top:5px;
}

.cart-qty{
display:flex;
align-items:center;
gap:6px;
}

.cart-qty button{
width:30px;
height:30px;
border:none;
background:#e5e7eb;
cursor:pointer;
border-radius:6px;
}

.cart-qty input{
width:40px;
text-align:center;
border:1px solid #ddd;
border-radius:6px;
height:30px;
}
.cart-price{
font-weight:600;
min-width:100px;
text-align:right;
}

.cart-remove{
color:red;
font-size:20px;
cursor:pointer;
margin-left:10px;
}
.cart-summary-box{
background:#ffffff;
padding:15px;
border-radius:12px;
}
.summary-products-3 .cart-summary-box{
padding:0;
}

.summary-row{
display:flex;
justify-content:space-between;
margin-bottom:10px;
}

.summary-row.discount{
color:#dc2626;
font-weight:600;
}

.summary-row.strong{
font-weight:600;
}

.summary-total{
display:flex;
justify-content:space-between;
font-size:18px;
font-weight:700;
color:#16a34a;
margin-top:15px;
}

@media (max-width:1000px){

.cart-page{
flex-direction:column;
}

.cart-left{
width:100%;
}

.cart-right{
width:100%;
position:static; 
}

}

.cart-actions-wrapper{
display:flex;
justify-content:space-between;
align-items:center;
gap:15px;

margin:20px;
padding:15px;

background:#ffffff;
border-radius:10px;

position:sticky;
bottom:20px;
z-index:10;
box-shadow:0 -4px 12px rgba(0,0,0,0.06);
}


.cart-actions-wrapper .btn-secondary,
.cart-actions-wrapper .btn-catalog{
flex:1;
}

.cart-actions-wrapper--checkout{
position:relative;
bottom:auto;
margin-top:30px;
}

@media (min-width:669px){

.cart-actions-wrapper{
max-width:600px; 
margin:30px auto 0;
}

}

.cart-actions-wrapper a{
display:inline-flex;
align-items:center;
justify-content:center;

height:44px;
padding:0 18px;

white-space:nowrap;


width:auto;
flex:0 0 auto;
}

.btn-secondary{
background:#e5e7eb;
color:#111827;
border:1px solid #d1d5db;
margin:0;
}

.btn-secondary:hover{
background:#d1d5db;
}

@media (max-width:668px){

.cart-actions-wrapper{
position:fixed;
left:0;
width:100%;

background:#fff;
padding:12px 15px;
margin:0;
border-radius:0;
z-index:999;
box-shadow:0;
bottom:68px;
}

.cart-actions-wrapper--checkout{
position:fixed;
left:0;
width:100%;

background:#fff;
padding:12px 15px;
margin:0;
border-radius:0;

z-index:999;
bottom:68px;

box-shadow: none !important;
}

.cart-actions-wrapper a{
flex:1;
text-align:center;
}

.btn-secondary{
font-size:13px;
padding:10px;
}



}

.cart-actions-wrapper.cart-actions-wrapper--checkout {
 box-shadow: none !important;
}

.cart-bottom{
display:flex;
align-items:center;
justify-content:space-between;
gap:15px;
margin-top:10px;
}

@media (max-width:768px){

.cart-item{
display:flex;
flex-wrap:wrap;
align-items:flex-start;
gap:10px;
}

.cart-img{
flex:0 0 70px;
}

.cart-info{
flex:1;
}

.cart-name{
font-size:15px;
line-height:1.3;
}

.cart-code{
margin-top:4px;
font-size:13px;
}
}

@media (max-width:768px){

.cart-bottom{
display:flex;
align-items:center;
justify-content:flex-end;
gap:10px;
width:100%;
margin-top:10px;
}

.cart-price{
order:2;
font-weight:600;
}

.cart-qty{
order:1;
display:flex;
align-items:center;
gap:6px;
}

.cart-remove{
order:3;
color:red;
font-size:18px;
cursor:pointer;
}

.cart-qty button{
width:32px;
height:32px;
}
}

.cart-summary-box{
 position:relative;
}

.cart-summary-loader{
 position:absolute;
 inset:0;
 display:flex;
 align-items:center;
 justify-content:center;
 z-index:10;

 background:rgba(255,255,255,0.6);

 opacity:0;
 pointer-events:none;
 transition:opacity .2s ease;
}

.cart-summary-loader.active{
 opacity:1;
 pointer-events:auto;
}

.loader-spinner{
 width:32px;
 height:32px;
 border:3px solid #e5e7eb;
 border-top:3px solid var(--color-primary);
 border-radius:50%;
 animation:spin .8s linear infinite;
}

@keyframes spin{
 to{ transform:rotate(360deg); }
}

.cart-confirm-modal{
 position:fixed;
 inset:0;
 background:rgba(0,0,0,0.4);
 display:flex;
 align-items:center;
 justify-content:center;
 opacity:0;
 pointer-events:none;
 transition:.2s ease;
 z-index:9999;
}

.cart-confirm-modal.active{
 opacity:1;
 pointer-events:auto;
}

.cart-confirm-box{
 background:#fff;
 padding:25px;
 border-radius:12px;
 width:100%;
 max-width:320px;
 text-align:center;
}

.cart-confirm-title{
 font-size:16px;
 font-weight:600;
 margin-bottom:20px;
}

.cart-confirm-actions{
 display:flex;
 gap:10px;
}

.btn-danger{
 flex:1;
 background:#ef4444;
 color:#fff;
 border:none;
 padding:10px;
 border-radius:8px;
 cursor:pointer;
}

.btn-light{
 flex:1;
 background:#f3f4f6;
 border:none;
 padding:10px;
 border-radius:8px;
 cursor:pointer;
}

.cart-remove{
 cursor:pointer;
 font-size:20px;
 font-weight:600;
 color:#ef4444;

 display:flex;
 align-items:center;
 justify-content:center;

 width:34px;
 height:34px;

 background:none; 
 border:none;
 padding:0; 
}

.bez_footer
{
 padding-bottom:160px;
}
.checkout-form{
width:100%;
max-width:1020px;
margin:0 auto;
padding:0 20px;
}


.cart-box{
background:#fff;
padding:30px;
border-radius:14px;
box-shadow:0 4px 20px rgba(0,0,0,0.05);
}

.form-group{
margin-bottom:15px;
}

.checkout-form input[type="text"],
.checkout-form input[type="email"],
.checkout-form input[type="tel"],
.checkout-form textarea,
.checkout-form select{

width:100%;
padding:14px 16px;

border:1px solid #e5e7eb;
border-radius:10px;

font-size:15px;

background:#fcfcfd;
transition:all .2s ease;
}

.checkout-form input:hover,
.checkout-form textarea:hover,
.checkout-form select:hover{
border-color:#cbd5f5;
}

.checkout-form input:focus,
.checkout-form textarea:focus,
.checkout-form select:focus{
outline:none;
border-color:var(--color-primary);
background:#fff;
box-shadow:0 0 0 3px rgba(59,130,246,0.1);
}

.radio-box,
.checkbox-box{
display:flex;
align-items:flex-start;
gap:12px;

padding:8px;

border:1px solid #e5e7eb;
border-radius:12px;

cursor:pointer;
transition:all .2s ease;
margin-bottom:12px;

position:relative;
}

.radio-box input,
.checkbox-box input{
margin-top:8px;
accent-color:var(--color-primary);
cursor:pointer;
}

.radio-box:hover,
.checkbox-box:hover{
border-color:var(--color-primary);
background:#f9fafb;
}

.radio-box.active,
.checkbox-box.active{
border-color:var(--color-primary);
background:#fcfcfd;
}
.radio-box:has(input:checked),
.checkbox-box:has(input:checked){
border-color:var(--color-primary);
background:#fcfcfd;
}



.checkout-form h1{
margin: 0 0 15px 0;
font-size:24px;
padding:0;
}
.checkout-form h2{
margin:15px 0;
font-size:18px;
padding-bottom:8px;
border-bottom:1px solid #e5e7eb;
width:100%;
}
.checkout-form h3{
margin-top:30px;
margin-bottom:15px;
font-size:18px;
}

.form-note{
font-size:13px;
color:#6b7280;
margin-bottom:10px;
}

.form-trust{
margin-top:15px;
font-size:13px;
color:#6b7280;
text-align:center;
}


@media (max-width:668px){

.checkout-form{
padding:15px;
}

.cart-box{
padding:20px;
border-radius:0;
}

}

.shipping-free{
color:#dc2626; 

margin-left:8px;
font-size:16px;
}



.summary-grid{
display:flex;
gap:30px;
margin-bottom:30px;
}

@media (max-width:768px){
.summary-grid{
flex-direction:column;
}
}

.summary-box{
flex:1;
}

.summary-box h3{
font-size:18px;
margin-bottom:15px;
padding-bottom:8px;
border-bottom:1px solid #e5e7eb;
}

.summary-box p{
margin:6px 0;
font-size:14px;
color:#374151;
}

.summary-box p strong{
color:#111827;
}

.summary-products{
background:#fff;
margin-bottom:25px;
}

.summary-products h3{
margin-bottom:15px;
}

.summary-products p{
margin: 0;
font-size:14px;
}

.summary-box-label{
min-width:100px;
font-weight:600;
color:#111827;
}

.summary-box p{
display:flex;
gap:10px;
margin:6px 0;
font-size:14px;
}

.summary-box .label{
min-width:80px; 
font-weight:600;
color:#111827;
}

.summary-box .value{
flex:1;
color:#374151;
word-break:break-word;
}


.terms-wrap{
display:flex;
justify-content:flex-end;
}

.terms-note{
font-size:13px;
color:#6b7280;
max-width:460px;
text-align:right;
}
.order-success{
max-width:600px;
margin:60px auto;
padding:40px;
background:#fff;
border-radius:16px;
box-shadow:0 10px 30px rgba(0,0,0,0.05);
text-align:center;
}

.order-success h1{
color:var(--color-success);
font-size:32px;
margin-bottom:10px;
}

.order-subtitle{
color:#6b7280;
margin-bottom:25px;
}

.order-number-box{
background:#f3f4f6;
padding:20px;
border-radius:10px;
margin-bottom:20px;
}

.order-number-box strong{
display:block;
font-size:22px;
margin-top:5px;
}

.order-email{
color:#6b7280;
margin-bottom:25px;
}

.order-steps{
text-align:left;
margin-bottom:30px;
}

.order-steps h3{
margin-bottom:10px;
}

.order-steps ul{
padding-left:18px;
color:#374151;
}

.order-actions{
margin-top:20px;
}

.order-contact{
margin-top:25px;
font-size:14px;
color:#6b7280;
}
.modal-overlay{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);

display:flex;
align-items:center;
justify-content:center;

opacity:0;
visibility:hidden;
transition:0.25s;
z-index:9999;
}

.modal-overlay.active{
opacity:1;
visibility:visible;
}

.modal-box{
position:relative;
background:#fff;
width:90%;
max-width:900px;
max-height:80vh;
overflow-y:auto;

border-radius:12px;
padding:25px;
}

.modal-close{
position:sticky;
top:0;
margin-left:auto;

width:36px;
height:36px;

border:none;
border-radius:50%;

background:#111;
color:#fff;

font-size:20px;
font-weight:600;

cursor:pointer;

display:flex;
align-items:center;
justify-content:center;

box-shadow:0 2px 8px rgba(0,0,0,0.1);

z-index:10;
}

.modal-close:hover{
background:#444;
transform:scale(1.05);
}

.modal-content{
margin-top:15px;
font-size:14px;
line-height:1.6;
}
.terms-link{
text-decoration:underline;
cursor:pointer;
}
.home-seo a
{
text-decoration:underline;
}
#mozaika{display:table;width:100%;margin-top:20px;}
#mozaika table{width:100%;font-size:12px;}
#mozaika td{width:12%;position:relative;}
#mozaika img{width:100%;z-index:1;-webkit-transition:opacity 1s ease-in-out;-moz-transition:opacity .15s ease-in-out;-ms-transition:opacity .15s ease-in-out;-o-transition:opacity .15s ease-in-out;transition:opacity .15s ease-in-out;}

#mozaika span{box-sizing:border-box;position:absolute;z-index:2;color:#fefefe;position:absolute;top:40%;left:0;text-align:center;width:100%;}

.modal-actions{
display:flex;
justify-content:center;
margin-top:10px;
}

.modal-ok{
max-width:80px;
width:100%;
}
.shipping-box{
background:#fff;
border-radius:14px;
padding:8px;
margin-bottom:14px;
border:1px solid var(--color-border);
}

.shipping-box-main{
background:#e9f1f7;
text-align:center;
font-weight:600;
}

.shipping-row{
display:flex;
gap:12px;
align-items:flex-start;
}

.shipping-icon{
font-size:20px;
margin-top:0;
}
.article-image{
    float:left;
    width:50%;
    max-width:500px;
    margin:0 20px 15px 0;
    border-radius:12px;
}

/* mobil */
@media (max-width:768px){
    .article-image{
        float:none;
        width:100%;
        max-width:100%;
        margin:0 0 15px 0;
    }
}
.article-content h3{
    margin-top:25px;
    font-size:18px;
}

.article-content h3 + p{
    background:#f5f7fa;
    padding:10px 15px;
    border-radius:8px;
}
.product-use{margin-top:15px;}
.error404{
padding:60px 0 80px;
}

.error404-box{
max-width:760px;
margin:0 auto;
margin-top:50px;
text-align:center;
background:#fff;
border:1px solid rgba(0,0,0,0.08);
border-radius:24px;
padding:40px 24px;
box-shadow:0 10px 35px rgba(0,0,0,0.06);
}

.error404-badge{
display:inline-block;
padding:8px 14px;
border-radius:999px;
background:rgba(0,123,255,0.08);
color:var(--color-primary);
font-size:14px;
font-weight:600;
margin-bottom:18px;
}

.error404-title{
font-size:clamp(30px, 4vw, 46px);
line-height:1.15;
margin:0 0 16px;
}

.error404-text{
max-width:620px;
margin:0 auto 28px;
font-size:17px;
line-height:1.7;
color:#555;
}

.error404-actions{
display:flex;
justify-content:center;
gap:14px;
flex-wrap:wrap;
margin-bottom:28px;
}


@media (max-width: 640px){
.error404{
padding:30px 0 50px;
}

.error404-box{
padding:28px 18px;
border-radius:18px;
}

.error404-text{
font-size:16px;
}
}
.lang-dropdown{
    position:relative;
    display:inline-block;
}

.lang-current{
    display:flex;
    align-items:center;
    gap:6px;
    background:#f5f5f5;
    border:0;
    padding:6px 10px;
    border-radius:6px;
    cursor:pointer;
    font-size:13px;
}

.lang-current:hover{
    background:#eaeaea;
}

.lang-menu{
    position:absolute;
    right:0;
    top:110%;
    background:#fff;
    border-radius:8px;
    box-shadow:0 10px 30px rgba(0,0,0,0.1);
    display:none;
    min-width:100px;
    z-index:100;
}

.lang-dropdown.open .lang-menu{
    display:block;
}

.lang-option{
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 12px;
    text-decoration:none;
    color:#333;
    font-size:13px;
}

.lang-option:hover{
    background:#f5f5f5;
}
.lang-menu{
    color:#222; 
}

.lang-option{
    color:#222; 
}

.lang-option span{
    color:#222; 
}
.cookie-bar{
position:fixed;
bottom:0;
left:0;
width:100%;
background:#1f4f8f;
color:#fff;
border-top:0;
padding:64px 20px;
z-index:9999;
opacity:0;
transform:translateY(100%);
transition:all .4s ease;
}

.cookie-bar.show{
opacity:1;
transform:translateY(0);
}

.cookie-content{
max-width:1200px;
margin:0 auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:40px;
}

.cookie-text{
color:#fff;
font-size:15px;
line-height:1.6;
max-width:600px;
}

.cookie-text strong{
display:block;
font-size:18px;
color:#fff;
margin-bottom:6px;
}

.cookie-text a{
color:#cfe3ff;
text-decoration:underline;
}

.cookie-actions{
display:flex;
gap:16px;
flex-shrink:0;
}

@media(max-width:768px){

.cookie-content{
flex-direction:column;
align-items:flex-start;
gap:20px;
}

.cookie-actions{
flex-direction:column;
width:100%;
gap:12px;
}

}
#cookieReject
{
color:var(--color-primary);
background:#fff;
}