/* TLG TECH v2 – section components. Scoped by section classes only (never post IDs), so it works on any site and in every language. */

/* Line icons (used as CSS masks) */
:root {
	--ico-collect: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M2 7h11v9H2zM13 10h4.5l3.5 3.5V16h-8z%22/%3E%3Ccircle cx=%226%22 cy=%2217.5%22 r=%221.8%22/%3E%3Ccircle cx=%2217%22 cy=%2217.5%22 r=%221.8%22/%3E%3C/svg%3E");
	--ico-sort: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3.5 5h17l-6.5 7.5V19l-4 2v-8.5z%22/%3E%3C/svg%3E");
	--ico-crush: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%224%22 y=%223.5%22 width=%2216%22 height=%228%22 rx=%221.5%22/%3E%3Cpath d=%22M8 11.5l-2 9M11 11.5l-.5 9M13 11.5l.5 9M16 11.5l2 9%22/%3E%3C/svg%3E");
	--ico-blend: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 3h6M10 3v6.5L4.8 18.2A2 2 0 0 0 6.5 21h11a2 2 0 0 0 1.7-2.8L14 9.5V3M7 15h10%22/%3E%3C/svg%3E");
	--ico-compound: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M2.5 8.5h12v7h-12zM14.5 10.5h3v3h-3M5.5 8.5V4.5h5v4%22/%3E%3Ccircle cx=%2220.5%22 cy=%228%22 r=%221.3%22/%3E%3Ccircle cx=%2221%22 cy=%2212%22 r=%221.3%22/%3E%3Ccircle cx=%2220.5%22 cy=%2216%22 r=%221.3%22/%3E%3C/svg%3E");
	--ico-ship: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 7.5l9-4.5 9 4.5v9l-9 4.5-9-4.5zM3 7.5l9 4.5 9-4.5M12 12v9%22/%3E%3C/svg%3E");
	--ico-mold: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3l9 4.5-9 4.5-9-4.5zM3 12l9 4.5 9-4.5M3 16.5L12 21l9-4.5%22/%3E%3C/svg%3E");
	--ico-assemble: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M14.7 6.3a4 4 0 0 0-5.3 5.3L3 18l3 3 6.4-6.4a4 4 0 0 0 5.3-5.3l-2.6 2.6-2.3-.6-.6-2.3z%22/%3E%3C/svg%3E");
	--ico-chip: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%226.5%22 y=%226.5%22 width=%2211%22 height=%2211%22 rx=%221.5%22/%3E%3Cpath d=%22M9.5 2.5v4M14.5 2.5v4M9.5 17.5v4M14.5 17.5v4M2.5 9.5h4M2.5 14.5h4M17.5 9.5h4M17.5 14.5h4%22/%3E%3C/svg%3E");
	--ico-box: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%225.5%22 width=%2218%22 height=%2213%22 rx=%221.5%22/%3E%3Cpath d=%22M7 9v6M9.5 9v6M12 9v6M15 9v6M17 9v6%22/%3E%3C/svg%3E");
	--ico-xrf: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%222%22/%3E%3Cellipse cx=%2212%22 cy=%2212%22 rx=%229%22 ry=%223.6%22/%3E%3Cellipse cx=%2212%22 cy=%2212%22 rx=%229%22 ry=%223.6%22 transform=%22rotate%2860 12 12%29%22/%3E%3Cellipse cx=%2212%22 cy=%2212%22 rx=%229%22 ry=%223.6%22 transform=%22rotate%28120 12 12%29%22/%3E%3C/svg%3E");
	--ico-mfi: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3.5 17.5a8.5 8.5 0 1 1 17 0M12 17.5l4.5-6M6 13.5l1.2.6M12 8.5V10M18 13.5l-1.2.6%22/%3E%3C/svg%3E");
	--ico-impact: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M13 4.5l6.5 6.5-3 3L10 7.5zM11.8 9.2L4 17l3 3 7.8-7.8%22/%3E%3C/svg%3E");
	--ico-color: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 3s6.5 7 6.5 11.5a6.5 6.5 0 0 1-13 0C5.5 10 12 3 12 3z%22/%3E%3Cpath d=%22M9 15a3 3 0 0 0 3 3%22/%3E%3C/svg%3E");
	--ico-waste: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 7h16M9 7V4h6v3M6 7l1.2 13h9.6L18 7M10 11v6M14 11v6%22/%3E%3C/svg%3E");
	--ico-recycle: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 12a8 8 0 0 1-14 5.3M4 12a8 8 0 0 1 14-5.3M18.5 3v4h-4M5.5 21v-4h4%22/%3E%3C/svg%3E");
	--ico-resin: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%228%22 cy=%229%22 r=%223.2%22/%3E%3Ccircle cx=%2216%22 cy=%229%22 r=%223.2%22/%3E%3Ccircle cx=%2212%22 cy=%2216%22 r=%223.2%22/%3E%3C/svg%3E");
	--ico-product: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 8h16v12H4zM8 8V6a4 4 0 0 1 8 0v2%22/%3E%3C/svg%3E");
	--ico-flask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 3h6M10 3v6.5L4.8 18.2A2 2 0 0 0 6.5 21h11a2 2 0 0 0 1.7-2.8L14 9.5V3%22/%3E%3C/svg%3E");
}

/* ==========================================================================
   Section tabs (sibling pages of the current menu group)
   ========================================================================== */
.section-tabs { background: var(--white); border-bottom: 1px solid var(--line); position: sticky; top: calc(var(--header-h) + 4px); z-index: 50; }
.admin-bar .section-tabs { top: calc(var(--header-h) + 36px); }
.section-tabs__list { list-style: none; margin: 0; padding: 0; display: flex; overflow-x: auto; scrollbar-width: none; }
.section-tabs__list::-webkit-scrollbar { display: none; }
.section-tabs__list li { flex: 1 1 0; min-width: max-content; }
.section-tabs__list a { display: block; padding: 18px 22px 16px; text-align: center; color: var(--muted); font-weight: 500; text-decoration: none; border-bottom: 3px solid transparent; white-space: nowrap; transition: color .2s, border-color .2s; }
.section-tabs__list a:hover { color: var(--navy); }
.section-tabs__list a.is-active { color: var(--blue); font-weight: 700; border-bottom-color: var(--blue); }
@media (min-width: 901px) {
 .section-tabs__list:has(> li:nth-child(6)) { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); overflow: visible; }
 .section-tabs__list:has(> li:nth-child(6)) li { min-width: 0; }
 .section-tabs__list:has(> li:nth-child(6)) a { display: flex; align-items: center; justify-content: center; height: 100%; padding-inline: 12px; white-space: normal; overflow-wrap: anywhere; }
}
@media (max-width: 782px) { .admin-bar .section-tabs { top: var(--header-h); } }
@media (max-width: 600px) {
	.section-tabs__list li { flex: 0 0 auto; }
	.section-tabs__list a { padding: 14px 16px 12px; font-size: .9rem; }
}

/* ==========================================================================
   Full menu (hamburger) – full sitemap overlay on desktop, side panel on mobile
   ========================================================================== */
