/* AKEY product page UI
 *
 * Grid system (one for the whole page):
 * - Outer container = the site container (same edges as the logo, breadcrumbs, gallery).
 * - 12 columns, gutter --ak-gap = the YOOtheme grid gutter (40px >= 1200px, 30px below), so the
 *   product hero (6/6) and every section below share the same column lines.
 * - Reading text = 8 of 12 columns. Pairs used: 6/6 (hero, drawings), 7/5 (photo + benefits,
 *   key specs + product details, buy block, blinds check), 5/7 (window calculator), 4/8 (install, FAQ).
 * - Spacing: --ak-s7 between sections, --ak-s4 between blocks inside a section, --ak-s2 between cards.
 * - One heading face (Alatsi, as the product title), one body face (Work Sans).
 */
:root {
	--ak-ink: #212121; --ak-body: #3b3b3b; --ak-mid: #6b6b6b; --ak-line: #d4d4d4; --ak-soft: #e6e6e6;
	--ak-bg: #efefef; --ak-card: #fff; --ak-tint: #f6f6f6; --ak-red: #da0101; --ak-ok: #1a7f37;
	--ak-r: 12px; --ak-gap: 40px;
	--ak-s1: 8px; --ak-s2: 16px; --ak-s3: 24px; --ak-s4: 32px; --ak-s5: 48px; --ak-s6: 64px; --ak-s7: 104px;
	--ak-text: calc((100% + var(--ak-gap)) * 8 / 12 - var(--ak-gap));
	--akey-hdr: 80px;
}
@media (max-width: 1199px) { :root { --ak-gap: 30px; } }
.akey-desc *, .akey-desc *::before, .akey-desc *::after, .akey-facts *, .akey-buybar { box-sizing: border-box; }
html:has(body.akey-v2) { scroll-padding-top: calc(var(--akey-hdr) + 72px); }

/* 12-column helper used by section-level layouts */
.akey-intro, .akey-split, .akey-cta, .akey-specs__cols, .akey-install, .akey-tool {
	display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ak-gap);
}

/* ============ hero */
.akey-v2 .product.uk-section { padding-top: var(--ak-s4); padding-bottom: var(--ak-s5); }
.akey-v2 .akey-h1 { margin: 0 !important; }
.akey-subtitle { margin: 8px 0 0 !important; font: 500 17px/1.4 'Work Sans', sans-serif; color: var(--ak-mid); letter-spacing: .01em; }
.akey-v2 .product .tm-source-woo-description p { font-size: 17px; line-height: 1.6; color: var(--ak-body); margin: 0; }

