/* ==========================================================================
   THERMOCON Product Catalog — front end
   CD: Inter · ink #0B343B · action #0B343B (hover #134A54) · accent #0B343B
   (non-text only) · body #49656C · surface #F0F6F6 · footer #061F24 ·
   focus #FFBF47 · 8px radius · 3px focus ring, 3px offset · 160ms motion ·
   44px minimum target. Tokens come from Settings → Design (:root vars).
   ========================================================================== */

:root {
	--thcc-ink: #0B343B; --thcc-action: #0B343B; --thcc-hover: #134A54; --thcc-accent: #0B343B;
	--thcc-body: #49656C; --thcc-surface: #F0F6F6; --thcc-dark: #061F24; --thcc-focus: #FFBF47;
	--thcc-radius: 8px; --thcc-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--thcc-line: #D5E3E4; --thcc-line-soft: #E6EFEF; --thcc-muted: #6B8388; --thcc-tint: #E4F4F7; --thcc-faint: #9DB5B9; --thcc-white: #fff; --thcc-ok: #1E7D4F; --thcc-warn: #9A5B00;
	--thcc-shadow: 0 1px 2px rgba(6,31,36,.06), 0 8px 24px rgba(6,31,36,.08);
	--thcc-shadow-lg: 0 24px 60px rgba(6,31,36,.22);
	--thcc-t: 160ms cubic-bezier(.2,.7,.3,1);
	--thcc-sticky-top: 0px;
}

.thcc { font-family: var(--thcc-font); color: var(--thcc-body); font-size: 16px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
.thcc *, .thcc *::before, .thcc *::after, .thcc-basket *, .thcc-basket *::before, .thcc-basket *::after { box-sizing: border-box; }
.thcc img { max-width: 100%; height: auto; display: block; }
.thcc a { color: var(--thcc-action); text-decoration: none; }
.thcc a:hover { color: var(--thcc-hover); text-decoration: underline; text-underline-offset: 3px; }
.thcc :focus-visible, .thcc-basket :focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 3px; border-radius: 4px; }
.thcc-band :focus-visible, .thcc-drawer-foot :focus-visible { outline-color: var(--thcc-focus); }
.thcc-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.thcc-ic { flex: none; }
.thcc [hidden], .thcc-basket [hidden] { display: none !important; }

