/*
Theme Name:   Kurivo Gorica
Theme URI:    https://kurivogorica.si/
Description:  Child theme of Kadence for Kurivo Gorica. Colours, fonts, buttons, header and footer are set in Appearance → Customize; this file only adds the few design pieces Kadence has no setting for.
Author:       Kreativni Splet
Template:     kadence
Version:      0.15.21
Requires at least: 6.4
Requires PHP: 7.4
License:      GPL-2.0-or-later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  kg-child
*/

/*
 * Design tokens.
 * Every colour points at Kadence's global palette, so changing a colour in
 * Customize → Colors changes it here too. Only the three values Kadence has
 * no slot for are fixed hex.
 */
:root {
	--kg-red:      var(--global-palette1, #EF4323);
	--kg-red-dk:   var(--global-palette2, #CE3517);
	--kg-ink:      var(--global-palette3, #17191B);
	--kg-ink2:     var(--global-palette4, #3D4245);
	--kg-muted:    var(--global-palette5, #6E7478);
	--kg-grey:     var(--global-palette6, #8F9192);
	--kg-line:     var(--global-palette7, #E2E1DE);
	--kg-bg2:      var(--global-palette8, #F7F6F4);
	--kg-bg:       var(--global-palette9, #FFFFFF);

	--kg-steel:    #8D8E8F; /* siva vsebinskih pasic — kot na živi strani */
	--kg-steel-ov: rgba(0, 0, 0, .20); /* prekrivni sloj nad fotografijo — od 20. 10. črn in redek; siv je zameglil sliko */
	--kg-bg3:      #EDEBE8; /* photo placeholders */
	--kg-red-tint: #FDEEEA; /* [MISSING DATA] markers */

	--kg-disp: var(--global-heading-font-family, Archivo, "Helvetica Neue", Arial, sans-serif);
}

/* ------------------------------------------------------------------ type */

h1, h2, h3, h4 { letter-spacing: -0.022em; line-height: 1.06; }

.kg-eyebrow {
	font-size: 11px; font-weight: 600; letter-spacing: .15em;
	text-transform: uppercase; color: var(--kg-muted);
}
.kg-lead  { font-size: 18px; line-height: 1.62; color: var(--kg-ink2); }
.kg-small { font-size: 13px; line-height: 1.55; color: var(--kg-muted); }
.kg-stat  { font-family: var(--kg-disp); font-weight: 800; letter-spacing: -0.035em; line-height: 1; }

/* ---------------------------------------------------------------- blocks */

/* Card: add class "kg-card" to a Group block */
.kg-card {
	background: var(--kg-bg);
	border: 1px solid var(--kg-line);
	border-radius: 3px;
}

/* Dark band: add class "kg-dark" to a Group block */
.kg-dark { background: var(--kg-steel); color: #fff; }
.kg-dark :where(h1, h2, h3, h4) { color: #fff; }
.kg-dark :where(p) { color: rgba(255, 255, 255, .66); }

/* Photo placeholder until real photos arrive: class "kg-photo" on a Group */
.kg-photo {
	background-color: var(--kg-bg3);
	background-image: repeating-linear-gradient(45deg, rgba(23, 25, 27, .055) 0 1px, transparent 1px 10px);
	border-radius: 3px;
}

/* Missing-data marker, e.g. [CENA]: inline highlight or class "kg-ph" */
.kg-ph {
	font-family: var(--kg-disp); font-weight: 600; font-size: .92em;
	color: var(--kg-red-dk); background: var(--kg-red-tint);
	padding: 1px 7px; border-radius: 2px; white-space: nowrap;
}

/* Chip / filter pill */
.kg-chip {
	display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px;
	border: 1px solid var(--kg-line); border-radius: 2px;
	font-size: 12.5px; font-weight: 500; color: var(--kg-ink2); background: var(--kg-bg);
}

/* Outline button = the design's ghost button */
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 1px solid var(--kg-line);
	color: var(--kg-ink);
	background: transparent;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: var(--kg-ink);
	color: var(--kg-ink);
}

/* =========================================================== TRGOVINA ====
 * Kategorijska stran: drobtine, glava kategorije, filtri, mreža izdelkov.
 * ======================================================================= */

/* Follows Prilagodi → Postavitev → širina vsebine, so one setting moves the
   whole site. 1200px is only the fallback if the theme mod is ever missing. */
.kg-wrap { max-width: var(--global-content-width, 1200px); margin-inline: auto; padding-inline: 24px; }

/* Document pages (404 copy aside) read in a narrow column, but that column
   starts at the site's left edge — a centred column beside a left-aligned
   header looks like a mistake. */
.kg-doc-col { max-width: 46rem; margin-inline: 0; }

/* drobtine */
.kg-crumbs { background: var(--kg-bg2); border-bottom: 1px solid var(--kg-line); }
.kg-crumbs .kg-wrap { display: flex; align-items: center; gap: 10px; height: 46px; font-size: 12.5px; }
.kg-crumb { color: var(--kg-muted); font-weight: 500; }
.kg-crumb:hover { color: var(--kg-red); }
.kg-crumb.is-current { color: var(--kg-ink); font-weight: 600; }
.kg-crumb-sep { color: var(--kg-line); }

/* glava kategorije */
.kg-cathead { background: var(--kg-bg2); border-bottom: 1px solid var(--kg-line); }
.kg-cathead .kg-wrap { padding-block: 64px; }
.kg-cathead-grid { display: grid; grid-template-columns: 1.04fr .96fr; gap: 60px; align-items: center; }
.kg-cattitle { font-size: 46px; margin-top: 18px; letter-spacing: -0.034em; }
.kg-cathead .kg-lead { margin-top: 20px; max-width: 470px; }
.kg-cathead-actions { display: flex; gap: 12px; margin-top: 30px; }
.kg-cathead-photo { min-height: 320px; border-radius: 3px; display: flex; align-items: flex-end; padding: 18px; }

/* gumbi zunaj blokov */
.kg-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	height: 52px; padding: 0 26px; border-radius: 2px;
	font-family: var(--kg-disp); font-weight: 600; font-size: 15px;
	border: 1px solid transparent; white-space: nowrap;
}
.kg-btn-red { background: var(--kg-red); color: #fff; }
/* Hover je obdelan niže, v sklopu »rdeči gumbi: jeklenka ob hoverju«. */
.kg-btn-ghost { background: transparent; border-color: var(--kg-line); color: var(--kg-ink); }
.kg-btn-ghost:hover { border-color: var(--kg-ink); color: var(--kg-ink); }

/* postavitev kategorije */
.kg-catbody .kg-wrap { padding-block: 72px; }
.kg-catgrid { display: grid; grid-template-columns: 248px 1fr; gap: 52px; align-items: start; }

.kg-rail-title { font-family: var(--kg-disp); font-weight: 700; font-size: 17px; letter-spacing: -0.016em; }
.kg-rail-block { border-bottom: 1px solid var(--kg-line); padding: 18px 0; }
.kg-rail-block:last-child { border-bottom: 0; }
.kg-rail-label {
	font-family: var(--kg-disp); font-weight: 600; font-size: 13.5px;
	letter-spacing: .02em; text-transform: uppercase; color: var(--kg-muted); margin-bottom: 12px;
}
.kg-rail-list { list-style: none; margin: 0; padding: 0; }
.kg-rail-list li { margin-bottom: 9px; }
.kg-rail-list a { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; color: var(--kg-ink2); }
.kg-rail-list a:hover { color: var(--kg-red); }
.kg-rail-count { color: var(--kg-muted); font-size: 12.5px; }

.kg-catbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.kg-catbar-title { font-size: 26px; letter-spacing: -0.026em; margin: 0; }
.kg-catbody .woocommerce-result-count { margin: 5px 0 0; font-size: 13px; color: var(--kg-muted); }
.kg-catbody .woocommerce-ordering select {
	height: 40px; border: 1px solid var(--kg-line); border-radius: 2px;
	background: #fff; font-size: 13px; padding: 0 10px;
}

/* mreža in kartica izdelka */
.kg-catmain ul.products {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px; margin: 0; padding: 0; list-style: none;
}
.kg-catmain ul.products::before,
.kg-catmain ul.products::after { content: none; }

li.kg-prod {
	display: flex; flex-direction: column; width: auto !important; margin: 0 !important; float: none !important;
	background: #fff; border: 1px solid var(--kg-line); border-radius: 3px; overflow: hidden;
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

/* Hover and keyboard focus get the same treatment. :focus-within means a
   person tabbing through the grid sees the same card lift a mouse user sees,
   and the outline marks which card actually holds focus. */
li.kg-prod:hover,
li.kg-prod:focus-within {
	border-color: var(--kg-red); box-shadow: 0 6px 20px rgba(23, 25, 27, .10); transform: translateY(-2px);
}
li.kg-prod:focus-within { outline: 2px solid var(--kg-red); outline-offset: 2px; }
li.kg-prod:hover .kg-prod-media img,
li.kg-prod:focus-within .kg-prod-media img { transform: scale(1.03); }
.kg-prod-media img { transition: transform .35s ease; }
li.kg-prod .kg-prod-title a:focus-visible { outline: 2px solid var(--kg-red); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
	li.kg-prod,
	.kg-prod-media img { transition: none; }
	li.kg-prod:hover,
	li.kg-prod:focus-within { transform: none; }
	li.kg-prod:hover .kg-prod-media img,
	li.kg-prod:focus-within .kg-prod-media img { transform: none; }
}
/* One frame height for every card, whatever shape the photo is. Without the
   fixed ratio a portrait photo made its card taller than its neighbours and
   left the grey card background showing under the short ones. */
/* One frame height for every card, whatever shape the photo is. "contain",
   not "cover": these are products shot on white, and cropping a cylinder or
   a pallet to fill the box cut the ends off. */
.kg-prod-media { display: block; aspect-ratio: 4 / 3; background: #fff; overflow: hidden;
	border-bottom: 1px solid var(--kg-line); }
/* !important because Kadence prints its own ul.products img rules after the
   child theme and they set object-fit: cover. */
.kg-prod-media img,
li.kg-prod .kg-prod-media img,
ul.products li.product .kg-prod-media img {
	display: block; width: 100% !important; height: 100% !important;
	object-fit: contain !important; padding: 14px; box-sizing: border-box;
	max-width: none; margin: 0;
}
.kg-prod-photo { display: block; width: 100%; height: 100%; background: var(--kg-bg3); }
.kg-prod-body { padding: 18px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.kg-prod-title { font-family: var(--kg-disp); font-weight: 600; font-size: 16px; line-height: 1.25; letter-spacing: -0.012em; margin: 0; }
.kg-prod-title a { color: var(--kg-ink); }
.kg-prod-title a:hover { color: var(--kg-red); }
.kg-prod-desc { margin: 0; }
.kg-prod-foot { margin-top: auto; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.kg-prod-cta { align-self: stretch; text-align: center; }

/* gumb "V povpraševanje" v kartici */
li.kg-prod .button {
	height: 44px; padding: 0 18px; display: inline-flex; align-items: center;
	background: transparent; border: 1px solid var(--kg-line); border-radius: 2px;
	font-family: var(--kg-disp); font-weight: 600; font-size: 14px; color: var(--kg-ink);
}
li.kg-prod .button:hover { border-color: var(--kg-ink); background: transparent; color: var(--kg-ink); }
li.kg-prod .added_to_cart { display: none; }

@media (max-width: 1024px) {
	.kg-catgrid { grid-template-columns: 1fr; gap: 32px; }
	.kg-cathead-grid { grid-template-columns: 1fr; gap: 32px; }
	.kg-catmain ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kg-cathead .kg-wrap, .kg-catbody .kg-wrap { padding-block: 44px; }
	.kg-cattitle { font-size: 34px; }
}
@media (max-width: 600px) {
	.kg-catmain ul.products { grid-template-columns: 1fr; }
	.kg-prod-foot { flex-direction: column; align-items: stretch; }
}

/* --- popravki kartice izdelka ------------------------------------------ */

/* Kadence pripne puščico in ikono košarice; v tej kartici ju ne potrebujemo */
li.kg-prod .button .kadence-svg-iconset,
li.kg-prod .button .kt-cart-added-icon,
li.kg-prod .button::after { display: none !important; content: none !important; }

/* cena nad gumbom, gumb čez celo širino — v treh stolpcih je premalo prostora */
.kg-prod-foot { flex-direction: column; align-items: stretch; gap: 14px; }

/* Kadence izpiše svoje pravila za .button v vrstičnem CSS, torej ZA to
   datoteko in pri višji specifičnosti (.woocommerce ul.products li.product …).
   Zato tu !important: brez njega gumb ostane brez obrobe, brez ozadja in z
   Kadencovim robom, kar je bilo videti kot golo sredinsko besedilo. */
ul.products li.product .button,
ul.products li.product a.kg-btn-ghost,
li.kg-prod .button,
li.kg-prod a.kg-btn-ghost {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 44px !important;
	padding: 0 18px !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	background: transparent !important;
	border: 1px solid var(--kg-line) !important;
	border-radius: 2px !important;
	font-family: var(--kg-disp) !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	letter-spacing: -.004em !important;
	color: var(--kg-ink) !important;
	text-align: center !important;
	text-decoration: none !important;
	transition: background .16s ease, border-color .16s ease, color .16s ease;
}

ul.products li.product .button:hover,
li.kg-prod .button:hover,
li.kg-prod a.kg-btn-ghost:hover {
	background: var(--kg-red) !important;
	border-color: var(--kg-red) !important;
	color: #fff !important;
}

li.kg-prod .button.loading { opacity: .55; pointer-events: none; }

/* Dodano: gumb pove, da je izdelek notri, in ostane klikljiv za še enega. */
li.kg-prod .button.added,
ul.products li.product .button.added {
	background: var(--kg-red-tint) !important;
	border-color: var(--kg-red) !important;
	color: var(--kg-red) !important;
}
li.kg-prod .button.added::before,
ul.products li.product .button.added::before {
	content: "";
	width: 11px; height: 6px; margin-right: 9px;
	border-left: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg) translateY(-2px);
}

/* WooCommerce doda za gumbom še povezavo "Ogled košarice". Košarice ni, in
   povratno informacijo dá obvestilo spodaj desno. */
li.kg-prod a.added_to_cart,
ul.products li.product a.added_to_cart { display: none !important; }

/* ==================================================================== 404 */

.kg-404 .kg-wrap { padding-block: 96px 110px; }
.kg-404 .kg-wrap > * { max-width: 900px; }
.kg-404-title { font-size: 52px; letter-spacing: -.038em; margin: 14px 0 0; }
.kg-404 .kg-lead { margin-top: 18px; max-width: 54ch; }

.kg-404-search { display: flex; gap: 10px; margin-top: 30px; max-width: 540px; }
.kg-404-search input,
.kg-searchform input {
	flex: 1; height: 46px; padding: 0 15px;
	border: 1px solid var(--kg-line); border-radius: 2px; background: #fff;
	font-size: 15px; color: var(--kg-ink);
}
.kg-404-search input:focus,
.kg-searchform input:focus { outline: 2px solid var(--kg-red); outline-offset: -1px; }
.kg-404-search .kg-btn, .kg-searchform .kg-btn { height: 46px; }

.kg-404-grid {
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 40px;
}
.kg-404-card {
	display: flex; flex-direction: column; gap: 5px;
	border: 1px solid var(--kg-line); border-radius: 3px; padding: 18px 20px;
	background: #fff; color: var(--kg-ink);
}
.kg-404-card:hover { border-color: var(--kg-ink); color: var(--kg-ink); }
.kg-404-card-label { font-family: var(--kg-disp); font-weight: 600; font-size: 15.5px; letter-spacing: -.014em; }
.kg-404-card-count { font-size: 12.5px; color: var(--kg-muted); }

.kg-404-help { margin-top: 42px; padding-top: 22px; border-top: 1px solid var(--kg-line); font-size: 14.5px; }
.kg-404-help a { color: var(--kg-red); font-weight: 600; }
.kg-404-help .kg-small { display: block; margin-top: 4px; }

/* ================================================================= search */

.kg-searchhead { background: var(--kg-bg2); border-bottom: 1px solid var(--kg-line); }
.kg-searchhead .kg-wrap { padding-block: 60px 54px; }
.kg-searchtitle { font-size: 40px; letter-spacing: -.034em; margin: 14px 0 0; }
.kg-searchhead .kg-lead { margin-top: 14px; }
.kg-searchform { display: flex; gap: 10px; margin-top: 26px; max-width: 540px; }

.kg-searchbody .kg-wrap { padding-block: 60px 90px; }
.kg-searchsec {
	display: flex; align-items: baseline; gap: 10px;
	font-size: 15px; letter-spacing: .06em; text-transform: uppercase;
	color: var(--kg-muted); font-weight: 600;
	padding-bottom: 14px; border-bottom: 1px solid var(--kg-line); margin: 0 0 26px;
}
.kg-searchsec:not(:first-child) { margin-top: 56px; }
.kg-searchsec span { color: var(--kg-ink); }

ul.products.kg-searchgrid {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 20px;
	list-style: none; margin: 0; padding: 0;
}

.kg-searchlist { list-style: none; margin: 0; padding: 0; }
.kg-searchlist li { border-bottom: 1px solid var(--kg-line); }
.kg-searchlist a { display: block; padding: 18px 0; color: var(--kg-ink); }
.kg-searchlist a:hover .kg-searchlist-title { color: var(--kg-red); }
.kg-searchlist-title { display: block; font-family: var(--kg-disp); font-weight: 600; font-size: 17px; letter-spacing: -.016em; }
.kg-searchlist-ex { display: block; margin-top: 5px; font-size: 14px; line-height: 1.55; color: var(--kg-ink2); max-width: 74ch; }

.kg-searchempty { margin-top: 10px; font-size: 15px; color: var(--kg-ink2); }
.kg-searchempty ul { margin: 10px 0 0; padding-left: 20px; }
.kg-searchempty li { margin-bottom: 6px; }

/* ================================================== novice: list + article */

body.blog .content-container,
body.archive .content-container,
body.single-post .content-container { padding-block: 0; }

body.blog .loop-entry,
body.archive .loop-entry {
	border: 1px solid var(--kg-line); border-radius: 3px; box-shadow: none;
	background: #fff;
}
body.blog .loop-entry:hover,
body.archive .loop-entry:hover { border-color: var(--kg-ink); }
body.blog .loop-entry .entry-title,
body.archive .loop-entry .entry-title { font-size: 20px; letter-spacing: -.02em; line-height: 1.22; }
body.blog .loop-entry .entry-title a,
body.archive .loop-entry .entry-title a { color: var(--kg-ink); }
body.blog .loop-entry .entry-meta,
body.archive .loop-entry .entry-meta { font-size: 12.5px; color: var(--kg-muted); }
body.blog .loop-entry .entry-summary,
body.archive .loop-entry .entry-summary { font-size: 14.5px; line-height: 1.6; color: var(--kg-ink2); }
body.blog .post-thumbnail,
body.archive .post-thumbnail { background: var(--kg-bg3); }

/* An article is reading, so it gets the same measure as the legal pages. */
body.single-post .entry-content > *,
body.single-post .entry-content > .alignwide { max-width: 44rem; margin-inline: 0; }
body.single-post .entry-content { font-size: 16.5px; line-height: 1.72; color: var(--kg-ink2); padding-block: 48px 72px; }
body.single-post .entry-content p { margin: 0 0 1.15em; }
body.single-post .entry-content h2 { font-size: 25px; margin: 2.4em 0 .6em; color: var(--kg-ink); }
body.single-post .entry-content h3 { font-size: 18px; margin: 1.9em 0 .45em; color: var(--kg-ink); }
body.single-post .entry-content a { color: var(--kg-red); text-decoration: underline; text-underline-offset: 2px; }
body.single-post .entry-content blockquote {
	border-left: 2px solid var(--kg-red); padding-left: 20px; margin-inline: 0;
	font-size: 18px; line-height: 1.6; color: var(--kg-ink);
}
body.single-post .entry-hero-container { background: var(--kg-bg2); border-bottom: 1px solid var(--kg-line); }
body.single-post .entry-hero-container h1 { font-size: 40px; letter-spacing: -.034em; line-height: 1.08; }

@media (max-width: 900px) {
	.kg-404-grid { grid-template-columns: 1fr; }
	.kg-404-title { font-size: 34px; }
	.kg-404 .kg-wrap { padding-block: 56px 70px; }
	.kg-searchtitle { font-size: 28px; }
	ul.products.kg-searchgrid { grid-template-columns: repeat(2, 1fr); }
	body.single-post .entry-hero-container h1 { font-size: 28px; }
}
@media (max-width: 600px) {
	ul.products.kg-searchgrid { grid-template-columns: 1fr; }
	.kg-404-search, .kg-searchform { flex-direction: column; }
}

/* ============================================================ full-bleed bands

   The coloured bands run edge to edge; what sits inside them lines up with the
   header, which .kg-wrap handles. The width is the viewport MINUS the
   scrollbar (--kg-sbw, measured in functions.php), not 100vw: 100vw includes
   the scrollbar, so the band would overflow by ~15px and put a horizontal
   scrollbar on every page.

   The earlier fix for that was overflow-x: clip on an ancestor. That silently
   killed position: sticky on the header — any ancestor with a non-visible
   overflow becomes the sticky element's scroll container, and a container that
   does not scroll can never make anything stick. Hence the explicit visible
   below: exact widths mean there is nothing to clip. */

/* Kadence sets overflow: clip on #wrapper. Any ancestor whose overflow is not
   visible becomes the sticky header's scroll container, and a container that
   does not scroll can never make anything stick — so this has to win. The
   bands below are sized exactly, so there is nothing left to clip. */
html, body { overflow-x: visible; }
#wrapper.site, .wp-site-blocks { overflow: visible !important; }

:root { --kg-sbw: 0px; }

/* Kadence sizes every .alignfull block with width: var(--global-vw, 100vw) and
   declares .wp-site-blocks { --global-vw: calc(100vw - (0.5 * var(--scrollbar-offset))) }
   — it subtracts only HALF the scrollbar, so every full-width block overflows
   by 7.5px and puts a horizontal scrollbar on the page. That rule is printed in
   kadence-global-inline-css, which loads after this file, so an equally
   specific override would lose; "body" in front raises specificity instead of
   relying on order. Correcting the variable fixes Kadence's own formula, so
   full-width blocks the client builds in the editor line up too, with no
   change to their markup. */
body .wp-site-blocks { --global-vw: calc(100vw - var(--kg-sbw)); }

/* Every coloured band on the site, whether it comes from a template below or
   from a block on a page. Keyed on the band class, not on the block's
   "alignfull" attribute, so a page the client rebuilds in the editor still
   lines up. */
.entry-content > .kg-hero,
.entry-content > .kg-pagehead,
.entry-content > .kg-section,
.entry-content > .kg-cta,
.kg-crumbs,
.kg-cathead,
.kg-catbody,
.kg-404,
.kg-searchhead,
.kg-searchbody,
.kg-pagehead-band,
.kg-newsbody,
.kg-prodspecs,
.kg-prodcalc,
.kg-prodrel,
.kg-prodcta {
	width: calc(100vw - var(--kg-sbw));
	margin-inline: calc(50% - 50vw + var(--kg-sbw) / 2);
}

/* The inner container holds the content to the same column as the header, so
   a band's background runs edge to edge while its text starts at the logo. */
.kg-hero > .wp-block-group__inner-container,
.kg-pagehead > .wp-block-group__inner-container,
.kg-section > .wp-block-group__inner-container,
.kg-cta > .wp-block-group__inner-container {
	max-width: var(--global-content-width, 1200px);
	box-sizing: border-box;
	margin-inline: auto;
	padding-inline: 24px;
}

/* =========================================================== sticky header

   Sticky goes on #masthead, not on the inner row. A sticky element can never
   leave its parent's box, and the inner row's parent is only 131px tall, so it
   unstuck itself 42px down the page. #masthead's parent is the page wrapper. */

/* !important because kadence-header-css prints #masthead{position:relative}
   after this stylesheet, at the same specificity. */
body #masthead {
	position: sticky !important;
	top: 0;
	z-index: 500;
	background: var(--kg-bg, #fff);
	transition: box-shadow .22s ease;
}

.admin-bar #masthead { top: 32px; }

@media (max-width: 782px) {
	.admin-bar #masthead { top: 46px; }
}

body.kg-stuck #masthead {
	box-shadow: 0 1px 0 var(--kg-line), 0 6px 22px rgba(23, 25, 27, .07);
}

/* The thin strip above is information, not navigation. It collapses when the
   reader scrolls down and comes back the moment they scroll up — so the phone
   number is one flick away rather than a trip to the top of the page.

   max-height, not display:none: display cannot be animated, and the height is
   measured into --kg-topbar-h in functions.php rather than hard-coded, so the
   strip can grow or wrap without the animation cutting it off. */
.site-top-header-wrap {
	max-height: var(--kg-topbar-h, 60px);
	overflow: hidden;
	opacity: 1;
	transition: max-height .3s cubic-bezier(.4, 0, .2, 1), opacity .2s ease;
	will-change: max-height;
}

body.kg-hidetop .site-top-header-wrap {
	max-height: 0;
	opacity: 0;
}

.site-branding img,
.site-header-item .custom-logo-link img { transition: transform .22s ease; }

body.kg-stuck .site-branding img,
body.kg-stuck .site-header-item .custom-logo-link img { transform: scale(.86); transform-origin: left center; }

@media (prefers-reduced-motion: reduce) {
	#masthead, .site-branding img, .site-header-item .custom-logo-link img,
	.site-top-header-wrap { transition: none; }
	body.kg-stuck .site-branding img { transform: none; }
}

/* ========================================================== product page */

.kg-missing {
	background: var(--kg-red-tint); color: var(--kg-red);
	padding: 0 5px; border-radius: 2px; font-weight: 600; white-space: nowrap;
}

.kg-prodpage > .kg-wrap { padding-block: 48px 64px; }

.kg-prodtop { display: grid; grid-template-columns: 1.02fr .98fr; gap: 56px; align-items: start; }

.kg-prodgal-main { background: var(--kg-bg2); border: 1px solid var(--kg-line); border-radius: 3px; overflow: hidden; }
.kg-prodgal-main img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* A product with no photograph keeps the frame so the two columns still line
   up, but says nothing — a label naming the missing photo helps no buyer. */
.kg-prodgal-main.kg-prodgal-empty { aspect-ratio: 4 / 3; background: var(--kg-bg3); }
.kg-ph-lg { min-height: 440px; }
.kg-prodgal-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 10px; }
.kg-prodgal-thumb { background: var(--kg-bg2); border: 1px solid var(--kg-line); border-radius: 2px; aspect-ratio: 1; display: flex; }
.kg-prodgal-thumb img { width: 100%; height: 100%; object-fit: cover; }
.kg-prodgal-thumb .kg-ph { width: 100%; display: flex; align-items: center; justify-content: center; text-align: center; }

.kg-prodtitle { font-size: 40px; letter-spacing: -.034em; line-height: 1.08; margin: 12px 0 0; }
.kg-prodbuy .kg-lead { margin-top: 16px; max-width: 48ch; }

.kg-prodcart { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 22px; }
.kg-prodcart form.cart { display: flex; align-items: center; gap: 10px; margin: 0; }
.kg-prodcart .quantity input {
	width: 78px; height: 46px; padding: 0 10px; text-align: center;
	border: 1px solid var(--kg-line); border-radius: 2px; background: #fff;
	font-size: 15px; color: var(--kg-ink);
}
.kg-prodcart button.single_add_to_cart_button {
	height: 46px; padding: 0 22px; border: 0; border-radius: 2px;
	background: var(--kg-red); color: #fff; cursor: pointer;
	font-family: var(--kg-disp); font-weight: 600; font-size: 14.5px;
}
.kg-prodcart button.single_add_to_cart_button:hover { background: var(--kg-red-dk); }
.kg-prodcart .kg-btn-ghost { height: 46px; }
.kg-prodcart .kadence-svg-iconset, .kg-prodcart button::after { display: none !important; }

.kg-prodbadges { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; }
.kg-prodbadges li {
	font-size: 12.5px; color: var(--kg-ink2);
	border: 1px solid var(--kg-line); border-radius: 2px; padding: 6px 11px;
}

.kg-prodspecs { background: var(--kg-bg2); border-block: 1px solid var(--kg-line); }
.kg-prodspecs .kg-wrap { padding-block: 72px; }
.kg-prodspecs-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 56px; align-items: start; }
/* Brez stolpca z dokumenti naj besedilo in tabela dobita širino, ki je na
   voljo, ne pa ostaneta stisnjena na polovici s praznino na desni. */
.kg-prodspecs-grid.kg-prodspecs-wide { grid-template-columns: minmax(0, 1fr); max-width: none; }
.kg-prodspecs-grid .kg-proddesc { max-width: 78ch; }
.kg-prodspecs-grid .kg-proddesc p { margin: 0 0 12px; line-height: 1.65; }
.kg-prodspecs h2 { font-size: 30px; letter-spacing: -.028em; margin: 12px 0 26px; }

/* Label column fixed and narrower, so a long value gets the room instead of
   wrapping after two words. Zebra rows because the eye loses the line on a
   seven-row table of numbers. */
.kg-spectable { width: 100%; border-collapse: collapse; font-size: 15px; background: #fff;
	table-layout: fixed; border: 1px solid var(--kg-line); border-radius: 3px; }
.kg-spectable th, .kg-spectable td { text-align: left; padding: 14px 18px;
	border-bottom: 1px solid var(--kg-line); vertical-align: top; line-height: 1.5;
	overflow-wrap: break-word; hyphens: none; }
.kg-spectable th { font-family: var(--kg-disp); font-weight: 600; color: var(--kg-ink);
	width: 38%; background: var(--kg-bg2); }
.kg-spectable td { color: var(--kg-ink2); }
.kg-spectable tr:last-child th, .kg-spectable tr:last-child td { border-bottom: 0; }

@media (max-width: 600px) {
	/* Two columns at 38/62 leave about twelve characters each on a phone, so
	   the label goes above its value instead. */
	.kg-spectable, .kg-spectable tbody, .kg-spectable tr, .kg-spectable th, .kg-spectable td { display: block; width: auto; }
	.kg-spectable tr { border-bottom: 1px solid var(--kg-line); }
	.kg-spectable tr:last-child { border-bottom: 0; }
	.kg-spectable th { border-bottom: 0; padding-bottom: 2px; background: none;
		font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--kg-muted); }
	.kg-spectable td { border-bottom: 0; padding-top: 0; }
}
.kg-proddesc { margin-top: 28px; font-size: 15.5px; line-height: 1.7; color: var(--kg-ink2); max-width: 70ch; }

.kg-proddocs { background: #fff; border: 1px solid var(--kg-line); border-radius: 3px; padding: 22px; }
.kg-proddocs ul { list-style: none; margin: 16px 0 0; padding: 0; }
.kg-proddocs li { border-top: 1px solid var(--kg-line); }
.kg-proddocs li a {
	display: flex; justify-content: space-between; align-items: center; gap: 12px;
	padding: 13px 0; font-size: 14.5px; color: var(--kg-ink);
}
.kg-proddocs li a span { font-size: 11.5px; letter-spacing: .08em; color: var(--kg-red); font-weight: 700; }
.kg-proddocs li a:hover { color: var(--kg-red); }

.kg-prodcalc .kg-wrap { padding-block: 72px; }
.kg-prodcalc h2 { font-size: 30px; letter-spacing: -.028em; margin: 12px 0 14px; }
.kg-calcbox {
	display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; align-items: end;
	max-width: 660px; margin-top: 28px; padding: 22px;
	border: 1px solid var(--kg-line); border-radius: 3px; background: var(--kg-bg2);
}
.kg-calcbox label { display: flex; flex-direction: column; gap: 7px; }
.kg-calcbox label span { font-size: 12.5px; color: var(--kg-muted); }
.kg-calcbox input {
	height: 46px; padding: 0 12px; border: 1px solid var(--kg-line); border-radius: 2px;
	background: #fff; font-size: 16px; color: var(--kg-ink);
}
.kg-calcbox input:disabled { background: var(--kg-bg3); cursor: not-allowed; }
.kg-calcout { display: flex; flex-direction: column; gap: 7px; }
.kg-calcout span { font-size: 12.5px; color: var(--kg-muted); }
.kg-calcout strong { font-family: var(--kg-disp); font-weight: 800; font-size: 26px; letter-spacing: -.03em; color: var(--kg-ink); }
.kg-prodcalc.is-nodata .kg-calcout strong { color: var(--kg-muted); }
.kg-calc-src { margin-top: 14px; }

.kg-prodrel { background: var(--kg-bg2); border-top: 1px solid var(--kg-line); }
.kg-prodrel .kg-wrap { padding-block: 72px; }
.kg-prodrel h2 { font-size: 30px; letter-spacing: -.028em; margin: 12px 0 10px; }
ul.products.kg-relgrid {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 20px;
	list-style: none; margin: 30px 0 0; padding: 0;
}

.kg-prodcta { background: var(--kg-steel); }
.kg-prodcta .kg-wrap { padding-block: 64px; }
.kg-prodcta h2 { color: #fff; font-size: 32px; letter-spacing: -.03em; margin: 0; }
.kg-prodcta .kg-lead { color: rgba(255, 255, 255, .7); margin-top: 12px; max-width: 62ch; }
.kg-prodcta .kg-btn { margin-top: 26px; }

@media (max-width: 1000px) {
	.kg-prodtop { grid-template-columns: 1fr; gap: 36px; }
	.kg-prodspecs-grid { grid-template-columns: 1fr; gap: 34px; }
	.kg-prodtitle { font-size: 30px; }
	.kg-prodspecs h2, .kg-prodcalc h2, .kg-prodrel h2, .kg-prodcta h2 { font-size: 24px; }
	.kg-prodspecs .kg-wrap, .kg-prodcalc .kg-wrap, .kg-prodrel .kg-wrap, .kg-prodcta .kg-wrap { padding-block: 48px; }
}
@media (max-width: 680px) {
	.kg-calcbox { grid-template-columns: 1fr; }
	.kg-prodcart { flex-direction: column; align-items: stretch; }
	.kg-prodcart form.cart { width: 100%; }
	.kg-prodcart button.single_add_to_cart_button { flex: 1; }
	.kg-prodcart .kg-btn-ghost { justify-content: center; }
}

/* ================================================================= novice */

.kg-pagehead-band { background: var(--kg-bg2); border-bottom: 1px solid var(--kg-line); }
.kg-pagehead-band .kg-wrap { padding-block: 60px 54px; }
.kg-pagetitle { font-size: 42px; letter-spacing: -.034em; line-height: 1.08; margin: 14px 0 0; }
.kg-pagehead-band .kg-lead { margin-top: 14px; max-width: 62ch; }

.kg-newsbody .kg-wrap { padding-block: 60px 88px; }
.kg-newsgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 26px; }

.kg-news { background: #fff; border: 1px solid var(--kg-line); border-radius: 3px; overflow: hidden; display: flex; flex-direction: column; }
.kg-news:hover { border-color: var(--kg-ink); }
.kg-news-media { display: block; aspect-ratio: 16 / 10; background: var(--kg-bg3); }
.kg-news-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kg-news-media .kg-ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.kg-news-body { padding: 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.kg-news-date { font-size: 12.5px; color: var(--kg-muted); margin: 0; }
.kg-news-title { font-size: 19px; letter-spacing: -.02em; line-height: 1.25; margin: 0; }
.kg-news-title a { color: var(--kg-ink); }
.kg-news-title a:hover { color: var(--kg-red); }
.kg-news-ex { font-size: 14px; line-height: 1.6; color: var(--kg-ink2); margin: 0; }


@media (max-width: 900px) {
	.kg-pagetitle { font-size: 30px; }
	.kg-pagehead-band .kg-wrap { padding-block: 40px 34px; }
	.kg-newsbody .kg-wrap { padding-block: 40px 60px; }
}

/* ============================================= gumbi: brez skakanja ob hoverju

   Kadence doda .button.button-style-outline:hover { border:2px solid }, polni
   gumb pa v mirovanju nima obrobe. Oboje pomeni, da se višina gumba ob prehodu
   miške spremeni za 1–2px in vsebina pod njim poskoči. Rešitev je, da je
   prostor za obrobo rezerviran ves čas: 1px prosojne obrobe v mirovanju,
   1px barvne ob hoverju. Nič se ne premakne. */

.wp-block-button__link,
.wp-element-button,
.kg-btn,
.button,
button.single_add_to_cart_button {
	border: 1px solid transparent;
	box-sizing: border-box;
}

/* WordPress core gives .is-style-outline a 2px border and its own padding
   (:root :where(...)), and Kadence prints its own button rules after the
   child theme. Either one reintroduces the 1-2px jump. "body" in front wins
   both, and pinning the width in every state means nothing moves. */
body .wp-block-button__link,
body .wp-element-button,
body .kg-btn,
body .button,
body button.single_add_to_cart_button,
body .is-style-outline > .wp-block-button__link,
body .wp-block-button__link:hover,
body .wp-block-button__link:focus,
body .wp-block-button__link:active,
body .wp-element-button:hover,
body .wp-element-button:focus,
body .kg-btn:hover,
body .kg-btn:focus,
body .button:hover,
body .button:focus,
body .button:active,
body button.single_add_to_cart_button:hover,
body .is-style-outline > .wp-block-button__link:hover,
body .is-style-outline > .wp-block-button__link:focus,
body .kg-prodcart .button,
body .kg-prodcart .button:hover,
body .kg-prodcart .kg-btn,
body .kg-prodcart .kg-btn:hover,
body .kg-prodcart button,
body .kg-prodcart button:hover,
body .kg-prodcart a,
body .kg-prodcart a:hover,
body .single_add_to_cart_button,
body .single_add_to_cart_button:hover,
body .single_add_to_cart_button:focus,
body .single_add_to_cart_button:active {
	border-width: 1px !important;
	border-style: solid !important;
	box-sizing: border-box !important;
}

/* ======================================== rdeči gumbi: jeklenka ob hoverju

   Rdeč gumb ob prehodu miške dobi videz jeklenke: brušeno jeklo pridrsi z
   leve, čezenj pa enkrat potegne odsev. Velja samo za gumbe, ki so rdeči v
   mirovanju — gumbi na karticah izdelkov so v mirovanju obrisani in rdeči
   šele ob hoverju, zato jih to ne zadene.

   Brez psevdoelementov: oba sloja sta ozadji istega gumba, zato se nič ne
   plasti nad besedilom in nič ne premakne postavitve. Animira se
   background-size in background-position, oboje je na GPU. */

:root {
	/* Ozek temen pas malo pod sredino in dva svetla robova: tako ploščica
	   bere kot valj, ne kot siv pravokotnik. */
	--kg-steel-1: #FDFDFE;  /* zgornji rob */
	--kg-steel-2: #EDEFF1;
	--kg-steel-3: #C3C7CB;
	--kg-steel-4: #A3A7AC;  /* senčni pas */
	--kg-steel-5: #C7CBCF;
	--kg-steel-6: #EFF1F3;  /* spodnji odboj */
	--kg-steel-7: #D4D7DA;
	--kg-steel-edge: #8E9398;
}

body .kg-btn-red,
body .kg-prod-cta,
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link,
body button.single_add_to_cart_button,
body a.header-button.button-style-filled {
	background-color: var(--kg-red);
	background-repeat: no-repeat;
	background-image:
		linear-gradient(105deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.78) 50%, rgba(255,255,255,0) 62%),
		linear-gradient(180deg,
			var(--kg-steel-1) 0%,
			var(--kg-steel-2) 10%,
			var(--kg-steel-3) 38%,
			var(--kg-steel-4) 50%,
			var(--kg-steel-4) 54%,
			var(--kg-steel-5) 66%,
			var(--kg-steel-6) 86%,
			var(--kg-steel-7) 100%);
	background-size: 220% 100%, 0% 100%;
	background-position: 150% 0, left center;
	transition:
		background-size   .34s cubic-bezier(.22, .61, .36, 1),
		background-position .62s cubic-bezier(.22, .61, .36, 1),
		color             .22s ease,
		border-color      .28s ease,
		box-shadow        .28s ease;
}

body .kg-btn-red:hover,
body .kg-btn-red:focus-visible,
body .kg-prod-cta:hover,
body .kg-prod-cta:focus-visible,
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible,
body button.single_add_to_cart_button:hover,
body button.single_add_to_cart_button:focus-visible,
body a.header-button.button-style-filled:hover,
body a.header-button.button-style-filled:focus-visible {
	background-size: 220% 100%, 100% 100%;
	background-position: -55% 0, left center;
	color: #fff !important;
	border-color: #fff !important;
	/* Belo besedilo na kovini je Lukova izbira. Razmerje je 2,4 : 1, kar je
	   pod pragom WCAG AA, zato ga drži pokonci senca pod črkami. */
	text-shadow: 0 1px 2px rgba(23, 25, 27, .55);
	/* Kadence postavi box-shadow:none !important na hover, zato tudi tu. */
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.95),
		inset 0 -1px 0 rgba(0,0,0,.10),
		0 4px 14px rgba(23,25,27,.16) !important;
}

/* Pritisk: kovina potemni in gumb se ne dvigne. */
body .kg-btn-red:active,
body .kg-prod-cta:active,
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:active,
body button.single_add_to_cart_button:active,
body a.header-button.button-style-filled:active {
	background-image:
		linear-gradient(105deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 62%),
		linear-gradient(180deg, var(--kg-steel-2) 0%, var(--kg-steel-4) 48%, var(--kg-steel-3) 100%);
	box-shadow: inset 0 2px 5px rgba(0,0,0,.18) !important;
}

/* Tipkovnica dobi isto kovino in zraven še rdeč obroč, da je vidno, kje je. */
body .kg-btn-red:focus-visible,
body .kg-prod-cta:focus-visible,
body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:focus-visible,
body button.single_add_to_cart_button:focus-visible,
body a.header-button.button-style-filled:focus-visible {
	outline: 2px solid var(--kg-red);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	body .kg-btn-red,
	body .kg-prod-cta,
	body .wp-block-button:not(.is-style-outline) > .wp-block-button__link,
	body button.single_add_to_cart_button,
	body a.header-button.button-style-filled { transition: color .01s linear; }

	/* Kovina se še vedno pokaže, samo brez drsenja in brez odseva. */
	body .kg-btn-red:hover,
	body .kg-prod-cta:hover,
	body .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
	body button.single_add_to_cart_button:hover,
	body a.header-button.button-style-filled:hover {
		background-position: 150% 0, left center;
	}
}

/* The inquiry button on the product page sat 1px taller on hover because
   Kadence re-declares its border there. Height and padding pinned too, so
   nothing below it can move whatever the border does. */
body .kg-prodcart .button,
body .kg-prodcart .kg-btn,
body .kg-prodcart button.single_add_to_cart_button {
	height: 52px !important;
	min-height: 52px !important;
	padding-block: 0 !important;
	line-height: 1 !important;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-element-button:hover,
.kg-btn:hover,
.button:hover,
.button:focus,
.button.button-style-outline:hover,
.button.button-style-outline:focus,
.button.button-style-outline:active {
	border-width: 1px !important;
	border-style: solid !important;
}

/* Kadence dvigne gumb s senco ob hoverju; na tej strani je to tujek. */
.wp-block-button__link:hover,
.wp-element-button:hover,
.button:hover,
.kg-btn:hover { box-shadow: none !important; }

/* Obrisani gumb ima obrobo že v mirovanju, zato se ne sme podvojiti. */
.is-style-outline > .wp-block-button__link,
.kg-btn-ghost { border: 1px solid var(--kg-line); }
.is-style-outline > .wp-block-button__link:hover,
.kg-btn-ghost:hover { border-color: var(--kg-ink); }
.kg-dark .is-style-outline > .wp-block-button__link { border-color: rgba(255, 255, 255, .35); }
.kg-dark .is-style-outline > .wp-block-button__link:hover { border-color: #fff; }

/* ===================================================== paginacija seznamov

   WooCommerce in Kadence jo pustita poravnano na levo pod mrežo izdelkov.
   Sredinsko je edina smiselna, ker je mreža široka čez celo vsebino. */

.woocommerce-pagination,
.kg-catmain .woocommerce-pagination,
.kg-searchbody .pagination,
.kg-searchbody .navigation,
.kg-newsbody .pagination,
.kg-newsbody .navigation {
	display: flex; justify-content: center; margin-top: 48px;
}

.woocommerce-pagination ul.page-numbers,
.kg-searchbody .nav-links,
.kg-newsbody .nav-links {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px;
	list-style: none; margin: 0; padding: 0; border: 0;
}

.woocommerce-pagination ul.page-numbers li { margin: 0; border: 0; }

.woocommerce-pagination .page-numbers,
.kg-searchbody .nav-links .page-numbers,
.kg-newsbody .nav-links .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 42px; height: 42px; padding: 0 12px; box-sizing: border-box;
	border: 1px solid var(--kg-line); border-radius: 2px; background: transparent;
	font-family: var(--kg-disp); font-weight: 600; font-size: 14.5px; color: var(--kg-ink);
	text-decoration: none; transition: border-color .16s ease, background .16s ease, color .16s ease;
}

.woocommerce-pagination a.page-numbers:hover,
.kg-searchbody .nav-links a.page-numbers:hover,
.kg-newsbody .nav-links a.page-numbers:hover { border-color: var(--kg-ink); }

.woocommerce-pagination .page-numbers.current,
.kg-searchbody .nav-links .page-numbers.current,
.kg-newsbody .nav-links .page-numbers.current {
	background: var(--kg-red); border-color: var(--kg-red); color: #fff;
}

.woocommerce-pagination .page-numbers.dots { border-color: transparent; background: none; }

.woocommerce-pagination a.page-numbers:focus-visible,
.kg-searchbody .nav-links a.page-numbers:focus-visible,
.kg-newsbody .nav-links a.page-numbers:focus-visible { outline: 2px solid var(--kg-red); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) { .woocommerce-pagination .page-numbers { transition: none; } }

/* Cilj skoka iz menija ali gumba ne sme končati pod lepljivo glavo. */
[id] { scroll-margin-top: 110px; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }


/* =====================================================================
   v0.14.0 — popravki po sestanku s stranko (15. 10. 2026)
   1) večji logotip  2) mehkejša tipografija  3) siva namesto črne
   4) pasica kategorije čez celo širino  5) kartice kategorij  6) noga
   ===================================================================== */

/* ---- pisava: Figtree (OFL, lokalno), mehkejša od Archivo ---------------- */
@font-face {
	font-family: "Figtree Variable"; font-style: normal; font-weight: 300 900; font-display: swap;
	src: url("assets/fonts/figtree-latin-ext-wght-normal.woff2") format("woff2-variations");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Figtree Variable"; font-style: normal; font-weight: 300 900; font-display: swap;
	src: url("assets/fonts/figtree-latin-wght-normal.woff2") format("woff2-variations");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
body {
	--global-heading-font-family: "Figtree Variable", "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
	--kg-disp: var(--global-heading-font-family);
}
h1, h2, h3, h4, h5, h6, .kg-stat, .kg-btn, .kg-card .wp-block-heading {
	font-family: var(--kg-disp);
}

/* ---- tipografija: manj glasna, bolj naravna ----------------------------- */
body h1, body h2, body h3, body h4 { font-weight: 600; letter-spacing: -0.012em; line-height: 1.18; }
body h1 { font-size: clamp(31px, 3.6vw, 42px); line-height: 1.12; letter-spacing: -0.016em; }
body h2 { font-size: clamp(25px, 2.5vw, 31px); }
body h3 { font-size: 18px; line-height: 1.28; letter-spacing: -0.006em; }
body h4 { font-size: 16px; }

.kg-eyebrow {
	font-size: 13px; font-weight: 500; letter-spacing: .01em;
	text-transform: none; color: var(--kg-muted);
}
.kg-lead  { font-size: 17.5px; line-height: 1.68; }
.kg-stat  { font-weight: 600; letter-spacing: -0.02em; }
.kg-calcout strong { font-weight: 600; letter-spacing: -0.02em; }

.kg-cattitle     { font-size: clamp(30px, 3.4vw, 40px); letter-spacing: -0.016em; font-weight: 600; }
.kg-pagetitle    { font-size: clamp(30px, 3.2vw, 38px); letter-spacing: -0.016em; }
.kg-prodtitle    { font-size: clamp(27px, 3vw, 35px); letter-spacing: -0.016em; line-height: 1.14; }
.kg-404-title    { font-size: clamp(34px, 4vw, 46px); letter-spacing: -0.02em; }
.kg-searchtitle  { font-size: clamp(28px, 3vw, 36px); letter-spacing: -0.016em; }
.kg-catbar-title { font-size: 23px; letter-spacing: -0.012em; }
.kg-prodspecs h2, .kg-prodcalc h2, .kg-prodrel h2 { font-size: 26px; letter-spacing: -0.014em; }
.kg-prodcta h2   { font-size: 28px; letter-spacing: -0.014em; }
.kg-news-title, body.archive .loop-entry .entry-title { letter-spacing: -0.01em; }
body.single-post .entry-hero-container h1 { font-size: clamp(29px, 3.2vw, 37px); letter-spacing: -0.016em; }
.kg-rail-title, .kg-prod-title, .kg-spectable th, .kg-404-card-label, .kg-searchlist-title { letter-spacing: -0.006em; }
.kg-rail-label, .kg-searchsec, .kg-proddocs li a span { text-transform: none; letter-spacing: .01em; }
.kg-rail-label { font-size: 13px; font-weight: 600; }
.kg-btn { font-weight: 600; letter-spacing: 0; border-radius: 4px; }

/* ---- siva namesto črne: vsebinski sklopi, zgornja vrstica in noga.
       Glavna vrstica glave ostane bela. ------------------------------------ */
.kg-dark, .kg-section.kg-dark, .kg-cta, .kg-prodcta { background: var(--kg-steel); }
.site-top-header-wrap > .site-header-row-container-inner,
.site-top-footer-wrap > .site-footer-row-container-inner,
.site-bottom-footer-wrap > .site-footer-row-container-inner { background-color: var(--kg-steel) !important; }
.site-top-header-wrap :where(a, span, p) { color: rgba(255, 255, 255, .94); }
.site-footer :where(p, li, a, span) { color: rgba(255, 255, 255, .94); }
.site-top-header-wrap a:hover, .site-footer a:hover { color: #fff; }
.kg-dark :where(p) { color: rgba(255, 255, 255, .92); }
.kg-dark :where(.kg-small) { color: rgba(255, 255, 255, .86); }

/* ---- logotip večji (glava, noga) ---------------------------------------- */
.site-branding a.brand img.custom-logo,
.site-branding img.custom-logo { width: 236px !important; max-width: none !important; height: auto !important; }
#colophon img.wp-image-53,
.site-footer img[src*="logo-bela"] { width: 176px !important; max-width: 100% !important; height: auto !important; }
@media (max-width: 1024px) {
	.site-branding a.brand img.custom-logo { width: 190px !important; }
}
@media (max-width: 600px) {
	.site-branding a.brand img.custom-logo { width: 156px !important; }
	#colophon img.wp-image-53 { width: 160px !important; }
}

/* ---- pasica kategorije čez celo širino (kot Plin na dom) ---------------- */
.kg-cathead {
	position: relative; overflow: hidden; border-bottom: 0;
	background: var(--kg-steel); color: #fff; isolation: isolate;
}
.kg-cathead .kg-cathead-photo {
	position: absolute !important; inset: 0; z-index: -2;
	min-height: 0 !important; border-radius: 0 !important; padding: 0 !important;
	background-color: var(--kg-steel);
}
.kg-cathead::after {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: var(--kg-steel-ov);
}
/* rahlo senčilo samo pod besedilom, da naslov drži berljivost nad fotografijo */
.kg-cathead::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(90deg, rgba(0, 0, 0, .30) 0%, rgba(0, 0, 0, .12) 55%, transparent 80%);
}
.kg-cathead .kg-wrap { padding-block: 84px; }
.kg-cathead-grid { display: block; max-width: 640px; }
.kg-cathead .kg-eyebrow { color: rgba(255, 255, 255, .82); }
.kg-cathead .kg-cattitle { color: #fff; margin-top: 10px; }
.kg-cathead .kg-lead { color: rgba(255, 255, 255, .92); max-width: 540px; }
.kg-cathead .kg-lead p { color: inherit; }
.kg-cathead .kg-btn-ghost { border-color: rgba(255, 255, 255, .7); color: #fff; }

@media (max-width: 767px) {
	.kg-cathead .kg-wrap { padding-block: 52px; }
	.kg-cathead::after { background: rgba(0, 0, 0, .38); }
	.kg-cathead-actions { flex-wrap: wrap; }
}

/* ---- kartice kategorij na uvodni: cela kartica je povezava -------------- */
body .kg-cat { position: relative; transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
body .kg-cat .kg-cat-title a { transition: color .2s ease; }
body .kg-cat .kg-cat-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; }
body .kg-cat::before { transition: transform .25s ease; transform-origin: left center; }
body .kg-cat .kg-cat-title {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
body .kg-cat .kg-cat-title::after {
	content: ""; flex: none; width: 18px; height: 18px; background: var(--kg-red);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center/contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center/contain;
	opacity: 0; transform: translateX(-6px); transition: opacity .25s ease, transform .25s ease;
}
body .kg-cat:hover, body .kg-cat:focus-within {
	border-color: var(--kg-ink2); box-shadow: 0 10px 24px -14px rgba(23, 25, 27, .35); transform: translateY(-2px);
}
body .kg-cat:hover .kg-cat-title::after,
body .kg-cat:focus-within .kg-cat-title::after { opacity: 1; transform: none; }
body .kg-cat:hover .kg-cat-title a { color: var(--kg-ink); }
body .kg-cat .kg-cat-title a:focus-visible { outline: none; }
body .kg-cat:has(.kg-cat-title a:focus-visible) { outline: 2px solid var(--kg-ink); outline-offset: 3px; }
@media (hover: none) { body .kg-cat .kg-cat-title::after { opacity: .85; transform: none; } }
@media (prefers-reduced-motion: reduce) {
	body .kg-cat, body .kg-cat::before, body .kg-cat .kg-cat-title::after, body .kg-cat .kg-cat-title a { transition: none; }
	body .kg-cat:hover, body .kg-cat:focus-within { transform: none; }
}

/* ---- noga: logotipa partnerjev pod podatki o podjetju ------------------- */
.kg-foot-logos {
	display: flex; flex-wrap: wrap; align-items: center; gap: 18px 22px;
	margin-top: 28px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .22);
}
.kg-foot-logos a, .kg-foot-logos span { display: inline-flex; align-items: center; }
.kg-foot-logos a { transition: opacity .18s ease; }
.kg-foot-logos a:hover { opacity: .85; }
.kg-foot-logos a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.kg-foot-topdom { background: none; padding: 0; }
.kg-foot-topdom img { display: block; height: 34px; width: auto; filter: brightness(0) invert(1); }
.kg-foot-giz img { display: block; height: 44px; width: auto; }

/* ---- stran Partnerji ---------------------------------------------------- */
.kg-partners { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 8px 0 0; padding: 0; list-style: none; }
.kg-partner {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
	min-height: 168px; padding: 28px 22px; text-align: center;
	background: var(--kg-bg); border: 1px solid var(--kg-line); border-radius: 4px;
	position: relative;
}
.kg-partner img { display: block; max-width: 100%; max-height: 64px; width: auto; height: auto; object-fit: contain; }
.kg-partner-name { font-family: var(--kg-disp); font-weight: 600; font-size: 15px; color: var(--kg-ink); }
@media (max-width: 1024px) { .kg-partners { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .kg-partners { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } .kg-partner { min-height: 132px; padding: 20px 14px; } }

/* glava: le toliko višja, da večji logotip ni odrezan */
.site-main-header-inner-wrap { min-height: 96px !important; }
@media (max-width: 1024px) { .site-main-header-inner-wrap { min-height: 76px !important; } }
.kg-btn { text-decoration: none; }

/* ---- v0.14.1 ---------------------------------------------------------- */

/* Gumb na strani izdelka: WooCommerce ima za .button.alt močnejši izbirnik od
   sklopa »jeklenka ob hoverju«, zato je ta gumb ostal brez kovine. Isti
   sloji, le z zadostno težo izbirnika. */
body .woocommerce button.single_add_to_cart_button.alt,
body button.single_add_to_cart_button.button.alt,
body .woocommerce a.button.alt,
body .woocommerce button.button.alt {
	background-color: var(--kg-red);
	background-repeat: no-repeat;
	background-image:
		linear-gradient(105deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.78) 50%, rgba(255,255,255,0) 62%),
		linear-gradient(180deg,
			var(--kg-steel-1) 0%,
			var(--kg-steel-2) 10%,
			var(--kg-steel-3) 38%,
			var(--kg-steel-4) 50%,
			var(--kg-steel-4) 54%,
			var(--kg-steel-5) 66%,
			var(--kg-steel-6) 86%,
			var(--kg-steel-7) 100%);
	background-size: 220% 100%, 0% 100%;
	background-position: 150% 0, left center;
	transition:
		background-size   .34s cubic-bezier(.22, .61, .36, 1),
		background-position .62s cubic-bezier(.22, .61, .36, 1),
		color             .22s ease,
		border-color      .28s ease,
		box-shadow        .28s ease;
}
body .woocommerce button.single_add_to_cart_button.alt:hover,
body .woocommerce button.single_add_to_cart_button.alt:focus-visible,
body button.single_add_to_cart_button.button.alt:hover,
body button.single_add_to_cart_button.button.alt:focus-visible,
body .woocommerce a.button.alt:hover,
body .woocommerce a.button.alt:focus-visible,
body .woocommerce button.button.alt:hover,
body .woocommerce button.button.alt:focus-visible {
	background-size: 220% 100%, 100% 100%;
	background-position: -55% 0, left center;
	color: #fff !important;
	border-color: #fff !important;
	text-shadow: 0 1px 2px rgba(23, 25, 27, .55);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.95),
		inset 0 -1px 0 rgba(0,0,0,.10),
		0 4px 14px rgba(23,25,27,.16) !important;
}
body .woocommerce button.single_add_to_cart_button.alt:active,
body button.single_add_to_cart_button.button.alt:active,
body .woocommerce a.button.alt:active,
body .woocommerce button.button.alt:active {
	background-image:
		linear-gradient(105deg, rgba(255,255,255,0) 38%, rgba(255,255,255,.45) 50%, rgba(255,255,255,0) 62%),
		linear-gradient(180deg, var(--kg-steel-2) 0%, var(--kg-steel-4) 48%, var(--kg-steel-3) 100%);
	box-shadow: inset 0 2px 5px rgba(0,0,0,.18) !important;
}
@media (prefers-reduced-motion: reduce) {
	body .woocommerce button.single_add_to_cart_button.alt,
	body button.single_add_to_cart_button.button.alt,
	body .woocommerce a.button.alt,
	body .woocommerce button.button.alt { transition: color .01s linear; }
	body .woocommerce button.single_add_to_cart_button.alt:hover,
	body button.single_add_to_cart_button.button.alt:hover,
	body .woocommerce a.button.alt:hover,
	body .woocommerce button.button.alt:hover { background-position: 150% 0, left center; }
}

/* Noga: logotip sede višje, da ni praznine nad njim. */
#colophon .kg-footer-brand { margin-top: -20px; margin-bottom: 4px; }
@media (max-width: 767px) { #colophon .kg-footer-brand { margin-top: -10px; } }

/* ---- v0.14.2: enotna pisava v glavi ------------------------------------ */
/* Kadence napiše meniju Archivo, zgornja vrstica pa je ostala na pisavi
   besedila. Oboje gre na Figtree, meni in zgornja vrstica malo večja. */
#masthead .main-navigation .menu-item > a,
#masthead .header-navigation ul li a,
#masthead a.header-button,
#masthead .site-top-header-wrap,
#masthead .site-top-header-wrap :where(a, p, span, div) {
	font-family: var(--kg-disp) !important;
}
#masthead .main-navigation .menu-item > a {
	font-size: 16px !important; font-weight: 600; letter-spacing: -.004em;
}
#masthead a.header-button { font-size: 15.5px !important; font-weight: 600; }
#masthead .site-top-header-wrap,
#masthead .site-top-header-wrap :where(a, p, span) { font-size: 13.5px !important; }
@media (max-width: 1024px) {
	#masthead .main-navigation .menu-item > a { font-size: 15px !important; }
	#masthead .site-top-header-wrap,
	#masthead .site-top-header-wrap :where(a, p, span) { font-size: 12.5px !important; }
}

/* ---- v0.14.3: ravnotežje glave, iskalnik in povpraševanje v zgornji vrstici */

/* Kadence da levemu in desnemu stolpcu fiksnih 260 px, zato je meni z osmimi
   postavkami visel bližje desni strani. Stolpca se zdaj prilegata vsebini
   (logotip 142 px, gumb 151 px), meni pa dobi ves prostor med njima. */
.site-main-header-inner-wrap { grid-template-columns: auto 1fr auto !important; }

/* Iskalnik: večja ikona. */
.site-top-header-wrap .search-toggle-open { font-size: 19px !important; }
.site-top-header-wrap .search-toggle-open svg { width: 19px !important; height: 19px !important; }

/* Povpraševanje: v zgornji vrstici je gumb z napisom, ne le ikona. */
.site-top-header-wrap .kg-qn-wrap { margin-right: 0; }
.site-top-header-wrap .kg-qn {
	display: inline-flex; align-items: center; gap: 8px;
	height: 30px; padding: 0 12px;
	border: 1px solid rgba(255, 255, 255, .55); border-radius: 3px;
	color: #fff; font-weight: 600; text-decoration: none;
}
.site-top-header-wrap .kg-qn,
.site-top-header-wrap .kg-qn svg { color: #fff; }
.site-top-header-wrap .kg-qn .kg-qn-label { color: inherit; }
.site-top-header-wrap .kg-qn:hover,
.site-top-header-wrap .kg-qn:focus-visible,
.site-top-header-wrap .kg-qn:hover svg,
.site-top-header-wrap .kg-qn:hover .kg-qn-label,
.site-top-header-wrap .kg-qn:focus-visible .kg-qn-label { color: var(--kg-red); }
.site-top-header-wrap .kg-qn:hover,
.site-top-header-wrap .kg-qn:focus-visible { background: #fff; border-color: #fff; }
.site-top-header-wrap .kg-qn svg { width: 17px; height: 17px; }
.site-top-header-wrap .kg-qn .kg-qn-label { display: inline !important; font-size: 13px; white-space: nowrap; }
.site-top-header-wrap .kg-qn-count { position: relative; top: -1px; }
.site-top-header-wrap .site-header-top-section-right { gap: 16px; }
@media (max-width: 1024px) {
	.site-top-header-wrap .kg-qn .kg-qn-label { display: none !important; }
	.site-top-header-wrap .kg-qn { padding: 0 9px; }
}

/* ---- v0.15.0: novice in enoten slog ------------------------------------ */

/* Komentarjev ni; če jih kak vtičnik vseeno izriše, naj se ne vidijo. */
.comments-area,
#comments,
#respond,
.comment-respond,
.entry-meta .comments-link,
.entry-meta .comment-count { display: none !important; }

/* Avtor prispevka ni podatek, ki bi bralcu kaj povedal — ostane datum. */
.entry-meta .posted-by,
.entry-related .entry-meta .posted-by { display: none; }
.entry-meta { font-size: 13px; color: var(--kg-muted); }
.entry-meta a { color: var(--kg-muted); }

/* Glava novice: enak ritem kot druge podstrani. */
body.single-post .entry-hero-container .entry-header { padding-block: 56px 0; }
body.single-post .entry-content > p:first-of-type { font-size: 17.5px; color: var(--kg-ink2); }
body.single-post .entry-content img,
body.single-post .entry-content figure img { border-radius: 10px; }

/* Sorodne novice: kartice kot na seznamu novic, ne Kadenceova privzeta mreža. */
.entry-related {
	background: var(--kg-bg2); border-top: 1px solid var(--kg-line);
	padding-block: 56px 64px; margin-top: 56px;
}
.entry-related-title {
	font-family: var(--kg-disp); font-weight: 600; font-size: 24px;
	letter-spacing: -.014em; margin: 0 0 26px;
}
.entry-related .loop-entry {
	background: #fff; border: 1px solid var(--kg-line); border-radius: 10px; overflow: hidden;
	transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.entry-related .loop-entry:hover,
.entry-related .loop-entry:focus-within {
	border-color: var(--kg-ink2); box-shadow: 0 10px 24px -14px rgba(23, 25, 27, .35); transform: translateY(-2px);
}
.entry-related .loop-entry .entry-title { font-size: 18px; line-height: 1.28; letter-spacing: -.01em; }
.entry-related .loop-entry .entry-title a { color: var(--kg-ink); text-decoration: none; }
.entry-related .loop-entry .entry-summary { font-size: 14.5px; line-height: 1.6; color: var(--kg-ink2); }

/* Navigacija med prispevki: brez velikih tiskanih angleških oznak. */
.post-navigation { border-top: 1px solid var(--kg-line); padding-block: 28px; }
.post-navigation .nav-subtitle {
	font-family: var(--kg-disp); font-weight: 600; font-size: 12.5px;
	letter-spacing: .02em; text-transform: none; color: var(--kg-muted);
}
.post-navigation .nav-title { font-size: 16px; letter-spacing: -.008em; color: var(--kg-ink); }

/* Seznam novic: razmiki in kartice poenoteni s karticami kategorij. */
.kg-newsgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 24px; }
.kg-news { position: relative; display: flex; flex-direction: column; background: #fff;
	border: 1px solid var(--kg-line); border-radius: 10px; overflow: hidden;
	transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.kg-news:hover, .kg-news:focus-within {
	border-color: var(--kg-ink2); box-shadow: 0 10px 24px -14px rgba(23, 25, 27, .35); transform: translateY(-2px);
}
.kg-news-media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--kg-bg3); }
.kg-news-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kg-news-body { display: flex; flex-direction: column; gap: 8px; padding: 20px 20px 22px; }
.kg-news-date { margin: 0; font-size: 12.5px; color: var(--kg-muted); }
.kg-news-title { margin: 0; }
.kg-news-title a { text-decoration: none; }
.kg-news-title a::after { content: ""; position: absolute; inset: 0; }
.kg-news-title a:focus-visible { outline: none; }
.kg-news:has(.kg-news-title a:focus-visible) { outline: 2px solid var(--kg-ink); outline-offset: 3px; }
.kg-news-ex { margin: 0; }
.kg-newsbody .kg-wrap { padding-block: 56px 72px; }
@media (prefers-reduced-motion: reduce) {
	.kg-news, .entry-related .loop-entry { transition: none; }
	.kg-news:hover, .entry-related .loop-entry:hover { transform: none; }
}

/* ---- v0.15.1: novice kot seznam, mirnejša enojna novica ---------------- */

/* Seznam novic: vrstice namesto mreže. Z dvema ali tremi novicami je mreža
   zijala prazna, vrstica pa da naslovu prostor in bere se hitreje. */
.kg-pagehead-band .kg-wrap { padding-block: 48px 44px; }
.kg-newsbody .kg-wrap { padding-block: 44px 64px; }
.kg-newsgrid { grid-template-columns: 1fr; gap: 16px; }
.kg-news { flex-direction: row; align-items: stretch; }
.kg-news-media { flex: 0 0 clamp(180px, 25%, 280px); aspect-ratio: auto; }
.kg-news-media img { width: 100%; height: 100%; object-fit: cover; }
.kg-news-body { padding: 22px 26px; justify-content: center; gap: 7px; }
.kg-news-title { font-size: 19px; line-height: 1.3; }
.kg-news-title a { color: var(--kg-ink); }
.kg-news:hover .kg-news-title a { color: var(--kg-red); }
.kg-news-ex { max-width: 76ch; font-size: 14.5px; line-height: 1.6; }
.kg-news-more { margin: 4px 0 0; font-family: var(--kg-disp); font-weight: 600; font-size: 14px; color: var(--kg-red); }
@media (max-width: 700px) {
	.kg-news { flex-direction: column; }
	.kg-news-media { flex: none; aspect-ratio: 16 / 10; }
	.kg-news-body { padding: 18px 20px 20px; }
}

/* Novica: naslovna fotografija je bila visoka pol zaslona. */
.single-post .post-thumbnail[class*="kadence-thumbnail-ratio"] {
	position: relative; height: clamp(220px, 26vw, 330px) !important;
	padding-bottom: 0 !important; margin-bottom: 0 !important;
	border-radius: 12px; overflow: hidden;
}
.single-post .post-thumbnail[class*="kadence-thumbnail-ratio"] img {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.single-post .entry-header { padding: 26px 30px 24px !important; }
.single-post .entry-taxonomies { display: none; }
.single-post .entry-content { margin-top: 20px !important; padding-block: 36px 56px !important; }
.entry-related { padding-block: 48px 56px !important; margin-top: 44px !important; }
.entry-related .loop-entry .post-thumbnail { padding-bottom: 62% !important; }
.post-navigation { margin-block: 32px !important; }

/* Enotna zaobljenost kartic: novice, partnerji, katalogi in akcije so pri
   10 px, kartice izdelkov in blokov pa so ostale pri 3 px. */
.kg-card,
li.kg-prod,
.kg-404-card,
.kg-rail-block .kg-btn-ghost,
.kg-prod-media { border-radius: 10px; }
li.kg-prod .kg-prod-media { border-radius: 10px 10px 0 0; }


/* === Pomoč pri izbiri: povezavi namesto gumbov ========================= */
/* Dva velika obrobljena gumba v ozkem stolpcu sta bila pretežka. Povezavi s
   puščico povesta isto in pustita blok miren. */
.kg-rail-links { display: flex; flex-direction: column; gap: 8px; margin: 14px 0 0; }
.kg-rail-links a {
	font-size: 14px; font-weight: 600; color: var(--kg-red); text-decoration: none;
	display: inline-flex; align-items: center; gap: 7px;
}
.kg-rail-links a::after {
	content: ""; width: 14px; height: 10px; background: currentColor; flex: 0 0 14px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat center / contain;
	transition: transform .18s ease;
}
.kg-rail-links a:hover { text-decoration: underline; text-underline-offset: 3px; }
.kg-rail-links a:hover::after { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) { .kg-rail-links a::after { transition: none; } }

/* Footer slogan */
.kg-foot-slogan { display: block; margin-bottom: 8px; font-family: var(--kg-disp, inherit); font-weight: 700; font-size: 1.15em; letter-spacing: -.01em; }


/* ======================================== gumbi: šivron iz logotipa + puščica

   Gumb je besedilna povezava z oranžnim šivronom iz logotipa levo in puščico
   desno (želja direktorja). Barvi nastavljata --kg-btn-acc (šivron, puščica,
   podčrtaj) in --kg-btn-ink (besedilo); na temnih ploskvah sta beli.
   Hover: šivron se odmakne, puščica zdrsne, podčrtaj se izriše.
   Šivron je maska, zato barva ni vezana na datoteko. */
:root {
	--kg-btn-acc: var(--kg-red);
	--kg-btn-ink: var(--kg-red);
	--kg-ok: #1F7A4D;
	--kg-ease: cubic-bezier(.22, .7, .2, 1);
	--kg-mask-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 62 116'%3E%3Cpath d='M37 0h3l22 44.7V46h-3.4L43.4 19 15 72.6V78l26.8 26.8h2.5L56 96l1.8-2.1H62v1.6L46 111l-3 3.6-2 1.4h-5l-2-1.4L1.3 81.9 0 80.1v-7.3z'/%3E%3C/svg%3E");
	--kg-mask-arr: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16'%3E%3Cpath d='M1 8h23M16.5 1.5 24 8l-7.5 6.5' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	--kg-mask-ok: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 16'%3E%3Cpath d='M5 8.5 10.5 14 21 2.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost) {
	display: inline-flex !important; align-items: center !important; justify-content: flex-start !important;
	gap: 12px !important; position: relative;
	width: auto !important; height: auto !important; min-height: 46px !important;
	padding: 6px 4px 9px !important;
	background-color: transparent !important;
	background-image: linear-gradient(var(--kg-btn-acc), var(--kg-btn-acc)) !important;
	background-repeat: no-repeat !important;
	background-position: 0 calc(100% - 3px) !important;
	background-size: 0 2px !important;
	border: 0 !important; border-radius: 0 !important; box-shadow: none !important; clip-path: none !important;
	color: var(--kg-btn-ink) !important;
	font-weight: 600 !important; text-decoration: none !important; text-transform: none !important; letter-spacing: 0 !important;
	text-shadow: none !important;
	cursor: pointer; -webkit-tap-highlight-color: transparent;
	transition: background-size .38s var(--kg-ease), color .2s ease, transform .15s ease;
}
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost)::before {
	content: "" !important; display: block !important; flex: none;
	position: static !important; transform: none; border: 0 !important;
	width: 15px; height: 28px; margin-right: -4px !important;
	background: var(--kg-btn-acc) !important;
	-webkit-mask: var(--kg-mask-chev) center / contain no-repeat; mask: var(--kg-mask-chev) center / contain no-repeat;
	transition: transform .34s var(--kg-ease);
}
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost)::after {
	content: "" !important; display: block !important; flex: none;
	width: 26px; height: 16px;
	background: var(--kg-btn-acc) !important;
	-webkit-mask: var(--kg-mask-arr) center / contain no-repeat; mask: var(--kg-mask-arr) center / contain no-repeat;
	transition: transform .34s var(--kg-ease);
}

/* hover in fokus (tudi s tipkovnico) */
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):is(:hover, :focus-visible) {
	background-size: 100% 2px !important; background-color: transparent !important;
	color: var(--kg-btn-ink) !important; border: 0 !important;
}
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):is(:hover, :focus-visible)::before { transform: translateX(-4px); }
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):is(:hover, :focus-visible)::after { transform: translateX(7px); }
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):focus-visible { outline: 2px solid var(--kg-btn-acc); outline-offset: 3px; }
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):active { transform: translateY(1px); }
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):active::after { transform: translateX(3px); }

/* kartice izdelkov: besedilo levo, puščica ob desnem robu, podčrtaj čez vso širino */
html body ul.products li.product.kg-prod .button,
html body li.kg-prod a.kg-btn-ghost { width: 100% !important; font-size: 14px !important; }
html body ul.products li.product.kg-prod .button::after,
html body li.kg-prod a.kg-btn-ghost::after { margin-left: auto; }

/* nalaganje: puščica postane vrteč obroč */
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost).loading { pointer-events: none; opacity: .75; }
:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost).loading::after {
	-webkit-mask: none; mask: none; background: none !important;
	width: 16px; height: 16px; border-radius: 50%;
	border: 2px solid var(--kg-btn-acc); border-top-color: transparent;
	animation: kg-btn-spin .7s linear infinite;
}
@keyframes kg-btn-spin { to { transform: rotate(360deg); } }

/* izdelek je že na seznamu: zelena kljukica, šivron ostane, klik vodi na seznam */
html body :is(ul.products li.product.kg-prod .button.added, ul.products li.product.kg-prod a.kg-on-list, li.kg-prod a.kg-on-list) {
	--kg-btn-ink: var(--kg-ink); --kg-btn-acc: var(--kg-ok);
	background-color: transparent !important; border: 0 !important; color: var(--kg-ink) !important;
	animation: kg-btn-added .5s var(--kg-ease);
}
html body :is(ul.products li.product.kg-prod .button.added, ul.products li.product.kg-prod a.kg-on-list, li.kg-prod a.kg-on-list)::before { background: var(--kg-red) !important; }
html body :is(ul.products li.product.kg-prod .button.added, ul.products li.product.kg-prod a.kg-on-list, li.kg-prod a.kg-on-list)::after {
	-webkit-mask-image: var(--kg-mask-ok); mask-image: var(--kg-mask-ok); background: var(--kg-ok) !important; transform: none;
}
@keyframes kg-btn-added { 0% { opacity: .3; transform: translateY(4px); } 100% { opacity: 1; transform: none; } }
a.kg-drop { transition: color .2s ease; }

/* temne ploskve */
.kg-dark, .kg-cta, .kg-prodcta, .kg-hero, .kg-cathead { --kg-btn-acc: #fff; --kg-btn-ink: #fff; }

@media (hover: none) {
	:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):hover { background-size: 0 2px !important; }
	:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):hover::before, :is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost):hover::after { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	:is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost), :is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost)::before, :is(body .kg-btn, body a.header-button.button-style-filled, body .kg-prod-cta, body .wp-block-button > .wp-block-button__link, body button.single_add_to_cart_button, body .kg-prodcart button.kg-btn, html body ul.products li.product.kg-prod .button, html body li.kg-prod a.kg-btn-ghost)::after { transition: none !important; animation: none !important; }
}
a.kg-topbar-member { color: inherit; text-decoration: none; }
a.kg-topbar-member:hover { text-decoration: underline; }