/* key facts */
.akey-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 8px; }
.akey-fact { display: flex; align-items: center; gap: 12px; background: var(--ak-card); border-radius: var(--ak-r); padding: 12px 14px; }
.akey-fact div { display: flex; flex-direction: column; line-height: 1.2; }
.akey-fact strong { font: 400 20px/1.2 'Alatsi', sans-serif; color: var(--ak-ink); }
.akey-fact span { font-size: 13px; color: var(--ak-mid); }
.akey-ico { width: 36px; height: 36px; flex: none; stroke: var(--ak-ink); stroke-width: 2.6; fill: var(--ak-ink); }
.akey-ico [fill="none"] { fill: none; }
.akey-ico-t { font: 700 11px 'Work Sans', sans-serif; fill: #fff; stroke: none; }
.akey-facts__more { display: inline-block; font-size: 15px; margin-top: 2px; }
.akey-facts__more::after { content: " \2193"; }

/* hero right column: one-line H1 at desktop, price and button on one row */
.akey-v2 .product .akey-h1 { font-size: clamp(30px, 2.6vw, 40px); line-height: 1.1; }
.akey-v2 .product .uk-grid > div:last-child { display: flex; flex-wrap: wrap; align-items: center; align-content: flex-start; }
.akey-v2 .product .uk-grid > div:last-child > * { flex: 0 0 100%; min-width: 0; margin: 0 !important; }
.akey-v2 .product .uk-grid > div:last-child > .uk-panel:has(.tm-source-woo-description) { margin-top: var(--ak-s2) !important; }
.akey-v2 .product .uk-grid > div:last-child > .uk-panel:has(> .akey-facts) { margin-top: var(--ak-s3) !important; }
.akey-v2 .product .uk-grid > div:last-child > .uk-panel:has(> .akey-versions) { margin-top: var(--ak-s2) !important; padding-top: var(--ak-s3); border-top: 1px solid var(--ak-line); }
.akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-price, .akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-price + * { margin-top: var(--ak-s2) !important; }
.akey-v2 .product .tm-element-woo-price .price, .akey-v2 .product form.cart, .akey-v2 .product .tm-source-woo-description p { margin: 0; }
.akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-price { flex: 0 0 auto; margin-right: var(--ak-s3) !important; }
.akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-price + * { flex: 0 0 auto; }

/* ============ first screen = the viewport (desktop): header + breadcrumbs + product + section nav
   at the bottom edge. --akey-hero-top / --akey-toc-h are measured in akey-ui.js. */
@media (min-width: 960px) {
	.akey-v2 { --akey-hero-avail: calc(100svh - var(--akey-hero-top, 121px) - var(--akey-toc-h, 58px)); }
	.akey-v2 .product.uk-section { min-height: var(--akey-hero-avail); display: flex; align-items: center; padding-top: var(--ak-s4); padding-bottom: var(--ak-s4); box-sizing: border-box; }
	.akey-v2 .product.uk-section > .uk-container { flex: 1 1 auto; }
	.akey-v2 .product .uk-grid { align-items: center; }
	.akey-v2 .woocommerce-product-gallery__image img, .akey-v2 .woocommerce-product-gallery__image > a > img {
		width: 100%; height: auto; max-height: max(360px, calc(var(--akey-hero-avail) - 2 * var(--ak-s4))); object-fit: contain; background: #fff;
	}
}

/* short desktop windows (e.g. 1280x720): tighten the product column so the first screen still fits */
@media (min-width: 960px) and (max-height: 820px) {
	.akey-v2 .product.uk-section { padding-top: var(--ak-s2); padding-bottom: var(--ak-s2); }
	.akey-v2 .woocommerce-product-gallery__image img, .akey-v2 .woocommerce-product-gallery__image > a > img { max-height: max(360px, calc(var(--akey-hero-avail) - 2 * var(--ak-s2))); }
	.akey-v2 .product .tm-source-woo-description p { font-size: 16px; line-height: 1.5; }
	.akey-v2 .product .uk-grid > div:last-child > .uk-panel:has(.tm-source-woo-description) { margin-top: 12px !important; }
	.akey-v2 .product .uk-grid > div:last-child > .uk-panel:has(> .akey-facts) { margin-top: var(--ak-s2) !important; }
	.akey-v2 .product .akey-fact { padding: 8px 12px; }
	.akey-v2 .product .uk-grid > div:last-child > .uk-panel:has(> .akey-versions) { margin-top: 12px !important; padding-top: var(--ak-s2); }
	.akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-price, .akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-price + * { margin-top: 12px !important; }
}

/* gallery: thumbnails in a column left of the photo (WooCommerce slider, zoom, lightbox) */
.single-product .tm-element-woo-images { position: relative; }
.single-product .woocommerce-product-gallery { display: grid; grid-template-columns: 80px minmax(0, 1fr); column-gap: var(--ak-s2); }
.single-product .woocommerce-product-gallery .flex-viewport { grid-column: 2; grid-row: 1; border-radius: var(--ak-r); background: #fff; }
.single-product .woocommerce-product-gallery .flex-viewport img { border: 0 !important; }
.single-product .woocommerce-product-gallery__trigger { position: absolute; top: 14px; right: 14px; z-index: 9; grid-column: 2; }
.single-product .woocommerce-product-gallery .flex-control-thumbs {
	grid-column: 1; grid-row: 1; height: 0; min-height: 100%; margin: 0; padding: 0 2px 0 0;
	display: flex; flex-direction: column; gap: 10px; overflow-y: auto; scrollbar-width: thin;
}
.single-product .woocommerce-product-gallery .flex-control-thumbs li { width: 100% !important; float: none; padding: 0; flex: none; clear: none !important; }
.single-product .woocommerce-product-gallery .flex-control-thumbs li img { border: 1px solid var(--ak-line) !important; border-radius: 8px; opacity: .55; transition: opacity .15s, border-color .15s; aspect-ratio: 1; object-fit: cover; }
.single-product .woocommerce-product-gallery .flex-control-thumbs li img.flex-active { opacity: 1; border-color: var(--ak-ink) !important; }
.single-product .tm-element-woo-images .onsale { left: calc(80px + var(--ak-s2) + 14px); top: 14px; z-index: 9; }

/* ============ description: rhythm and type */
.akey-v2 .akey-desc.uk-section { padding-top: 0; padding-bottom: var(--ak-s5); }
.akey-v2 .akey-desc .uk-panel { counter-reset: akey-sec; }
.akey-v2 .akey-desc .uk-panel > * { margin-top: 0; margin-bottom: var(--ak-s4); }
.akey-v2 .akey-desc .uk-panel > :is(p, h3, ul:not([class]), ol:not([class]), table, .akey-figure--half, .akey-more) { max-width: var(--ak-text); }
.akey-v2 .akey-desc .uk-panel > p { margin-bottom: var(--ak-s3); }

.akey-v2 .akey-desc p, .akey-v2 .akey-desc .uk-panel > ul:not([class]) li { font-size: 18px; line-height: 1.65; color: var(--ak-body); }
.akey-v2 .akey-desc h2, .akey-v2 #tm-main .akey-desc ~ .uk-section h2, .akey-v2 #tm-main .akey-desc ~ .uk-section .uk-h2 {
	font: 400 40px/1.15 'Alatsi', sans-serif; color: var(--ak-ink); letter-spacing: -0.01em; text-transform: none;
}
/* section start: hairline across the container, red number, heading */
.akey-v2 .akey-desc .uk-panel > h2, .akey-v2 .akey-desc .uk-panel > .akey-split {
	margin: var(--ak-s7) 0 var(--ak-s4); padding-top: var(--ak-s3); border-top: 1px solid var(--ak-line);
}
.akey-v2 .akey-desc .uk-panel > h2, .akey-split__head h2 { counter-increment: akey-sec; max-width: none; }
.akey-split__head h2 { margin: 0 !important; }
.akey-v2 .akey-desc .uk-panel > h2::before, .akey-split__head h2::before {
	content: counter(akey-sec, decimal-leading-zero); display: block; margin-bottom: 10px;
	font: 600 13px/1 'Work Sans', sans-serif; letter-spacing: .14em; color: var(--ak-red);
}
.akey-v2 .akey-desc .uk-panel > h3 { font: 400 24px/1.25 'Alatsi', sans-serif; color: var(--ak-ink); margin: var(--ak-s5) 0 var(--ak-s2); }
.akey-v2 .akey-desc .uk-panel > h2 + h3 { margin-top: 0; }
.akey-v2 .akey-desc .uk-panel > :is(.akey-intro, .akey-benefits) + h2 { margin-top: var(--ak-s6); }
.akey-v2 .akey-desc .uk-panel > :is(p, ul:not([class]), ol:not([class])) a:not([class]) { color: var(--ak-red); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.akey-v2 .akey-desc .uk-panel > ul:not([class]) { padding-left: 1.2em; }
.akey-v2 .akey-desc .uk-panel > ul:not([class]) li + li { margin-top: 6px; }
.akey-v2 .akey-desc table.uk-table { background: var(--ak-card); border-radius: var(--ak-r); overflow: hidden; width: 100%; margin: 0; }
.akey-v2 .akey-desc table.uk-table th { font: 600 12px 'Work Sans', sans-serif; letter-spacing: .08em; color: var(--ak-mid); }
.akey-v2 .akey-desc table.uk-table td { font-size: 17px; color: var(--ak-ink); }
.akey-v2 .akey-desc table.uk-table :is(th, td):first-child { padding-left: 0; }
.akey-v2 .akey-legacy-box, .akey-v2 .akey-legacy-review, .akey-v2 .akey-legacy-specs { display: none !important; }
.akey-legacy-specs .uk-panel:empty { display: none; }

/* ============ text grid (desktop): one 12-column grid inside the description.
   Section lead and standalone paragraphs start at the spine and run 8 columns (no empty corner on the left).
   A point row = subhead in columns 1–4 + its text in columns 5–12, both starting on the same line.
   Section headings, tools, photos and card groups run all 12 columns. */
@media (min-width: 960px) {
	.akey-v2 .akey-desc .uk-panel { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ak-gap); align-items: start; }
	.akey-v2 .akey-desc .uk-panel > * { grid-column: 1 / -1; min-width: 0; }
	.akey-v2 .akey-desc .uk-panel > :is(p, ul:not([class]), ol:not([class]), table, .akey-more, .akey-note) { grid-column: 1 / span 8; max-width: none; }
	.akey-v2 .akey-desc .uk-panel > h2 + p, .akey-v2 .akey-desc .uk-panel > h2 + p + p { font-size: 19px; }
	.akey-v2 .akey-desc .uk-panel > h2 + p { margin-top: 0; }

	/* point rows */
	.akey-v2 .akey-desc .uk-panel > h3 { grid-column: 1 / span 4; max-width: none !important; padding-right: var(--ak-s2); }
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :is(p, ul:not([class]), ol:not([class]))),
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :is(p, ul:not([class]), ol:not([class]))) + * { position: relative; margin: var(--ak-s3) 0 var(--ak-s3); padding-top: var(--ak-s4); }
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :is(p, ul:not([class]), ol:not([class]))) + * { grid-column: 5 / -1; }
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :is(p, ul:not([class]), ol:not([class]))) + * + :is(p, ul:not([class]), ol:not([class])) { grid-column: 5 / -1; margin-top: 0; }
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :is(p, ul:not([class]), ol:not([class])))::after { content: ""; position: absolute; left: 0; top: 0; height: 1px; width: calc(300% + 2 * var(--ak-gap)); background: var(--ak-line); }
	/* the first row right under a section heading needs no rule of its own */
	.akey-v2 .akey-desc .uk-panel > h2 + h3, .akey-v2 .akey-desc .uk-panel > h2 + h3 + * { margin-top: 0 !important; padding-top: 0 !important; }
	.akey-v2 .akey-desc .uk-panel > h2 + h3::after { display: none; }
	/* a subhead that introduces a full-width block keeps its own row */
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :not(p, ul:not([class]), ol:not([class]))) { grid-column: 1 / -1; margin: var(--ak-s5) 0 var(--ak-s3); }
	.akey-v2 .akey-desc .uk-panel > h2 + h3:has(+ :not(p, ul:not([class]), ol:not([class]))) { margin-top: 0; }

	.akey-v2 .akey-desc .uk-panel > :is(p, ul:not([class]), ol:not([class])) + :is(.akey-block, .akey-photos, .akey-figure, .akey-cta, .akey-box, .akey-compare, .akey-media) { margin-top: var(--ak-s2); }
	.akey-v2 .akey-desc .uk-panel > .akey-split { grid-column: 1 / -1; }
}
.akey-v2 .akey-desc .akey-first { color: var(--ak-ink); font-weight: 500; }
@media (max-width: 959px) {
	.akey-v2 .akey-desc .uk-panel > h3:has(+ :is(p, ul:not([class]), ol:not([class]))) { padding-top: var(--ak-s3); border-top: 1px solid var(--ak-line); }
	.akey-v2 .akey-desc .uk-panel > h2 + h3:has(+ :is(p, ul:not([class]), ol:not([class]))) { padding-top: 0; border-top: 0; }
}