.thcc-wrap { max-width: calc(var(--thcc-container, 1320px) + 2 * var(--thcc-gutter, 24px)); margin: 0 auto; padding: 0 var(--thcc-gutter, 24px); width: 100%; box-sizing: border-box; }
/* Lined up with the site header to the pixel (product.js measures it). */
.thcc-product.has-frame .thcc-wrap { max-width: none; width: var(--thcc-frame-w); margin-left: var(--thcc-frame-l); margin-right: 0; padding-left: 0; padding-right: 0; }
.thcc-main { background: #fff; }

.thcc-h2 { font: 700 clamp(1.45rem, 1.1rem + 1.2vw, 2rem)/1.2 var(--thcc-font); color: var(--thcc-ink); margin: 0 0 20px; letter-spacing: -.01em; }
.thcc-h3 { font: 700 1.125rem/1.3 var(--thcc-font); color: var(--thcc-ink); margin: 0 0 14px; }
.thcc-eyebrow { font: 700 .75rem/1.2 var(--thcc-font); letter-spacing: .12em; text-transform: uppercase; color: var(--thcc-action); margin: 0 0 8px; }
.thcc-muted { color: var(--thcc-muted); font-size: .9rem; margin: 0; }
.thcc-mono { font-variant-numeric: tabular-nums; white-space: nowrap; }
.thcc-alert { background: #FFF7E6; border: 1px solid #F2D49B; color: var(--thcc-warn); padding: 12px 16px; border-radius: var(--thcc-radius); margin: 16px 0; }

/* ---------- buttons (identity props !important: theme button styles win otherwise) ---------- */
.thcc .thcc-btn, .thcc-basket .thcc-btn, .thcc-dialog .thcc-btn {
	display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
	min-height: 48px; padding: 0 22px !important; border-radius: var(--thcc-radius) !important;
	font: 600 1rem/1 var(--thcc-font) !important; letter-spacing: 0 !important; text-transform: none !important;
	border: 2px solid transparent !important; cursor: pointer; text-decoration: none !important;
	transition: background var(--thcc-t), color var(--thcc-t), border-color var(--thcc-t), transform var(--thcc-t), box-shadow var(--thcc-t);
	white-space: nowrap; box-shadow: none;
}
.thcc .thcc-btn:active { transform: translateY(1px); }
.thcc .thcc-btn-primary, .thcc-basket .thcc-btn-primary, .thcc-dialog .thcc-btn-primary { background: var(--thcc-action) !important; color: #fff !important; }
.thcc .thcc-btn-primary:hover, .thcc-basket .thcc-btn-primary:hover, .thcc-dialog .thcc-btn-primary:hover { background: var(--thcc-hover) !important; color: #fff !important; }
.thcc .thcc-btn-primary:disabled, .thcc-basket .thcc-btn-primary:disabled { background: var(--thcc-faint) !important; cursor: not-allowed; }
.thcc .thcc-btn-ghost, .thcc-dialog .thcc-btn-ghost { background: transparent !important; color: var(--thcc-ink) !important; border-color: var(--thcc-line) !important; }
.thcc .thcc-btn-ghost:hover, .thcc-dialog .thcc-btn-ghost:hover { border-color: var(--thcc-ink) !important; }
.thcc .thcc-btn-outline { background: #fff !important; color: var(--thcc-action) !important; border-color: var(--thcc-action) !important; }
.thcc .thcc-btn-outline:hover { background: var(--thcc-surface) !important; }
.thcc .thcc-btn-light { background: #fff !important; color: var(--thcc-ink) !important; }
.thcc .thcc-btn-light:hover { background: var(--thcc-surface) !important; }
.thcc .thcc-btn-outline-light { background: transparent !important; color: #fff !important; border-color: rgba(255,255,255,.55) !important; }
.thcc .thcc-btn-outline-light:hover { border-color: #fff !important; color: #fff !important; }
.thcc .thcc-btn-sm { min-height: 38px; padding: 0 14px !important; font-size: .875rem !important; }
.thcc .thcc-btn-icon { width: 38px; padding: 0 !important; background: var(--thcc-surface) !important; color: var(--thcc-action) !important; }
.thcc .thcc-btn-icon:hover { background: var(--thcc-action) !important; color: #fff !important; }
.thcc .thcc-btn-icon.is-in { background: var(--thcc-ok) !important; color: #fff !important; }
.thcc .thcc-btn-block, .thcc-basket .thcc-btn-block { width: 100%; }
.thcc-linkbtn { background: none !important; border: 0 !important; padding: 6px 0 !important; color: var(--thcc-action) !important; font: 600 .875rem/1.3 var(--thcc-font) !important; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; text-decoration: underline; text-underline-offset: 3px; min-height: 32px; }
.thcc-linkbtn:hover { color: var(--thcc-hover) !important; }
.thcc-linkbtn.thcc-danger { color: #A33A3A !important; }
.thcc-iconbtn { display: inline-flex; align-items: center; gap: 6px; background: none !important; border: 0 !important; color: var(--thcc-body) !important; font: 500 .875rem/1 var(--thcc-font) !important; cursor: pointer; padding: 8px !important; min-height: 40px; border-radius: 6px !important; }
.thcc-iconbtn:hover { color: var(--thcc-ink) !important; background: var(--thcc-surface) !important; text-decoration: none !important; }

/* add button states */
.thcc .thcc-add .thcc-add-ic { display: inline-flex; transition: transform var(--thcc-t); }
.thcc .thcc-add.is-in { background: var(--thcc-ink) !important; }
.thcc .thcc-add.is-in .thcc-add-ic svg { display: none; }
.thcc .thcc-add.is-in .thcc-add-ic::before { content: "✓"; font-weight: 700; }
.thcc .thcc-add.is-added { animation: thcc-pop .5s ease; }
@keyframes thcc-pop { 40% { transform: scale(1.04); } }

/* ---------- top bar ---------- */
.thcc-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 20px; padding-bottom: 8px; flex-wrap: wrap; }
.thcc-crumbs ol { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; font-size: .85rem; }
.thcc-crumbs li { display: flex; align-items: center; }
.thcc-crumbs li + li::before { content: "›"; margin: 0 8px; color: var(--thcc-faint); }
.thcc-crumbs a { color: var(--thcc-body); }
.thcc-crumbs [aria-current] { color: var(--thcc-ink); font-weight: 600; }
.thcc-back { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: .9rem; padding: 8px 14px; border-radius: 999px; background: var(--thcc-surface); color: var(--thcc-ink) !important; }
.thcc-back:hover { background: var(--thcc-line-soft); text-decoration: none !important; }

/* ---------- hero ---------- */
.thcc-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 72px); padding-top: 20px; padding-bottom: 56px; align-items: start; }
.thcc-gallery { position: sticky; top: calc(var(--thcc-sticky-top) + 16px); }
.thcc-stage { position: relative; background: linear-gradient(180deg, var(--thcc-surface), var(--thcc-surface)); border-radius: calc(var(--thcc-radius) * 2); overflow: hidden; aspect-ratio: 1 / 1; display: grid; place-items: center; border: 1px solid var(--thcc-line-soft); }
.thcc-slide { margin: 0; width: 100%; height: 100%; }
.thcc-slide.is-on { animation: thcc-fade .25s ease; }
@keyframes thcc-fade { from { opacity: .3; } to { opacity: 1; } }
.thcc .thcc-zoom { all: unset; display: block; width: 100%; height: 100%; cursor: zoom-in; position: relative; background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; }
.thcc .thcc-slide-img { width: 100%; height: 100%; object-fit: contain; padding: 6%; mix-blend-mode: multiply; }
.thcc-zoom-ic { position: absolute; right: 14px; bottom: 14px; width: 40px; height: 40px; border-radius: 50%; background: #fff; display: grid; place-items: center; color: var(--thcc-ink); box-shadow: var(--thcc-shadow); opacity: 0; transition: opacity var(--thcc-t); }
.thcc-zoom:hover .thcc-zoom-ic, .thcc-zoom:focus-visible .thcc-zoom-ic { opacity: 1; }
.thcc .thcc-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border-radius: 50% !important; border: 0 !important; background: rgba(255,255,255,.92) !important; color: var(--thcc-ink) !important; display: grid; place-items: center; cursor: pointer; box-shadow: var(--thcc-shadow); padding: 0 !important; }
.thcc .thcc-nav:hover { background: #fff !important; }
.thcc-prev { left: 12px; } .thcc-next { right: 12px; }
.thcc-badge { position: absolute; left: 16px; top: 16px; z-index: 2; background: var(--thcc-ink); color: #fff; font: 700 .75rem/1 var(--thcc-font); letter-spacing: .06em; text-transform: uppercase; padding: 8px 12px; border-radius: 999px; }
.thcc-noimg { display: grid; place-items: center; width: 100%; height: 100%; color: var(--thcc-faint); min-height: 160px; }
.thcc-thumbs { display: flex; gap: 10px; margin-top: 12px; overflow-x: auto; padding: 4px 2px; scrollbar-width: thin; }
.thcc .thcc-thumb { flex: 0 0 76px; height: 76px; border-radius: var(--thcc-radius) !important; border: 2px solid var(--thcc-line-soft) !important; background: var(--thcc-surface) !important; padding: 4px !important; cursor: pointer; transition: border-color var(--thcc-t); }
.thcc .thcc-thumb img { width: 100% !important; height: 100% !important; object-fit: contain; mix-blend-mode: multiply; }
.thcc .thcc-thumb.is-on, .thcc .thcc-thumb:hover { border-color: var(--thcc-action) !important; }

.thcc-buy { min-width: 0; }
.thcc-title { font: 800 clamp(1.8rem, 1.2rem + 2.2vw, 2.75rem)/1.1 var(--thcc-font); color: var(--thcc-ink); margin: 0 0 10px; letter-spacing: -.02em; }
.thcc-subtitle { font-size: 1.15rem; color: var(--thcc-ink); margin: 0 0 14px; font-weight: 500; }
.thcc-meta { display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center; font-size: .875rem; margin-bottom: 18px; }
.thcc-sku b { color: var(--thcc-ink); font-variant-numeric: tabular-nums; }
.thcc-varcount { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: var(--thcc-surface); border-radius: 999px; color: var(--thcc-ink); font-weight: 600; }
.thcc-lead { font-size: 1.05rem; margin-bottom: 22px; }
.thcc-lead p { margin: 0 0 10px; }

/* variant picker */
.thcc-picker { border: 1px solid var(--thcc-line); border-radius: calc(var(--thcc-radius) * 1.5); padding: 20px; margin: 0 0 20px; background: #fff; box-shadow: var(--thcc-shadow); }
.thcc-picker-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 14px; }
.thcc-picker-title { font: 700 1rem/1.3 var(--thcc-font); color: var(--thcc-ink); margin: 0; flex: 1 1 auto; }
.thcc-fromtable { display: inline-flex; align-items: center; gap: 6px; margin: 0; background: var(--thcc-tint); color: var(--thcc-hover); font-size: .8rem; font-weight: 600; padding: 5px 10px; border-radius: 999px; animation: thcc-glow 1.6s ease 2; }
@keyframes thcc-glow { 50% { box-shadow: 0 0 0 5px rgba(0,158,193,.18); } }
.thcc-attr { margin-bottom: 14px; }
.thcc-attr-label { display: block; font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--thcc-muted); margin: 0 0 8px; }
.thcc-attr-label b { color: var(--thcc-ink); text-transform: none; letter-spacing: 0; font-size: .9rem; }
.thcc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.thcc .thcc-chip { min-height: 44px; padding: 8px 14px !important; border-radius: var(--thcc-radius) !important; border: 1.5px solid var(--thcc-line) !important; background: #fff !important; color: var(--thcc-ink) !important; font: 500 .9rem/1.25 var(--thcc-font) !important; cursor: pointer; transition: all var(--thcc-t); text-align: left; }
.thcc .thcc-chip:hover { border-color: var(--thcc-action) !important; }
.thcc .thcc-chip.is-on { border-color: var(--thcc-action) !important; background: var(--thcc-action) !important; color: #fff !important; box-shadow: 0 0 0 3px rgba(0,117,138,.15); }
.thcc .thcc-chip.is-na:not(.is-on) { border-style: dashed !important; color: var(--thcc-faint) !important; }
.thcc-select { display: block; margin: 6px 0 0; }
.thcc .thcc-select select { width: 100%; min-height: 48px; padding: 0 40px 0 14px; border: 1.5px solid var(--thcc-line); border-radius: var(--thcc-radius); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%230B343B' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center; appearance: none; font: 500 .95rem var(--thcc-font); color: var(--thcc-ink); }
.thcc-picker-msg { font-size: .8rem; color: var(--thcc-hover); margin: 8px 0 0; min-height: 1em; }
.thcc-varcard { margin-top: 14px; background: var(--thcc-surface); border-radius: var(--thcc-radius); padding: 14px 16px; }
.thcc-varcard-title { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-weight: 700; color: var(--thcc-ink); }
.thcc-varcard-title svg { color: var(--thcc-ok); }
.thcc-varspecs { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px 16px; margin: 0; }
.thcc-varspecs div { min-width: 0; }
.thcc-varspecs dt { font-size: .75rem; color: var(--thcc-muted); }
.thcc-varspecs dd { margin: 0; font-weight: 600; color: var(--thcc-ink); font-variant-numeric: tabular-nums; }
.thcc-varnote { margin: 8px 0 0; font-size: .875rem; }

/* actions */
.thcc-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 4px 0 20px; }
.thcc-actions .thcc-add { flex: 1 1 220px; }
.thcc-qty { display: inline-flex; align-items: center; border: 1.5px solid var(--thcc-line); border-radius: var(--thcc-radius); background: #fff; height: 48px; }
.thcc-qty label { margin: 0; }
.thcc .thcc-qty input, .thcc-basket .thcc-qty input, .thcc-dialog .thcc-qty input { width: 64px; height: 100%; border: 0 !important; text-align: center; font: 600 1rem var(--thcc-font); color: var(--thcc-ink); background: transparent !important; -moz-appearance: textfield; padding: 0 !important; box-shadow: none !important; }
.thcc-qty input::-webkit-outer-spin-button, .thcc-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.thcc-qty .thcc-qty-btn { width: 44px; height: 100%; border: 0 !important; background: none !important; color: var(--thcc-ink) !important; cursor: pointer; display: grid; place-items: center; padding: 0 !important; border-radius: 0 !important; }
.thcc-qty .thcc-qty-btn:hover { color: var(--thcc-action) !important; background: var(--thcc-surface) !important; }
.thcc-qty-sm { height: 36px; }
.thcc-qty-sm .thcc-qty-btn { width: 34px; }
.thcc-basket .thcc-qty-sm input { width: 46px; font-size: .9rem; }
.thcc-qty-unit { font-size: .8rem; color: var(--thcc-muted); padding: 0 10px 0 2px; }

.thcc-trust { list-style: none; margin: 0 0 16px; padding: 16px 0 0; border-top: 1px solid var(--thcc-line-soft); display: grid; gap: 8px; }
.thcc-trust li { display: flex; gap: 10px; align-items: center; font-size: .9rem; color: var(--thcc-ink); }
.thcc-trust svg { color: var(--thcc-action); }
.thcc-share { display: flex; gap: 4px; flex-wrap: wrap; margin-left: -8px; }

/* ---------- section tabs ---------- */
.thcc-tabs { position: sticky; top: var(--thcc-sticky-top); z-index: 20; background: rgba(255,255,255,.96); backdrop-filter: saturate(1.4) blur(8px); border-bottom: 1px solid var(--thcc-line-soft); border-top: 1px solid var(--thcc-line-soft); }
.thcc-tabs-in { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.thcc-tabs-in::-webkit-scrollbar { display: none; }
.thcc .thcc-tab { flex: none; padding: 16px 16px 14px; font-weight: 600; font-size: .95rem; color: var(--thcc-body); border-bottom: 3px solid transparent; white-space: nowrap; }
.thcc .thcc-tab:hover { color: var(--thcc-ink); text-decoration: none; }
.thcc .thcc-tab.is-on { color: var(--thcc-ink); border-bottom-color: var(--thcc-action); }

/* ---------- sections ---------- */
.thcc-sec { padding-top: clamp(40px, 5vw, 72px); padding-bottom: clamp(40px, 5vw, 72px); scroll-margin-top: calc(var(--thcc-sticky-top) + 64px); }
.thcc-sec-alt { background: var(--thcc-surface); }
.thcc-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.thcc-sec-head .thcc-h2 { margin: 0; }
.thcc-overview { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.thcc-overview.has-features { grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); }
.thcc-content { font-size: 1.02rem; }
.thcc-content h2, .thcc-content h3 { color: var(--thcc-ink); }
.thcc-content ul { padding-left: 1.2em; }
.thcc-features { background: var(--thcc-surface); border-radius: calc(var(--thcc-radius) * 1.5); padding: 24px; align-self: start; }
.thcc-features ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.thcc-features li { display: flex; gap: 12px; }
.thcc-feat-ic { flex: none; width: 36px; height: 36px; border-radius: 50%; background: #fff; color: var(--thcc-action); display: grid; place-items: center; }
.thcc-features b { display: block; color: var(--thcc-ink); }
.thcc-features small { display: block; font-size: .875rem; }
.thcc-video iframe { width: 100%; aspect-ratio: 16/9; height: auto; border-radius: var(--thcc-radius); margin-top: 20px; }

/* tech data */
.thcc-specgrid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr); gap: 32px; align-items: start; }
.thcc-specgrid > :only-child { grid-column: 1 / -1; }
.thcc-spectable-wrap.is-collapsed { max-height: 560px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 75%, transparent); mask-image: linear-gradient(#000 75%, transparent); }
.thcc-spectable { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--thcc-radius); overflow: hidden; margin: 0 0 18px; font-size: .95rem; }
.thcc-spectable caption { text-align: left; font-weight: 700; color: var(--thcc-ink); padding: 0 0 8px; }
.thcc-spectable th, .thcc-spectable td { padding: 12px 16px; border-bottom: 1px solid var(--thcc-line-soft); text-align: left; vertical-align: top; }
.thcc-spectable th { width: 45%; font-weight: 500; color: var(--thcc-body); }
.thcc-spectable td { font-weight: 600; color: var(--thcc-ink); font-variant-numeric: tabular-nums; }
.thcc-spectable tr:last-child th, .thcc-spectable tr:last-child td { border-bottom: 0; }
.thcc-selspecs { position: sticky; top: calc(var(--thcc-sticky-top) + 80px); background: #fff; border-radius: calc(var(--thcc-radius) * 1.5); padding: 20px; border: 2px solid var(--thcc-action); }
.thcc-selspecs-title { margin: 0 0 12px; font-size: .9rem; }
.thcc-selspecs-title b { color: var(--thcc-ink); }
.thcc-selspecs .thcc-spectable { margin: 0; }
.thcc-more-btn { margin-top: 4px; }

/* compare */
.thcc-compare-wrap { overflow-x: auto; border: 1px solid var(--thcc-line); border-radius: calc(var(--thcc-radius) * 1.5); background: #fff; }
.thcc-compare { width: 100%; border-collapse: collapse; font-size: .92rem; min-width: 640px; }
.thcc-compare th, .thcc-compare td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--thcc-line-soft); vertical-align: middle; }
.thcc-compare thead th { background: var(--thcc-ink); color: #fff; font-weight: 600; font-size: .8rem; letter-spacing: .02em; position: sticky; top: 0; }
.thcc-compare tbody th { color: var(--thcc-ink); font-weight: 600; }
.thcc-compare tbody tr { transition: background var(--thcc-t); }
.thcc-compare tbody tr:hover { background: var(--thcc-surface); }
.thcc-compare tbody tr.is-sel { background: var(--thcc-tint); box-shadow: inset 4px 0 0 var(--thcc-action); }
.thcc-compare-act { white-space: nowrap; text-align: right !important; }
.thcc-compare-act .thcc-btn + .thcc-btn { margin-left: 6px; }
.thcc .thcc-pick-on { display: none; align-items: center; gap: 4px; }
.thcc tr.is-sel .thcc-pick-off { display: none; }
.thcc tr.is-sel .thcc-pick-on { display: inline-flex; }
.thcc tr.is-sel [data-thcc-pick] { background: var(--thcc-action) !important; color: #fff !important; }

/* downloads */
.thcc-downloads { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.thcc-downloads a { display: flex; align-items: center; gap: 14px; background: #fff; border-radius: var(--thcc-radius); padding: 16px; border: 1px solid var(--thcc-line-soft); color: var(--thcc-ink) !important; transition: border-color var(--thcc-t), box-shadow var(--thcc-t); }
.thcc-downloads a:hover { border-color: var(--thcc-action); box-shadow: var(--thcc-shadow); text-decoration: none !important; }
.thcc-dl-ic { width: 44px; height: 44px; border-radius: var(--thcc-radius); background: var(--thcc-surface); color: var(--thcc-action); display: grid; place-items: center; flex: none; }
.thcc-dl-txt { flex: 1; min-width: 0; }
.thcc-dl-txt b { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; }
.thcc-dl-txt small { color: var(--thcc-muted); }
.thcc-dl-go { color: var(--thcc-action); }

/* faq */
.thcc-faq { display: grid; gap: 10px; max-width: 920px; }
.thcc-faq-item { border: 1px solid var(--thcc-line); border-radius: var(--thcc-radius); background: #fff; }
.thcc-faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 16px; align-items: center; padding: 16px 20px; font-weight: 600; color: var(--thcc-ink); min-height: 56px; }
.thcc-faq-item summary::-webkit-details-marker { display: none; }
.thcc-faq-ic { transition: transform var(--thcc-t); color: var(--thcc-action); }
.thcc-faq-item[open] .thcc-faq-ic { transform: rotate(45deg); }
.thcc-faq-a { padding: 0 20px 16px; }

/* cards (related + boxes) */
.thcc-cards { display: grid; gap: 24px; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); }
.thcc-cols-1 { --cols: 1; } .thcc-cols-2 { --cols: 2; } .thcc-cols-3 { --cols: 3; } .thcc-cols-4 { --cols: 4; }
.thcc-card { background: #fff; border: 1px solid var(--thcc-line); border-radius: calc(var(--thcc-radius) * 1.5); overflow: hidden; display: flex; flex-direction: column; transition: box-shadow var(--thcc-t), transform var(--thcc-t), border-color var(--thcc-t); }
.thcc-card:hover { box-shadow: var(--thcc-shadow); transform: translateY(-2px); border-color: #BFD4D6; }
.thcc-card-media { position: relative; display: block; aspect-ratio: 4 / 3; background: linear-gradient(180deg, var(--thcc-surface), var(--thcc-surface)); }
.thcc-card-media img { width: 100%; height: 100%; object-fit: contain; padding: 8%; mix-blend-mode: multiply; }
.thcc-card-body { padding: 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.thcc-card-title { font: 700 1.15rem/1.3 var(--thcc-font); margin: 0; }
.thcc-card-title a { color: var(--thcc-ink) !important; }
.thcc-card-sub { margin: 0; font-size: .9rem; }
.thcc-card-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; margin-top: auto; }
.thcc-keydata { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; margin: 6px 0; padding: 12px 0; border-top: 1px solid var(--thcc-line-soft); border-bottom: 1px solid var(--thcc-line-soft); }
.thcc-keydata dt { font-size: .75rem; color: var(--thcc-muted); }
.thcc-keydata dd { margin: 0; font-weight: 600; color: var(--thcc-ink); font-size: .9rem; font-variant-numeric: tabular-nums; }
.thcc-mini-wrap { overflow-x: auto; }
.thcc-mini { width: 100%; border-collapse: collapse; font-size: .82rem; }
.thcc-mini th { text-align: left; font-weight: 600; color: var(--thcc-muted); padding: 6px 8px 6px 0; border-bottom: 1px solid var(--thcc-line); }
.thcc-mini td { padding: 6px 8px 6px 0; border-bottom: 1px solid var(--thcc-line-soft); color: var(--thcc-ink); font-variant-numeric: tabular-nums; }
.thcc-more { margin-top: 4px; font-size: .8rem; }
.thcc-card-actions { margin-top: auto; padding-top: 12px; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.thcc-boxes { margin: 24px 0; }
.thcc-boxes-empty { padding: 20px; background: var(--thcc-surface); border-radius: var(--thcc-radius); }

/* contact band */
.thcc-band { background: var(--thcc-ink); color: #D8E6E8; padding: 48px 0; }
.thcc-band-in { display: flex; justify-content: space-between; gap: 24px 48px; align-items: center; flex-wrap: wrap; }
.thcc-band-title { font: 700 1.5rem/1.25 var(--thcc-font); color: #fff; margin: 0 0 6px; }
.thcc-band p { margin: 0; }
.thcc-band-actions { display: flex; gap: 12px 20px; flex-wrap: wrap; align-items: center; }
.thcc .thcc-band-link { color: #fff !important; display: inline-flex; gap: 8px; align-items: center; font-weight: 600; }

/* sticky product bar */
.thcc-stickybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; background: #fff; box-shadow: 0 -6px 24px rgba(6,31,36,.12); transform: translateY(110%); transition: transform .25s ease; }
.thcc-stickybar.is-on { transform: none; }
.thcc-stickybar-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 10px; padding-bottom: 10px; }
.thcc-stickybar-prod { display: flex; align-items: center; gap: 12px; min-width: 0; }
.thcc-stickybar-prod img { width: 48px !important; height: 48px !important; max-width: none !important; object-fit: contain; background: var(--thcc-surface); border-radius: 6px; }
.thcc-stickybar-prod b { display: block; color: var(--thcc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.thcc-stickybar-prod small { display: block; font-size: .8rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 48vw; }
html.thcc-sticky-on .thcc-basket.thcc-pos-bottom .thcc-bar { bottom: 84px; }

/* lightbox + dialog */
.thcc-lightbox { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; }
.thcc-lightbox::backdrop { background: rgba(6,31,36,.92); }
.thcc-lightbox[open] { display: grid; place-items: center; }
.thcc-lb-img { max-width: min(92vw, 1400px); max-height: 84vh; object-fit: contain; background: #fff; border-radius: var(--thcc-radius); }
.thcc .thcc-lb-close, .thcc .thcc-lb-nav { position: fixed; border: 0 !important; background: rgba(255,255,255,.12) !important; color: #fff !important; width: 52px; height: 52px; border-radius: 50% !important; display: grid; place-items: center; cursor: pointer; padding: 0 !important; }
.thcc .thcc-lb-close:hover, .thcc .thcc-lb-nav:hover { background: rgba(255,255,255,.24) !important; }
.thcc-lb-close { top: 20px; right: 20px; }
.thcc-lb-prev { left: 20px; top: 50%; transform: translateY(-50%); }
.thcc-lb-next { right: 20px; top: 50%; transform: translateY(-50%); }
.thcc-lb-count { position: fixed; bottom: 18px; left: 0; right: 0; text-align: center; color: #fff; margin: 0; font-size: .9rem; }

.thcc-dialog { border: 0; padding: 0; border-radius: calc(var(--thcc-radius) * 2); width: min(640px, 94vw); max-height: 88vh; box-shadow: var(--thcc-shadow-lg); font-family: var(--thcc-font); color: var(--thcc-body); }
.thcc-dialog::backdrop { background: rgba(6,31,36,.55); backdrop-filter: blur(2px); }
.thcc-dialog-in { display: flex; flex-direction: column; max-height: 88vh; margin: 0; }
.thcc-dialog-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 22px 24px 12px; border-bottom: 1px solid var(--thcc-line-soft); }
.thcc-dialog-title { font: 700 1.25rem/1.3 var(--thcc-font); color: var(--thcc-ink); margin: 0; }
.thcc-dialog-body { padding: 14px 24px; overflow-y: auto; }
.thcc-dialog-foot { display: flex; gap: 10px; align-items: center; justify-content: flex-end; flex-wrap: wrap; padding: 14px 24px 20px; border-top: 1px solid var(--thcc-line-soft); background: #FAFCFC; }
.thcc-dialog-foot .thcc-qty { margin-right: auto; }
.thcc-optlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.thcc-opt input { position: absolute; opacity: 0; pointer-events: none; }
.thcc-opt label { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1.5px solid var(--thcc-line); border-radius: var(--thcc-radius); cursor: pointer; transition: all var(--thcc-t); min-height: 52px; }
.thcc-opt label:hover { border-color: var(--thcc-action); }
.thcc-opt.is-on label { border-color: var(--thcc-action); background: #F2FAFB; box-shadow: 0 0 0 3px rgba(0,117,138,.12); }
.thcc-opt input:focus-visible + label { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc-opt-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--thcc-faint); flex: none; display: grid; place-items: center; }
.thcc-opt.is-on .thcc-opt-dot { border-color: var(--thcc-action); }
.thcc-opt.is-on .thcc-opt-dot::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--thcc-action); }
.thcc-opt-txt { flex: 1; min-width: 0; }
.thcc-opt-txt b { display: block; color: var(--thcc-ink); font-weight: 600; }
.thcc-opt-txt small { font-size: .8rem; color: var(--thcc-muted); }
.thcc-opt-in { font-size: .72rem; font-weight: 700; color: var(--thcc-ok); background: #E6F4EC; padding: 3px 8px; border-radius: 999px; }

/* ==========================================================================
   Inquiry cart
   ========================================================================== */
.thcc-basket { font-family: var(--thcc-font); color: var(--thcc-body); font-size: 15px; line-height: 1.5; }
.thcc-bar { position: fixed; z-index: 99990; right: 24px; bottom: 24px; display: flex; align-items: center; gap: 10px; background: #fff; padding: 8px 8px 8px 10px; border-radius: 999px; box-shadow: var(--thcc-shadow-lg); border: 1px solid var(--thcc-line-soft); transition: bottom .25s ease, transform .25s ease; max-width: calc(100vw - 32px); }
.thcc-bar.is-pulse { animation: thcc-bump .6s ease; }
@keyframes thcc-bump { 30% { transform: scale(1.05); } 60% { transform: scale(.98); } }
.thcc-basket .thcc-bar-main { all: unset; display: flex; align-items: center; gap: 12px; cursor: pointer; padding: 4px 8px 4px 4px; border-radius: 999px; min-width: 0; }
.thcc-basket .thcc-bar-main:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc-bar-ic { position: relative; width: 46px; height: 46px; border-radius: 50%; background: var(--thcc-ink); color: #fff; display: grid; place-items: center; flex: none; }
.thcc-bar-n { position: absolute; top: -4px; right: -4px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--thcc-accent); color: #fff; font: 700 .75rem/22px var(--thcc-font); text-align: center; border: 2px solid #fff; }
.thcc-bar-txt { display: flex; flex-direction: column; min-width: 0; }
.thcc-bar-txt b { color: var(--thcc-ink); font-weight: 700; font-size: .95rem; }
.thcc-bar-sub { font-size: .8rem; color: var(--thcc-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 240px; }
.thcc-basket .thcc-bar-send { border-radius: 999px !important; min-height: 46px; }
.thcc-basket.is-empty .thcc-bar-send { display: none !important; }

.thcc-scrim { position: fixed; inset: 0; background: rgba(6,31,36,.45); z-index: 99991; opacity: 0; transition: opacity .22s ease; }
.thcc-basket.is-open .thcc-scrim { opacity: 1; }
.thcc-drawer { position: fixed; z-index: 99992; top: 0; right: 0; bottom: 0; width: min(440px, 100vw); background: #fff; display: flex; flex-direction: column; transform: translateX(100%); transition: transform .22s cubic-bezier(.2,.7,.3,1); box-shadow: var(--thcc-shadow-lg); outline: none; }
.thcc-basket.is-open .thcc-drawer { transform: none; }
.thcc-drawer-head { display: flex; justify-content: space-between; align-items: flex-start; padding: 22px 20px 16px 24px; border-bottom: 1px solid var(--thcc-line-soft); }
.thcc-drawer-head h2 { font: 700 1.3rem/1.2 var(--thcc-font); color: var(--thcc-ink); margin: 0; }
.thcc-drawer-count { margin: 4px 0 0; font-size: .85rem; }
.thcc-drawer-body { flex: 1; overflow-y: auto; padding: 8px 16px; }
.thcc-drawer-list { list-style: none; margin: 0; padding: 0; }
.thcc-li { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 14px; padding: 14px 8px; border-bottom: 1px solid var(--thcc-line-soft); align-items: start; }
.thcc-li.is-unavailable { opacity: .6; }
.thcc-li-img { width: 64px; height: 64px; border-radius: var(--thcc-radius); background: var(--thcc-surface); display: grid; place-items: center; color: var(--thcc-faint); overflow: hidden; }
.thcc-li-img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.thcc-li-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.thcc-li-name { font-weight: 600; color: var(--thcc-ink) !important; text-decoration: none; }
a.thcc-li-name:hover { color: var(--thcc-action) !important; text-decoration: underline; }
.thcc-li-var { font-size: .85rem; }
.thcc-li-sku { font-size: .75rem; color: var(--thcc-muted); font-variant-numeric: tabular-nums; }
.thcc-li .thcc-qty { margin-top: 8px; align-self: flex-start; }
.thcc-drawer-empty { text-align: center; padding: 48px 16px; color: var(--thcc-muted); }
.thcc-drawer-empty svg { color: #BFD4D6; margin: 0 auto 12px; display: block; }
.thcc-drawer-foot { padding: 16px 24px 20px; border-top: 1px solid var(--thcc-line-soft); background: #FAFCFC; display: grid; gap: 12px; }
.thcc-drawer-note { display: flex; gap: 8px; align-items: flex-start; font-size: .82rem; margin: 0; }
.thcc-drawer-note svg { color: var(--thcc-ok); margin-top: 2px; }
.thcc-drawer-sec { display: flex; justify-content: space-between; gap: 12px; }

.thcc-toast { position: fixed; z-index: 99995; left: 50%; bottom: 100px; transform: translate(-50%, 16px); opacity: 0; background: var(--thcc-dark); color: #fff; padding: 12px 18px; border-radius: var(--thcc-radius); font-size: .9rem; box-shadow: var(--thcc-shadow-lg); transition: opacity .2s ease, transform .2s ease; max-width: calc(100vw - 32px); }
.thcc-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.thcc-toast.is-warn { background: #7A3E00; }
.thcc-toast { display: flex; align-items: center; gap: 14px; font-family: var(--thcc-font); line-height: 1.4; }
.thcc-toast[hidden] { display: none; }
.thcc-toast-btn { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px !important; border-radius: 999px !important; background: rgba(255,255,255,.14) !important; color: #fff !important; border: 0 !important; font: 600 .85rem/1.2 var(--thcc-font) !important; cursor: pointer; white-space: nowrap; }
.thcc-toast-btn:hover { background: rgba(255,255,255,.24) !important; }
.thcc-toast-btn:focus-visible { outline: 2px solid var(--thcc-focus); outline-offset: 2px; }
html.thcc-lock { overflow: hidden; }

.thcc-pos-right .thcc-bar { top: 50%; bottom: auto; right: 0; transform: translateY(-50%); border-radius: 16px 0 0 16px; flex-direction: column; padding: 10px; }
.thcc-pos-right .thcc-bar-txt { display: none; }
.thcc-pos-right .thcc-bar-send { display: none !important; }

/* header badge on an existing icon */
.thcc-hbadge-host { position: relative; cursor: pointer; }
.thcc-hbadge { position: absolute; top: -6px; right: -8px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--thcc-accent, #0B343B); color: #fff; font: 700 11px/18px "Inter", system-ui, sans-serif; text-align: center; }

.thcc-basket-trigger { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; background: none; border: 0; font: inherit; color: inherit; position: relative; }
.thcc-basket-trigger .thcc-count { background: var(--thcc-accent, #0B343B); color: #fff; border-radius: 999px; font-size: 11px; font-weight: 700; min-width: 18px; height: 18px; line-height: 18px; text-align: center; padding: 0 5px; }

/* ==========================================================================
   Hub Manager table rows with products (rendered by Hub Manager 4.0)
   ========================================================================== */
.thcm-hub .thcm-prod { display: inline-flex; align-items: center; gap: 12px; }
.thcm-hub .thcm-prod-img { flex: none; width: var(--thcm-thumb, 56px); height: var(--thcm-thumb, 56px); border-radius: 8px; background: #F0F6F6; display: grid; place-items: center; overflow: hidden; }
.thcm-hub .thcm-prod-img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.thcm-hub a.thcm-prod-link { color: var(--thcc-ink, var(--thcc-ink)); font-weight: 600; text-decoration: none; }
.thcm-hub a.thcm-prod-link:hover { color: var(--thcc-action, var(--thcc-action)); text-decoration: underline; text-underline-offset: 3px; }
.thcm-hub a.thcm-details { display: flex; justify-content: center; align-items: center; gap: 4px; margin: 8px 0 0; font-weight: 600; font-size: .82rem; line-height: 1.2; color: var(--thcc-action, var(--thcc-action)); white-space: nowrap; text-align: center; }
.thcm-hub td.thcm-action > a.thcm-details:first-child { margin-top: 0; }
.thcm-hub tr.is-in-basket { background: #F2FAFB; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1024px) {
	.thcc-cards { --cols: 2 !important; }
	.thcc-specgrid { grid-template-columns: 1fr; }
	.thcc-selspecs { position: static; }
}
@media (max-width: 860px) {
	.thcc-hero { grid-template-columns: 1fr; }
	.thcc-gallery { position: static; }
	.thcc-overview.has-features { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.thcc-wrap { padding: 0 var(--thcc-gutter-m, 16px); }
	.thcc-cards { --cols: 1 !important; }
	.thcc-actions .thcc-btn-ghost { flex: 1 1 100%; }
	.thcc-bar { left: 12px; right: 12px; bottom: 12px; border-radius: 16px; justify-content: space-between; }
	.thcc-bar-sub { max-width: 40vw; }
	.thcc-basket.thcc-no-mobile { display: none !important; }
	html.thcc-sticky-on .thcc-basket.thcc-pos-bottom .thcc-bar { bottom: 78px; }
	.thcc-stickybar-prod small { max-width: 40vw; }
	.thcc-band-in { flex-direction: column; align-items: flex-start; }
	.thcc-keydata { grid-template-columns: 1fr; }
	.thcc-dialog-foot .thcc-btn-primary { flex: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.thcc *, .thcc-basket * { animation: none !important; transition: none !important; }
}
@media print {
	.thcc-tabs, .thcc-actions, .thcc-share, .thcc-stickybar, .thcc-basket, .thcc-band, .thcc-nav, .thcc-thumbs, .thcc-compare-act, .thcc-back, #thcc-related { display: none !important; }
	.thcc-hero { grid-template-columns: 1fr 1fr; }
	.thcc-sec { padding: 16px 0; }
	.thcc-sec-alt { background: none; }
	.thcc-spectable-wrap.is-collapsed { max-height: none; -webkit-mask-image: none; mask-image: none; }
}

/* Theme table borders (Twenty Twenty-One, Hello, Astra …) off inside the catalogue. */
.thcc table { border: 0; }
.thcc table th, .thcc table td { border-left: 0; border-right: 0; border-top: 0; }
.thcc .thcc-spectable, .thcc .thcc-mini { border: 0; }

/* Theme button styles (dark background, padding) must not reach the cart bar. */
.thcc-basket .thcc-bar-main, .thcc-basket .thcc-bar-main:hover, .thcc-basket .thcc-bar-main:focus { background: transparent !important; color: inherit !important; border: 0 !important; padding: 4px 8px 4px 4px !important; box-shadow: none !important; text-decoration: none !important; }
.thcc-basket .thcc-iconbtn, .thcc-basket .thcc-qty-btn, .thcc-basket .thcc-linkbtn { box-shadow: none !important; }
.thcc .thcc-btn:focus:not(:focus-visible), .thcc-basket .thcc-btn:focus:not(:focus-visible) { outline: none !important; }
html.thcc-sticky-on .thcc-toast { bottom: 170px; }
.thcm-hub .thcm-prod { min-width: 190px; }
.thcm-hub .thcm-prod-link { white-space: normal; }
.thcc dl, .thcc dd, .thcc dt { margin-left: 0; }
.thcc dd { margin: 0; }
.thcc .thcc-opt label { display: flex !important; width: 100%; margin: 0; font-weight: inherit; }
.thcc .thcc-opt { margin: 0; }
@media (max-width: 640px) {
	/* Product sticky bar visible: the cart shrinks to a round icon above it. */
	html.thcc-sticky-on .thcc-basket .thcc-bar { left: auto; right: 12px; bottom: 80px; padding: 6px; border-radius: 999px; }
	html.thcc-sticky-on .thcc-basket .thcc-bar-txt, html.thcc-sticky-on .thcc-basket .thcc-bar-send { display: none !important; }
	.thcc-toast { left: 16px; right: 16px; transform: translateY(16px); font-size: .85rem; }
	.thcc-toast.is-on { transform: none; }
	.thcc-bar-txt b { font-size: .9rem; }
	.thcc-basket .thcc-bar-send { padding: 0 14px !important; font-size: .9rem !important; }
}


/* ==========================================================================
   3.1 — product page, advanced layout
   ========================================================================== */
.thcc-hero-band { background: linear-gradient(180deg, var(--thcc-surface) 0%, rgba(240,246,246,.45) 55%, #fff 100%); }
.thcc-topbar + .thcc-alert, .thcc-product > .thcc-topbar { position: relative; }
.thcc-product .thcc-topbar { padding-top: 22px; }
.thcc-stage { border-radius: 20px; background: radial-gradient(120% 90% at 50% 20%, #fff 0%, #F4F9F9 60%, #E9F2F2 100%); box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 20px 50px -30px rgba(6,31,36,.35); }
.thcc-counter { position: absolute; top: 16px; right: 16px; z-index: 2; font: 600 .75rem/1 var(--thcc-font); color: var(--thcc-ink); background: rgba(255,255,255,.9); padding: 7px 10px; border-radius: 999px; box-shadow: var(--thcc-shadow); font-variant-numeric: tabular-nums; }
@media (min-width: 861px) {
	.thcc-gallery:has(.thcc-thumbs) { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 16px; }
	.thcc-gallery:has(.thcc-thumbs) .thcc-thumbs { order: -1; flex-direction: column; margin: 0; overflow-y: auto; overflow-x: hidden; height: 0; min-height: 100%; padding: 2px; scrollbar-width: none; }
	.thcc .thcc-gallery:has(.thcc-thumbs) .thcc-thumb { flex: 0 0 78px; width: 78px; height: 78px; }
}
.thcc-title { font-size: clamp(2rem, 1.3rem + 2.4vw, 3.1rem); letter-spacing: -.025em; margin-bottom: 12px; }
.thcc .thcc-sku { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: .85rem !important; color: var(--thcc-body) !important; padding: 5px 10px !important; border-radius: 999px !important; border: 1px dashed #BFD4D6 !important; transition: border-color var(--thcc-t), background var(--thcc-t); }
.thcc .thcc-sku:hover { border-color: var(--thcc-action) !important; background: #fff !important; }
.thcc .thcc-sku:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc .thcc-sku svg { color: var(--thcc-action) !important; }
.thcc a.thcc-varcount { text-decoration: none; }
.thcc a.thcc-varcount:hover { background: var(--thcc-line-soft); text-decoration: none; }

/* temperature families */
.thcc-temp-frozen { --tc: #3450B8; --tb: #EDF1FD; }
.thcc-temp-cold { --tc: #1F7A8C; --tb: #E2F0F2; }
.thcc-temp-ambient { --tc: #B86E00; --tb: #FFF4E0; }
.thcc-temp-warm { --tc: #C2410C; --tb: #FFEDE5; }
.thcc-temp-neutral { --tc: #49656C; --tb: #EEF3F3; }
.thcc-temp-dot { width: 9px; height: 9px; border-radius: 50% !important; background: var(--tc, var(--thcc-action)) !important; flex: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--tc, var(--thcc-action)) 18%, transparent) !important; }
.thcc-temps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; }
.thcc .thcc-temp { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px !important; border-radius: 999px !important; background: var(--tb) !important; color: var(--tc) !important; font: 600 .82rem/1.2 var(--thcc-font) !important; cursor: pointer; border: 1.5px solid transparent !important; transition: border-color var(--thcc-t), transform var(--thcc-t); }
.thcc .thcc-temp:hover { border-color: var(--tc) !important; }
.thcc .thcc-temp.is-on { border-color: var(--tc) !important; background: #fff !important; box-shadow: 0 4px 14px -6px var(--tc) !important; }
.thcc .thcc-temp:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc .thcc-chip { display: inline-flex; align-items: center; gap: 8px; }
.thcc .thcc-chip.is-on .thcc-temp-dot { background: #fff !important; box-shadow: none !important; }

/* at a glance */
.thcc-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 0 0 22px; }
.thcc-fact { display: flex; flex-direction: column; gap: 2px; background: #fff; border: 1px solid var(--thcc-line-soft); border-radius: 12px; padding: 14px 14px 12px; position: relative; overflow: hidden; }
.thcc-fact::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: linear-gradient(var(--thcc-accent), var(--thcc-action)); opacity: .8; }
.thcc-fact-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--thcc-surface); color: var(--thcc-action); margin-bottom: 8px; }
.thcc-fact dd { order: 1; margin: 0; font: 700 1.2rem/1.2 var(--thcc-font); color: var(--thcc-ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.thcc-fact dt { order: 2; font-size: .75rem; color: var(--thcc-muted); line-height: 1.3; }
.thcc-fact-ic { order: 0; }
.thcc-fact.is-flash dd { animation: thcc-flash .8s ease; }
@keyframes thcc-flash { 0% { color: var(--thcc-accent); transform: translateY(-3px); } 100% { color: var(--thcc-ink); transform: none; } }

/* action card */
.thcc-actions-card { background: #fff; border: 1px solid var(--thcc-line); border-radius: 14px; padding: 16px; box-shadow: var(--thcc-shadow); margin: 0 0 14px; }
.thcc-actions-card .thcc-actions { margin: 0; }
.thcc-actions-note { display: flex; gap: 8px; align-items: center; margin: 12px 0 0; font-size: .8rem; color: var(--thcc-muted); }
.thcc-actions-note svg { color: var(--thcc-ok); }
.thcc-tools { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.thcc .thcc-tool { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 7px; min-height: 40px !important; padding: 0 14px !important; border-radius: 999px !important; border: 1px solid var(--thcc-line) !important; background: #fff !important; color: var(--thcc-ink) !important; font: 600 .85rem/1 var(--thcc-font) !important; cursor: pointer; transition: border-color var(--thcc-t), background var(--thcc-t), color var(--thcc-t); text-decoration: none !important; }
.thcc .thcc-tool:hover { border-color: var(--thcc-action) !important; color: var(--thcc-action) !important; }
.thcc .thcc-tool:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc .thcc-tool.is-on { background: var(--thcc-ink) !important; border-color: var(--thcc-ink) !important; color: #fff !important; }
.thcc-tool svg { color: currentColor !important; }
.thcc-sharewrap { position: relative; }
.thcc-sharemenu { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; min-width: 210px; background: #fff; border: 1px solid var(--thcc-line); border-radius: 12px; box-shadow: var(--thcc-shadow-lg); padding: 6px; display: grid; }
.thcc .thcc-sharemenu > a, .thcc .thcc-sharemenu > button { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; padding: 10px 12px !important; border-radius: 8px !important; cursor: pointer; font: 500 .9rem/1.2 var(--thcc-font) !important; color: var(--thcc-ink) !important; text-decoration: none !important; }
.thcc .thcc-sharemenu > a:hover, .thcc .thcc-sharemenu > button:hover, .thcc .thcc-sharemenu > :focus-visible { background: var(--thcc-surface) !important; }
.thcc-sharemenu svg { color: var(--thcc-action); }
.thcc-contactcard { display: flex; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 12px; background: var(--thcc-ink); color: #CFE0E2; margin-top: 4px; }
.thcc-contactcard-ic { width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.1); color: #fff; display: grid; place-items: center; flex: none; }
.thcc-contactcard-t { margin: 0; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.thcc-contactcard-l { margin: 2px 0 0; display: flex; flex-wrap: wrap; gap: 4px 16px; }
.thcc .thcc-contactcard a { color: #fff !important; font-weight: 600; }

/* tabs */
.thcc-tabs-in { justify-content: space-between; align-items: center; overflow: visible; }
.thcc-tabs-links { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.thcc-tabs-links::-webkit-scrollbar { display: none; }
.thcc-tabs-cta { display: flex; align-items: center; gap: 14px; flex: none; opacity: 0; transform: translateY(6px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.thcc-tabs.is-stuck .thcc-tabs-cta { opacity: 1; transform: none; pointer-events: auto; }
.thcc-tabs.is-stuck { box-shadow: 0 8px 24px -16px rgba(6,31,36,.4); }
.thcc-tabs-prod { display: flex; flex-direction: column; text-align: right; line-height: 1.25; max-width: 320px; }
.thcc-tabs-prod b { color: var(--thcc-ink); font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.thcc-tabs-prod small { font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.thcc-tabs-progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; background: linear-gradient(90deg, var(--thcc-accent), var(--thcc-action)); transform-origin: 0 50%; transform: scaleX(0); pointer-events: none; }
.thcc-tabs { position: sticky; }

/* section heading deep links */
.thcc-h2 { display: flex; align-items: center; gap: 10px; }
.thcc .thcc-anchor { all: unset; box-sizing: border-box; width: 32px; height: 32px; border-radius: 8px !important; display: inline-grid; place-items: center; color: var(--thcc-faint) !important; cursor: pointer; opacity: 0; transition: opacity var(--thcc-t), background var(--thcc-t), color var(--thcc-t); }
.thcc-h2:hover .thcc-anchor, .thcc .thcc-anchor:focus-visible { opacity: 1; }
.thcc .thcc-anchor:hover { background: var(--thcc-surface) !important; color: var(--thcc-action) !important; }
.thcc .thcc-anchor:focus-visible { outline: 3px solid var(--thcc-action); }
@media (hover: none) { .thcc .thcc-anchor { opacity: .7; } }
.thcc-h2-sm { font-size: 1.3rem; }
.thcc-h2-sm svg { color: var(--thcc-action); }

/* versions tools */
.thcc-vtools { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin: 0 0 16px; padding: 12px; background: var(--thcc-surface); border-radius: 12px; }
.thcc-search { position: relative; display: flex; align-items: center; flex: 1 1 240px; max-width: 360px; }
.thcc-search svg { position: absolute; left: 12px; color: var(--thcc-muted); pointer-events: none; }
.thcc .thcc-search input { width: 100%; min-height: 42px; padding: 0 12px 0 40px !important; border: 1.5px solid var(--thcc-line) !important; border-radius: 999px !important; background: #fff !important; font: 500 .9rem var(--thcc-font); color: var(--thcc-ink); box-shadow: none !important; }
.thcc .thcc-search input:focus { border-color: var(--thcc-action) !important; outline: none; }
.thcc-vfilter { display: flex; flex-wrap: wrap; gap: 6px; }
.thcc .thcc-pill { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 7px; min-height: 36px !important; padding: 0 12px !important; border-radius: 999px !important; background: #fff !important; border: 1px solid var(--thcc-line) !important; font: 500 .82rem/1.1 var(--thcc-font) !important; color: var(--thcc-ink) !important; cursor: pointer; transition: all var(--thcc-t); }
.thcc .thcc-pill:hover { border-color: var(--thcc-action) !important; }
.thcc .thcc-pill.is-on { background: var(--thcc-ink) !important; border-color: var(--thcc-ink) !important; color: #fff !important; }
.thcc .thcc-pill:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc .thcc-pill.is-on .thcc-temp-dot { box-shadow: 0 0 0 2px rgba(255,255,255,.5) !important; }
.thcc .thcc-sortbtn { all: unset; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; color: inherit !important; font: inherit !important; }
.thcc .thcc-sortbtn svg { opacity: .45; }
.thcc th[aria-sort="ascending"] .thcc-sortbtn svg, .thcc th[aria-sort="descending"] .thcc-sortbtn svg { opacity: 1; color: var(--thcc-accent) !important; }
.thcc .thcc-sortbtn:focus-visible { outline: 2px solid var(--thcc-focus); outline-offset: 3px; }
.thcc-vempty { padding: 20px; margin: 0; text-align: center; color: var(--thcc-muted); }
.thcc-compare tbody tr[hidden] { display: none; }

/* cards */
.thcc-cards-rel { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
@media (min-width: 1100px) { .thcc-cards-rel { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.thcc .thcc-card-media img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; }
.thcc-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; width: 100%; }
.thcc-card-actions .thcc-card-foot { margin-top: 0; }
.thcc .thcc-cmpchk { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; gap: 6px; min-height: 36px !important; padding: 0 10px !important; border-radius: 999px !important; border: 1px solid var(--thcc-line) !important; color: var(--thcc-body) !important; font: 600 .78rem/1 var(--thcc-font) !important; cursor: pointer; transition: all var(--thcc-t); }
.thcc .thcc-cmpchk:hover { border-color: var(--thcc-action) !important; color: var(--thcc-action) !important; }
.thcc .thcc-cmpchk.is-on { background: var(--thcc-ink) !important; border-color: var(--thcc-ink) !important; color: #fff !important; }
.thcc .thcc-cmpchk:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }

/* recently viewed */
.thcc-recent { padding-top: 40px; padding-bottom: 40px; }
.thcc-recent-list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 1fr); gap: 14px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
@media (min-width: 1100px) { .thcc-recent-list { grid-auto-flow: row; grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.thcc a.thcc-recent-card { display: flex; gap: 12px; align-items: center; padding: 10px; border: 1px solid var(--thcc-line-soft); border-radius: 12px; background: #fff; color: var(--thcc-ink); transition: border-color var(--thcc-t), box-shadow var(--thcc-t); }
.thcc a.thcc-recent-card:hover { border-color: var(--thcc-action); box-shadow: var(--thcc-shadow); text-decoration: none; }
.thcc-recent-img { width: 56px; height: 56px; border-radius: 8px; background: var(--thcc-surface); flex: none; overflow: hidden; }
.thcc .thcc-recent-img img { width: 100% !important; height: 100% !important; object-fit: contain; mix-blend-mode: multiply; }
.thcc-recent-txt { display: flex; flex-direction: column; min-width: 0; }
.thcc-recent-txt small { font-size: .7rem; color: var(--thcc-action); text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.thcc-recent-txt b { font-size: .88rem; line-height: 1.3; }

/* compare dock + dialog */
.thcc-cmpdock { position: fixed; z-index: 99989; left: 24px; bottom: 24px; display: flex; align-items: center; background: var(--thcc-ink); border-radius: 999px; box-shadow: var(--thcc-shadow-lg); font-family: var(--thcc-font); padding: 4px; }
.thcc-cmpdock[hidden] { display: none; }
.thcc-cmpdock-go, .thcc-cmpdock-x { all: unset; box-sizing: border-box; cursor: pointer; color: #fff !important; display: inline-flex; align-items: center; gap: 8px; }
.thcc-cmpdock-go { padding: 10px 14px !important; font: 600 .9rem/1 var(--thcc-font) !important; border-radius: 999px !important; }
.thcc-cmpdock-go:hover:not(:disabled) { background: rgba(255,255,255,.1) !important; }
.thcc-cmpdock-go:disabled { opacity: .7; cursor: default; }
.thcc-cmpdock-x { width: 34px; height: 34px; justify-content: center; border-radius: 50% !important; font-size: 20px !important; line-height: 1; color: #9FC0C4 !important; }
.thcc-cmpdock-x:hover { background: rgba(255,255,255,.1) !important; color: #fff !important; }
.thcc-cmpdock :focus-visible { outline: 2px solid var(--thcc-focus); outline-offset: 2px; }
html.thcc-sticky-on .thcc-cmpdock { bottom: 96px; }
.thcc-dialog.thcc-cmpdlg { width: min(1180px, 96vw); }
.thcc-cmpdlg .thcc-dialog-head { align-items: center; }
.thcc-cmpdlg .thcc-dialog-title { flex: 1; }
.thcc-cmpdlg .thcc-iconbtn { font-size: 24px !important; width: 44px; justify-content: center; }
.thcc-switch { display: inline-flex; align-items: center; gap: 10px; font: 600 .85rem var(--thcc-font); color: var(--thcc-ink); cursor: pointer; }
.thcc-switch input { position: absolute; opacity: 0; }
.thcc-switch span { width: 38px; height: 22px; border-radius: 999px; background: #C9D9DB; position: relative; transition: background var(--thcc-t); }
.thcc-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform var(--thcc-t); }
.thcc-switch input:checked + span { background: var(--thcc-action); }
.thcc-switch input:checked + span::after { transform: translateX(16px); }
.thcc-switch input:focus-visible + span { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc-cmp-body { padding: 0 !important; }
.thcc-cmp-scroll { overflow: auto; max-height: calc(88vh - 90px); }
.thcc-cmp { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .9rem; min-width: 560px; }
.thcc-cmp th, .thcc-cmp td { padding: 12px 16px; border-bottom: 1px solid var(--thcc-line-soft); text-align: left; vertical-align: top; }
.thcc-cmp thead th { position: sticky; top: 0; background: #fff; z-index: 2; border-bottom: 2px solid var(--thcc-line); }
.thcc-cmp tbody th { position: sticky; left: 0; background: #FAFCFC; color: var(--thcc-body); font-weight: 500; width: 200px; z-index: 1; }
.thcc-cmp thead th:first-child { left: 0; z-index: 3; }
.thcc-cmp td { color: var(--thcc-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.thcc-cmp tr.is-diff td { background: #F5FBFC; }
.thcc-cmpdlg.is-diff tr.is-same { display: none; }
.thcc-cmp-head { display: flex; flex-direction: column; gap: 6px; position: relative; min-width: 170px; }
.thcc-cmp-head small { font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--thcc-action); font-weight: 700; }
.thcc-cmp-img { display: block; height: 110px; background: var(--thcc-surface); border-radius: 10px; }
.thcc-cmp-img img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.thcc-cmp-name { font-weight: 700; color: var(--thcc-ink) !important; text-decoration: none; }
.thcc-cmp-rm { all: unset; position: absolute; top: 4px; right: 4px; width: 28px; height: 28px; border-radius: 50% !important; background: #fff !important; box-shadow: var(--thcc-shadow) !important; display: grid; place-items: center; cursor: pointer; color: var(--thcc-ink) !important; font-size: 18px !important; z-index: 1; }
.thcc-cmpdlg .thcc-btn.is-in { background: var(--thcc-ink) !important; }

/* print head only in print */
.thcc-print-head { display: none; }

/* desktop: product CTA lives in the stuck tabs */
@media (min-width: 861px) { .thcc-stickybar { display: none !important; } }

@media (max-width: 1024px) { .thcc-tabs-prod { display: none; } }
@media (max-width: 860px) {
	.thcc-tabs-cta { display: none; }
	.thcc-hero-band { background: linear-gradient(180deg, var(--thcc-surface), #fff 40%); }
	.thcc-cmpdock { left: 12px; bottom: 12px; }
	html.thcc-sticky-on .thcc-cmpdock { bottom: 84px; }
}
@media (max-width: 640px) {
	.thcc-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
	.thcc-fact { padding: 12px 10px 10px; }
	.thcc-fact dd { font-size: 1.05rem; }
	.thcc-tools { gap: 6px; }
	.thcc .thcc-tool { padding: 0 12px !important; font-size: .8rem !important; }
	.thcc-sharemenu { left: auto; right: 0; }
	.thcc-cmpchk-t { display: none; }
	html.thcc-cmp-on .thcc-basket .thcc-bar { left: auto; }
}

@media print {
	.thcc-print-head { display: flex; justify-content: space-between; gap: 20px; font-size: 11px; color: #49656C; border-bottom: 2px solid var(--thcc-ink); padding: 0 0 8px; margin: 0 0 16px; }
	.thcc-print-head b { color: var(--thcc-ink); }
	.thcc-tools, .thcc-temps button:not(.is-on), .thcc-vtools, .thcc-cmpdock, .thcc-recent, .thcc-anchor, .thcc-counter, .thcc-contactcard, .thcc-actions-card, .thcc-picker .thcc-chips, .thcc-select, .thcc-picker-head .thcc-linkbtn, .thcc-cmpchk { display: none !important; }
	.thcc-hero-band { background: none !important; }
	.thcc-stage { box-shadow: none; aspect-ratio: auto; height: 300px; }
	.thcc-fact { break-inside: avoid; }
	.thcc-compare thead th { background: #eee !important; color: #000 !important; }
	html.thcc-print-ds header, html.thcc-print-ds footer, html.thcc-print-ds .elementor-location-header, html.thcc-print-ds .elementor-location-footer, html.thcc-print-ds #wpadminbar { display: none !important; }
	html.thcc-print-ds .thcc-print-head { display: flex !important; }
	html.thcc-print-ds #thcc-overview, html.thcc-print-ds #thcc-faq, html.thcc-print-ds #thcc-downloads, html.thcc-print-ds .thcc-topbar, html.thcc-print-ds .thcc-lead { display: none !important; }
	html.thcc-print-ds .thcc-sec { padding: 10px 0 !important; }
	html.thcc-print-ds .thcc-compare tbody tr:not(.is-sel) { color: #555; }
}

/* theme resets for 3.1 controls */
.thcc .thcc-sku { background: transparent !important; font-family: var(--thcc-font) !important; text-decoration: none !important; }
.thcc .thcc-sku b { color: var(--thcc-ink); }
.thcc .thcc-anchor, .thcc .thcc-sortbtn, .thcc .thcc-cmp-rm { background-color: transparent !important; border: 0 !important; padding: 0 !important; }
.thcc .thcc-anchor:hover { background: var(--thcc-surface) !important; }
.thcc .thcc-cmp-rm, .thcc-cmp-rm { background: #fff !important; }
.thcc-fact dd, .thcc-fact dt { margin: 0 !important; padding: 0 !important; text-align: left; }
.thcc-fact dt { font-weight: 500; }
.thcc dd { padding-left: 0; }
.thcc-tabs.is-fixed { position: fixed !important; top: var(--thcc-sticky-top); left: 0; right: 0; z-index: 9980; }
@media (min-width: 783px) { body.admin-bar .thcc-tabs.is-fixed { top: calc(var(--thcc-sticky-top) + 32px); } }
.thcc-tabs-ph { height: 0; }
.thcc-cmpdlg table, .thcc-cmpdlg th, .thcc-cmpdlg td { border-left: 0 !important; border-right: 0 !important; border-top: 0 !important; }
.thcc-cmpdlg table { border: 0 !important; }
.thcc-cmpdlg, .thcc-cmpdlg a, .thcc-cmpdlg button, .thcc-cmpdlg th, .thcc-cmpdlg td { font-family: var(--thcc-font); }
.thcc-cmpdlg .thcc-cmp-name { font-size: 1rem; line-height: 1.3; }
.thcc-cmpdlg .thcc-cmp-name:hover { color: var(--thcc-action) !important; text-decoration: underline; }

/* cart drawer tools */
.thcc-drawer-tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.thcc-basket .thcc-toolbtn { all: unset; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; padding: 0 8px !important; border-radius: 8px !important; border: 1px solid var(--thcc-line) !important; background: #fff !important; color: var(--thcc-ink) !important; font: 600 .8rem/1 var(--thcc-font) !important; cursor: pointer; text-transform: none !important; letter-spacing: 0 !important; transition: border-color var(--thcc-t), color var(--thcc-t); }
.thcc-basket .thcc-toolbtn:hover { border-color: var(--thcc-action) !important; color: var(--thcc-action) !important; }
.thcc-basket .thcc-toolbtn:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc-basket .thcc-toolbtn svg { color: var(--thcc-action); }
.thcc-li { transition: opacity .16s ease, transform .16s ease; }
.thcc-li.is-leaving { opacity: 0; transform: translateX(24px); }
@media (min-width: 783px) { body.admin-bar .thcc-drawer { top: 32px; } }
@media (max-width: 782px) { body.admin-bar .thcc-drawer { top: 46px; } }
.thcc-content h2, .thcc-content h3, .thcc-content h4 { font-family: var(--thcc-font); font-weight: 700; letter-spacing: -.01em; line-height: 1.3; margin: 1.4em 0 .5em; } .thcc-content h2 { font-size: 1.35rem; } .thcc-content h3 { font-size: 1.15rem; } .thcc-content > .thcc-h2 + * { margin-top: 0; }
.thcc .thcc-cmpchk { background: #fff !important; }
.thcc .thcc-cmpchk.is-on { background: var(--thcc-ink) !important; color: #fff !important; }
@media (max-width: 480px) {
	.thcc-stickybar-prod div { display: none; }
	.thcc-stickybar-act { flex: 1; }
	.thcc-stickybar-act .thcc-add { width: 100%; }
}

/* ==========================================================================
   3.2 — table row context, enquiry CTA, version compare
   ========================================================================== */
.thcc-rowctx { position: relative; margin: 0 0 20px; border-radius: 14px; background: #fff; border: 1.5px solid var(--thcc-action); box-shadow: 0 10px 30px -18px rgba(0,117,138,.55); overflow: hidden; }
.thcc-rowctx::before { content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--thcc-accent), var(--thcc-action)); }
.thcc-rowctx.is-off { border-color: #D9A441; box-shadow: none; }
.thcc-rowctx.is-off::before { background: #D9A441; }
.thcc-rowctx.is-off .thcc-rowctx-sub::after { content: attr(data-off); }
.thcc-rowctx-head { display: flex; align-items: center; gap: 12px; padding: 16px 16px 10px; }
.thcc-rowctx-ic { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--thcc-tint); color: var(--thcc-action); flex: none; }
.thcc-rowctx-head > div { flex: 1; min-width: 0; }
.thcc .thcc-rowctx-t { font: 700 1rem/1.3 var(--thcc-font); color: var(--thcc-ink); margin: 0; letter-spacing: 0; }
.thcc-rowctx-sub { margin: 2px 0 0; font-size: .8rem; color: var(--thcc-muted); }
.thcc a.thcc-rowctx-back { display: inline-flex; align-items: center; gap: 6px; font-size: .8rem; font-weight: 600; padding: 7px 12px; border-radius: 999px; background: var(--thcc-surface); color: var(--thcc-ink); white-space: nowrap; }
.thcc a.thcc-rowctx-back:hover { background: var(--thcc-line-soft); text-decoration: none; }
.thcc-rowctx-switch { display: flex; gap: 6px; overflow-x: auto; padding: 2px 16px 12px; scrollbar-width: thin; }
.thcc .thcc-rowopt { all: unset; box-sizing: border-box; flex: none; display: inline-flex; align-items: center; gap: 8px; max-width: 280px; min-height: 38px; padding: 6px 12px 6px 6px !important; border-radius: 999px !important; border: 1px solid var(--thcc-line) !important; background: #fff !important; color: var(--thcc-ink) !important; font: 500 .8rem/1.2 var(--thcc-font) !important; cursor: pointer; transition: border-color var(--thcc-t), background var(--thcc-t); }
.thcc .thcc-rowopt:hover { border-color: var(--thcc-action) !important; }
.thcc .thcc-rowopt.is-on { background: var(--thcc-ink) !important; border-color: var(--thcc-ink) !important; color: #fff !important; }
.thcc .thcc-rowopt:focus-visible { outline: 3px solid var(--thcc-action); outline-offset: 2px; }
.thcc-rowopt-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--thcc-surface); color: var(--thcc-ink); font-weight: 700; font-size: .72rem; flex: none; }
.thcc-rowopt.is-on .thcc-rowopt-n { background: var(--thcc-accent); color: #fff; }
.thcc-rowopt-l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.thcc-rowctx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1px; margin: 0; background: var(--thcc-line-soft); border-top: 1px solid var(--thcc-line-soft); border-bottom: 1px solid var(--thcc-line-soft); }
.thcc-rowcell { background: #fff; padding: 10px 14px; min-width: 0; }
.thcc-rowcell.is-varies { background: #F2FAFB; }
.thcc-rowcell.is-extra { display: none; }
.thcc-rowctx.is-open .thcc-rowcell.is-extra { display: block; }
.thcc-rowcell dt { display: flex; align-items: center; gap: 6px; font-size: .7rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--thcc-muted); margin: 0 !important; padding: 0 !important; }
.thcc-rowcell dd { margin: 3px 0 0 !important; padding: 0 !important; font-weight: 600; color: var(--thcc-ink); font-size: .92rem; line-height: 1.35; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.thcc-rowcell.is-varies dd { color: var(--thcc-hover); }
.thcc-rowcell.is-changed dd { animation: thcc-flash .9s ease; }
.thcc-rowcell-flag { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 4px; background: var(--thcc-action); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.thcc-rowctx-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; padding: 8px 16px 10px; }
.thcc-rowctx-legend { margin: 0 auto 0 0; font-size: .75rem; color: var(--thcc-muted); display: flex; align-items: center; gap: 6px; }

/* enquiry CTA */
.thcc .thcc-quote-main { width: 100%; min-height: 56px; margin-top: 12px; font-size: 1.05rem !important; gap: 10px; box-shadow: 0 10px 24px -12px rgba(0,117,138,.8) !important; }
.thcc .thcc-quote-main span { flex: 1; text-align: center; }
.thcc-actions-card > .thcc-quote-main:first-child { margin-top: 0; }
.thcc-actions .thcc-add { flex: 1 1 200px; }
.thcc .thcc-add.is-in { background: var(--thcc-ink) !important; color: #fff !important; border-color: var(--thcc-ink) !important; }
.thcc-actions-sel { margin: 10px 0 0; font-size: .78rem; color: var(--thcc-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.thcc-actions-sel b { color: var(--thcc-ink); font-weight: 600; }
.thcc-tabs-cta .thcc-btn + .thcc-btn { margin-left: 0; }
.thcc-tabs-cta { gap: 8px; }
.thcc .thcc-btn-icon-only { width: 48px; padding: 0 !important; flex: none; }
.thcc-stickybar-act { display: flex; gap: 8px; }

/* versions compare */
.thcc-vcmp-col { width: 1%; text-align: center !important; }
.thcc-vcmp-h { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.thcc-vcmp { display: inline-grid; place-items: center; width: 36px; height: 36px; cursor: pointer; border-radius: 8px; }
.thcc-vcmp:hover { background: var(--thcc-surface); }
.thcc .thcc-vcmp input { width: 18px; height: 18px; accent-color: var(--thcc-action); margin: 0; cursor: pointer; }
.thcc-compare tbody tr.is-cmp { background: #F7FBFC; }
.thcc-vcmpbar { position: sticky; bottom: 16px; z-index: 5; display: flex; align-items: center; gap: 14px; justify-content: flex-end; margin: 12px 0 0 auto; width: fit-content; padding: 8px 8px 8px 18px; border-radius: 999px; background: var(--thcc-ink); color: #fff; box-shadow: var(--thcc-shadow-lg); font-size: .88rem; font-weight: 600; }
.thcc-vcmpbar[hidden] { display: none; }
.thcc .thcc-vcmpbar .thcc-linkbtn { color: #9FC0C4 !important; }
.thcc .thcc-vcmpbar .thcc-btn { border-radius: 999px !important; }
.thcc .thcc-vcmpbar .thcc-btn:disabled { opacity: .5; cursor: not-allowed; }

/* compare dialogs: current column, buttons, suggestions */
.thcc-cmp th.is-cur, .thcc-cmp td.is-cur { background: #EAF6F8 !important; }
.thcc-cmp-btns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.thcc-cmpdlg .thcc-btn { display: inline-flex !important; align-items: center; justify-content: center; min-height: 36px; padding: 0 12px !important; border-radius: 8px !important; font: 600 .8rem/1 var(--thcc-font) !important; border: 2px solid transparent !important; cursor: pointer; white-space: nowrap; }
.thcc-cmpdlg .thcc-btn-primary { background: var(--thcc-action) !important; color: #fff !important; }
.thcc-cmpdlg .thcc-btn-outline { background: #fff !important; color: var(--thcc-action) !important; border-color: var(--thcc-action) !important; }
.thcc-cmpdlg .thcc-rowcell-flag { vertical-align: middle; margin-left: 4px; }
.thcc-cmp-hint { margin: 0; padding: 14px 20px; background: #FFF7E6; color: var(--thcc-warn); font: 600 .88rem var(--thcc-font); }
.thcc-cmp-sug { padding: 16px 20px 20px; border-top: 1px solid var(--thcc-line-soft); background: #FAFCFC; }
.thcc-cmp-sug-t { margin: 0 0 10px; font: 700 .9rem var(--thcc-font); color: var(--thcc-ink); }
.thcc-cmp-sug-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.thcc-cmp-sugcard { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; padding: 8px !important; border-radius: 10px !important; background: #fff !important; border: 1px solid var(--thcc-line) !important; cursor: pointer; font-family: var(--thcc-font); color: var(--thcc-ink) !important; }
.thcc-cmp-sugcard:hover { border-color: var(--thcc-action) !important; }
.thcc-cmp-sugimg { width: 48px; height: 48px; border-radius: 8px; background: var(--thcc-surface); overflow: hidden; flex: none; }
.thcc-cmp-sugimg img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.thcc-cmp-sugtxt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.thcc-cmp-sugtxt small { font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; color: var(--thcc-action); font-weight: 700; }
.thcc-cmp-sugtxt b { font-size: .85rem; line-height: 1.3; }
.thcc-cmp-sugplus { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--thcc-action); color: #fff; font-weight: 700; flex: none; }

@media (max-width: 640px) {
	.thcc-rowctx-grid { grid-template-columns: 1fr 1fr; }
	.thcc-rowctx-head { flex-wrap: wrap; }
	.thcc-rowctx-head > div { flex: 1 1 calc(100% - 60px); }
	.thcc a.thcc-rowctx-back { margin-left: 52px; }
	.thcc-vcmpbar { left: 12px; right: 12px; width: auto; margin: 12px 0 0; }
	.thcc-stickybar-act { flex: 1; }
	.thcc-stickybar-act [data-thcc-quote] { flex: 1; }
}

/* 3.2 — hero proportions */
.thcc-title { font-size: clamp(1.9rem, 1.2rem + 1.6vw, 2.6rem) !important; line-height: 1.12; }
@media (min-width: 861px) { .thcc-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 3.5vw, 64px); } }
@media (min-width: 861px) { .thcc-stage { max-height: min(640px, 78vh); aspect-ratio: 1 / 1; } .thcc-gallery { max-width: 720px; } }
.thcc-rowcell dt { text-transform: none !important; letter-spacing: 0 !important; font-size: .74rem !important; font-weight: 500 !important; line-height: 1.3; }
.thcc-rowctx-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.thcc-rowctx-switch { mask-image: linear-gradient(90deg, #000 90%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 90%, transparent); }
.thcc-cmpdlg .thcc-cmp-name { text-decoration: none !important; }
.thcc-cmp thead th { vertical-align: top; }
.thcc-cmp tbody th .thcc-rowcell-flag { margin-left: 6px; }
.thcc-fly { position: fixed; z-index: 100000; object-fit: contain; background: #fff; border-radius: 16px; box-shadow: 0 16px 40px rgba(6,31,36,.35); pointer-events: none; will-change: transform; }

/* ==========================================================================
   3.3 — full width: the page breaks out of whatever narrow content box the
   theme puts around single posts, and lines up with the site container.
   ========================================================================== */
.thcc-product { position: relative; width: var(--thcc-vw, 100vw) !important; max-width: none !important; margin-left: calc(50% - var(--thcc-vw, 100vw) / 2) !important; margin-right: calc(50% - var(--thcc-vw, 100vw) / 2) !important; background: #fff; box-sizing: border-box; }
body.thcc-product-page { overflow-x: clip; }
body.thcc-product-page .thcc-main { padding: 0 !important; margin-top: 0; }
.thcc-alert-admin { display: block; margin-top: 6px; color: #6B4A00; }
.thcc-alert-admin a { font-weight: 600; }

/* technical data from the product table */
.thcc-specgrid.has-rowspecs { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.thcc-specgrid.has-rowspecs > :only-child { grid-column: 1 / -1; }
.thcc-specgrid.has-rowspecs > :only-child .thcc-rowspecs tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; }
.thcc-specgrid.has-rowspecs > :only-child .thcc-rowspecs tr { display: grid; grid-template-columns: 45% 1fr; border-bottom: 1px solid var(--thcc-line-soft); }
.thcc-specgrid.has-rowspecs > :only-child .thcc-rowspecs th, .thcc-specgrid.has-rowspecs > :only-child .thcc-rowspecs td { border: 0; width: auto; }
.thcc-rowspecs tr.is-varies th { color: var(--thcc-hover); font-weight: 600; }
.thcc-rowspecs tr.is-changed td { animation: thcc-flash .9s ease; }
.thcc-sec-head .thcc-muted b { color: var(--thcc-ink); }

/* versions table: first column is the first attribute, compare box on the left */
.thcc-compare thead th.thcc-vcmp-col { color: #9FC0C4; }
.thcc-compare .thcc-vcmp-col { width: 48px; padding-right: 0 !important; }
.thcc-vcell { display: inline-flex; align-items: center; gap: 8px; }
.thcc-vfilter { align-items: center; }
.thcc-vfilter-l { font-size: .75rem; font-weight: 600; color: var(--thcc-muted); margin-right: 4px; }
.thcc-compare th, .thcc-compare td { white-space: nowrap; }
.thcc-compare tbody th { white-space: normal; min-width: 160px; }

@media (max-width: 860px) {
	.thcc-specgrid.has-rowspecs { grid-template-columns: 1fr; }
	.thcc-specgrid.has-rowspecs > :only-child .thcc-rowspecs tbody { grid-template-columns: 1fr; }
}

/* =====================================================================
   3.4 — product hero: kicker, quiet picker, configuration ticket
   ===================================================================== */
.thcc-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 12px; font-size: .9rem; }
.thcc-kicker-line { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--thcc-action); }
.thcc-kicker-line::before { content: ""; width: 22px; height: 3px; border-radius: 2px; background: var(--thcc-accent); }
.thcc .thcc-kicker-n { color: var(--thcc-body); font-weight: 600; text-decoration: underline; text-decoration-color: var(--thcc-line); text-underline-offset: 4px; }
.thcc .thcc-kicker-n:hover { color: var(--thcc-action); text-decoration-color: currentColor; }
.thcc-buy .thcc-title { margin-bottom: 8px; }
.thcc-buy .thcc-lead { color: var(--thcc-body); max-width: 60ch; margin-bottom: 26px; }

/* picker without card chrome — the ticket is the only card */
.thcc-buy .thcc-picker { border: 0; box-shadow: none; padding: 22px 0 6px; margin: 0; border-top: 1px solid var(--thcc-line-soft); background: transparent; border-radius: 0; }
.thcc-buy .thcc-picker-title { font-size: 1.05rem; }
.thcc-buy .thcc-attr-label { text-transform: none; letter-spacing: 0; font-size: .875rem; color: var(--thcc-body); font-weight: 600; }
.thcc-buy .thcc-attr { margin-bottom: 16px; }

/* the configuration card — in the site's own colours (tokens come from the theme) */
.thcc-ticket { position: relative; margin: 10px 0 18px; border-radius: calc(var(--thcc-radius) * 1.5); background: #fff; border: 1px solid var(--thcc-line); box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 14px 34px -18px rgba(0,0,0,.28); overflow: hidden; }
.thcc-ticket-head { display: grid; gap: 3px; padding: 16px 22px 15px; background: var(--thcc-action); color: #fff; }
.thcc .thcc-ticket-k { margin: 0; font: 600 .82rem/1.3 var(--thcc-font); color: rgba(255,255,255,.85); letter-spacing: 0; }
.thcc-ticket-v { margin: 0; font: 700 clamp(1.1rem, 1rem + .5vw, 1.32rem)/1.3 var(--thcc-font); color: #fff; letter-spacing: -.005em; }
.thcc-ticket .thcc-fromtable { justify-self: start; margin-top: 6px; background: rgba(255,255,255,.18); color: #fff; animation: none; }
.thcc .thcc-ticket-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; margin: 0; padding: 18px 22px 18px; }
.thcc-ticket .thcc-fact { background: none; border: 0; border-radius: 0; padding: 0 0 0 12px; gap: 2px; overflow: visible; }
.thcc-ticket .thcc-fact::after { width: 3px; background: var(--thcc-brand, var(--thcc-accent)); opacity: 1; border-radius: 2px; }
.thcc-ticket .thcc-fact dt { order: 0; display: flex; align-items: center; gap: 6px; font-size: .78rem; color: var(--thcc-muted); }
.thcc-ticket .thcc-fact dt svg { color: var(--thcc-action); flex: none; }
.thcc .thcc-ticket .thcc-fact dd { order: 1; color: var(--thcc-ink) !important; font-size: 1.12rem; }
.thcc-ticket-act { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 0 22px; }
.thcc .thcc-btn.thcc-btn-ticket { min-height: 52px; justify-content: space-between; padding: 0 20px !important; background: var(--thcc-action) !important; color: #fff !important; font-size: 1rem !important; border-color: var(--thcc-action) !important; }
.thcc .thcc-btn.thcc-btn-ticket svg { transition: transform var(--thcc-t); color: #fff; }
.thcc .thcc-btn.thcc-btn-ticket:hover { background: var(--thcc-hover) !important; border-color: var(--thcc-hover) !important; }
.thcc .thcc-btn.thcc-btn-ticket:hover svg { transform: translateX(4px); }
.thcc .thcc-btn.thcc-btn-ticket-2 { min-height: 52px; background: #fff !important; color: var(--thcc-ink) !important; border: 1.5px solid var(--thcc-line) !important; }
.thcc .thcc-btn.thcc-btn-ticket-2:hover { border-color: var(--thcc-action) !important; color: var(--thcc-action) !important; }
.thcc .thcc-btn.thcc-btn-ticket-2.is-in { background: #EAF6EF !important; border-color: var(--thcc-ok) !important; color: var(--thcc-ok) !important; }
.thcc-ticket-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 14px; margin: 0; padding: 12px 22px 16px; font-size: .8rem; color: var(--thcc-muted); }
.thcc .thcc-ticket-sku { all: unset; background: var(--thcc-surface) !important; cursor: copy; font-size: .8rem; color: var(--thcc-muted) !important; padding: 3px 9px; border-radius: 6px; border: 1px solid var(--thcc-line-soft); }
.thcc .thcc-ticket-sku b { color: var(--thcc-ink); font-variant-numeric: tabular-nums; }
.thcc .thcc-ticket-sku:hover, .thcc .thcc-ticket-sku:focus-visible { border-color: var(--thcc-action); }
.thcc .thcc-ticket-sku.is-copied b::after { content: " ✓"; color: var(--thcc-ok); }

.thcc-buy .thcc-tools { margin-bottom: 16px; }
.thcc .thcc-tool-phone { margin-left: auto; border-color: transparent !important; color: var(--thcc-action) !important; }
.thcc .thcc-tool-phone:hover { border-color: var(--thcc-action) !important; }
.thcc-buy .thcc-rowctx { margin-bottom: 18px; }

@media (min-width: 1100px) {
	.thcc-ticket-act { grid-template-columns: 1.2fr 1fr; }
}
@media (max-width: 720px) {
	.thcc-ticket-head, .thcc .thcc-ticket-facts, .thcc-ticket-act, .thcc-ticket-foot { padding-left: 16px; padding-right: 16px; }
	.thcc .thcc-ticket-facts { gap: 12px 14px; }
	.thcc-ticket .thcc-fact dd { font-size: 1rem; }
	.thcc .thcc-tool-phone { margin-left: 0; }
}
@media print {
	.thcc-ticket { box-shadow: none; border: 1px solid #999; }
	.thcc-ticket-head { background: #fff !important; color: #000 !important; border-bottom: 1px solid #999; }
	.thcc-ticket-v, .thcc .thcc-ticket-k { color: #000 !important; }
	.thcc-ticket-act { display: none !important; }
}


/* 3.7 — long product names never run out of the column; phones get a slightly smaller title */
.thcc-product .thcc-title { overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 600px) { .thcc-product .thcc-title { font-size: clamp(1.6rem, 1rem + 3.4vw, 2rem) !important; } }
@media (max-width: 760px) {
	.thcc-product .thcc-tabs-links { overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); padding-right: 28px; }
	.thcc-product .thcc-tabs-links::-webkit-scrollbar { display: none; }
}

/* ==========================================================================
   3.7 — "Konfiguration wählen": the product's rows from the Hub table, always
   visible, every configuration as a readable card (no sideways scrolling),
   the chosen one's values below. Petrol only — no sky blue.
   ======================================================================== */
.thcc-temp-cold { --tc: #1F7A8C; --tb: #E2F0F2; }
.thcc .thcc-rowctx { margin: 4px 0 22px; padding: 0; border: 1px solid var(--thcc-line); border-radius: 18px; background: #fff; box-shadow: 0 1px 2px rgba(6,31,36,.04), 0 18px 40px -30px rgba(6,31,36,.45); overflow: hidden; }
.thcc .thcc-rowctx::before { content: none; }
.thcc .thcc-rowctx.is-off { border-color: #D9A441; }
.thcc .thcc-rowctx-head { display: flex; align-items: flex-start; gap: 12px 16px; flex-wrap: wrap; padding: 20px 22px 14px; }
.thcc .thcc-rowctx-hd { flex: 1 1 260px; min-width: 0; }
.thcc .thcc-rowctx-t { margin: 0; font: 700 1.15rem/1.3 var(--thcc-font); color: var(--thcc-ink); letter-spacing: -.005em; }
.thcc .thcc-rowctx-sub { margin: 4px 0 0; font-size: .86rem; line-height: 1.45; color: var(--thcc-muted); }
.thcc .thcc-rowctx.is-from .thcc-rowctx-t::after { content: ""; }
.thcc .thcc-rowctx-ic { display: none; }
.thcc a.thcc-rowctx-back { margin: 0; flex: none; }

.thcc .thcc-rowctx-switch { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; padding: 0 22px 18px; overflow: visible; -webkit-mask-image: none; mask-image: none; }
.thcc .thcc-rowctx .thcc-rowopt {
	all: unset; box-sizing: border-box; position: relative; cursor: pointer;
	display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px;
	width: 100%; max-width: none; min-height: 64px; margin: 0 !important; padding: 12px 14px !important;
	background: #fff !important; color: var(--thcc-ink) !important; border: 1.5px solid var(--thcc-line) !important; border-radius: 14px !important;
	font: 500 .9rem/1.3 var(--thcc-font) !important; text-align: left; text-transform: none !important; letter-spacing: 0 !important; box-shadow: none !important;
	transition: border-color .16s, background .16s, box-shadow .16s, transform .16s;
}
.thcc .thcc-rowctx .thcc-rowopt.is-extra { display: none !important; }
.thcc .thcc-rowctx.is-open .thcc-rowopt.is-extra { display: grid !important; }
.thcc .thcc-rowctx .thcc-rowopt:hover,
.thcc .thcc-rowctx .thcc-rowopt:focus { background: #fff !important; color: var(--thcc-ink) !important; border-color: var(--thcc-ink) !important; }
.thcc .thcc-rowctx .thcc-rowopt:hover { transform: translateY(-1px); box-shadow: 0 10px 22px -18px rgba(6,31,36,.6) !important; }
.thcc .thcc-rowctx .thcc-rowopt:focus-visible { outline: 3px solid #FFBF47; outline-offset: 2px; }
.thcc .thcc-rowctx .thcc-rowopt.is-on { background: #F2F7F7 !important; border-color: var(--thcc-ink) !important; box-shadow: inset 0 0 0 1px var(--thcc-ink) !important; transform: none; }
.thcc .thcc-rowctx .thcc-rowopt-n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #EDF3F4; color: var(--thcc-ink); font-size: .78rem; font-weight: 700; }
.thcc .thcc-rowctx .thcc-rowopt.is-on .thcc-rowopt-n { background: var(--thcc-ink); color: #fff; }
.thcc .thcc-rowctx .thcc-rowopt-tx { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.thcc .thcc-rowctx .thcc-rowopt-t { display: flex; align-items: center; gap: 7px; font-weight: 700; font-size: .92rem; color: var(--thcc-ink); white-space: normal; }
.thcc .thcc-rowctx .thcc-rowopt-t .thcc-temp-dot { box-shadow: 0 0 0 3px var(--tb, #EDF3F4) !important; }
.thcc .thcc-rowctx .thcc-rowopt-m { font-size: .8rem; color: var(--thcc-muted); white-space: normal; line-height: 1.35; }
.thcc .thcc-rowctx .thcc-rowopt-ck { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid var(--thcc-line); color: transparent; transition: all .16s; }
.thcc .thcc-rowctx .thcc-rowopt-ck svg { width: 13px; height: 13px; }
.thcc .thcc-rowctx .thcc-rowopt.is-on .thcc-rowopt-ck { background: var(--thcc-ink); border-color: var(--thcc-ink); color: #fff; }
.thcc .thcc-rowctx .thcc-rowopt-more { all: unset; box-sizing: border-box; cursor: pointer; display: grid; place-items: center; min-height: 64px; padding: 10px 14px !important; border: 1.5px dashed var(--thcc-line) !important; border-radius: 14px !important; background: transparent !important; color: var(--thcc-ink) !important; font: 700 .86rem/1.3 var(--thcc-font) !important; }
.thcc .thcc-rowctx .thcc-rowopt-more:hover { border-color: var(--thcc-ink) !important; }

.thcc .thcc-rowctx-detail { padding: 16px 22px 18px; background: #F6F9F9; border-top: 1px solid var(--thcc-line-soft); }
.thcc .thcc-rowctx-dk { margin: 0 0 10px !important; font-size: .8rem; font-weight: 700; color: var(--thcc-muted); }
.thcc .thcc-rowctx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 0 !important; padding: 0; background: none; border: 0; }
.thcc .thcc-rowctx .thcc-rowcell { margin: 0; padding: 10px 12px; background: #fff; border: 1px solid var(--thcc-line-soft); border-radius: 12px; min-width: 0; }
.thcc .thcc-rowctx .thcc-rowcell.is-varies { background: #fff; }
.thcc .thcc-rowctx .thcc-rowcell dt { display: block; font-size: .74rem !important; font-weight: 500 !important; color: var(--thcc-muted); line-height: 1.3; text-transform: none !important; letter-spacing: 0 !important; }
.thcc .thcc-rowctx .thcc-rowcell dd { margin: 4px 0 0 !important; font-size: 1rem; font-weight: 700; color: var(--thcc-ink); line-height: 1.3; }
.thcc .thcc-rowctx-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; padding: 12px 22px 14px; border-top: 1px solid var(--thcc-line-soft); }
@media (max-width: 600px) {
	.thcc .thcc-rowctx-head { padding: 16px 16px 12px; }
	.thcc .thcc-rowctx-switch { grid-template-columns: 1fr; padding: 0 16px 16px; gap: 8px; }
	.thcc .thcc-rowctx-detail { padding: 14px 16px 16px; }
	.thcc .thcc-rowctx-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
	.thcc .thcc-rowctx-foot { padding: 12px 16px; }
}
.thcc .thcc-rowctx .thcc-rowopt { grid-template-columns: minmax(0, 1fr) auto; align-items: start; padding: 14px 14px 14px 16px !important; }
.thcc .thcc-rowctx .thcc-rowopt-ck { margin-top: 1px; }
.thcc .thcc-rowctx .thcc-rowopt-t { font-size: .95rem; line-height: 1.3; }
.thcc .thcc-rowctx .thcc-rowopt-m { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.thcc .thcc-rowctx .thcc-rowopt-tag { display: inline-block; padding: 3px 8px; border-radius: 6px; background: #EEF3F4; color: #3F5A60; font-size: .76rem; font-weight: 600; line-height: 1.3; white-space: nowrap; }
.thcc .thcc-rowctx .thcc-rowopt.is-on .thcc-rowopt-tag { background: #fff; color: var(--thcc-ink); box-shadow: inset 0 0 0 1px #D6E2E4; }
.thcc .thcc-rowctx .thcc-rowopt::before { content: none; }