/* HOSET new style (26.10.2026): home services block, catalog listing and filter. Scoped overrides on top of style.css. */

/* ---- home: services block ---- */
.home-services { padding: 20px 0 6px; }
.home-services .hs-title { font-size: 34px; font-weight: 700; color: #1d2126; }
.home-services .hs-subtitle { color: #5b616b; font-size: 16px; line-height: 1.4; }
.hs-block { display: grid; grid-template-columns: 1fr; background: #e9e9e9; border: 0; padding: 0; align-content: center; }
.hs-block .hsb-bg { position: static; width: auto; height: 260px; margin: 0; background-size: cover; }
.hs-block .hsb-tip { padding: 28px 24px 0; color: #0840f3; font-weight: 700; letter-spacing: 2px; }
.hs-block .hsb-title { padding: 0 24px; margin-bottom: 16px; font-size: 32px; font-weight: 700; line-height: 1.1; color: #1d2126; }
.hs-block .hsb-list, .hs-block > ul { padding: 0 24px 30px; margin: 0; }
.hs-block .hsb-list li { margin-top: 0; }
.hs-block .hsb-list a { display: inline-block; padding: 7px 0; font-weight: 600; color: #1d2126; }
.hs-block .hsb-list a:hover { color: #0840f3; text-decoration: none; }
.hs-block .hsb-list a:after { content: " \2192"; color: #0840f3; }
@media (min-width: 900px) {
	.hs-block { grid-template-columns: 1fr 1fr; grid-template-rows: auto auto 1fr; min-height: 420px; overflow: hidden; }
	/* image on the RIGHT (the next block, 3D, has its image on the left) */
	.hs-block .hsb-bg { position: static; width: auto; grid-column: 2; grid-row: 1 / span 3; height: 100%; min-height: 420px; margin: 0; background-size: cover; background-position: center; }
	.hs-block .hsb-tip, .hs-block .hsb-title, .hs-block .hsb-list, .hs-block > ul { grid-column: 1; padding-left: 52px; padding-right: 40px; }
	.hs-block .hsb-tip { align-self: end; padding-top: 40px; }
	.hs-block .hsb-list, .hs-block > ul { align-self: start; padding-bottom: 40px; }
	.hs-block .hsb-list { columns: 2; column-gap: 24px; }
}

/* ---- catalog: filter sidebar ---- */
.filter .f-title { display: block; margin: 0 0 14px; font-size: 22px; font-weight: 700; color: #1d2126; }
.f-block, .f-title + .f-block { border: 0; margin-bottom: 8px; }
.fb-title a { background: #e9e9e9; min-height: 50px; padding: 17px 44px 17px 16px; font-weight: 600; color: #1d2126; }
.fb-title a:hover, .fb-title a:focus { color: #0840f3; }
.fb-title i, .fb-title .collapsed i:before { background-color: #0840f3; }
.f-block .fb-price input { border-radius: 0; }

/* ---- catalog: listing grid ---- */
.catalog-head .ch-title { font-size: 30px; font-weight: 700; color: #1d2126; }
.catalog-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 22px 16px; text-align: left; justify-content: stretch; align-content: start; }
.catalog-list .product-card { width: auto; max-width: none; margin: 0; padding: 0 0 14px; border: 1px solid transparent; border-radius: 0; background: #fff; text-align: left; box-shadow: none; transition: border-color .2s; }
.catalog-list .product-card:hover { border-color: #0840f3; }
.catalog-list .pc-img { padding: 0; margin: 0 0 12px; background: #f4f4f4; }
.catalog-list .pc-img a { padding-bottom: 82%; }
.catalog-list .pc-img img { object-fit: contain; }
.catalog-list .collection-card .pc-img img { object-fit: cover; }
.catalog-list .pc-head, .catalog-list .pc-bottom { padding: 0 12px; }
.catalog-list .pc-title { font-size: 15px; font-weight: 700; line-height: 1.3; text-align: left; }
.catalog-list .pc-brand { margin-top: 3px; color: #8b919c; font-size: 11px; letter-spacing: .6px; text-transform: uppercase; text-align: left; }
.catalog-list .pc-brand small { text-transform: none; letter-spacing: 0; }
.catalog-list .pc-price { text-align: left; }
.catalog-list .pc-price .pcp-actual { color: #0840f3; font-size: 18px; font-weight: 700; text-align: left; }
.catalog-list .pc-price:after { display: block; margin-top: 2px; font-size: 11px; font-weight: 400; color: #8b919c; }
:lang(fi) .catalog-list .pc-price:after { content: "sis. ALV 25,5 %"; }
:lang(en) .catalog-list .pc-price:after { content: "incl. VAT 25.5%"; }
:lang(et) .catalog-list .pc-price:after { content: "sis. KM 25,5%"; }
:lang(es) .catalog-list .pc-price:after { content: "IVA incl. 25,5%"; }
:lang(ru) .catalog-list .pc-price:after { content: "с НДС 25,5%"; }
:lang(uk) .catalog-list .pc-price:after { content: "з ПДВ 25,5%"; }
@media (max-width: 640px) { .catalog-list { grid-template-columns: repeat(2, 1fr); gap: 14px 10px; } .catalog-list .pc-price .pcp-actual { font-size: 16px; } }

/* ---- category index tiles (sub-category pages) ---- */
.hc-inner { background: #e9e9e9; }
.hc-head { position: relative; height: 230px; background-color: #d9d9d9; }
.hc-head:before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.14) 60%, rgba(0,0,0,0) 100%); }
.hc-title { padding: 24px 26px; }
.hc-title:before { display: none; }
.hc-title span { font-size: 24px; font-weight: 500; line-height: 1.15; vertical-align: top; text-shadow: 0 1px 12px rgba(0,0,0,.35); }
.hc-title:hover:after, .hc-title:focus:after { opacity: 0; }
.icon-hc-arrow { top: 6px; }
.hc-block, .hc-block.hc-short { height: 230px; margin-bottom: 14px; }
.catalog-list .pc-add .btn, .catalog-list .btn { border-radius: 0; letter-spacing: .8px; }
@media (max-width: 640px) { .catalog-list .pc-head, .catalog-list .pc-bottom { padding-left: 10px !important; padding-right: 10px !important; } .catalog-list .product-card { margin-left: 0 !important; margin-right: 0 !important; } }
.catalog-list .pc-title, .catalog-list .pc-brand, .catalog-list .pc-price { padding-left: 0; padding-right: 0; }

/* ---- catalog layout like archiproducts: 270px sidebar + wide 3-column grid ---- */
@media (min-width: 768px) {
	.cc-side { width: 270px; }
	.cc-content { width: calc(100% - 300px) !important; }
}
.cs-tree { margin: 0 0 22px; }
.cs-h { background: #e9e9e9; padding: 15px 16px; font-weight: 700; font-size: 16px; color: #1d2126; margin-bottom: 8px; }
.cs-list { list-style: none; margin: 0; padding: 0 4px; }
.cs-list li a { display: block; padding: 6px 0; color: #5b616b; font-size: 15px; line-height: 1.3; }
.cs-list li a:hover { color: #0840f3; text-decoration: none; }
.cs-l1 { padding-left: 12px; } .cs-l2 { padding-left: 24px; } .cs-l3 { padding-left: 36px; }
.cs-cur a { color: #0840f3; font-weight: 700; }
.cs-child a { font-size: 14px; }
.fb-options .fb-search { display: block; width: calc(100% - 8px); margin: 8px 4px 10px; padding: 10px 12px; border: 1px solid #cfcfcf; border-radius: 0; font: inherit; font-size: 14px; box-sizing: border-box; }
.fb-options .fb-list { max-height: 300px; overflow-y: auto; scrollbar-width: thin; }
.fb-options li label span { font-size: 14.5px; }
@media (max-width: 767px) { .cs-tree { display: none; } }

/* cards: brand first (bold), name muted, price + request link */
.catalog-list { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 28px 20px; }
.catalog-list .pc-img a { padding-bottom: 100%; }
.catalog-list .pc-img img { object-fit: contain; padding: 6%; box-sizing: border-box; }
.catalog-list .collection-card .pc-img img { padding: 0; }
.catalog-list .pc-head { display: flex; flex-direction: column; }
.catalog-list .pc-brand { order: -1; margin: 0 0 2px; color: #1d2126; font-size: 15px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.catalog-list .pc-title { font-weight: 400; font-size: 14.5px; color: #5b616b; }
.catalog-list .pc-title a { color: #5b616b; }
.catalog-list .pc-title a:hover { color: #0840f3; text-decoration: none; }
.catalog-list .collection-card .pc-brand { font-weight: 400; color: #8b919c; font-size: 13px; order: 1; }
.catalog-list .collection-card .pc-title { color: #1d2126; font-weight: 700; font-size: 15px; }
.catalog-list .collection-card .pc-title a { color: #1d2126; }
.catalog-list .pc-add .btn { background: none; color: #0840f3; padding: 0; margin-top: 6px; border: 0; text-transform: none; font-size: 15px; font-weight: 600; text-align: left; letter-spacing: 0; }
.catalog-list .pc-add .btn:hover { text-decoration: underline; background: none; }
.catalog-list .pc-bottom { padding-top: 6px; }
/* product code / size lines are secondary; real brand stays bold */
.catalog-list .pc-brand:has(> small) { order: 3; margin: 2px 0 0; font-size: 12px; font-weight: 400; color: #8b919c; }
.catalog-list .pc-head:not(:has(.pc-brand:not(:has(> small)))) .pc-title { font-weight: 700; color: #1d2126; }
.catalog-list .pc-head:not(:has(.pc-brand:not(:has(> small)))) .pc-title a { color: #1d2126; }
@media (max-width: 640px) { .catalog-list { grid-template-columns: repeat(2, 1fr); gap: 18px 10px; } .catalog-list .pc-img img { padding: 4%; } }

/* mobile mosaic: one more big tile */
:lang(de) .catalog-list .pc-price:after { content: "inkl. MwSt. 25,5 %"; }
:lang(fr) .catalog-list .pc-price:after { content: "TVA 25,5 % incluse"; }
:lang(sv) .catalog-list .pc-price:after { content: "inkl. moms 25,5 %"; }
:lang(no) .catalog-list .pc-price:after { content: "inkl. mva 25,5 %"; }
:lang(lv) .catalog-list .pc-price:after { content: "ar PVN 25,5 %"; }
:lang(lt) .catalog-list .pc-price:after { content: "su PVM 25,5 %"; }

/* price: 3% smaller, VAT note in brand blue */
.catalog-list .pc-price .pcp-actual { font-size: 17.5px; }
.catalog-list .pc-price:after { color: #0840f3; }
@media (max-width: 640px) { .catalog-list .pc-price .pcp-actual { font-size: 15.5px; } }

/* all site buttons: one bold weight */
.btn, a.btn, button.btn, input.btn, .fr-btn, .pb-add-btn, .pec-add-btn, .hh-b1, .hh-b2 { font-weight: 700 !important; }

/* home product blocks (moved from index.php so any page can use .home-product-group / .hx-pgrid) */
/* Home product blocks - grid, vertical scroll, brand grey, sharp corners (26.10.2026) */
.home-product-group { background: #e9e9e9; border-radius: 0; padding: 34px 22px 26px; margin-top: 40px; overflow: hidden; }
.home-product-group .hpg-title { margin-bottom: 24px; }
.hx-pgrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; max-height: 1000px; overflow-y: auto; padding: 2px 8px 6px 2px; scrollbar-width: thin; scrollbar-color: #0840f3 transparent; -webkit-overflow-scrolling: touch; }
@media (min-width: 768px) { .hx-pgrid { grid-template-columns: repeat(3, 1fr); gap: 18px; max-height: 1080px; } }
@media (min-width: 1100px) { .hx-pgrid { grid-template-columns: repeat(4, 1fr); } }
.hx-pgrid .product-card { position: relative; border: 1px solid transparent; border-radius: 0; box-shadow: none; background: #fff; padding: 0 0 18px; overflow: hidden; width: 100%; max-width: none; margin: 0; text-align: left; transition: border-color .2s; }
.hx-pgrid .product-card:hover { border-color: #0840f3; }
.hx-pgrid .pc-img { padding: 0; margin: 0 0 14px; }
.hx-pgrid .pc-img a { padding-bottom: 100%; background: #fff; }
.hx-pgrid .pc-img img { width: 100%; height: 100%; object-fit: cover; }
.hx-pgrid .pc-head, .hx-pgrid .pc-bottom { padding: 0 16px; }
.hx-pgrid .pc-cat { font-size: 10.5px; letter-spacing: .8px; text-transform: uppercase; color: #0840f3; margin-bottom: 6px; }
.hx-pgrid .pc-title { font-size: 15px; font-weight: 700; line-height: 1.3; margin-bottom: 4px; }
.hx-pgrid .pc-brand { font-size: 11px; letter-spacing: .6px; text-transform: uppercase; color: #8b919c; }
.hx-pgrid .pc-brand small { font-size: 11px; text-transform: none; letter-spacing: 0; }
.hx-pgrid .pc-bottom { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e9e9e9; }
.hx-pgrid .pc-title, .hx-pgrid .pc-brand { padding: 0; margin-left: 0; margin-right: 0; text-align: left; }
.hx-pgrid .pc-price { margin: 0; padding: 0; text-align: left; justify-content: flex-start; }
.hx-pgrid .pc-price .pcp-actual { font-size: 18.4px; }
.hx-pgrid .pc-price .pcp-actual, .hx-pgrid .pc-price .pcp-100, .hx-pgrid .pc-price { text-align: left !important; }
.hx-pgrid .pc-vat { display: block; margin-top: 2px; font-size: 11px; color: #0840f3; text-align: left; }
.pc-pop { display: none; }
/* hx-mobile-price */
@media (max-width: 520px) { .hx-pgrid .pc-price .pcp-actual { font-size: 15.5px; } .hx-pgrid .pc-price .pcp-actual span, .hx-pgrid .pc-price .pcp-actual small { white-space: normal; } .hx-pgrid .pc-head, .hx-pgrid .pc-bottom { padding: 0 12px; } }
@media (hover: hover) {
	.hx-pgrid .pc-pop { display: flex; flex-direction: column; position: absolute; left: 0; right: 0; top: 0; bottom: 0; padding: 18px 16px 14px; background: #fff; color: #1d2126; text-decoration: none; text-align: left; opacity: 0; visibility: hidden; transition: opacity .2s, visibility .2s; z-index: 3; overflow: hidden; }
	.hx-pgrid .product-card:hover .pc-pop { opacity: 1; visibility: visible; }
	.pc-pop span { display: block; }
	.pc-pop .pp-k { font-size: 10.5px; letter-spacing: .8px; text-transform: uppercase; color: #0840f3; margin-bottom: 6px; }
	.pc-pop .pp-t { font-size: 16px; font-weight: 700; line-height: 1.25; margin-bottom: 12px; }
	.pc-pop .pp-r { font-size: 13px; line-height: 1.35; margin-bottom: 7px; }
	.pc-pop .pp-r i { display: block; font-style: normal; font-size: 11px; color: #8b919c; }
	.pc-pop .pp-d { font-size: 12.5px; line-height: 1.4; color: #5b616b; margin-top: 4px; }
	.pc-pop .pp-go { margin-top: auto; padding-top: 8px; font-size: 20px; color: #0840f3; }
}

/* Product page (desktop): wide gallery on the left with info below it, price block pinned on the right */
@media (min-width: 992px) {
  #product.product { display: grid; grid-template-columns: minmax(0, 1fr) 400px; column-gap: 40px; align-items: start; }
  #product.product:before, #product.product:after { display: none !important; }
  #product.product > h1 { grid-column: 1 / -1; }
  #product.product .product-gallery-wrap { grid-column: 1; grid-row: 2; width: auto; float: none; padding: 0; }
  #product.product .product-content { display: contents; }
  #product.product .product-buy { grid-column: 2; grid-row: 2 / span 12; position: sticky; top: 90px; align-self: start; width: auto; float: none; margin: 0; background: #fff; }
  #product.product .product-info, #product.product .product-description, #product.product .product-properties { grid-column: 1; padding-left: 0; padding-right: 0; }
  #product.product .product-gallery .fotorama__wrap { margin-left: 0; margin-right: 0; }
}
@media (min-width: 992px) {
  #product.product .product-extra, #product.product .product-calculator { grid-column: 1; }
  #product.product .product-buy { grid-row: 2 / span 14; }
}
@media (min-width: 992px) {
  .container:has(#product.product) { overflow-x: clip !important; overflow-y: visible !important; display: flow-root; }
}
@media (min-width: 992px) {
  #product.product .product-buy { box-sizing: border-box; }
  #product.product .product-buy .pb-calculate { display: block; float: none; margin: 8px 0 0; position: static; }
  #product.product .product-buy .hx-fit-btn, #product.product .product-buy .fr-btn { box-sizing: border-box; max-width: 100%; }
}

/* Product cards: photo without frame or fill, the site background shows through; refined price and VAT */
.catalog-list .product-card, .hx-pgrid .product-card { background: transparent; }
.catalog-list .pc-img, .hx-pgrid .pc-img, .hx-pgrid .pc-img a, .catalog-list .pc-img a { background: transparent; }
.catalog-list .pc-img img, .hx-pgrid .pc-img img { mix-blend-mode: multiply; }
.catalog-list .pc-price .pcp-actual, .hx-pgrid .pc-price .pcp-actual { font-size: 20px; font-weight: 700; letter-spacing: -.2px; line-height: 1.15; }
.catalog-list .pc-price .pcp-actual small, .hx-pgrid .pc-price .pcp-actual small { font-size: 12px; font-weight: 500; color: #8b919c; letter-spacing: 0; }
.catalog-list .pc-price:after { display: inline-block; margin-top: 5px; padding: 2px 8px; background: rgba(8,64,243,.07); color: #0840f3; font-size: 11px; font-weight: 600; letter-spacing: .2px; }
.hx-pgrid .pc-vat { display: inline-block; margin-top: 5px; padding: 2px 8px; background: rgba(8,64,243,.07); color: #0840f3; font-size: 11px; font-weight: 600; letter-spacing: .2px; }
@media (max-width: 640px) { .catalog-list .pc-price .pcp-actual, .hx-pgrid .pc-price .pcp-actual { font-size: 17px; } }

/* price details: VAT, box price, live total */
.pb-pinfo{margin:4px 0 10px;font-size:13px;line-height:1.5;color:#444}.pb-pinfo-row{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline}.pb-pinfo b{font-weight:700;color:#111}.pb-pinfo small{color:#777;font-size:12px}.pb-pinfo-incl{display:inline-block;background:#e9e9e9;padding:1px 6px;font-weight:700;color:#111}.pb-pinfo-total{margin-top:6px;padding-top:6px;border-top:1px solid #e9e9e9;font-size:14px}.pb-pinfo-total b{font-size:16px;color:#0840f3}.pb-pinfo-total em{font-style:normal;font-weight:700}

/* Product page (28.10): roomier price column — wider, more air, larger price details */
@media (min-width: 992px) {
  #product.product { grid-template-columns: minmax(0, 1fr) 470px; column-gap: 48px; }
  #product.product .product-buy { padding: 26px 28px 24px; border-color: #e3e5ea; }
  #product.product .pb-price-value.large span { font-size: 38px; }
  #product.product .pb-pinfo { font-size: 14.5px; margin: 10px 0 14px; }
  #product.product .pb-pinfo-row { gap: 6px 14px; }
  #product.product .pb-pinfo-row + .pb-pinfo-row { margin-top: 4px; }
  #product.product .pb-pinfo small { font-size: 13px; }
  #product.product .pb-pinfo-incl { padding: 2px 8px; }
  #product.product .pb-pinfo-total { margin-top: 12px; padding-top: 12px; font-size: 16px; }
  #product.product .pb-pinfo-total b { font-size: 22px; }
  #product.product .pb-project-note { margin: 10px 0 18px !important; font-size: 13.5px !important; }
  #product.product .pb-qty-tip { margin-top: 6px; }
  #product.product .pb-add-to-cart .btn { padding-left: 26px; padding-right: 26px; }
  #product.product .pb-calculate { margin-top: 12px !important; }
  #product.product .hx-fit-btn, #product.product .fr-btn { margin-top: 14px; }
}

/* Product variants as tiles/chips (30.10): the select stays hidden as the source of truth */
#product-variants.hx-sw-on select.hx-sw-src { position: absolute !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; margin: 0; }
#product-variants.hx-sw-on .form-col { position: relative; width: 100% !important; float: none; padding-left: 0; padding-right: 0; }
#product-variants.hx-sw-on .form-row { margin: 0; }
#product-variants.hx-sw-on label { display: block; font-weight: 700; font-size: 13px; margin-bottom: 8px; }
#product-variants.hx-sw-on label + br { display: none; }
#product-variants.hx-sw-on .pb-select-variation { display: none; }
.hx-sw { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.hx-sw button { font: inherit; cursor: pointer; background: #fff; border: 1px solid #c9ced6; color: #1d2126; padding: 0; text-align: center; box-sizing: border-box; border-radius: 0; }
.hx-sw button:hover { border-color: #0840f3; }
.hx-sw button.on { border: 2px solid #0840f3; }
.hx-sw button.off { color: #b4b8bf; border-style: dashed; cursor: not-allowed; text-decoration: line-through; }
.hx-sw button.off img { opacity: .35; }
.hx-chip { padding: 9px 14px; font-size: 14px; line-height: 1.2; }
.hx-chip.on { padding: 8px 13px; }
.hx-tile { width: 84px; padding: 5px 4px 4px; }
.hx-tile.on { padding: 4px 3px 3px; }
.hx-tile img { display: block; width: 72px; height: 72px; object-fit: contain; margin: 0 auto; mix-blend-mode: multiply; }
.hx-tile span { display: block; font-size: 11px; line-height: 1.2; margin-top: 4px; word-break: break-word; }
@media (max-width: 991px) {
  #product-variants.hx-sw-on .form-col { width: 100% !important; float: none; padding: 0; }
  .hx-sw { gap: 6px; }
  .hx-tile { width: 76px; } .hx-tile img { width: 64px; height: 64px; }
}