/* ============ photo + text pair: photo 6 columns, text 6 columns, sides alternate */
.akey-media { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ak-gap); align-items: center; margin: 0 0 var(--ak-s5) !important; }
.akey-media__photo { grid-column: 1 / span 6; margin: 0; }
.akey-media__photo img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; display: block; border-radius: var(--ak-r); }
.akey-media__text { grid-column: 8 / -1; }
.akey-media--flip .akey-media__photo { grid-column: 7 / -1; grid-row: 1; }
.akey-media--flip .akey-media__text { grid-column: 1 / span 5; grid-row: 1; }
.akey-media__text h3 { font: 400 24px/1.25 'Alatsi', sans-serif !important; color: var(--ak-ink); margin: 0 0 var(--ak-s2) !important; max-width: none !important; }
.akey-media__text p { margin: 0 0 var(--ak-s2) !important; }
.akey-media__text p:last-child { margin-bottom: 0 !important; }
.akey-media__text > p:has(> strong:only-child) { display: block; margin-top: var(--ak-s2); padding: 12px 16px; border-left: 3px solid var(--ak-ink); background: var(--ak-card); border-radius: 0 8px 8px 0; font-size: 16px; color: var(--ak-ink); }

/* ============ short practical tip */
.akey-note { display: flex; gap: var(--ak-s2); align-items: flex-start; background: var(--ak-card); border-radius: var(--ak-r); padding: var(--ak-s3); margin: 0 0 var(--ak-s5) !important; }
.akey-note .akey-ico { flex: 0 0 36px; width: 36px; height: 36px; }
.akey-note__title { display: block; font: 400 20px/1.3 'Alatsi', sans-serif; color: var(--ak-ink); margin-bottom: 4px; }
.akey-v2 .akey-desc .akey-note p { font-size: 16px; line-height: 1.6; margin: 0; }

/* two photos side by side */
.akey-photos--2 .akey-photos__item, .akey-photos--2 .akey-photos__item:first-child { grid-column: span 6; }
.akey-photos--2 .akey-photos__item img { height: auto; aspect-ratio: 3 / 2; }
@media (max-width: 639px) { .akey-photos--2 .akey-photos__item, .akey-photos--2 .akey-photos__item:first-child { grid-column: 1 / -1; } }

/* ============ sticky section nav (native sticky: no placeholder, no width tricks) */
.akey-toc {
	position: sticky; top: var(--akey-hdr); z-index: 970;
	background: var(--ak-bg);
	box-shadow: 0 0 0 100vmax var(--ak-bg), 0 1px 0 100vmax var(--ak-line);
	clip-path: inset(0 -100vmax -1px -100vmax);
	margin: 0 0 var(--ak-s5) !important;
}
.akey-toc ul { list-style: none; display: flex; gap: 4px; margin: 0 0 0 -16px; padding: 12px 0; overflow-x: auto; scrollbar-width: none; }
.akey-toc ul::-webkit-scrollbar { display: none; }
.akey-toc li { flex: none; }
.akey-toc a { display: block; white-space: nowrap; padding: 8px 16px; border-radius: 999px; color: var(--ak-ink); font-size: 15px; line-height: 1.2; text-decoration: none; transition: background-color .15s, color .15s; }
.akey-toc a:hover { background: var(--ak-card); color: var(--ak-ink); }
.akey-toc a.is-active { background: var(--ak-ink); color: #fff; }

/* ============ cards */
.akey-block { background: var(--ak-card); border-radius: var(--ak-r); padding: var(--ak-s4); margin: 0 0 var(--ak-s4) !important; }
.akey-block__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--ak-s2) var(--ak-s4); margin-bottom: var(--ak-s3); }
.akey-block__note { font-size: 14px !important; color: var(--ak-mid) !important; margin: var(--ak-s2) 0 0; }
.akey-block svg { width: 100%; height: auto; display: block; }
.akey-svg-s { font: 500 13px 'Work Sans', sans-serif; fill: var(--ak-mid); letter-spacing: .02em; }
.akey-svg-m { font: 600 15px 'Work Sans', sans-serif; }
.akey-svg-l { font: 400 22px 'Alatsi', sans-serif; fill: var(--ak-ink); }