.nav-toggle { display: block; }
.mobile-nav__title { display: none; }
@media (min-width: 1081px) {
	.mobile-nav { background: rgba(6, 25, 50, .55); }
	.mobile-nav__panel { position: absolute; inset: 0 0 auto 0; width: 100%; max-width: none; height: auto; max-height: 100vh; overflow-y: auto; transform: translateY(-16px); padding: calc(var(--header-h) + 40px) max(var(--gutter), calc((100vw - var(--wrap)) / 2)) 48px; background: var(--white); box-shadow: 0 30px 60px rgba(6, 25, 50, .2); }
	.mobile-nav.is-open .mobile-nav__panel { transform: none; }
	.mobile-nav__title { display: block; margin: 0 0 20px; font-size: .78rem; font-weight: 700; letter-spacing: .18em; color: var(--red); }
	.mobile-nav__menu, .mobile-nav ul.menu { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 32px 24px; margin: 0 0 32px; }
	.mobile-nav__menu > li > a, .mobile-nav ul.menu > li > a { border-bottom: 2px solid var(--navy); padding: 0 0 12px; font-size: 1.05rem; color: var(--navy); }
	.mobile-nav .sub-menu { padding: 12px 0 0; margin: 0; }
	.mobile-nav .sub-menu a { border: 0; padding: 7px 0; font-weight: 400; color: var(--muted); font-size: .94rem; }
	.mobile-nav .sub-menu a:hover { color: var(--blue); }
	.mobile-nav .lang-switch--mobile, .mobile-nav__panel > .btn--block { display: none; }
	.mobile-nav__contact { margin: 0; padding-top: 20px; border-top: 1px solid var(--line); }
	.mobile-nav__contact br { display: none; }
	.mobile-nav__contact a:last-child { margin-left: 24px; }
	.nav-open .site-header { z-index: 101; }
}

/* ==========================================================================
   Quick menu (floating inquiry + top)
   ========================================================================== */
.quick-menu { position: fixed; right: 20px; bottom: 24px; z-index: 90; display: flex; flex-direction: column; gap: 8px; opacity: 0; visibility: hidden; transform: translateY(12px); transition: opacity .25s, transform .25s, visibility .25s; }
.quick-menu.is-visible { opacity: 1; visibility: visible; transform: none; }
.quick-menu__item { width: 64px; height: 64px; border-radius: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; text-decoration: none; font-size: .7rem; font-weight: 600; box-shadow: 0 10px 24px rgba(10, 47, 92, .18); }
.quick-menu__item svg { width: 22px; height: 22px; }
.quick-menu__item--inquiry { background: var(--blue); color: var(--white); }
.quick-menu__item--inquiry:hover { background: var(--navy); color: var(--white); }
.quick-menu__item--top { background: var(--navy); color: var(--white); }
.quick-menu__item--top:hover { background: var(--blue); color: var(--white); }
@media (max-width: 600px) {
	.quick-menu { right: 12px; bottom: 14px; }
	.quick-menu__item { width: 52px; height: 52px; border-radius: 14px; font-size: .64rem; }
}

/* ==========================================================================
   Icon cards (process steps, lab instruments)
   ========================================================================== */
.tlg-card--icon::before { content: ""; display: block; width: 56px; height: 56px; margin-bottom: 18px; border-radius: 16px; background: var(--blue-soft) var(--ico, none) center / 30px no-repeat; background-image: none; position: relative; }
.tlg-card--icon { position: relative; }
.tlg-card--icon::after { content: ""; position: absolute; top: 37px; left: 37px; width: 30px; height: 30px; background: var(--blue); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; pointer-events: none; }
.tlg-section--alt .tlg-card--icon::before { background-color: var(--blue-soft); }
.tlg-ico-collect { --ico: var(--ico-collect); } .tlg-ico-sort { --ico: var(--ico-sort); } .tlg-ico-crush { --ico: var(--ico-crush); }
.tlg-ico-blend { --ico: var(--ico-blend); } .tlg-ico-compound { --ico: var(--ico-compound); } .tlg-ico-ship { --ico: var(--ico-ship); }
.tlg-ico-mold { --ico: var(--ico-mold); } .tlg-ico-assemble { --ico: var(--ico-assemble); } .tlg-ico-chip { --ico: var(--ico-chip); }
.tlg-ico-box { --ico: var(--ico-box); } .tlg-ico-xrf { --ico: var(--ico-xrf); } .tlg-ico-mfi { --ico: var(--ico-mfi); }
.tlg-ico-impact { --ico: var(--ico-impact); } .tlg-ico-color { --ico: var(--ico-color); } .tlg-ico-recycle { --ico: var(--ico-recycle); }

/* Process cards: numbered, connected left → right on desktop */
.tlg-process-cards { counter-reset: pc; }
.tlg-process-cards > .tlg-card { counter-increment: pc; }
.tlg-process-cards > .tlg-card:not(:last-child) .tlg-card__title::after { content: none; }
@media (min-width: 901px) {
	.tlg-process-cards { position: relative; }
	.tlg-process-cards > .tlg-card:not(:last-child)::before { box-shadow: none; }
	.tlg-grid--4.tlg-process-cards > .tlg-card { padding-top: 28px; }
}
.tlg-process-cards .tlg-card__num { position: absolute; top: 26px; right: 24px; font-size: 1.6rem; line-height: 1; color: var(--line); font-weight: 700; letter-spacing: 0; }
.tlg-process-cards .tlg-card__num + .tlg-card__title { margin-top: 0; }

/* ==========================================================================
   Cycle diagram (ordered list on a ring)
   ========================================================================== */