/* ======================================== izbira: plin za dom / za podjetje */
dialog.kg-gaschoice { border: 0; padding: 0; background: #fff; color: var(--kg-ink); width: min(680px, calc(100vw - 32px));
	border-radius: 6px; box-shadow: 0 30px 80px rgba(0, 0, 0, .35); overflow: visible; }
dialog.kg-gaschoice::backdrop { background: rgba(20, 22, 24, .55); backdrop-filter: blur(2px); }
dialog.kg-gaschoice[open] { animation: kg-pop .32s var(--kg-ease); }
dialog.kg-gaschoice[open]::backdrop { animation: kg-fade .25s ease; }
@keyframes kg-pop { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes kg-fade { from { opacity: 0; } to { opacity: 1; } }
.kg-gc-in { padding: 34px 34px 28px; }
.kg-gc-title { font-family: var(--kg-disp); font-weight: 700; font-size: 26px; letter-spacing: -.02em; margin: 0 0 6px; }
.kg-gc-sub { margin: 0 0 22px; color: var(--kg-muted); font-size: 15px; }
.kg-gc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
a.kg-gc-card { display: flex; flex-direction: column; gap: 8px; padding: 20px 20px 18px; border: 1px solid var(--kg-line); border-radius: 4px;
	background: #fff; color: var(--kg-ink); text-decoration: none; transition: border-color .2s ease, box-shadow .25s ease, transform .25s var(--kg-ease); }
a.kg-gc-card:hover, a.kg-gc-card:focus-visible { border-color: var(--kg-red); box-shadow: 0 10px 24px rgba(0, 0, 0, .09); transform: translateY(-2px); outline: 0; }
.kg-gc-ico { width: 40px; height: 40px; color: var(--kg-red); }
.kg-gc-h { font-family: var(--kg-disp); font-weight: 700; font-size: 19px; letter-spacing: -.012em; }
.kg-gc-p { font-size: 14px; color: var(--kg-ink2); line-height: 1.45; }
.kg-gc-go { margin-top: auto; padding-top: 10px; display: inline-flex; align-items: center; gap: 8px; color: var(--kg-red); font-weight: 600; font-size: 14.5px; }
.kg-gc-go::after { content: ""; width: 22px; height: 14px; background: var(--kg-red); -webkit-mask: var(--kg-mask-arr) center / contain no-repeat; mask: var(--kg-mask-arr) center / contain no-repeat; transition: transform .3s var(--kg-ease); }
a.kg-gc-card:hover .kg-gc-go::after { transform: translateX(6px); }
.kg-gc-tel { margin: 20px 0 0; font-size: 14px; color: var(--kg-muted); }
.kg-gc-tel a { color: var(--kg-ink); font-weight: 600; }
html body button.kg-gc-x { position: absolute; top: 10px; right: 10px; width: 40px; height: 40px; padding: 0; border: 0 !important; box-shadow: none; background: none; cursor: pointer; border-radius: 50%; color: var(--kg-ink); font-size: 26px; line-height: 1; transition: background .2s ease; }
html body button.kg-gc-x:hover { background: var(--kg-bg2); color: var(--kg-ink); }
@media (max-width: 560px) { .kg-gc-grid { grid-template-columns: 1fr; } .kg-gc-in { padding: 28px 20px 22px; } }
@media (prefers-reduced-motion: reduce) { dialog.kg-gaschoice[open], dialog.kg-gaschoice[open]::backdrop { animation: none; } a.kg-gc-card, .kg-gc-go::after { transition: none; } }

/* ======================================== pravne strani (zasebnost, piškotki, splošni pogoji)
   Celotna širina vsebine, naslovna pasica čez zaslon. Razred kg-pravno-page doda functions.php. */
.kg-pravno-page{--kgp-gut:max(24px,calc((100vw - var(--kg-sbw,0px) - 1360px) / 2 + 24px))}
.kg-pravno-page .entry-content > .kg-pagehead{max-width:none!important;box-sizing:border-box;background:var(--kg-bg2,#F5F4F2);border-bottom:1px solid var(--kg-line,#E2E1DE);padding:60px var(--kgp-gut) 52px;margin-bottom:0}
.kg-pravno-page .kg-pagehead h1{font-size:46px;letter-spacing:-.034em;line-height:1.08;margin:12px 0 0}
.kg-pravno-page .kg-pagehead .kg-lead{max-width:62ch;margin:16px 0 0}
.kg-pravno-page .entry-content > .kg-section{max-width:none!important;box-sizing:border-box;padding:48px var(--kgp-gut) 90px}
.kg-pravno-page .kg-section > *{max-width:1000px;margin-inline:0!important}
.kg-pravno-page .kg-section > .wp-block-table{max-width:none}
.kg-pravno-page .kg-section p,.kg-pravno-page .kg-section li{font-size:16.5px;line-height:1.7;color:var(--kg-ink2,#3A3D40)}
.kg-pravno-page .kg-section > p:first-child{font-size:14.5px;color:var(--kg-muted,#6E7478)}
.kg-pravno-page .kg-section h2{font-size:26px;letter-spacing:-.022em;margin:48px 0 14px;padding-top:30px;border-top:1px solid var(--kg-line,#E2E1DE)}
.kg-pravno-page .kg-section > p:first-child + h2{border-top:0}
.kg-pravno-page .kg-section h3{font-size:19px;letter-spacing:-.014em;margin:28px 0 8px}
.kg-pravno-page .kg-section ul{padding-left:1.3em;margin:0 0 1.1em}
.kg-pravno-page .kg-section li{margin-bottom:6px}
.kg-pravno-page .kg-section table{width:100%;border-collapse:collapse;font-size:15px}
.kg-pravno-page .kg-section th{background:var(--kg-bg2,#F5F4F2);text-align:left;font-weight:600}
.kg-pravno-page .kg-section th,.kg-pravno-page .kg-section td{padding:12px 14px;border:1px solid var(--kg-line,#E2E1DE);vertical-align:top;line-height:1.5}
.kg-pravno-page .kg-section a{color:var(--kg-red,#EF4323);text-underline-offset:2px}
@media(max-width:767px){.kg-pravno-page .kg-pagehead h1{font-size:32px}.kg-pravno-page .entry-content > .kg-pagehead{padding:40px 24px 34px}.kg-pravno-page .entry-content > .kg-section{padding:32px 24px 60px}.kg-pravno-page .kg-section table{display:block;overflow-x:auto}}

/* pravne strani: več zraka, rdeče povezave */
.kg-pravno-page .kg-section p{margin:0 0 1.35em}
.kg-pravno-page .kg-section p,.kg-pravno-page .kg-section li{line-height:1.8}
.kg-pravno-page .kg-section ul{margin:0 0 1.6em;padding-left:1.4em}
.kg-pravno-page .kg-section li{margin-bottom:10px}
.kg-pravno-page .kg-section h2{margin:64px 0 20px;padding-top:40px}
.kg-pravno-page .kg-section h3{margin:36px 0 12px}
.kg-pravno-page .kg-section > p:first-child{margin-bottom:8px}
.kg-pravno-page .kg-section .wp-block-table{margin:28px 0 36px}
.kg-pravno-page .entry-content > .kg-section{padding:56px var(--kgp-gut) 110px}
.kg-pravno-page .entry-content > .kg-pagehead{padding:72px var(--kgp-gut) 60px}
.kg-pravno-page .entry-content a:not(.wp-element-button){color:var(--kg-red) !important;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;transition:text-decoration-color .2s ease,color .2s ease}
.kg-pravno-page .entry-content a:not(.wp-element-button):hover{color:#C5321A !important;text-decoration-thickness:2px}


/* Product gallery 0.15.15: swap on thumbnail click, lightbox on the photo */
.kg-prodgal-main { aspect-ratio: 1 / 1; background: #fff; position: relative; }
.kg-prodgal-main.kg-prodgal-empty { aspect-ratio: 4 / 3; }
.kg-prodgal-zoom { all: unset; box-sizing: border-box; display: block; width: 100%; height: 100%; position: relative; cursor: zoom-in; }
.kg-prodgal-zoom:focus-visible { outline: 2px solid var(--kg-red); outline-offset: -2px; }
.kg-prodgal-main .kg-prodgal-zoom img { object-fit: contain; width: 100%; height: 100%; transition: transform .35s var(--kg-ease, ease); }
.kg-prodgal-zoom:hover img { transform: scale(1.03); }
.kg-prodgal-zoomicon { position: absolute; right: 12px; bottom: 12px; width: 38px; height: 38px; border-radius: 50%; background: rgba(255, 255, 255, .92); border: 1px solid var(--kg-line); box-shadow: 0 2px 8px rgba(0, 0, 0, .12); }
.kg-prodgal-zoomicon::before { content: ""; position: absolute; left: 10px; top: 9px; width: 11px; height: 11px; border: 2px solid var(--kg-ink); border-radius: 50%; }
.kg-prodgal-zoomicon::after { content: ""; position: absolute; left: 22px; top: 22px; width: 7px; height: 2px; background: var(--kg-ink); transform: rotate(45deg); transform-origin: 0 0; }
.kg-prodgal-thumbs { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.kg-prodgal-thumb { all: unset; box-sizing: border-box; flex: 0 0 76px; height: 76px; background: #fff; border: 1px solid var(--kg-line); border-radius: 2px; cursor: pointer; overflow: hidden; display: block; transition: border-color .2s ease; }
.kg-prodgal-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kg-prodgal-thumb:hover { border-color: var(--kg-muted); }
.kg-prodgal-thumb[aria-current="true"] { border-color: var(--kg-red); box-shadow: 0 0 0 1px var(--kg-red); }
.kg-prodgal-thumb:focus-visible { outline: 2px solid var(--kg-red); outline-offset: 2px; }

dialog.kg-lightbox { border: 0; padding: 0; margin: 0; max-width: none; max-height: none; width: 100vw; height: 100vh; height: 100dvh; background: rgba(15, 17, 18, .94); color: #fff; }
dialog.kg-lightbox::backdrop { background: rgba(15, 17, 18, .94); }
dialog.kg-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.kg-lb-fig { margin: 0; max-width: calc(100vw - 150px); max-height: calc(100dvh - 90px); display: flex; }
.kg-lb-img { max-width: 100%; max-height: calc(100dvh - 90px); width: auto; height: auto; object-fit: contain; background: #fff; border-radius: 2px; }
.kg-lb-close, .kg-lb-nav { all: unset; box-sizing: border-box; position: absolute; width: 48px; height: 48px; border-radius: 50%; background: rgba(255, 255, 255, .12); cursor: pointer; transition: background .2s ease; }
.kg-lb-close:hover, .kg-lb-nav:hover { background: rgba(255, 255, 255, .26); }
.kg-lb-close:focus-visible, .kg-lb-nav:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.kg-lb-close { top: 18px; right: 18px; }
.kg-lb-close::before, .kg-lb-close::after { content: ""; position: absolute; left: 14px; top: 23px; width: 20px; height: 2px; background: #fff; transform: rotate(45deg); }
.kg-lb-close::after { transform: rotate(-45deg); }
.kg-lb-nav { top: 50%; margin-top: -24px; }
.kg-lb-prev { left: 18px; }
.kg-lb-next { right: 18px; }
.kg-lb-nav::before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; }
.kg-lb-prev::before { transform: translateX(3px) rotate(-135deg); }
.kg-lb-next::before { transform: translateX(-3px) rotate(45deg); }
.kg-lb-single .kg-lb-nav { display: none; }
.kg-lb-count { position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; margin: 0; font-size: 14px; color: rgba(255, 255, 255, .75); }
@media (max-width: 700px) {
	.kg-lb-fig { max-width: 100vw; }
	.kg-lb-prev { left: 8px; } .kg-lb-next { right: 8px; }
	.kg-lb-nav { top: auto; bottom: 14px; margin-top: 0; }
	.kg-prodgal-thumb { flex-basis: 64px; height: 64px; }
}

/* Kadence paints every button red on hover/focus; the gallery buttons keep their own look. */
html body .kg-prodgal-zoom, html body .kg-prodgal-zoom:hover, html body .kg-prodgal-zoom:focus, html body .kg-prodgal-zoom:active { background: transparent !important; color: inherit !important; box-shadow: none !important; }
html body .kg-prodgal-thumb, html body .kg-prodgal-thumb:hover, html body .kg-prodgal-thumb:focus, html body .kg-prodgal-thumb:active { background: #fff !important; color: inherit !important; }
html body .kg-prodgal-thumb[aria-current="true"] { box-shadow: 0 0 0 1px var(--kg-red) !important; }
html body .kg-lb-close, html body .kg-lb-nav { background: rgba(255, 255, 255, .12) !important; }
html body .kg-lb-close:hover, html body .kg-lb-nav:hover, html body .kg-lb-close:focus, html body .kg-lb-nav:focus { background: rgba(255, 255, 255, .26) !important; }
html body .kgv-slider-btn, html body .kgv-slider-btn:hover, html body .kgv-slider-btn:focus { background: #fff !important; }


/* Header gas button: same link-style button as the rest (logo chevron left, arrow right), in red. */
body a.header-button.button-style-filled { --kg-btn-acc: var(--kg-red); --kg-btn-ink: var(--kg-red); white-space: nowrap; margin-left: 8px; }