/* ============ intro: detail photo (7) + benefits (5) */
.akey-intro { margin: 0 !important; align-items: stretch; }
.akey-intro__photo { grid-column: span 7; margin: 0; position: relative; }
.akey-intro__photo img { width: 100%; height: 100%; min-height: 360px; object-fit: cover; border-radius: var(--ak-r); display: block; }
.akey-intro__photo figcaption { position: absolute; left: 16px; bottom: 14px; background: rgba(255,255,255,.92); color: var(--ak-ink); font-size: 13px; padding: 5px 10px; border-radius: 999px; }
.akey-intro .akey-benefits--stack { grid-column: span 5; }

/* benefits */
.akey-benefits { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ak-s2); margin: 0 0 var(--ak-s4) !important; }
.akey-benefits li { background: var(--ak-card); border-radius: var(--ak-r); padding: var(--ak-s3); margin: 0 !important; display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: var(--ak-s2); align-items: start; }
.akey-benefits .akey-ico { width: 44px; height: 44px; margin-top: 2px; }
.akey-benefits h3 { font: 400 22px/1.2 'Alatsi', sans-serif !important; color: var(--ak-ink); margin: 0 0 var(--ak-s1) !important; }
.akey-benefits p { font-size: 16px !important; line-height: 1.55 !important; margin: 0 0 8px !important; }
.akey-benefits__link { font-size: 15px; color: var(--ak-red); text-decoration: none; font-weight: 500; }
.akey-benefits__link::after { content: " \2192"; }
.akey-benefits__link:hover { color: var(--ak-ink); }
.akey-intro .akey-benefits--stack { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 1fr; margin: 0 !important; }

/* ============ tools: controls, answer and drawing read as one unit */
.akey-tool { row-gap: var(--ak-s3); align-items: start; }
.akey-tool__ctrl { grid-row: 1; display: flex; flex-direction: column; gap: var(--ak-s2); }
.akey-tool__res { grid-row: 2; margin: 0 !important; padding-top: var(--ak-s3); border-top: 1px solid var(--ak-soft); font-size: 17px; line-height: 1.55; color: var(--ak-body); }
.akey-tool__draw { grid-row: 1 / span 2; align-self: center; display: flex; justify-content: center; }
.akey-tool__draw svg { max-width: 100%; }
/* window calculator: controls 5, drawing 7 */
.akey-fit .akey-tool__ctrl, .akey-fit .akey-tool__res { grid-column: 1 / span 5; }
.akey-fit .akey-tool__draw { grid-column: 6 / -1; }
.akey-fit .akey-fit__svg { max-height: 300px; }
/* blinds check: controls and answer 7, narrow drawing 5 centered */
.akey-proj .akey-tool__ctrl, .akey-proj .akey-tool__res { grid-column: 1 / span 7; }
.akey-proj .akey-tool__draw { grid-column: 8 / -1; }
.akey-proj .akey-proj__svg { max-height: 320px; width: auto; }
.akey-tool .akey-range { max-width: 520px; }
.akey-tool .akey-seg { display: flex; }
.akey-tool .akey-seg__label { flex-basis: 100%; margin-bottom: 2px; }
/* size table inside the calculator, full card width */
.akey-tool__more { grid-column: 1 / -1; grid-row: 3; border-top: 1px solid var(--ak-soft); margin-top: var(--ak-s1); }
.akey-tool__more summary, .akey-more summary { list-style: none; cursor: pointer; padding: var(--ak-s2) 0 0; font: 500 16px 'Work Sans', sans-serif; color: var(--ak-ink); display: flex; justify-content: space-between; align-items: center; }
.akey-tool__more summary::-webkit-details-marker, .akey-more summary::-webkit-details-marker { display: none; }
.akey-tool__more summary::after, .akey-more summary::after { content: "+"; font-size: 22px; line-height: 1; color: var(--ak-mid); }
.akey-tool__more[open] summary::after, .akey-more[open] summary::after { content: "\2212"; }
.akey-tool__more-body { padding-top: var(--ak-s2); }
.akey-tool__more-body p { font-size: 16px !important; margin: 12px 0 0; }
.akey-more { background: var(--ak-card); border-radius: var(--ak-r); padding: 0 20px 16px; }