.tlg-cycle { position: relative; width: min(100%, 680px); aspect-ratio: 1; margin-inline: auto; --n: 6; --r: 39%; }
.tlg-cycle:has(.tlg-cycle__list > li:nth-child(5):last-child) { --n: 5; }
.tlg-cycle:has(.tlg-cycle__list > li:nth-child(4):last-child) { --n: 4; }
.tlg-cycle::before { content: ""; position: absolute; inset: 11%; border: 2px dashed #c3d3e6; border-radius: 50%; }
.tlg-cycle__center { position: absolute; inset: 31%; margin: 0 !important; display: flex; align-items: center; justify-content: center; text-align: center; padding: 6%; border-radius: 50%; background: radial-gradient(circle at 50% 35%, #fff, var(--blue-soft)); border: 1px solid #d2e0f0; color: var(--navy); font-weight: 700; font-size: clamp(.9rem, 1.6vw, 1.1rem); line-height: 1.35; }
.tlg-cycle__center::before { content: ""; position: absolute; top: 14%; left: 50%; width: 34px; height: 34px; transform: translateX(-50%); background: #2f9e5b; -webkit-mask: var(--ico-recycle) center / contain no-repeat; mask: var(--ico-recycle) center / contain no-repeat; }
.tlg-cycle__list { list-style: none; margin: 0 !important; padding: 0; counter-reset: cy; }
.tlg-cycle__list > li { counter-increment: cy; position: absolute; width: 28%; left: calc(50% + cos(var(--a)) * var(--r)); top: calc(50% + sin(var(--a)) * var(--r)); transform: translate(-50%, -24px); text-align: center; color: var(--muted); font-size: .84rem; line-height: 1.4; }
.tlg-cycle__list > li::before { content: ""; display: block; width: 72px; height: 72px; margin: -12px auto 10px; border-radius: 50%; background: var(--white); border: 2px solid var(--blue); box-shadow: 0 8px 20px rgba(0, 80, 160, .12); }
.tlg-cycle__list > li::after { content: counter(cy); position: absolute; top: -14px; left: calc(50% + 22px); width: 24px; height: 24px; border-radius: 50%; background: var(--red); color: #fff; font-size: .75rem; font-weight: 700; line-height: 24px; text-align: center; }
.tlg-cycle__list > li strong { display: block; color: var(--navy); font-size: .98rem; }
.tlg-cycle__list > li { --ic: var(--ico-recycle); }
.tlg-cycle__list > li > strong::before { content: ""; position: absolute; top: 9px; left: 50%; width: 30px; height: 30px; transform: translateX(-50%); background: var(--blue); -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
.tlg-cycle__list > li:nth-child(1) { --a: -90deg; }
.tlg-cycle__list > li:nth-child(2) { --a: calc(-90deg + 360deg / var(--n)); }
.tlg-cycle__list > li:nth-child(3) { --a: calc(-90deg + 2 * 360deg / var(--n)); }
.tlg-cycle__list > li:nth-child(4) { --a: calc(-90deg + 3 * 360deg / var(--n)); }
.tlg-cycle__list > li:nth-child(5) { --a: calc(-90deg + 4 * 360deg / var(--n)); }
.tlg-cycle__list > li:nth-child(6) { --a: calc(-90deg + 5 * 360deg / var(--n)); }
.tlg-cycle__list > li:nth-child(7) { --a: calc(-90deg + 6 * 360deg / var(--n)); }
.tlg-cycle--process li:nth-child(1) { --ic: var(--ico-collect); } .tlg-cycle--process li:nth-child(2) { --ic: var(--ico-sort); }
.tlg-cycle--process li:nth-child(3) { --ic: var(--ico-crush); } .tlg-cycle--process li:nth-child(4) { --ic: var(--ico-blend); }
.tlg-cycle--process li:nth-child(5) { --ic: var(--ico-compound); } .tlg-cycle--process li:nth-child(6) { --ic: var(--ico-ship); }
.tlg-cycle--vision li:nth-child(1) { --ic: var(--ico-waste); } .tlg-cycle--vision li:nth-child(2) { --ic: var(--ico-recycle); }
.tlg-cycle--vision li:nth-child(3) { --ic: var(--ico-flask); } .tlg-cycle--vision li:nth-child(4) { --ic: var(--ico-resin); }
.tlg-cycle--vision li:nth-child(5) { --ic: var(--ico-product); }
.tlg-cycle--vision .tlg-cycle__center { font-size: clamp(.95rem, 1.8vw, 1.2rem); }
/* Inside a two-column editorial section the ring takes the full row. */
.tlg-mission-purpose + .tlg-section .tlg-cycle { grid-column: 1 / -1; grid-row: 6; margin-block: 24px 0; }
@media (max-width: 700px) {
	.tlg-cycle { aspect-ratio: auto; width: 100%; }
	.tlg-cycle::before { inset: 24px auto 24px 35px; width: 0; border-width: 0 0 0 2px; border-radius: 0; }
	.tlg-cycle__center { position: static; border-radius: var(--radius); padding: 48px 20px 18px; margin-bottom: 20px !important; }
	.tlg-cycle__center::before { top: 10px; }
	.tlg-cycle__list > li { position: relative; left: auto; top: auto; width: auto; transform: none; text-align: left; padding: 6px 0 18px 92px; min-height: 80px; }
	.tlg-cycle__list > li::before { position: absolute; left: 0; top: 0; margin: 0; }
	.tlg-cycle__list > li::after { left: 54px; top: -6px; }
	.tlg-cycle__list > li > strong::before { left: 36px; top: 21px; }
}

/* ==========================================================================
   Product directory rows (reference: product.lottechem.com)
   ========================================================================== */
.tlg-directory .tlg-head + .tlg-note { margin-top: 18px !important; max-width: 760px; }
.tlg-product-list { border-top: 2px solid var(--navy); }
.tlg-product-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 48px; align-items: center; padding: 32px 24px; border-bottom: 1px solid var(--line); }
.tlg-product-row:nth-child(even) { background: var(--surface); }
.tlg-product-row > * { margin: 0 !important; }
.tlg-product-row__main > * { margin: 0; }
.tlg-product-row__main > * + * { margin-top: 10px; }
.tlg-product-row__title { font-size: clamp(1.15rem, 2vw, 1.4rem); font-weight: 400; color: var(--ink); letter-spacing: -.01em; }
.tlg-product-row__title strong { font-weight: 800; color: var(--navy); margin-right: 2px; }
.tlg-product-row__title span { color: var(--muted); font-size: .9em; }
.tlg-product-row__text { color: var(--muted); max-width: 72ch; }
.tlg-product-row__sub { list-style: none; padding: 14px 18px; background: var(--surface); border-radius: var(--radius-sm); font-size: .92rem; color: var(--muted); }
.tlg-section--alt .tlg-product-row__sub { background: var(--white); }
.tlg-product-row__sub li + li { margin-top: 6px; }
.tlg-product-row__sub strong { color: var(--navy); }
.tlg-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; background: var(--blue-soft); color: var(--blue); font-size: .8rem; font-weight: 700; }
.tlg-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--red); }
.tlg-product-row__actions { margin: 0 !important; }
.tlg-product-row__actions .wp-block-button__link { min-width: 132px; justify-content: center; border-radius: 999px; padding-inline: 1.4em; }
.tlg-product-row__actions .wp-block-button__link::after { content: "\2192"; margin-left: 8px; }
@media (max-width: 700px) {
	.tlg-product-row { grid-template-columns: 1fr; gap: 14px; padding: 24px 0; }
}

/* Linked chips */
.tlg-chips--links a { color: inherit; text-decoration: none; display: block; }

/* ==========================================================================
   Gallery
   ========================================================================== */
.tlg-gallery { display: grid; gap: clamp(12px, 2vw, 20px); }
.tlg-gallery--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tlg-gallery--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tlg-gallery > * { margin: 0 !important; }
.tlg-gallery__item img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); }
.tlg-gallery__item figcaption { margin-top: 10px; font-size: .9rem; font-weight: 600; color: var(--navy); }
.tlg-product-body .product-application-gallery { margin-top: 24px; }
.tlg-product-body .product-application-gallery img { display: block; aspect-ratio: 1; height: auto; object-fit: contain; background: var(--white); border: 1px solid var(--line); }
@media (max-width: 760px) { .tlg-gallery--3, .tlg-gallery--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ==========================================================================
   Flow (ESG roadmap): MEASURE → IMPROVE → …
   ========================================================================== */
.tlg-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 12px; counter-reset: fl; }
.tlg-flow li { counter-increment: fl; position: relative; padding: 22px 16px; border-radius: var(--radius); background: var(--white); border: 1px solid var(--line); text-align: center; font-weight: 700; color: var(--navy); letter-spacing: .04em; text-transform: uppercase; }
.tlg-flow li::before { content: "0" counter(fl); display: block; font-size: .78rem; color: var(--red); margin-bottom: 6px; }
.tlg-flow li:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: -10px; width: 8px; height: 8px; border-top: 2px solid var(--blue); border-right: 2px solid var(--blue); transform: translateY(-50%) rotate(45deg); z-index: 1; }
.tlg-flow li:last-child { background: var(--blue); color: var(--white); border-color: var(--blue); }
.tlg-flow li:last-child::before { color: #cfe2ff; }
@media (max-width: 600px) { .tlg-flow { grid-template-columns: 1fr 1fr; } .tlg-flow li::after { display: none; } }

/* ==========================================================================
   Notices list
   ========================================================================== */
.tlg-notices { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--navy); }
.tlg-notices__item { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 24px; padding: 24px 4px; border-bottom: 1px solid var(--line); }
.tlg-notices__item.is-sticky .tlg-notices__title::before { content: "●"; color: var(--red); margin-right: 8px; font-size: .7em; vertical-align: middle; }
.tlg-notices__date { color: var(--muted); font-size: .9rem; padding-top: 3px; font-variant-numeric: tabular-nums; }
.tlg-notices__title { color: var(--navy); font-weight: 700; font-size: 1.08rem; text-decoration: none; }
.tlg-notices__title:hover { color: var(--blue); text-decoration: underline; }
.tlg-notices__excerpt { margin: 6px 0 0; color: var(--muted); font-size: .94rem; }
.tlg-notices__empty { padding: 40px; text-align: center; color: var(--muted); background: var(--surface); border-radius: var(--radius); }
.tlg-notices__pages { display: flex; gap: 6px; justify-content: center; margin-top: 28px; }
.tlg-notices__pages a, .tlg-notices__pages span { min-width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid var(--line); text-decoration: none; }
.tlg-notices__pages span { background: var(--blue); color: var(--white); border-color: var(--blue); }
@media (max-width: 600px) { .tlg-notices__item { grid-template-columns: 1fr; gap: 6px; } }

/* FAQ split (Inquiry page) */
.tlg-split--faq .tlg-col-copy:first-child { position: sticky; top: calc(var(--header-h) + 80px); align-self: start; }
@media (max-width: 900px) { .tlg-split--faq .tlg-col-copy:first-child { position: static; } }

/* ==========================================================================
   Location (was page-ID based; now .tlg-locations on the sections)
   ========================================================================== */
.tlg-location-map { width: 100%; overflow: hidden; border-radius: var(--radius); }
.tlg-location-map iframe { display: block; width: 100%; height: 280px; border: 0; }
.page-content > .tlg-locations:first-child > .tlg-container { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; gap: 16px 64px; align-items: start; }
.page-content > .tlg-locations:first-child > .tlg-container > :is(.tlg-head, h3, p) { grid-column: 1; margin: 0; }
.page-content > .tlg-locations:first-child .tlg-head { margin-bottom: 16px; }
.page-content > .tlg-locations:first-child .tlg-location-map { grid-column: 2; grid-row: 1 / span 3; align-self: stretch; margin: 0; }
.tlg-locations .tlg-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: center; padding: 28px; border: 1px solid var(--line); background: var(--white); border-radius: var(--radius); box-shadow: none; }
.tlg-locations .tlg-card > * { margin: 0; }
.tlg-locations .tlg-card__title { font-size: 1.4rem; }
.tlg-locations .tlg-card .tlg-location-map, .tlg-locations .tlg-card__text:not(:has(a)) { grid-column: 1 / -1; }
.tlg-locations .tlg-card a { color: var(--blue); font-weight: 600; text-decoration: none; }
.tlg-locations .tlg-card a:is(:hover, :focus-visible) { text-decoration: underline; }
@media (max-width: 760px) {
	.page-content > .tlg-locations:first-child > .tlg-container { grid-template-columns: 1fr; gap: 20px; }
	.page-content > .tlg-locations:first-child .tlg-location-map { grid-column: 1; grid-row: auto; }
	.tlg-locations .tlg-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) { .tlg-locations .tlg-card { grid-template-columns: 1fr; padding: 22px; gap: 14px; } }

/* Printing / OEM / R&D: 3-up text groups without card chrome get light structure */
.tlg-grid > .tlg-col-copy { padding-top: 20px; border-top: 2px solid var(--blue); }
.tlg-grid > .tlg-col-copy > * { margin: 0; }
.tlg-grid > .tlg-col-copy > * + * { margin-top: 10px; }