.akey-seg { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.akey-seg__label { font-size: 14px; color: var(--ak-mid); margin-right: 4px; }
.akey-seg button, .akey-install__ctrl button {
	font: 500 15px/1 'Work Sans', sans-serif; border: 1px solid var(--ak-line); background: var(--ak-card); color: var(--ak-ink);
	border-radius: 999px; padding: 11px 18px; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s;
}
.akey-seg button:hover, .akey-install__ctrl button:hover { border-color: var(--ak-ink); }
.akey-seg button.is-active { background: var(--ak-ink); border-color: var(--ak-ink); color: #fff; }
.akey-install__ctrl button:disabled { opacity: .35; cursor: default; border-color: var(--ak-line); }
.akey-range { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--ak-mid); }
.akey-range output { font: 400 24px/1.2 'Alatsi', sans-serif; color: var(--ak-ink); }
.akey-range input[type=range] { width: 100%; margin: 6px 0 0; accent-color: var(--ak-red); }
.akey-sag .akey-range { flex: 1 1 320px; max-width: 480px; }
.akey-num { display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--ak-mid); }
.akey-num span { display: flex; align-items: center; gap: 8px; font: 400 22px 'Alatsi', sans-serif; color: var(--ak-ink); }
.akey-num input { width: 112px; height: 48px; font: 400 26px 'Alatsi', sans-serif; padding: 0 12px; border: 1px solid var(--ak-line); border-radius: 8px; background: #fff; color: var(--ak-ink); }
.akey-num input:focus { outline: 2px solid var(--ak-ink); outline-offset: 1px; }
.akey-result-big { display: block; font: 400 30px/1.15 'Alatsi', sans-serif; margin-bottom: 8px; }
.akey-ok { color: var(--ak-ok); } .akey-bad { color: var(--ak-red); }

/* ============ buy block: terms 7, price + button 5 */
.akey-cta { align-items: center; row-gap: var(--ak-s3); background: var(--ak-ink); color: #fff; border-radius: var(--ak-r); padding: var(--ak-s4); margin: 0 0 var(--ak-s4) !important; }
.akey-cta__text { grid-column: span 7; }
.akey-cta__buy { grid-column: span 5; display: flex; align-items: center; justify-content: flex-end; gap: var(--ak-s3); }
.akey-cta h3 { font: 400 28px/1.2 'Alatsi', sans-serif !important; color: #fff !important; margin: 0 0 6px !important; }
.akey-cta p { color: #cfcfcf !important; font-size: 16px !important; margin: 0 !important; }
.akey-cta__price { font: 600 30px monospace; color: #fff; white-space: nowrap; }
.akey-cta__price del { color: #9a9a9a; font-size: 15px; margin-right: 8px; }
.akey-cta__price ins { text-decoration: none; background: none; color: #fff; }
.akey-cta__btn { display: inline-block; background: var(--ak-red); color: #fff !important; border-radius: 999px; padding: 14px 28px; font-size: 15px; text-transform: uppercase; letter-spacing: .04em; text-decoration: none !important; white-space: nowrap; transition: background-color .15s; }
.akey-cta__btn:hover { background: #b80000; }
/* after a check: amber stripe for a limit, red stripe and a quieter button when it does not fit */
.akey-cta { box-shadow: inset 4px 0 0 transparent; transition: box-shadow .25s ease; }
.akey-cta.is-warn { box-shadow: inset 4px 0 0 #e0a100; }
.akey-cta.is-bad { box-shadow: inset 4px 0 0 var(--ak-red); }
.akey-cta.is-warn .akey-cta__title { color: #ffd166 !important; }
.akey-cta.is-bad .akey-cta__title { color: #ff8a8a !important; }
.akey-cta.is-bad .akey-cta__btn { background: transparent; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5); }
.akey-cta.is-bad .akey-cta__btn:hover { background: rgba(255, 255, 255, .08); }
.akey-cta.is-updated .akey-cta__text { animation: akey-pop .35s ease; }

/* section nav on tablets and phones: every item visible at once, wraps to a second row instead of scrolling */
@media (max-width: 959px) {
	.akey-toc ul { flex-wrap: wrap; overflow: visible; gap: 6px; margin-left: 0; padding: 10px 0; }
	.akey-toc a { padding: 7px 12px; font-size: 14px; background: rgba(255, 255, 255, .7); }
	.akey-toc a.is-active { background: var(--ak-ink); }
}
@media (max-width: 400px) {
	.akey-toc ul { gap: 5px; padding: 8px 0; }
	.akey-toc a { padding: 6px 10px; font-size: 13px; }
}

/* ============ photos */
.akey-figure { margin: 0 0 var(--ak-s4); }
.akey-figure img, .akey-photos img { width: 100%; display: block; border-radius: var(--ak-r); }
.akey-figure--wide img { aspect-ratio: 2 / 1; height: auto; object-fit: cover; object-position: 50% 35%; }
.akey-figure--half img { aspect-ratio: 16 / 9; height: auto; object-fit: cover; }
.akey-figure figcaption, .akey-photos figcaption, .akey-media figcaption { font-size: 14px; line-height: 1.45; color: var(--ak-mid); margin-top: 10px; }
.akey-photos { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ak-gap); row-gap: var(--ak-s2); margin: 0 0 var(--ak-s4); }
.akey-photos__item { margin: 0; display: block; grid-column: span 3; }
.akey-photos__item:first-child { grid-column: span 6; }
.akey-photos__item img { height: 520px; object-fit: cover; }

/* ============ specs: drawings 6/6, key specs 7 + product details 5 */
.akey-specs__draw { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--ak-gap); padding-bottom: var(--ak-s4); margin-bottom: var(--ak-s4); border-bottom: 1px solid var(--ak-soft); }
.akey-specs__draw svg { background: #fafafa; border-radius: 8px; }
.akey-specs__draw svg:only-child { grid-column: 1 / -1; width: 100%; height: 230px; }
.akey-specs__cols { align-items: start; }
.akey-specs__main { grid-column: span 7; }
.akey-specs__ids { grid-column: span 5; background: var(--ak-tint); border-radius: 8px; padding: var(--ak-s3); }
.akey-specs__cols h3 { font: 400 20px/1.2 'Alatsi', sans-serif !important; color: var(--ak-ink); margin: 0 0 4px !important; padding-bottom: 10px; border-bottom: 2px solid var(--ak-ink); }
.akey-specs__ids h3 { font-size: 17px !important; border-bottom-width: 1px; border-color: var(--ak-line); }
.akey-specs__cols dl { margin: 0; }
.akey-specs__cols dl > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--ak-s2); padding: 11px 0; border-bottom: 1px solid var(--ak-soft); }
.akey-specs__cols dl > div:last-child { border-bottom: 0; }
.akey-specs__cols dt { font-weight: 400; font-size: 15px; color: var(--ak-mid); }
.akey-specs__cols dd { margin: 0; font-size: 16px; color: var(--ak-ink); }
.akey-specs__ids dl > div { padding: 8px 0; border-color: var(--ak-line); }
.akey-specs__ids :is(dt, dd) { font-size: 14px; }
.akey-fallback-title { margin-top: var(--ak-s6); }

/* ============ in the box */
.akey-box { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--ak-gap); row-gap: var(--ak-s2); margin: 0 0 var(--ak-s4) !important; }
.akey-box li { background: var(--ak-card); border-radius: var(--ak-r); padding: 20px; display: flex; gap: var(--ak-s2); align-items: center; font-size: 16px !important; line-height: 1.4 !important; color: var(--ak-ink) !important; margin: 0 !important; }
.akey-box .akey-ico { width: 44px; height: 44px; }
/* cards open the kit photo */
.akey-box--zoom li { padding: 0; }
.akey-box__link { display: flex; align-items: center; gap: var(--ak-s2); width: 100%; height: 100%; padding: 20px; border-radius: inherit; color: inherit !important; text-decoration: none !important; cursor: zoom-in; }
.akey-box__link > span { flex: 1 1 auto; }
.akey-box__zoom { flex: none; width: 20px; height: 20px; fill: none; stroke: var(--ak-mid); stroke-width: 1.8; stroke-linecap: round; opacity: .55; transition: opacity .2s ease, stroke .2s ease, transform .2s ease; }
.akey-box__link:hover .akey-box__zoom, .akey-box__link:focus-visible .akey-box__zoom { opacity: 1; stroke: var(--ak-red); transform: scale(1.12); }
.akey-box__link:focus-visible { outline: 2px solid var(--ak-ink); outline-offset: 2px; }

/* ============ install: steps list 4, step 8 */
.akey-install { row-gap: var(--ak-s3); }
.akey-install__nav { grid-column: span 4; list-style: none; margin: 0; padding: 0; }
.akey-install__steps { grid-column: span 8; list-style: none; margin: 0; padding: 0; display: grid; }
.akey-install__nav a { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 8px; color: var(--ak-ink); text-decoration: none; font-size: 16px; line-height: 1.3; }
.akey-install__nav a:hover { background: #f6f6f6; color: var(--ak-ink); }
.akey-install__nav a span { flex: none; width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--ak-ink); display: grid; place-items: center; font-size: 13px; }
.akey-install__nav a.is-active { background: #f3f3f3; }
.akey-install__nav a.is-active span { background: var(--ak-red); border-color: var(--ak-red); color: #fff; }
.akey-install.is-js .akey-install__step { grid-area: 1 / 1; visibility: hidden; }
.akey-install.is-js .akey-install__step.is-active { visibility: visible; }
.akey-install:not(.is-js) .akey-install__step + .akey-install__step { margin-top: var(--ak-s3); }
.akey-install__art { background: #fafafa; border-radius: 8px; }
.akey-install__num { display: block; font: 600 12px 'Work Sans', sans-serif; color: var(--ak-red); text-transform: uppercase; letter-spacing: .1em; margin: var(--ak-s3) 0 6px; }
.akey-install__text p { margin: 0; font-size: 17px; }
.akey-install__ctrl { grid-column: 5 / -1; display: flex; justify-content: space-between; gap: 12px; }
.akey-install:not(.is-js) .akey-install__ctrl { display: none; }
.akey-install__ctrl .akey-btn { background: var(--ak-red); border-color: var(--ak-red); color: #fff; }
.akey-install__ctrl .akey-btn:hover { background: #b80000; border-color: #b80000; }

/* ============ compare */
.akey-compare { display: grid; grid-template-columns: repeat(var(--akey-n, 3), minmax(0, 1fr)); column-gap: var(--ak-gap); row-gap: var(--ak-s2); margin: 0 0 var(--ak-s4) !important; }
.akey-compare__card { position: relative; background: var(--ak-card); border-radius: var(--ak-r); padding: var(--ak-s3); border: 2px solid transparent; display: flex; flex-direction: column; }
.akey-compare__card.is-current { border-color: var(--ak-ink); }
.akey-compare__badge { position: absolute; top: 14px; left: 14px; background: var(--ak-ink); color: #fff; font: 600 11px/1 'Work Sans', sans-serif; padding: 6px 10px; border-radius: 999px; text-transform: uppercase; letter-spacing: .08em; }
.akey-compare__card img { width: 100%; height: 180px; object-fit: contain; }
.akey-compare__card h3 { font: 400 24px/1.2 'Alatsi', sans-serif !important; margin: var(--ak-s2) 0 var(--ak-s1) !important; }
.akey-compare__card h3 a { color: var(--ak-ink); text-decoration: none; }
.akey-compare__card h3 a::after { content: " \2192"; color: var(--ak-red); }
.akey-compare__card dl { margin: 0; }
.akey-compare__card dl div { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--ak-soft); font-size: 15px; }
.akey-compare__card dt { color: var(--ak-mid); font-weight: 400; }
.akey-compare__card dd { margin: 0; text-align: right; color: var(--ak-ink); }

/* ============ two-column section (FAQ): heading 4, content 8 */
.akey-split { row-gap: var(--ak-s3); }
.akey-split__head { grid-column: span 4; }
.akey-split__head p { font-size: 16px !important; color: var(--ak-mid) !important; margin: var(--ak-s2) 0 0; max-width: 320px; }
.akey-split__body { grid-column: span 8; }

/* FAQ (native details: opens instantly, nothing above it moves) */
.akey-faq { display: flex; flex-direction: column; gap: 10px; }
.akey-faq details { background: var(--ak-card); border-radius: var(--ak-r); }
.akey-faq summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: var(--ak-s2); padding: 20px 24px; cursor: pointer; }
.akey-faq summary::-webkit-details-marker { display: none; }
.akey-faq summary h3 { font: 400 20px/1.3 'Alatsi', sans-serif !important; color: var(--ak-ink); margin: 0 !important; }
.akey-faq summary::after { content: ""; flex: none; width: 14px; height: 14px; background: linear-gradient(var(--ak-ink), var(--ak-ink)) center / 100% 2px no-repeat, linear-gradient(var(--ak-ink), var(--ak-ink)) center / 2px 100% no-repeat; transition: transform .2s; }
.akey-faq details[open] summary::after { transform: rotate(45deg); }
.akey-faq summary:hover h3 { color: var(--ak-red); }
.akey-faq__a { padding: 0 24px 22px; }
.akey-faq__a p { margin: 0; font-size: 17px !important; }
.akey-faq__a p + p { margin-top: 10px; }

/* ============ other versions (from akey-versions.php) on the same column lines */
.akey-v2 .akey-other [uk-grid] { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--ak-gap); row-gap: var(--ak-s2); margin-left: 0 !important; }
.akey-v2 .akey-other [uk-grid] > * { width: auto !important; padding-left: 0 !important; margin-top: 0 !important; }
.akey-v2 .akey-other [uk-grid]:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.akey-v2 .akey-other [uk-grid] > :only-child { width: calc(50% - var(--ak-gap) / 2) !important; }
.akey-other [uk-grid] > :only-child .akey-card { display: grid; grid-template-columns: 200px minmax(0, 1fr); text-align: left; }
.akey-other [uk-grid] > :only-child .akey-card { row-gap: 6px; column-gap: var(--ak-s3); }
.akey-other [uk-grid] > :only-child .akey-card__img { grid-column: 1; grid-row: 1 / 3; }
.akey-other [uk-grid] > :only-child .akey-card__name { grid-column: 2; align-self: end; margin-top: 0; }
.akey-other [uk-grid] > :only-child .akey-card__price { grid-column: 2; align-self: start; margin-top: 0; }
@media (max-width: 639px) { .akey-media { grid-template-columns: minmax(0, 1fr); column-gap: 0; } }
@media (max-width: 639px) { .akey-v2 .akey-other [uk-grid] > :only-child { width: auto !important; } .akey-other [uk-grid] > :only-child .akey-card { grid-template-columns: 120px minmax(0, 1fr); } }
.akey-other .akey-card__img { height: 180px; display: flex; align-items: center; justify-content: center; }
.akey-other .akey-card__img img { max-height: 180px; width: auto; }
@media (max-width: 959px) { .akey-v2 .akey-other [uk-grid] { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--ak-s2); } }

/* ============ mobile buy bar */
.akey-buybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 990; background: #fff; box-shadow: 0 -4px 16px rgba(0,0,0,.12); padding: 10px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; transform: translateY(110%); transition: transform .25s; }
.akey-buybar.is-on { transform: none; }
.akey-buybar__price { font: 600 22px monospace; }
.akey-buybar a { background: var(--ak-red); color: #fff; border-radius: 999px; padding: 12px 22px; text-transform: uppercase; font-size: 14px; text-decoration: none; }
@media (min-width: 960px) { .akey-buybar { display: none; } }

/* ============ tablet: everything collapses to one column, same order */
@media (max-width: 959px) {
	:root { --ak-s7: 80px; --ak-text: 100%; }
	.akey-v2 .akey-desc h2, .akey-v2 #tm-main .akey-desc ~ .uk-section h2 { font-size: 32px; }
	.akey-intro, .akey-split, .akey-cta, .akey-specs__cols, .akey-install, .akey-tool { grid-template-columns: minmax(0, 1fr); row-gap: var(--ak-s3); }
	.akey-intro > *, .akey-split > *, .akey-cta > *, .akey-specs__cols > *, .akey-install > *, .akey-tool > *, .akey-media > * { grid-column: 1 / -1 !important; grid-row: auto !important; }
	.akey-media { row-gap: var(--ak-s3); }
	.akey-intro__photo img { min-height: 0; aspect-ratio: 4 / 3; height: auto; }
	.akey-intro .akey-benefits--stack { grid-auto-rows: auto; }
	.akey-tool__res { padding-bottom: var(--ak-s2); border-bottom: 1px solid var(--ak-soft); }
	.akey-proj .akey-proj__svg { max-height: 280px; }
	.akey-cta__buy { justify-content: flex-start; }
	.akey-benefits { grid-template-columns: minmax(0, 1fr); }
	.akey-install__nav { display: none; }
	.akey-compare { grid-template-columns: minmax(0, 1fr); }
	.akey-box { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--ak-s2); }
	.akey-photos__item { grid-column: span 6; }
	.akey-photos__item:first-child { grid-column: 1 / -1; }
	.akey-photos__item img { height: auto; aspect-ratio: 4 / 5; }
	.akey-photos__item:first-child img { aspect-ratio: 3 / 2; }
	.akey-split__head p { max-width: none; }
}

/* ============ phone */
@media (max-width: 639px) {
	:root { --ak-s7: 64px; }
	.single-product .woocommerce-product-gallery { grid-template-columns: minmax(0, 1fr); row-gap: 10px; }
	.single-product .woocommerce-product-gallery .flex-viewport { grid-column: 1; }
	.single-product .woocommerce-product-gallery__trigger { grid-column: 1; }
	.single-product .woocommerce-product-gallery .flex-control-thumbs { grid-column: 1; grid-row: 2; height: auto; min-height: 0; flex-direction: row; overflow-x: auto; overflow-y: hidden; padding: 0 0 4px; }
	.single-product .woocommerce-product-gallery .flex-control-thumbs li { width: 64px !important; }
	.single-product .tm-element-woo-images .onsale { left: 14px; }
	.akey-cta { padding: var(--ak-s3); }
	.akey-cta__buy { flex-wrap: wrap; justify-content: space-between; gap: 12px; }
	.akey-cta__price { font-size: 22px; }
	.akey-cta__price del { font-size: 13px; }
	.akey-cta__btn { flex: 1 1 100%; text-align: center; }
	.akey-v2 .akey-desc p, .akey-v2 .akey-desc .uk-panel > ul:not([class]) li { font-size: 17px; }
	.akey-v2 .akey-desc h2, .akey-v2 #tm-main .akey-desc ~ .uk-section h2 { font-size: 28px; }
	.akey-v2 .akey-desc .uk-panel > h3 { font-size: 21px; margin-top: var(--ak-s4); }
	.akey-fact { padding: 10px; gap: 8px; }
	.akey-fact strong { font-size: 17px; }
	.akey-ico { width: 28px; height: 28px; }
	.akey-block { padding: var(--ak-s2); }
	.akey-block__head { gap: var(--ak-s2); }
	.akey-sag .akey-range { flex-basis: 100%; }
	.akey-figure--wide img { aspect-ratio: 4 / 3; }
	.akey-specs__draw { grid-template-columns: minmax(0, 1fr); row-gap: var(--ak-s2); }
	.akey-specs__draw svg:only-child { height: auto; }
	.akey-box { grid-template-columns: minmax(0, 1fr); }
	.akey-photos { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
	.akey-photos__item, .akey-photos__item:first-child { grid-column: 1 / -1; }
	.akey-photos__item img, .akey-photos__item:first-child img { aspect-ratio: 4 / 3; }
	.akey-faq summary { padding: 16px 18px; }
	.akey-faq summary h3 { font-size: 18px !important; }
	.akey-faq__a { padding: 0 18px 18px; }
	.akey-v2 .akey-desc table.uk-table :is(th, td) { padding-left: 8px; padding-right: 8px; }
	.akey-v2 .akey-desc table.uk-table th { font-size: 11px; }
}

/* ============ light motion: opacity + transform only, so nothing pushes the layout.
   Turned off entirely when the system asks for reduced motion. */
.akey-anim .akey-rv { opacity: 0; transform: translateY(14px); transition: opacity .42s ease, transform .5s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--akey-d, 0) * 50ms); }
.akey-anim .akey-rv.is-in { opacity: 1; transform: none; }

/* cards lift a little on hover */
.akey-fact, .akey-benefits li, .akey-box li, .akey-compare__card, .akey-other .akey-card { transition: transform .25s ease, box-shadow .25s ease; }
@media (hover: hover) {
	.akey-fact:hover, .akey-benefits li:hover, .akey-box li:has(.akey-box__link):hover, .akey-compare__card:hover, .akey-other .akey-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0, 0, 0, .07); }
	.akey-anim .akey-rv.is-in:is(.akey-benefits li, .akey-box li:has(.akey-box__link), .akey-compare__card):hover { transform: translateY(-3px); }
	.akey-benefits__link::after, .akey-compare__card h3 a::after { display: inline-block; transition: transform .2s ease; }
	.akey-benefits__link:hover::after, .akey-compare__card h3 a:hover::after { transform: translateX(4px); }
	.akey-cta__btn, .single_add_to_cart_button { transition: background-color .15s, transform .2s ease, box-shadow .2s ease; }
	.akey-cta__btn:hover, .akey-v2 .single_add_to_cart_button:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(218, 1, 1, .25); }
	.akey-photos__item img, .akey-intro__photo img { transition: filter .3s ease; }
	.akey-photos__item:hover img, .akey-intro__photo:hover img { filter: brightness(1.04) contrast(1.02); }
}

/* install steps cross-fade (they are stacked in one grid cell, height never changes) */
.akey-install.is-js .akey-install__step { opacity: 0; transition: opacity .35s ease, visibility 0s linear .35s; }
.akey-install.is-js .akey-install__step.is-active { opacity: 1; transition: opacity .35s ease, visibility 0s; }

/* FAQ answer and size table fade in as they open */
@keyframes akey-fade-down { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.akey-faq details[open] .akey-faq__a, .akey-tool__more[open] .akey-tool__more-body { animation: akey-fade-down .3s ease; }

/* calculator answers: a soft fade when the result text changes */
@keyframes akey-pop { from { opacity: .35; } to { opacity: 1; } }
.akey-tool__res.is-updated .akey-result-big { animation: akey-pop .35s ease; }

@media (prefers-reduced-motion: reduce) {
	.akey-anim .akey-rv { opacity: 1 !important; transform: none !important; transition: none !important; }
	.akey-fact, .akey-benefits li, .akey-box li, .akey-compare__card, .akey-install__step, .akey-buybar { transition: none !important; }
	.akey-faq details[open] .akey-faq__a, .akey-tool__more[open] .akey-tool__more-body, .akey-tool__res .akey-result-big { animation: none !important; }
	.akey-fact:hover, .akey-benefits li:hover, .akey-box li:hover, .akey-compare__card:hover { transform: none !important; }
}

/* other versions: odd last card on the 2-column (tablet/phone) grid spans the row as a wide card, no empty corner */
@media (max-width: 959px) {
	.akey-v2 .akey-other [uk-grid] > :last-child:nth-child(odd):not(:only-child) { grid-column: 1 / -1; }
	.akey-other [uk-grid] > :last-child:nth-child(odd):not(:only-child) .akey-card { display: grid; grid-template-columns: 120px minmax(0, 1fr); column-gap: var(--ak-s3); row-gap: 4px; text-align: left; align-content: center; }
	.akey-other [uk-grid] > :last-child:nth-child(odd):not(:only-child) .akey-card__img { grid-column: 1; grid-row: 1 / span 3; height: 120px; }
	.akey-other [uk-grid] > :last-child:nth-child(odd):not(:only-child) .akey-card__img img { max-height: 120px; }
	.akey-other [uk-grid] > :last-child:nth-child(odd):not(:only-child) .akey-card > :not(.akey-card__img) { grid-column: 2; margin-top: 0; }
}

/* ---------------- wholesale / trade */
.akey-trade { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--ak-gap); row-gap: var(--ak-s3); align-items: center; }
.akey-trade__text { grid-column: span 5; }
.akey-trade__tiles { grid-column: span 7; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ak-s2); list-style: none; margin: 0 !important; padding: 0 !important; }
.akey-trade__tiles li { background: var(--ak-tint); border-radius: var(--ak-r); padding: var(--ak-s3); margin: 0 !important; display: flex; flex-direction: column; gap: 6px; }
.akey-trade__tiles strong { font: 400 26px/1.15 'Alatsi', sans-serif; color: var(--ak-ink); }
.akey-trade__tiles span { font-size: 15px; line-height: 1.4; color: var(--ak-mid); }
.akey-v2 .akey-trade p { margin: 0 0 var(--ak-s2); }
.akey-trade__lead { font-size: 18px !important; line-height: 1.5; color: var(--ak-body); }
.akey-trade__kit { font-size: 15px !important; color: var(--ak-mid) !important; }
.akey-trade__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ak-s2) var(--ak-s3); margin: var(--ak-s3) 0 var(--ak-s2); }
.akey-trade__mail { font-size: 15px; color: var(--ak-ink) !important; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.akey-v2 .akey-trade .akey-trade__phone { font-size: 14px; color: var(--ak-mid); margin: 0; }
.akey-trade__phone a { color: inherit !important; white-space: nowrap; }
@media (max-width: 959px) {
	.akey-trade { grid-template-columns: minmax(0, 1fr); }
	.akey-trade__text, .akey-trade__tiles { grid-column: auto; }
}
@media (max-width: 639px) {
	.akey-trade__tiles li { padding: var(--ak-s2); }
	.akey-trade__tiles strong { font-size: 21px; }
	.akey-trade__tiles span { font-size: 14px; }
}
/* the trade line under the Buy button gets a full row of its own */
.akey-v2 .product .uk-grid > div:last-child > .tm-element-woo-add-to-cart:has(> .akey-trade-line) { display: contents; }
.akey-v2 .product .tm-element-woo-add-to-cart > form.cart { flex: 0 0 auto; margin-top: var(--ak-s2) !important; }
.akey-trade-line { flex: 0 0 100%; margin: 12px 0 0 !important; font-size: 15px; color: var(--ak-mid); }
.akey-trade-line a { color: var(--ak-ink) !important; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.akey-trade-line a::after { content: " \2192"; }