/* Centered CEO letter using existing editable copy blocks. */
.tlg-ceo-message { background: var(--surface); }
.tlg-ceo-message .tlg-col-copy {
  max-width: 800px;
  margin-inline: auto;
  background: #fffefa;
  padding: clamp(24px, 5vw, 64px);
  border: 1px solid var(--line);
  box-shadow: 0 8px 28px rgba(11, 43, 74, .05);
  text-align: left;
  position: relative;
}
.tlg-ceo-message .tlg-col-copy::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 5px;
  background: linear-gradient(90deg, var(--blue) 0 82%, var(--red) 82%);
}
.tlg-ceo-message .tlg-title { font-size: clamp(1.8rem, 2.6vw, 2.2rem); line-height: 1.35; }
.tlg-ceo-message .tlg-col-copy > p { line-height: 1.85; }
.tlg-ceo-message .tlg-col-copy > * + * { margin-top: 24px; }
.tlg-ceo-message .tlg-lead { color: var(--blue); font-weight: 500; }
.tlg-ceo-message .tlg-note {
  padding: 24px;
  margin-top: 40px !important;
  font-size: 1.2rem;
  color: var(--navy);
  text-align: right;
  background: var(--blue-soft);
  border-right: 3px solid var(--blue);
}
.tlg-ceo-message .tlg-note::after {
  content: "";
  display: block;
  width: 56px;
  height: 3px;
  margin: 14px 0 0 auto;
  background: linear-gradient(90deg, var(--blue) 0 70%, var(--red) 70%);
}
/* Six-step service journey; reuse the existing editable head, grid and cards. */
.tlg-oneline-highlight { background: var(--white); }
.tlg-oneline-highlight .tlg-head { max-width: none; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 20px 64px; align-items: start; }
.tlg-oneline-highlight .tlg-eyebrow { grid-column: 1 / -1; color: var(--blue); }
.tlg-oneline-highlight .tlg-title { color: var(--navy); }
.tlg-oneline-highlight .tlg-lead { color: var(--muted); margin-top: 0 !important; }
.tlg-oneline-highlight .tlg-grid { gap: 32px; }
.tlg-oneline-highlight .tlg-card { padding: 28px 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; transition: none; }
.tlg-oneline-highlight .tlg-card:hover { border-color: var(--line); }
.tlg-oneline-highlight .tlg-card__num { font-size: 2.75rem; line-height: 1; font-weight: 500; color: var(--blue); }
.tlg-oneline-highlight .tlg-card__title { font-size: 1.25rem; color: var(--navy); margin-top: 24px; }
.tlg-oneline-highlight .tlg-card__text { color: var(--muted); font-size: 1rem; }
.tlg-oneline-highlight .tlg-card:nth-child(4) .tlg-card__num { color: var(--red); }
@media (max-width: 900px) {
  .tlg-oneline-highlight .tlg-head { grid-template-columns: 1fr; gap: 16px; }
  .tlg-oneline-highlight .tlg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .tlg-oneline-highlight .tlg-grid { grid-template-columns: 1fr; gap: 24px; }
  .tlg-oneline-highlight .tlg-card { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 10px 20px; padding: 24px 0 0; }
  .tlg-oneline-highlight .tlg-card__num { grid-row: 1 / 3; font-size: 2rem; }
  .tlg-oneline-highlight .tlg-card__title, .tlg-oneline-highlight .tlg-card__text { margin: 0; }
}
/* Reuse the editable ordered steps as an editorial directory, not a timeline. */
.tlg-printing-workflow > .tlg-container { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.tlg-printing-workflow > .tlg-container > * + * { margin-top: 0; }
.tlg-printing-workflow .tlg-steps { grid-template-columns: 1fr; gap: 0; border-top: 2px solid var(--navy); }
.tlg-printing-workflow .tlg-steps li { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.3fr); gap: 24px; padding: 30px 0 30px 64px; border-bottom: 1px solid var(--line); font-size: 1rem; line-height: 1.7; }
.tlg-printing-workflow .tlg-steps li::before { top: 30px; width: 40px; height: 40px; border: 0; border-radius: var(--radius); background: var(--blue-soft); }
.tlg-printing-workflow .tlg-steps li::after { display: none !important; }
.tlg-printing-workflow .tlg-steps strong { margin: 0; font-size: 1.1rem; }
@media (max-width: 900px) {
  .tlg-printing-workflow > .tlg-container { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .tlg-printing-workflow .tlg-steps li { display: block; padding: 24px 0 24px 58px; }
  .tlg-printing-workflow .tlg-steps li::before { top: 24px; }
  .tlg-printing-workflow .tlg-steps strong { margin-bottom: 8px; }
}
/* Mission editorial layout uses the current three sections without changing copy. */
.tlg-mission-purpose > .tlg-container,
.tlg-mission-purpose + .tlg-section > .tlg-container {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  gap: 24px clamp(32px, 5vw, 72px);
  align-items: start;
}
.tlg-mission-purpose > .tlg-container > .tlg-head,
.tlg-mission-purpose + .tlg-section > .tlg-container > .tlg-head { grid-row: 1 / span 5; }
.tlg-mission-purpose > .tlg-container > p,
.tlg-mission-purpose + .tlg-section > .tlg-container > p { grid-column: 2; margin: 0; line-height: 1.85; }
.tlg-mission-purpose + .tlg-section .tlg-lead {
  padding: 24px;
  background: var(--white);
  color: var(--blue);
  border-left: 3px solid var(--blue);
  font-weight: 600;
}
.tlg-mission-vision .tlg-split.wp-block-columns { align-items: stretch; gap: 0; border: 1px solid var(--line); }
.tlg-mission-vision .tlg-col-copy { padding: clamp(28px, 4vw, 52px); }
.tlg-mission-vision .tlg-col-copy:first-child { background: var(--navy); border-top: 4px solid var(--red); }
.tlg-mission-vision .tlg-col-copy:first-child :is(.tlg-title, .tlg-eyebrow) { color: var(--white); }
.tlg-mission-vision .tlg-col-copy:last-child { background: var(--surface); line-height: 1.85; }
@media (max-width: 860px) {
  .tlg-mission-purpose > .tlg-container,
  .tlg-mission-purpose + .tlg-section > .tlg-container { grid-template-columns: 1fr; }
  .tlg-mission-purpose > .tlg-container > .tlg-head,
  .tlg-mission-purpose + .tlg-section > .tlg-container > .tlg-head { grid-row: auto; }
  .tlg-mission-purpose > .tlg-container > p,
  .tlg-mission-purpose + .tlg-section > .tlg-container > p { grid-column: auto; }
}

.tlg-mission-statements .tlg-grid { gap: 0; border-radius: var(--radius); overflow: hidden; }
.tlg-mission-statements .tlg-card {
  padding: clamp(28px, 4vw, 56px); border: 0; border-radius: 0;
  box-shadow: none; background: var(--navy); color: var(--white);
}
.tlg-mission-statements .tlg-card + .tlg-card { background: var(--blue-soft); color: var(--navy); }
.tlg-mission-statements .tlg-card__num { color: #84c4ff; font-size: 1rem; }
.tlg-mission-statements .tlg-card + .tlg-card .tlg-card__num { color: var(--blue); }
.tlg-mission-statements .tlg-card__title { color: inherit; font-size: clamp(1.5rem, 2.5vw, 2rem); }
.tlg-mission-statements .tlg-card__text { color: inherit; font-size: 1rem; line-height: 1.8; }
.tlg-mission-statements .tlg-card > * + * { margin-top: 20px; }
.tlg-mission-principles .tlg-card {
  background: transparent; border: 0; border-top: 2px solid var(--blue);
  border-radius: 0; padding: 24px 0 0; box-shadow: none;
}
.tlg-mission-principles .tlg-card__num { font-size: 1.5rem; color: var(--blue); }

/* Two consecutive sections on the same background: don't double the spacing. */
.page-content > .tlg-section:not(.tlg-section--alt):not(.tlg-cta):not(.tlg-section--stats) + .tlg-section:not(.tlg-section--alt):not(.tlg-cta):not(.tlg-section--stats),
.page-content > .tlg-section--alt + .tlg-section--alt { padding-top: 0; }
@media (max-width: 700px) {
	.tlg-cycle::before { display: none; }
	.tlg-product-row__actions .wp-block-button__link { min-width: 0; padding: .55em 1.2em; font-size: .88rem; }
}

/* Application / document icons */
:root {
	--app-appliance: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%225%22 y=%223%22 width=%2214%22 height=%2218%22 rx=%222%22/%3E%3Cpath d=%22M5 8h14%22/%3E%3Ccircle cx=%2212%22 cy=%2214.5%22 r=%223.5%22/%3E%3Cpath d=%22M8 5.5h1%22/%3E%3C/svg%3E");
	--app-electronics: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%224%22 width=%2218%22 height=%2212%22 rx=%221.5%22/%3E%3Cpath d=%22M8 20h8M12 16v4%22/%3E%3C/svg%3E");
	--app-automotive: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 14l2-5a2 2 0 0 1 1.9-1.4h10.2A2 2 0 0 1 19 9l2 5v4h-3M3 14v4h3M3 14h18%22/%3E%3Ccircle cx=%227.5%22 cy=%2217.5%22 r=%221.8%22/%3E%3Ccircle cx=%2216.5%22 cy=%2217.5%22 r=%221.8%22/%3E%3Cpath d=%22M9.5 17.5h5%22/%3E%3C/svg%3E");
	--app-office: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 9V3h10v6M7 17H4v-7a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v7h-3%22/%3E%3Crect x=%227%22 y=%2214%22 width=%2210%22 height=%227%22/%3E%3C/svg%3E");
	--app-toys: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%2211%22 width=%2218%22 height=%229%22 rx=%221%22/%3E%3Crect x=%225.5%22 y=%227%22 width=%224%22 height=%224%22 rx=%22.5%22/%3E%3Crect x=%2214.5%22 y=%227%22 width=%224%22 height=%224%22 rx=%22.5%22/%3E%3C/svg%3E");
	--app-packaging: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 7.5l9-4.5 9 4.5v9l-9 4.5-9-4.5zM3 7.5l9 4.5 9-4.5M12 12v9M7.5 5.2l9 4.5%22/%3E%3C/svg%3E");
	--app-medical: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223%22 y=%223%22 width=%2218%22 height=%2218%22 rx=%223%22/%3E%3Cpath d=%22M12 7.5v9M7.5 12h9%22/%3E%3C/svg%3E");
	--app-construction: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 21h18M5 21V9l7-5 7 5v12M9 21v-6h6v6%22/%3E%3C/svg%3E");
	--app-lighting: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 18h6M10 21h4M12 3a6 6 0 0 0-3.5 10.9c.6.5 1 1.2 1 2.1h5c0-.9.4-1.6 1-2.1A6 6 0 0 0 12 3z%22/%3E%3C/svg%3E");
	--app-electrical: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M9 3v5M15 3v5M6 8h12v3a6 6 0 0 1-12 0zM12 17v4%22/%3E%3C/svg%3E");
	--app-mobile: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%227%22 y=%222.5%22 width=%2210%22 height=%2219%22 rx=%222%22/%3E%3Cpath d=%22M11 18.5h2%22/%3E%3C/svg%3E");
	--app-textile: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M6 21l12-18M9 3c2 3 2 6 0 9s-2 6 0 9M15 3c-2 3-2 6 0 9s2 6 0 9%22/%3E%3C/svg%3E");
	--app-industrial: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%223%22/%3E%3Cpath d=%22M12 2.5v3M12 18.5v3M2.5 12h3M18.5 12h3M5.3 5.3l2.1 2.1M16.6 16.6l2.1 2.1M5.3 18.7l2.1-2.1M16.6 7.4l2.1-2.1%22/%3E%3C/svg%3E");
	--app-download: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M12 4v11M7 10.5l5 5 5-5M5 20h14%22/%3E%3C/svg%3E");
}

/* ==========================================================================
   Product detail (single tlg_product) – layout per client draft:
   name + description left, document buttons right; features, applications, case study
   ========================================================================== */
.product-head { padding-bottom: clamp(40px, 5vw, 64px); background: linear-gradient(180deg, var(--surface), var(--white)); }
.product-head__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px 56px; align-items: start; }
.product-head__title { font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 400; color: var(--ink); margin: 0 0 14px; letter-spacing: -.01em; }
.product-head__title strong { font-weight: 800; color: var(--navy); }
.product-head__title span { color: var(--muted); font-size: .8em; }
.product-head__desc { color: var(--ink); max-width: 68ch; line-height: 1.8; margin: 0; }
.product-docs { display: grid; grid-template-columns: repeat(2, 132px); gap: 12px; }
.product-docs__btn { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 58px; padding: 10px 44px 10px 18px; border-radius: 10px 18px 10px 18px; background: var(--red); color: #fff; text-decoration: none; box-shadow: 0 6px 16px rgba(215, 38, 46, .22); transition: transform .2s, box-shadow .2s, background .2s; }
.product-docs__btn span { font-size: 1.35rem; font-weight: 800; letter-spacing: .02em; line-height: 1.1; }
.product-docs__btn small { font-size: .74rem; opacity: .85; }
.product-docs__btn::after { content: ""; position: absolute; right: 12px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); background: currentColor; -webkit-mask: var(--app-download) center / contain no-repeat; mask: var(--app-download) center / contain no-repeat; opacity: .9; }
.product-docs__btn:hover, .product-docs__btn:focus-visible { color: #fff; background: #b81e25; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(215, 38, 46, .3); }
.product-docs__btn.is-request { opacity: .92; }
.product-docs__btn.is-request::after { content: "\2192"; -webkit-mask: none; mask: none; background: none; width: auto; height: auto; font-size: 1.1rem; }


.tlg-product-body { padding-top: 0; padding-bottom: clamp(72px, 9vw, 120px); }
.tlg-product-body > .tlg-container > * + * { margin-top: clamp(72px, 9vw, 112px) !important; }
.product-block { padding-bottom: clamp(8px, 1vw, 16px); }
.product-block__title { font-size: 1.5rem; color: var(--ink); margin: 0 0 20px !important; padding-bottom: 12px; border-bottom: 2px solid var(--navy); }
.product-features { max-width: none; padding: clamp(24px, 4vw, 44px); background: var(--surface); border-left: 4px solid var(--blue); }
.product-features__list { margin: 0; }

.tlg-apps { list-style: disc; margin: 0; padding: 16px 24px 16px 44px; background: var(--surface); border-radius: var(--radius); display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 40px; }
.tlg-apps > li { padding: 8px 0; text-align: left; color: var(--ink); font-size: 1rem; line-height: 1.6; }
.tlg-app + .tlg-app { border-left: 0; }
.tlg-app::before { display: none; }
.product-head__copy { grid-column: 1 / -1; }
.product-resources { padding-top: 0; }
.product-resources .product-block + .product-block { margin-top: 48px; }
.product-resources .product-docs { display: flex; flex-wrap: wrap; gap: 12px; }
.product-resources .product-docs__btn { min-width: 132px; }
.product-industries__list { padding-left: 24px; }
.product-industries__list:empty { min-height: 48px; border: 1px dashed var(--line); border-radius: var(--radius-sm); }
.tlg-app--appliance { --app-icon: var(--app-appliance); } .tlg-app--electronics { --app-icon: var(--app-electronics); }
.tlg-app--automotive { --app-icon: var(--app-automotive); } .tlg-app--office { --app-icon: var(--app-office); }
.tlg-app--toys { --app-icon: var(--app-toys); } .tlg-app--packaging { --app-icon: var(--app-packaging); }
.tlg-app--medical { --app-icon: var(--app-medical); } .tlg-app--construction { --app-icon: var(--app-construction); }
.tlg-app--lighting { --app-icon: var(--app-lighting); } .tlg-app--electrical { --app-icon: var(--app-electrical); }
.tlg-app--mobile { --app-icon: var(--app-mobile); } .tlg-app--textile { --app-icon: var(--app-textile); }
.tlg-app--industrial { --app-icon: var(--app-industrial); }

.tlg-cases { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * 20px) / 3); gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; scrollbar-width: thin; }
.tlg-cases > * { margin: 0 !important; scroll-snap-align: start; }
.tlg-case img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); background: var(--blue-soft); }
.tlg-case figcaption { margin-top: 10px; font-weight: 600; color: var(--navy); font-size: .95rem; }
.tlg-product-body .tlg-cases--illustrative { grid-auto-flow: row; grid-auto-columns: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; scroll-snap-type: none; }
.tlg-product-body .tlg-cases--illustrative img { aspect-ratio: 3 / 2; object-fit: contain; }
@media (max-width: 600px) {
	.tlg-product-body .tlg-cases--illustrative { grid-template-columns: 1fr; }
}

/* Product list: details + inquire buttons */
.tlg-product-row__actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.tlg-product-row__actions .is-style-outline .wp-block-button__link::after { content: none; }

@media (max-width: 900px) {
	.product-head__grid { grid-template-columns: 1fr; }
	.product-docs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.tlg-cases { grid-auto-columns: 70%; }
}
@media (max-width: 600px) {
	.product-docs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tlg-apps { grid-template-columns: repeat(2, 1fr); }
	.tlg-app + .tlg-app { border-left: 0; }
	.tlg-app:nth-child(even) { border-left: 1px solid var(--line); }
	.tlg-cases { grid-auto-columns: 85%; }
	.tlg-product-row__actions { justify-content: flex-start; }
}

/* Document buttons: larger on desktop */
@media (min-width: 901px) {
	.product-docs { grid-template-columns: repeat(2, 176px); gap: 16px; }
	.product-docs__btn { min-height: 78px; padding: 12px 52px 12px 24px; border-radius: 12px 24px 12px 24px; }
	.product-docs__btn span { font-size: 1.75rem; }
	.product-docs__btn::after { right: 18px; width: 24px; height: 24px; }
	.product-docs__btn.is-request::after { font-size: 1.4rem; }
}

:root {
	--app-kitchen: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 11h16v3a6 6 0 0 1-6 6h-4a6 6 0 0 1-6-6zM20 12.5h2M9 7c0-1.5 1-1.5 1-3M13 7c0-1.5 1-1.5 1-3%22/%3E%3C/svg%3E");
	--app-aerospace: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M21 4l-6.5 6.5M3.5 13.5L8 15l1.5 4.5 2-2-.5-3.5 6-6 3.5-.5 1-2.5-2.5 1-6 6-3.5-.5z%22/%3E%3C/svg%3E");
	--app-leaf: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M5 19C5 10 10 5 20 4c-1 10-6 15-15 15zM5 19l8-8%22/%3E%3C/svg%3E");
	--app-recycle: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.5%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 12a8 8 0 0 1-14 5.3M4 12a8 8 0 0 1 14-5.3M18.5 3v4h-4M5.5 21v-4h4%22/%3E%3C/svg%3E");
}
.tlg-app--kitchen { --app-icon: var(--app-kitchen); } .tlg-app--aerospace { --app-icon: var(--app-aerospace); }
.tlg-app--leaf { --app-icon: var(--app-leaf); } .tlg-app--recycle { --app-icon: var(--app-recycle); }
/* Document buttons without a link: shown, not clickable */
.product-docs__btn.is-empty { opacity: .55; box-shadow: none; cursor: default; }
.product-docs__btn.is-empty:hover { transform: none; background: var(--red); }
.product-docs__btn.is-empty::after { display: none; }

/* Supplied resin photos: editable image blocks, full dish visible. */
.tlg-pellet-gallery .tlg-gallery__item { padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); }
.tlg-pellet-gallery .tlg-gallery__item img { width: 100%; height: auto; aspect-ratio: auto; }
.tlg-pellet-gallery .tlg-gallery__item figcaption { margin-top: 12px; text-align: center; }

/* Product directory visuals: reuse supplied pellet assets and editable code tiles. */
.tlg-product-row--visual { grid-template-columns: 132px minmax(0, 1fr) auto; gap: 24px; }
.tlg-product-row__visual { width: 132px; overflow: hidden; border-radius: 0; }
.tlg-product-row__visual.tlg-product-image-empty { aspect-ratio: 12 / 13; background: var(--blue-soft); border: 1px solid var(--line); }
.tlg-product-body .tlg-case.tlg-product-image-empty { aspect-ratio: 3 / 2; background: var(--blue-soft); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.tlg-product-row__visual img { display: block; width: 100%; height: auto; object-fit: contain; object-position: center; background: transparent; border: 0; border-radius: 0; }
.tlg-product-row__code { display: flex; align-items: center; justify-content: center; min-height: 143px; padding: 12px; background: var(--blue-soft); color: var(--navy); font-size: 1.35rem; font-weight: 800; text-align: center; overflow-wrap: anywhere; }
@media (max-width: 900px) {
 .tlg-product-row--visual { grid-template-columns: 100px minmax(0, 1fr); }
 .tlg-product-row--visual .tlg-product-row__actions { grid-column: 2; justify-content: flex-start; }
 .tlg-product-row__visual { width: 100px; }
 .tlg-product-row__code { min-height: 108px; }
}
@media (max-width: 700px) {
 /* Mobile: image on top, text and button below. */
 .tlg-product-row--visual { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 24px 12px; align-items: start; }
 .tlg-product-row__visual { width: 100%; }
 .tlg-product-row--visual .tlg-product-row__actions { grid-column: 1; }
 .tlg-product-row__code { min-height: 160px; font-size: 1.35rem; padding: 12px; }
}

/* Mobile cycle: keep the desktop ring, scaled down. */
@media (max-width: 700px) {
	.tlg-cycle { aspect-ratio: 1; width: min(100%, 420px); --r: 38%; margin-bottom: 44px; }
	.tlg-cycle::before { display: block; inset: 12%; width: auto; border: 2px dashed #c3d3e6; border-radius: 50%; }
	.tlg-cycle__center { position: absolute; inset: 32%; margin: 0 !important; padding: 18% 5% 4%; border-radius: 50%; font-size: .7rem; line-height: 1.3; }
	.tlg-cycle__center::before { top: 8%; width: 18px; height: 18px; }
	.tlg-cycle--vision .tlg-cycle__center { font-size: .7rem; }
	.tlg-cycle__list { display: block; position: static; }
	.tlg-cycle__list::before { content: none; }
	.tlg-cycle__list > li { position: absolute; display: block; width: 30%; min-height: 0; padding: 0; left: calc(50% + cos(var(--a)) * var(--r)); top: calc(50% + sin(var(--a)) * var(--r)); transform: translate(-50%, -24px); text-align: center; background: none; border: 0; box-shadow: none; font-size: .66rem; line-height: 1.3; }
	.tlg-cycle__list > li > br { display: none; }
	.tlg-cycle__list > li::before { position: static; width: 48px; height: 48px; margin: 0 auto 4px; transform: none; border-width: 2px; box-shadow: 0 4px 12px rgba(0, 80, 160, .12); }
	.tlg-cycle__list > li > strong::before { left: 50%; top: 24px; width: 22px; height: 22px; transform: translate(-50%, -50%); }
	.tlg-cycle__list > li::after { left: calc(50% + 14px); top: -6px; width: 18px; height: 18px; font-size: .62rem; line-height: 18px; }
	.tlg-cycle__list > li strong { font-size: .78rem; line-height: 1.25; margin: 0 0 2px; }
}

/* Cycle centre: icon and text grouped in the middle (all widths). */
.tlg-cycle__center { flex-direction: column; gap: 8px; }
.tlg-cycle__center::before { position: static; flex: none; transform: none; width: 30px; height: 30px; }
@media (max-width: 700px) {
	.tlg-cycle__center { padding: 6%; gap: 4px; }
	.tlg-cycle__center::before { width: 18px; height: 18px; }
}


/* Document buttons v2.8.5: light card button (file badge, label, PDF, download icon). Only linked documents render. */
.product-resources .product-docs { display: flex; flex-wrap: wrap; gap: 12px; }
.product-docs__btn, .product-resources .product-docs__btn { display: inline-flex; flex-direction: row; align-items: center; gap: 10px; min-width: 0; min-height: 56px; padding: 10px 16px 10px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); color: var(--navy); box-shadow: 0 2px 8px rgba(10, 47, 92, .06); text-decoration: none; transition: background .2s, border-color .2s, color .2s, transform .2s, box-shadow .2s; }
.product-docs__btn::before { content: ""; flex: none; width: 36px; height: 36px; border-radius: 8px; background: var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 3v5h5M9 13h6M9 17h4'/%3E%3C/svg%3E") center / 20px no-repeat; }
.product-docs__btn .product-docs__label { font-size: 1.05rem; font-weight: 800; letter-spacing: .02em; line-height: 1.1; }
.product-docs__btn small { font-size: .72rem; font-weight: 700; color: var(--muted); opacity: 1; letter-spacing: .04em; }
.product-docs__btn::after { content: ""; position: static; flex: none; width: 18px; height: 18px; margin-left: 6px; transform: none; background: currentColor; -webkit-mask: var(--app-download) center / contain no-repeat; mask: var(--app-download) center / contain no-repeat; opacity: .8; }
.product-docs__btn:hover, .product-docs__btn:focus-visible { background: var(--navy); border-color: var(--navy); color: #fff; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(10, 47, 92, .18); }
.product-docs__btn:hover small, .product-docs__btn:focus-visible small { color: rgba(255, 255, 255, .75); }
@media (min-width: 901px) {
	.product-docs__btn, .product-resources .product-docs__btn { min-height: 60px; padding: 11px 20px 11px 11px; border-radius: 12px; }
	.product-docs__btn::after { right: auto; width: 18px; height: 18px; }
}
@media (max-width: 600px) {
	.product-resources .product-docs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.product-resources .product-docs__btn { width: 100%; padding-right: 12px; }
	.product-docs__btn::after { margin-left: auto; }
}


/* v2.8.6 product detail layout: header, [photo | key features], applications, illustrations, data sheet. */
.tlg-product-body { padding-bottom: clamp(40px, 5vw, 56px); }
.tlg-product-body > .tlg-container { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(36px, 4vw, 48px); }
.tlg-product-body > .tlg-container > * { margin: 0 !important; min-width: 0; }
.tlg-product-body .tlg-pellet-gallery { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; align-content: start; }
.tlg-product-body .tlg-pellet-gallery:has(> :nth-child(2)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tlg-product-body .tlg-pellet-gallery .tlg-gallery__item { margin: 0; padding: 12px; }
.tlg-product-body .product-features { padding: clamp(22px, 3vw, 32px); border-left: 0; border-radius: var(--radius); }
.tlg-product-body .product-features .product-block__title { font-size: 1.3rem; }
.tlg-product-body .product-application-gallery { margin-top: 16px !important; }
@media (min-width: 901px) {
	.tlg-product-body > .tlg-container { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: 32px; }
	.tlg-product-body > .tlg-container > * { grid-column: 1 / -1; }
	.tlg-product-body > .tlg-container > .tlg-pellet-gallery { grid-column: 1; }
	.tlg-product-body > .tlg-container > .tlg-pellet-gallery + .product-features { grid-column: 2; align-self: stretch; }
	.tlg-product-body .tlg-pellet-gallery:not(:has(> :nth-child(2))) .tlg-gallery__item { height: 100%; display: flex; align-items: center; }
}

/* Data sheet buttons: solid red tiles in one row. */
.product-resources { padding-top: 0; }
.product-resources .product-docs { display: flex; flex-wrap: wrap; gap: 12px; }
.product-docs__btn, .product-resources .product-docs__btn { display: inline-flex; align-items: center; justify-content: center; gap: 0; min-width: 150px; min-height: 56px; padding: 12px 28px; border: 0; border-radius: 14px 14px 14px 4px; background: var(--red); color: #fff; box-shadow: 0 6px 16px rgba(215, 38, 46, .2); text-decoration: none; }
.product-docs__btn::before, .product-docs__btn::after { content: none; display: none; }
.product-docs__btn .product-docs__label { font-size: 1.25rem; font-weight: 800; letter-spacing: .03em; line-height: 1; color: inherit; }
.product-docs__btn small { display: none; }
.product-docs__btn:hover, .product-docs__btn:focus-visible { background: #b81e25; border-color: transparent; color: #fff; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(215, 38, 46, .3); }
.product-docs__btn.is-empty { opacity: 1; cursor: default; }
.product-docs__btn.is-empty:hover { transform: none; background: var(--red); box-shadow: 0 6px 16px rgba(215, 38, 46, .2); }
@media (max-width: 600px) {
	.product-resources .product-docs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.product-resources .product-docs__btn { width: 100%; min-width: 0; min-height: 52px; padding: 10px 12px; }
	.product-docs__btn .product-docs__label { font-size: 1.1rem; }
}
/* Front end only: an industries block with no items yet is hidden (still editable in the editor). */
.product-detail .product-industries:not(:has(li:not(:empty))) { display: none; }

/* Data sheet buttons in the logo red (#e02229, sampled from logo-tlg-tech.png). */
.product-docs__btn, .product-resources .product-docs__btn, .product-docs__btn.is-empty:hover { background: #e02229; box-shadow: 0 6px 16px rgba(224, 34, 41, .22); }
.product-docs__btn:hover, .product-docs__btn:focus-visible { background: #c01a20; box-shadow: 0 10px 22px rgba(224, 34, 41, .3); }

/* Hover: lift, darker red, download arrow slides in (all four buttons, linked or not). */
.product-resources .product-docs__btn { position: relative; overflow: hidden; transition: background .2s ease, transform .2s ease, box-shadow .2s ease, padding .2s ease; }
.product-resources .product-docs__btn::after { content: ""; display: block; position: absolute; right: 14px; top: 50%; width: 16px; height: 16px; margin: 0; background: #fff; -webkit-mask: var(--app-download) center / contain no-repeat; mask: var(--app-download) center / contain no-repeat; opacity: 0; transform: translate(-6px, -50%); transition: opacity .2s ease, transform .2s ease; }
.product-resources .product-docs__btn:hover, .product-resources .product-docs__btn:focus-visible,
.product-resources .product-docs__btn.is-empty:hover { background: #c01a20; color: #fff; transform: translateY(-3px); box-shadow: 0 12px 24px rgba(224, 34, 41, .32); }
.product-resources .product-docs__btn:hover::after, .product-resources .product-docs__btn:focus-visible::after { opacity: 1; transform: translate(0, -50%); }
.product-resources .product-docs__btn:active { transform: translateY(-1px); box-shadow: 0 6px 14px rgba(224, 34, 41, .28); }
@media (hover: hover) and (min-width: 601px) { .product-resources .product-docs__btn:hover, .product-resources .product-docs__btn:focus-visible { padding-right: 40px; } }
