/* [no-id] */
.home-template #sx-hero{display:none!important}.home-template .content.has-full{margin-top:-2rem}
.tv .innerpg{padding-top:64px}.page-applications #sx-hero,.page-coating-service #sx-hero,.page-certification #sx-hero,.page-contact #sx-hero{display:none!important}.tv .matpanel{background:#fff;border:1px solid #dcece7;border-radius:20px;padding:26px 24px}.tv .matpanel+.matpanel{margin-top:18px}.tv .mattag{display:inline-flex;align-items:center;background:var(--teal-d);color:#fff;font-size:12.5px;font-weight:600;padding:6px 14px;border-radius:999px;margin-bottom:14px;letter-spacing:.02em}.tv .matbody{display:flex;gap:18px;align-items:flex-start}.tv .matbody ul{margin:0;padding:0;list-style:none;flex:1}.tv .matbody li{font-size:14px;color:var(--sub);line-height:1.75;padding-left:16px;position:relative}.tv .matbody li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--teal-l)}.tv .maticon{flex:none;width:56px;height:56px;border-radius:14px;background:linear-gradient(135deg,var(--mint),var(--teal-l));display:flex;align-items:center;justify-content:center}.tv .matpanel .chips{margin-top:16px}
.tv .reveal{transform:translateY(28px) scale(.97)}
.tv .reveal.in{transform:none}
.tv .card{transition:transform .5s cubic-bezier(.16,.84,.32,1),box-shadow .5s cubic-bezier(.16,.84,.32,1),border-color .5s}
.tv .card:hover{transform:translateY(-8px) scale(1.015);box-shadow:0 30px 60px rgba(22,78,72,.18);border-color:#bfe0d8}
.tv .card svg{transition:transform .5s cubic-bezier(.16,.84,.32,1)}
.tv .card:hover svg{transform:scale(1.06)}
.tv .matpanel{transition:transform .45s cubic-bezier(.16,.84,.32,1),box-shadow .45s}
.tv .matpanel:hover{transform:translateY(-4px);box-shadow:0 24px 48px rgba(22,78,72,.12)}
.tv .btn{position:relative;overflow:hidden}
.tv .btn.p::before{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-20deg);transition:left .65s cubic-bezier(.2,.8,.2,1)}
.tv .btn.p:hover::before{left:130%}
.tv .chip{transition:transform .25s ease,background .25s ease}
.tv .chip:hover{transform:translateY(-2px)}
.tv .trust .n{display:inline-block}
#sx-header nav a{position:relative}
#sx-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:2px;background:var(--teal,#226E66);transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
#sx-header nav a:hover::after{transform:scaleX(1);transform-origin:left}
@keyframes tvDrift{0%,100%{transform:translate(0,0)}50%{transform:translate(-14px,12px)}}
.bg-grid-gray-950{animation:tvDrift 20s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.tv .reveal,.tv .card,.tv .btn.p::before,.bg-grid-gray-950{transition:none!important;animation:none!important}}

.dark .tv{--paper:#0e1a17;--mint:#15241f;--ink:#eaf3ef;--sub:#8fb6ac;--teal-l:#6cc2b3}
.dark .tv .hero{background:radial-gradient(1200px 600px at 70% -10%,#1c332c 0%,var(--paper) 60%)}
.dark .tv .card{background:#132420;border-color:#22413a}
.dark .tv .card h3{color:#8fe0cc}
.dark .tv .matpanel{background:#132420;border-color:#22413a}
.dark .tv .checks li{background:#132420;border-color:#22413a;color:#dcefe9}
.dark .tv .chip{color:#bfe6dc;border-color:#2a493f}
.dark .tv .btn.g{background:#132420;color:#bfe6dc;border-color:#2a493f}
.dark .tv .btn.g:hover{border-color:var(--teal-l)}
.dark .tv .split img{box-shadow:0 20px 50px rgba(0,0,0,.45)}
.dark .tv .card:hover{box-shadow:0 30px 60px rgba(0,0,0,.5)}
.dark .tv .matpanel:hover{box-shadow:0 24px 48px rgba(0,0,0,.4)}
.dark .tv .checks li:hover{box-shadow:0 12px 26px rgba(0,0,0,.4)}

@keyframes dropPulse{0%{opacity:.5;transform:translateY(0) scale(.9)}50%{opacity:1;transform:translateY(-4px) scale(1.05)}100%{opacity:.5;transform:translateY(0) scale(.9)}}
.tv .card:hover .ico-drops circle{animation:dropPulse 1.3s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.tv .card:hover .ico-drops circle:nth-child(2){animation-delay:.15s}
.tv .card:hover .ico-drops circle:nth-child(3){animation-delay:.3s}
.tv .card:hover .ico-drops circle:nth-child(4){animation-delay:.45s}
.tv .card:hover .ico-drops circle:nth-child(5){animation-delay:.6s}
@keyframes threadFlow{to{stroke-dashoffset:-200}}
.tv .card:hover .ico-thread{animation:threadFlow 2.4s linear infinite}
@keyframes shieldPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@keyframes glowPulse{0%,100%{opacity:.55}50%{opacity:1}}
.shield-pulse{animation:shieldPulse 3.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.glow-pulse{animation:glowPulse 3.6s ease-in-out infinite}
.tv .certrow span[data-tip]{position:relative;cursor:default}
.tv .certrow span[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%) translateY(4px);background:var(--teal-d);color:#fff;font-size:12px;font-weight:500;letter-spacing:0;white-space:nowrap;padding:7px 12px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;box-shadow:0 10px 24px rgba(0,0,0,.2);z-index:5}
.tv .certrow span[data-tip]::before{content:"";position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--teal-d);opacity:0;transition:opacity .25s ease;pointer-events:none}
.tv .certrow span[data-tip]:hover::after,.tv .certrow span[data-tip]:hover::before{opacity:1;transform:translateX(-50%) translateY(0)}
.tv .card,.tv .matpanel,.tv .checks li{cursor:pointer}
@media(prefers-reduced-motion:reduce){.shield-pulse,.glow-pulse,.tv .card:hover .ico-drops circle,.tv .card:hover .ico-thread{animation:none!important}}

.tv .app svg{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.tv .app:hover svg{transform:scale(1.06)}
.tv .app .cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px 12px;font-size:13.5px;font-weight:600;letter-spacing:.02em;color:#fff;background:linear-gradient(to top,rgba(8,33,29,.62),rgba(8,33,29,0));z-index:1;pointer-events:none}
@media(prefers-reduced-motion:reduce){.tv .app svg{transition:none!important}}

/* hide Ghost membership/newsletter defaults (not relevant for this exhibition microsite) */
[data-portal="signin"], [data-portal="signup"] { display: none !important; }
#sx-footer-subscription { display: none !important; }

.pet-dog{transform-box:fill-box;transform-origin:center;animation:dogJump 1.1s ease-in-out infinite}
@keyframes dogJump{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-9px) rotate(-5deg)}}
.pet-cat-paw{animation:catSwipe 1s ease-in-out infinite}
@keyframes catSwipe{0%,100%{transform:rotate(0deg)}50%{transform:rotate(32deg)}}
@media(prefers-reduced-motion:reduce){.pet-dog,.pet-cat-paw{animation:none!important}}

/* ===== DESIGNER PHOTO SYSTEM ===== */
.tv .phero{position:relative;min-height:78vh;display:flex;align-items:center;overflow:hidden;margin:0;background:#dfe9e6}
.tv .phero .pbg{position:absolute;inset:0;overflow:hidden}
.tv .phero .pbg img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.06);will-change:transform}
.tv .phero .pshade{position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,.94) 0%,rgba(255,255,255,.80) 34%,rgba(255,255,255,.18) 62%,rgba(255,255,255,0) 100%)}
.tv .phero .wrap{position:relative;z-index:2;width:100%}
.tv .phero .pinner{max-width:560px}
.tv .phero h1{font-size:clamp(34px,5.4vw,60px);line-height:1.12;letter-spacing:.04em;font-weight:800;color:var(--teal-d);margin:0 0 14px}
.tv .phero .sub{font-size:clamp(17px,2.3vw,23px);color:var(--teal-d);font-weight:600;letter-spacing:.02em;margin-bottom:8px}
.tv .phero .sub2{font-size:clamp(14px,1.7vw,16px);color:var(--sub);letter-spacing:.04em}
.tv .phero .en{font-size:clamp(13px,1.7vw,17px);letter-spacing:.2em;color:var(--sub);font-weight:500;margin-bottom:22px}
@media(max-width:760px){
  .tv .phero{min-height:66vh}
  .tv .phero .pshade{background:linear-gradient(180deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,.72) 55%,rgba(255,255,255,.55) 100%)}
  .tv .phero .pinner{max-width:100%}
}
/* photo blocks */
.tv .photo{border-radius:18px;overflow:hidden;box-shadow:0 18px 44px rgba(22,78,72,.16);background:var(--mint)}
.tv .photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.tv .photo:hover img{transform:scale(1.045)}
.tv .photoband{position:relative;height:clamp(300px,42vw,520px);overflow:hidden;margin:0}
.tv .photoband img{width:100%;height:100%;object-fit:cover;will-change:transform}
/* cert logo strip */
.tv .certlogos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;margin-top:34px}
.tv .certlogos .cl{background:#fff;border:1px solid #e3efeb;border-radius:16px;padding:20px 26px;display:flex;align-items:center;justify-content:center;min-width:150px;min-height:92px;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s}
.tv .certlogos .cl img{max-height:46px;max-width:150px;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.72;transition:filter .45s,opacity .45s}
.tv .certlogos .cl:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(22,78,72,.14);border-color:var(--teal-l)}
.tv .certlogos .cl:hover img{filter:none;opacity:1}
.dark .tv .certlogos .cl{background:#16241f;border-color:#25403a}
.dark .tv .certlogos .cl img{filter:grayscale(1) brightness(2.6);opacity:.8}
.dark .tv .certlogos .cl:hover img{filter:brightness(1.15)}
/* doc gallery */
.tv .docs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.tv .docs figure{margin:0;border-radius:14px;overflow:hidden;background:#fff;border:1px solid #e3efeb;box-shadow:0 8px 22px rgba(22,78,72,.08);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.tv .docs figure:hover{transform:translateY(-8px) rotate(-.6deg);box-shadow:0 22px 44px rgba(22,78,72,.18)}
.tv .docs img{display:block;width:100%;height:auto}
@media(max-width:860px){.tv .docs{grid-template-columns:repeat(2,1fr)}}
.dark .tv .docs figure{background:#16241f;border-color:#25403a}
/* ===== SCROLL / REVEAL SYSTEM ===== */
.tv .rv{opacity:0;transform:translateY(30px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.tv .rv.in{opacity:1;transform:none}
.tv .rv-l{opacity:0;transform:translateX(-42px);transition:opacity .95s cubic-bezier(.2,.7,.2,1),transform .95s cubic-bezier(.2,.7,.2,1)}
.tv .rv-l.in{opacity:1;transform:none}
.tv .rv-r{opacity:0;transform:translateX(42px);transition:opacity .95s cubic-bezier(.2,.7,.2,1),transform .95s cubic-bezier(.2,.7,.2,1)}
.tv .rv-r.in{opacity:1;transform:none}
.tv .rv-z{opacity:0;transform:scale(.93);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.tv .rv-z.in{opacity:1;transform:none}
/* image curtain reveal */
.tv .rv-cur{clip-path:inset(0 100% 0 0);transition:clip-path 1.25s cubic-bezier(.66,0,.2,1)}
.tv .rv-cur.in{clip-path:inset(0 0 0 0)}
/* stagger delays */
.tv .s1{transition-delay:.09s}.tv .s2{transition-delay:.18s}.tv .s3{transition-delay:.27s}
.tv .s4{transition-delay:.36s}.tv .s5{transition-delay:.45s}.tv .s6{transition-delay:.54s}
/* scroll progress bar */
#tvprog{position:fixed;top:0;left:0;height:3px;width:0;z-index:99999;background:linear-gradient(90deg,var(--teal-l),var(--teal-d));transition:width .12s linear;pointer-events:none}
/* section headings underline draw */
.tv .hline{position:relative;display:inline-block;padding-bottom:12px}
.tv .hline:after{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;background:var(--teal-l);transform:translateX(-50%);transition:width .9s cubic-bezier(.2,.8,.2,1) .25s}
.tv .hline.in:after{width:62px}
@media(prefers-reduced-motion:reduce){
  .tv .rv,.tv .rv-l,.tv .rv-r,.tv .rv-z,.tv .rv-cur,.tv .hline:after,.tv .photo img,.tv .certlogos .cl,.tv .docs figure{transition:none!important;animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}
  #tvprog{display:none}
}

/* full-bleed breakout for photo sections */
.tv .phero, .tv .photoband{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.tv .phero .wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.tv .phero .pbg img{object-position:72% center}
.tv .phero .pshade{background:linear-gradient(100deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.93) 30%,rgba(255,255,255,.62) 50%,rgba(255,255,255,.10) 74%,rgba(255,255,255,0) 100%)}
.dark .tv .phero .pshade{background:linear-gradient(100deg,rgba(14,26,23,.96) 0%,rgba(14,26,23,.90) 30%,rgba(14,26,23,.60) 50%,rgba(14,26,23,.10) 74%,rgba(14,26,23,0) 100%)}
@media(max-width:760px){
  .tv .phero .pbg img{object-position:64% center}
  .tv .phero .pshade{background:linear-gradient(180deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.86) 48%,rgba(255,255,255,.7) 100%)}
  .dark .tv .phero .pshade{background:linear-gradient(180deg,rgba(14,26,23,.95) 0%,rgba(14,26,23,.86) 48%,rgba(14,26,23,.7) 100%)}
}

/* hline correction: keep h2 block-level, underline follows text alignment */
.tv h2.hline{display:block;position:relative;padding-bottom:14px}
.tv h2.hline:after{content:"";position:absolute;bottom:0;width:0;height:2px;background:var(--teal-l);transition:width .9s cubic-bezier(.2,.8,.2,1) .25s;left:0;transform:none}
.tv h2.hline.in:after{width:56px}
.tv [style*="text-align:center"] h2.hline:after,.tv .cta h2.hline:after{left:50%;transform:translateX(-50%)}
.tv .cta h2.hline:after{background:rgba(255,255,255,.55)}

.page-en #sx-hero,.page-en-applications #sx-hero,.page-en-coating-service #sx-hero,.page-en-certification #sx-hero,.page-en-contact #sx-hero{display:none!important}

.dark .tv .phero h1{color:#eaf3ef}
.dark .tv .phero .sub{color:#bfe0d7}
.dark .tv .phero .sub2,.dark .tv .phero .en{color:#9dc3b8}
.dark .tv .phero .kick{color:var(--teal-l)}
.dark .tv .phero .lead{color:#c3d9d3}

.page-about #sx-hero,.page-en-about #sx-hero{display:none!important}

/* trust bar: fit 5 stats, wrap gracefully */
.tv .trust .wrap{grid-template-columns:repeat(5,1fr)!important;gap:16px!important}
@media(max-width:1000px){.tv .trust .wrap{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:620px){.tv .trust .wrap{grid-template-columns:repeat(2,1fr)!important}}
.tv .trust .t{font-size:13px;line-height:1.5;opacity:.9}
.tv .trust .n{font-size:clamp(24px,2.6vw,34px)}

/* clinical trial block */
.tv .trialstats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
@media(max-width:820px){.tv .trialstats{grid-template-columns:1fr}}
.tv .ts{background:linear-gradient(160deg,var(--teal-d),#1d6259);color:#fff;border-radius:18px;padding:30px 26px;box-shadow:0 14px 34px rgba(22,78,72,.18)}
.tv .tsn{font-size:clamp(34px,4vw,46px);font-weight:800;line-height:1;letter-spacing:-.02em}
.tv .tsn b{font-size:.46em;font-weight:700;margin-left:4px}
.tv .tst{font-size:15px;font-weight:600;margin-top:12px;opacity:.95}
.tv .tsd{font-size:13px;line-height:1.6;margin-top:8px;opacity:.72}
.tv .limits{margin-top:46px;background:var(--mint);border:1px solid #d7e9e4;border-left:4px solid var(--teal-l);border-radius:14px;padding:24px 26px}
.tv .limits h4{margin:0 0 12px;font-size:15px;color:var(--teal-d);font-weight:700}
.tv .limits ul{margin:0;padding-left:18px}
.tv .limits li{font-size:14px;color:var(--sub);line-height:1.75;margin-bottom:6px}
.tv .limits .cite{margin:16px 0 0;font-size:12.5px;color:var(--sub);line-height:1.7;padding-top:14px;border-top:1px solid #d7e9e4}
.tv .limits .cite a{color:var(--teal);word-break:break-all}
.dark .tv .limits{background:#16241f;border-color:#25403a;border-left-color:var(--teal-l)}

.page-applications .mtx .card .body:has(> p.muted),
.page-en-applications .mtx .card .body:has(> p.muted){min-height:auto}
.page-applications .mtx .card .body > p.muted,
.page-en-applications .mtx .card .body > p.muted{position:static;opacity:1;transform:none;margin-top:8px}
.page-applications .mtx .card .body:has(> p.muted)::before,
.page-en-applications .mtx .card .body:has(> p.muted)::before{content:none!important}
.tv .mtx .card .body h3{line-height:1.4}
@media(max-width:980px){.tv .mtx{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:560px){.tv .mtx{grid-template-columns:1fr!important}}

/* case study gallery */
.tv .cases{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:42px}
@media(max-width:820px){.tv .cases{grid-template-columns:1fr}}
.tv .cs{border-radius:20px;overflow:hidden;background:#fff;border:1px solid #e2eeea;box-shadow:0 14px 34px rgba(22,78,72,.10);transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .55s}
.tv .cs:hover{transform:translateY(-8px);box-shadow:0 26px 52px rgba(22,78,72,.18)}
.tv .cs .ph{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--mint)}
.tv .cs .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
.tv .cs:hover .ph img{transform:scale(1.06)}
.tv .cs .meta{padding:22px 24px 24px}
.tv .cs .meta h3{margin:0 0 4px;font-size:18px;color:var(--teal-d)}
.tv .cs .meta .d{font-size:13px;color:var(--teal-l);font-weight:600;letter-spacing:.04em}
.tv .cs .meta p{margin:10px 0 0;font-size:14px;color:var(--sub);line-height:1.7}
.dark .tv .cs{background:#16241f;border-color:#25403a}
.dark .tv .cs .meta h3{color:#eaf3ef}

.tv .plain{margin-top:44px;background:linear-gradient(150deg,var(--teal-d),#1d6259);color:#fff;border-radius:20px;padding:34px 34px 30px;box-shadow:0 18px 40px rgba(22,78,72,.2)}
.tv .plain .lab{font-size:12px;letter-spacing:.22em;text-transform:uppercase;opacity:.7;font-weight:600}
.tv .plain h3{margin:12px 0 16px;font-size:clamp(20px,2.4vw,26px);line-height:1.45;color:#fff;font-weight:700}
.tv .plain p{margin:0 0 12px;font-size:15.5px;line-height:1.85;opacity:.93}
.tv .plain p:last-child{margin-bottom:0}
.tv .plain .hi{background:rgba(255,255,255,.16);padding:2px 8px;border-radius:6px;font-weight:700}
@media(max-width:640px){.tv .plain{padding:26px 22px}}

.tv .cards{grid-template-columns:repeat(3,1fr)}
@media(max-width:960px){.tv .cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.tv .cards{grid-template-columns:1fr}}
.pel{transform-box:fill-box;transform-origin:center;animation:pelFloat 3.4s ease-in-out infinite}
.pel.p2{animation-delay:.45s}.pel.p3{animation-delay:.9s}.pel.p4{animation-delay:1.3s}
@keyframes pelFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-6px) rotate(-7deg)}}
@media(prefers-reduced-motion:reduce){.pel{animation:none!important}}

/* ===== APPLICATION TILE ICON MOTION ===== */
.tv .app svg g[filter] > circle{transform-box:fill-box;transform-origin:center}
.tv .app svg g[filter] > circle:nth-of-type(1){animation:tvHaloA 4.6s ease-in-out infinite}
.tv .app svg g[filter] > circle:nth-of-type(2){animation:tvHaloB 4.6s ease-in-out infinite}
@keyframes tvHaloA{0%,100%{scale:1;opacity:1}50%{scale:1.07;opacity:.72}}
@keyframes tvHaloB{0%,100%{scale:1;opacity:.9}50%{scale:.93;opacity:.45}}

/* glyph group: use individual transform props so they compose with the SVG transform attribute */
.tv .app svg g[filter] > g{transform-box:fill-box;transform-origin:center}
.tv .apps2 .app:nth-child(1) svg g[filter] > g{animation:tvGlyphBob 5.2s ease-in-out infinite}
.tv .apps2 .app:nth-child(2) svg g[filter] > g{animation:tvGlyphTilt 5.6s ease-in-out infinite}
.tv .apps3 .app:nth-child(1) svg g[filter] > g{animation:tvGlyphBob 4.8s ease-in-out infinite}
.tv .apps3 .app:nth-child(2) svg g[filter] > g{animation:tvGlyphPulse 4.2s ease-in-out infinite}
.tv .apps3 .app:nth-child(3) svg g[filter] > g{animation:tvGlyphWave 5.4s ease-in-out infinite}
@keyframes tvGlyphBob{0%,100%{translate:0 0}50%{translate:0 -7px}}
@keyframes tvGlyphTilt{0%,100%{rotate:0deg;translate:0 0}50%{rotate:-4deg;translate:0 -4px}}
@keyframes tvGlyphPulse{0%,100%{scale:1}50%{scale:1.07}}
@keyframes tvGlyphWave{0%,100%{translate:0 0;rotate:0deg}33%{translate:-4px -3px;rotate:2.5deg}66%{translate:4px -3px;rotate:-2.5deg}}

/* sparkle dots drift on every tile */
.tv .app svg > circle{transform-box:fill-box;transform-origin:center;animation:tvSpark 3.6s ease-in-out infinite}
.tv .app svg > circle:nth-of-type(2){animation-delay:.7s}
.tv .app svg > circle:nth-of-type(3){animation-delay:1.4s}
@keyframes tvSpark{0%,100%{opacity:.35;scale:1}50%{opacity:1;scale:1.5}}

/* hover accelerates */
.tv .app:hover svg g[filter] > g{animation-duration:2.4s}
@media(prefers-reduced-motion:reduce){
  .tv .app svg g[filter] > circle,.tv .app svg g[filter] > g,.tv .app svg > circle{animation:none!important}
}

/* product grid: 3 across, but never override grids that set columns inline */
.tv .cards:not([style*="grid-template-columns"]){grid-template-columns:repeat(3,1fr)!important}
/* exactly 3 products: never orphan one on its own row — go 3 -> 1 */
@media(max-width:820px){.tv .cards:not([style*="grid-template-columns"]){grid-template-columns:1fr!important;max-width:460px;margin-left:auto;margin-right:auto}}

#sx-footer .tv-slogan{display:block;margin-top:14px;max-width:none}
#sx-footer .tv-slogan .sl-zh{display:block;font-size:16px;font-weight:600;letter-spacing:.03em;color:var(--teal-d,#164e48);line-height:1.7}
#sx-footer .tv-slogan .sl-en{display:block;margin-top:6px;font-size:13.5px;letter-spacing:.03em;opacity:.72;line-height:1.7}
.dark #sx-footer .tv-slogan .sl-zh{color:#cfe6df}

/* section-level "learn more" link */
.tv .more{display:inline-flex;align-items:center;gap:8px;margin-top:26px;font-size:15px;font-weight:600;color:var(--teal);text-decoration:none;letter-spacing:.02em;transition:gap .35s cubic-bezier(.2,.8,.2,1),color .3s}
.tv .more:after{content:"→";transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.tv .more:hover{gap:12px;color:var(--teal-d)}
.tv .more:hover:after{transform:translateX(3px)}
.dark .tv .more{color:var(--teal-l)}
.dark .tv .more:hover{color:#bfe0d7}
.tv .morec{text-align:center;margin-top:34px}
/* clickable cards / tiles */
.tv a.card,.tv a.app,.tv a.cs{text-decoration:none;color:inherit;display:block}
.tv a.app{position:relative}
.tv a.card:focus-visible,.tv a.app:focus-visible,.tv a.cs:focus-visible{outline:3px solid var(--teal-l);outline-offset:3px}
.tv a.app:after{content:"";position:absolute;inset:0;border-radius:16px;box-shadow:inset 0 0 0 0 var(--teal-l);transition:box-shadow .4s}
.tv a.app:hover:after{box-shadow:inset 0 0 0 2px rgba(255,255,255,.55)}

/* anchor offset under the sticky header */
#clinical{scroll-margin-top:96px}
/* highlighted clinical-evidence CTA */
.tv .hicta{display:inline-flex;align-items:center;gap:14px;margin-top:26px;padding:16px 24px;border-radius:999px;
  background:linear-gradient(135deg,var(--teal-d),#1d6259);color:#fff;text-decoration:none;
  box-shadow:0 14px 30px rgba(22,78,72,.22);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;max-width:100%}
.tv .hicta:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(22,78,72,.3)}
.tv .hicta .n{font-size:26px;font-weight:800;line-height:1;letter-spacing:-.01em;flex:none}
.tv .hicta .n b{font-size:.6em;margin-left:2px}
.tv .hicta .tx{font-size:14.5px;font-weight:600;line-height:1.5;letter-spacing:.02em}
.tv .hicta .tx small{display:block;font-weight:500;opacity:.78;font-size:12.5px;margin-top:2px;letter-spacing:.03em}
.tv .hicta .ar{flex:none;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.tv .hicta:hover .ar{transform:translateX(4px)}
@media(max-width:560px){.tv .hicta{border-radius:20px;flex-wrap:wrap;gap:10px;padding:16px 20px}}
/* clickable 80% stat in the trust bar */
.tv .trust a{color:inherit;text-decoration:none;display:block;border-radius:14px;padding:6px 4px;transition:background .35s}
.tv .trust a:hover{background:rgba(255,255,255,.10)}
.tv .trust a .lk{display:block;font-size:11.5px;opacity:.62;margin-top:6px;letter-spacing:.04em}

/* ============ MOBILE OPTIMISATION ============ */
/* 1. kill horizontal overflow from 100vw full-bleed (clip does not break sticky header) */
html,body{overflow-x:clip}
.tv .phero,.tv .photoband{max-width:100vw}

/* 2. reveal animations must not push content sideways on small screens */
@media(max-width:820px){
  .tv .rv-l,.tv .rv-r{transform:translateY(24px)}
  .tv .rv-l.in,.tv .rv-r.in{transform:none}
}

/* 3. inline-styled grids need to collapse too */
@media(max-width:980px){
  .tv .cards[style*="repeat(3"],.tv .cards[style*="repeat(4"],
  .tv .mtx,.tv .docs,.tv .trialstats{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:760px){
  .tv .cards[style*="grid-template-columns"],
  .tv .mtx,.tv .docs,.tv .trialstats,.tv .cases,
  .tv .apps2,.tv .apps3,.tv .coop,.tv .split{grid-template-columns:1fr!important}
  .tv .cards:not([style*="grid-template-columns"]){max-width:none}
}

/* 4. phone-specific spacing & type */
@media(max-width:640px){
  .tv section{padding:56px 0}
  .tv .wrap{padding:0 20px}
  .tv .phero{min-height:auto;padding:56px 0 48px}
  .tv .phero .wrap{padding:0 20px}
  .tv h2{font-size:clamp(24px,6.4vw,30px);line-height:1.35}
  .tv .lead,.tv .muted{font-size:15px}
  .tv .trust .wrap{padding:32px 18px;gap:20px 12px}
  .tv .trust .n{font-size:clamp(21px,6vw,26px)}
  .tv .trust .t{font-size:12px}
  .tv .btns{gap:10px}
  .tv .btn{padding:13px 20px;font-size:14.5px}
  /* comfortable tap targets */
  .tv .more,.tv .btn,.tv .trust a{min-height:44px;display:inline-flex;align-items:center}
  .tv .chip{padding:7px 13px}
  /* photo panels shouldn't be square-cropped tall on phones */
  .tv .photo{aspect-ratio:4/3}
  .tv .photo img{height:100%}
  .tv .photoband{height:clamp(220px,52vw,320px)}
  .tv .cs .ph{aspect-ratio:16/11}
  /* cert logo strip: 2 up instead of squeezed row */
  .tv .certlogos{gap:10px}
  .tv .certlogos .cl{min-width:0;flex:1 1 calc(50% - 10px);min-height:78px;padding:16px}
  .tv .certlogos .cl img{max-height:34px}
  /* clinical CTA stacks cleanly */
  .tv .hicta{width:100%;justify-content:flex-start}
  .tv .hicta .n{font-size:22px}
  .tv .hicta .tx{font-size:13.5px}
  /* long report scans stay readable */
  .tv .docs figure img{width:100%}
  .tv .limits{padding:20px 18px}
  .tv .plain{padding:24px 20px}
  .tv .plain h3{font-size:18px}
  .tv .ts{padding:24px 20px}
}

@media(max-width:640px){
  /* logos must never be clipped by the card */
  .tv .certlogos .cl img{max-width:100%!important;width:auto}
  /* keep a lone trailing logo at half width instead of stretching */
  .tv .certlogos .cl{flex:0 1 calc(50% - 5px);max-width:calc(50% - 5px)}
  .tv .certlogos{justify-content:center}
  /* checklist: reclaim space taken by the tick icon */
  .tv .checks li{padding-left:46px;font-size:14.5px;line-height:1.7}
  /* headings inside dark CTA shouldn't be oversized */
  .tv .cta h2{font-size:clamp(21px,5.6vw,26px)}
  .tv .cta p{font-size:14.5px}
  /* case card meta */
  .tv .cs .meta{padding:18px 18px 20px}
  .tv .cs .meta h3{font-size:17px}
  /* footer slogan */
  #sx-footer .tv-slogan .sl-zh{font-size:15px}
  #sx-footer .tv-slogan .sl-en{font-size:12.5px}
}

/* ===== DARK MODE v2 : accessible accent + surface pins ===== */
/* 1. accent teal is used for TEXT in many places; the desktop-light value
      (#226E66) only reaches 2.7:1 on the dark canvas. Lift the text-role
      tokens, then pin every surface that relied on the old dark values. */
.dark .tv{--teal:#4fb8a6;--teal-d:#7ad3c0;--teal-l:#8fdccb}
.dark .tv .mattag{background:#164e48}
.dark .tv .matbody li::before{background:#5BAFA3}
.dark .tv .maticon{background:linear-gradient(135deg,var(--mint),#5BAFA3)}
.dark #sx-header nav a::after{background:var(--teal,#226E66)}
.dark .tv .certrow span[data-tip]::after{background:#164e48}
.dark .tv .certlogos .cl:hover{border-color:#5BAFA3}
.dark #tvprog{background:linear-gradient(90deg,#5BAFA3,#164e48)}
.dark .tv .hline:after{background:#5BAFA3}
.dark .tv h2.hline:after{background:#5BAFA3}
.dark .tv .ts{background:linear-gradient(160deg,#164e48,#1d6259)}
.dark .tv .plain{background:linear-gradient(150deg,#164e48,#1d6259)}
.dark .tv a.card:focus-visible,.dark .tv a.app:focus-visible,.dark .tv a.cs:focus-visible{outline:3px solid #5BAFA3}
.dark .tv a.app:after{box-shadow:inset 0 0 0 0 #5BAFA3}
.dark .tv .hicta{
  background:linear-gradient(135deg,#164e48,#1d6259)}
.dark .tv .hero:before{background-image:radial-gradient(#5BAFA3 .5px,transparent .5px)}
.dark .tv .btn.p{background:#226E66}
.dark .tv .btn.g:hover{border-color:#5BAFA3}
.dark .tv .trust{background:#164e48}
.dark .tv .app{background:#164e48}
.dark .tv .checks li:before{background:#226E66}
.dark .tv .band{background:#164e48}
.dark .tv .cta{background:linear-gradient(120deg,#226E66,#164e48)}
/* 2. photo hero: text was flipped light but the scrim stayed white */
.dark .tv .phero{background:#0e1a17}
.dark .tv .phero .pshade{background:linear-gradient(100deg,rgba(9,20,17,.95) 0%,rgba(9,20,17,.86) 34%,rgba(9,20,17,.34) 62%,rgba(9,20,17,.05) 100%)}
.dark .tv .phero h1{color:#eaf3ef}
.dark .tv .phero .sub{color:#8fdccb}
.dark .tv .phero .sub2,.dark .tv .phero .lead{color:#a9c9c1}
.dark .tv .phero .kick{color:#8fdccb}
.dark .tv .phero .en{color:#9fc3ba}
/* 3. photo bands & inline images sit better slightly dimmed at night */
.dark .tv .photoband img,.dark .tv .cs img,.dark .tv .split img,
.dark .tv .phero .pbg img{filter:brightness(.82) saturate(.92)}
.dark .tv .certlogos .cl img{filter:brightness(0) invert(1) opacity(.72)}
.dark .tv .certlogos .cl:hover img{opacity:1}
/* 4. section rhythm: alt bands need a visible but soft step */
.dark .tv section.alt{background:#111f1b}
.dark .tv .wrap>hr,.dark .tv .rule{border-color:#22413a}
/* 5. muted copy was too dim against the darker canvas */
.dark .tv .muted{color:#a3c2ba}
.dark .tv .eyebrow{color:#6fcbb9;letter-spacing:.16em}
.dark .tv .more{color:#6fcbb9}
.dark .tv .more:hover{color:#a5e8d8}
/* 6. white pill button on dark CTA panels */
.dark .tv .btn.w{background:#eaf3ef;color:#0e1a17}
.dark .tv .btn.w:hover{background:#fff}
/* 7. header / footer chrome */
.dark #sx-header{background:rgba(14,26,23,.88);border-bottom-color:#1e3832}
.dark #sx-footer{background:#0b1613;border-top-color:#1e3832}
.dark #sx-footer .tv-slogan .sl-zh{color:#dcefe9}
.dark #sx-footer .tv-slogan .sl-en{color:#8fb6ac}

/* dark v2 fixes: two rules were out-specified by the light-mode originals */
.dark .tv a.more,.dark .tv a.more:visited{color:#6fcbb9}
.dark .tv a.more:hover{color:#a5e8d8}
.dark .tv .chip,.dark .tv span.chip{background:#16302a;border-color:#2a493f;color:#bfe6dc}
.dark .tv .chips .chip{background:#16302a}

.dark .tv a.btn.w,.dark .tv a.btn.w:visited{background:#eaf3ef;color:#0e1a17;border-color:#eaf3ef}
.dark .tv a.btn.w:hover{background:#fff;color:#0b1613}

.dark .tv a.btn.w,.dark .tv a.btn.w:visited{background:#eaf3ef;color:#0e1a17;border-color:#eaf3ef}
.dark .tv a.btn.w:hover{background:#fff;color:#0b1613}

/* ===== readability: Chinese line-breaking ===== */
.tv p,.tv .muted,.tv li{text-wrap:pretty;line-break:strict;overflow-wrap:break-word}
.tv h1,.tv h2,.tv h3{text-wrap:balance}
.tv .nw{white-space:nowrap}
/* ===== feature icon row ===== */
.tv .featrow{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:24px}
.tv .feat{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:14px;
  background:var(--mint);border:1px solid #d7e8e2;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.tv .feat:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(22,78,72,.12)}
.tv .feat .fi{flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:#fff;
  display:grid;place-items:center;box-shadow:0 2px 6px rgba(22,78,72,.10)}
.tv .feat .fi svg{display:block}
.tv .feat .ft{font-size:14px;font-weight:600;color:var(--teal-d);line-height:1.35;letter-spacing:.01em}
.tv .feat .ft small{display:block;font-weight:500;font-size:12px;color:var(--sub);margin-top:3px;letter-spacing:.02em}
.dark .tv .feat{background:#16302a;border-color:#2a493f}
.dark .tv .feat .fi{background:#0b1613}
.dark .tv .feat .ft{color:#bfe6dc}
.dark .tv .feat .ft small{color:#8fb6ac}
@media(max-width:640px){.tv .featrow{grid-template-columns:1fr;gap:8px}.tv .feat{padding:11px 13px}}

.tv .feat{padding:11px 12px;gap:10px}
.tv .feat .fi{flex:0 0 30px;width:30px;height:30px;border-radius:9px}
.tv .feat .ft{font-size:13.5px;line-height:1.3}
.tv .feat .ft small{font-size:11.5px;margin-top:2px;line-height:1.35}
.tv .featrow{grid-template-columns:repeat(auto-fit,minmax(178px,1fr))}
@media(max-width:900px){.tv .featrow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.tv .featrow{grid-template-columns:1fr}}

/* [no-id] */
.tv{--teal:#226E66;--teal-d:#164e48;--teal-l:#5BAFA3;--mint:#e8f4f0;--paper:#f7fbf9;--ink:#1e2e2b;--sub:#56706b;font-family:-apple-system,"Noto Sans TC","PingFang TC","Helvetica Neue",Arial,sans-serif;color:var(--ink);line-height:1.7;margin:0 -4vw;}
.tv *{box-sizing:border-box}
.tv .wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.tv .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.tv .reveal.in{opacity:1;transform:none}
.tv .d1{transition-delay:.08s}.tv .d2{transition-delay:.16s}.tv .d3{transition-delay:.24s}.tv .d4{transition-delay:.32s}
/* HERO */
.tv .hero{position:relative;overflow:hidden;background:radial-gradient(1200px 600px at 70% -10%,#d7ece6 0%,var(--paper) 60%);padding:120px 0 90px;text-align:center}
.tv .hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(var(--teal-l) .5px,transparent .5px);background-size:26px 26px;opacity:.12;mask-image:radial-gradient(700px 400px at 50% 20%,#000,transparent 75%)}
.tv .kick{display:inline-block;font-size:13px;letter-spacing:.28em;color:var(--teal);font-weight:600;margin-bottom:20px}
.tv .hero h1{font-size:clamp(38px,6vw,66px);line-height:1.08;letter-spacing:-.02em;font-weight:800;margin:0 0 8px;color:var(--teal-d)}
.tv .hero .en{font-size:clamp(15px,2.2vw,20px);letter-spacing:.18em;color:var(--sub);font-weight:500;margin-bottom:26px}
.tv .lead{max-width:620px;margin:0 auto 34px;font-size:clamp(16px,2vw,18px);color:var(--sub)}
.tv .btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.tv .btn{display:inline-flex;align-items:center;gap:8px;padding:14px 30px;border-radius:999px;font-weight:600;font-size:15px;text-decoration:none;transition:transform .2s,box-shadow .2s}
.tv .btn.p{background:var(--teal);color:#fff;box-shadow:0 8px 24px rgba(34,110,102,.28)}
.tv .btn.p:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(34,110,102,.36)}
.tv .btn.g{background:#fff;color:var(--teal-d);border:1.5px solid #cfe3dd}
.tv .btn.g:hover{transform:translateY(-2px);border-color:var(--teal-l)}
/* TRUST BAR */
.tv .trust{background:var(--teal-d);color:#fff}
.tv .trust .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:44px 24px;text-align:center}
.tv .trust .n{font-size:clamp(26px,4vw,40px);font-weight:800;letter-spacing:-.02em}
.tv .trust .t{font-size:13px;color:#bcdcd6;margin-top:6px}
.tv .trust b{color:#eafff9}
/* SECTION */
.tv section{padding:88px 0}
.tv .eyebrow{font-size:12px;letter-spacing:.24em;color:var(--teal);font-weight:700;text-transform:uppercase}
.tv h2{font-size:clamp(28px,4vw,42px);letter-spacing:-.02em;font-weight:800;color:var(--ink);margin:10px 0 18px;line-height:1.15}
.tv .split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.tv .split img{width:100%;border-radius:18px;box-shadow:0 20px 50px rgba(22,78,72,.12)}
.tv .muted{color:var(--sub);font-size:17px}
/* PRODUCT CARDS */
.tv .alt{background:var(--mint)}
.tv .cards{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:40px}
.tv .card{background:#fff;border:1px solid #dcece7;border-radius:20px;overflow:hidden;transition:transform .3s,box-shadow .3s}
.tv .card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(22,78,72,.14)}
.tv .card img{width:100%;display:block;aspect-ratio:16/10;object-fit:cover;background:var(--paper)}
.tv .card .body{padding:26px 28px 30px}
.tv .card h3{margin:0 0 6px;font-size:22px;color:var(--teal-d)}
.tv .card .zh{color:var(--sub);font-size:14px;margin-bottom:14px}
.tv .chips{display:flex;flex-wrap:wrap;gap:8px}
.tv .chip{font-size:12.5px;padding:6px 12px;border-radius:999px;background:var(--mint);color:var(--teal-d);border:1px solid #cfe3dd}
/* APPLICATIONS */
.tv .apps2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:40px}
.tv .apps3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.tv .app{position:relative;border-radius:16px;overflow:hidden;background:var(--teal-d);box-shadow:0 10px 30px rgba(22,78,72,.10)}
.tv .apps2 .app{aspect-ratio:16/10}
.tv .apps3 .app{aspect-ratio:1/1}
.tv .app img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tv .app:hover img{transform:scale(1.06)}
/* CERT */
.tv .certrow{display:flex;justify-content:center;gap:36px;flex-wrap:wrap;align-items:center;margin-top:30px;color:var(--sub);letter-spacing:.14em;font-weight:600;font-size:15px}
.tv .certrow span{opacity:.85}
/* COOPERATION */
.tv .coop{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.tv .checks{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.tv .checks li{position:relative;padding:16px 20px 16px 56px;background:#fff;border:1px solid #dcece7;border-radius:14px;font-weight:600;color:var(--teal-d);box-shadow:0 8px 20px rgba(22,78,72,.06);transition:transform .2s,box-shadow .2s}
.tv .checks li:hover{transform:translateX(4px);box-shadow:0 12px 26px rgba(22,78,72,.12)}
.tv .checks li:before{content:"✓";position:absolute;left:18px;top:50%;transform:translateY(-50%);width:26px;height:26px;line-height:26px;text-align:center;border-radius:50%;background:var(--teal);color:#fff;font-size:14px;font-weight:800}
.tv .band{margin-top:28px;background:var(--teal-d);color:#fff;border-radius:14px;padding:18px 24px;text-align:center;font-weight:600;letter-spacing:.02em}
/* CTA */
.tv .cta{background:linear-gradient(120deg,var(--teal),var(--teal-d));color:#fff;text-align:center;border-radius:28px;padding:70px 30px;position:relative;overflow:hidden}
.tv .cta:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.35) .6px,transparent .6px);background-size:24px 24px;opacity:.15}
.tv .cta h2{color:#fff;position:relative}
.tv .cta p{color:#d7ece6;max-width:560px;margin:12px auto 26px;position:relative}
.tv .cta .btn.w{background:#fff;color:var(--teal-d);position:relative}
@media(max-width:820px){.tv .split{grid-template-columns:1fr;gap:30px}.tv .coop{grid-template-columns:1fr;gap:30px}.tv .cards{grid-template-columns:1fr}.tv .apps2{grid-template-columns:1fr}.tv .trust .wrap{grid-template-columns:1fr 1fr;gap:28px}.tv section{padding:60px 0}.tv .hero{padding:90px 0 70px}}

/* [no-id] */
#sx-header-brand img{max-height:46px!important;width:auto!important}#sx-header{min-height:84px!important}#sx-header nav{min-height:84px!important}#sx-header .inner{min-height:64px!important}@media(min-width:1024px){#sx-header{height:84px!important}}

/* [tv-layout] */
/* ================= LAYOUT WIDTH =================
   Single source of truth. Must load last — the base .tv rules live in a
   later <style> block than the top of this injection, and the homepage
   carries its own inline block too.
   Fixed-px gutters (not vw) so the full-bleed photo hero and the normal
   sections start at exactly the same x at every width. */
.inner:has(.tv),.max-w-5xl:has(.tv),.max-w-3xl:has(.tv),.content:has(.tv){max-width:none!important}
.max-w-5xl:has(.tv){margin-left:0!important;margin-right:0!important}
.outer:has(.tv){padding-left:0!important;padding-right:0!important}
.tv{margin-left:0!important;margin-right:0!important;width:100%}

.tv .wrap,.tv .phero .wrap,.tv .trust .wrap,.tv .band .wrap{
  max-width:1360px;margin-left:auto;margin-right:auto;
  padding-left:32px;padding-right:32px;box-sizing:border-box}
@media(max-width:1424px){.tv .wrap,.tv .phero .wrap,.tv .trust .wrap,.tv .band .wrap{max-width:none;padding-left:40px;padding-right:40px}}
@media(max-width:1100px){.tv .wrap,.tv .phero .wrap,.tv .trust .wrap,.tv .band .wrap{padding-left:28px;padding-right:28px}}
@media(max-width:640px){.tv .wrap,.tv .phero .wrap,.tv .trust .wrap,.tv .band .wrap{padding-left:20px;padding-right:20px}}

.tv .phero .pinner{max-width:660px}
.tv .lead{max-width:720px}
.tv .cta p{max-width:640px}
.tv .wrap>[style*="max-width:640px"]{max-width:760px!important}
.tv .wrap>[style*="max-width:700px"]{max-width:820px!important}

/* [tv-tablet] */
/* tablets (641–1100px): keep the desktop 2-up / 3-up rhythm.
   Previously .apps2 collapsed to one huge tile while .apps3 stayed 3-across. */
@media(min-width:641px) and (max-width:1100px){
  .tv .apps2{grid-template-columns:repeat(2,1fr)!important}
  .tv .apps3{grid-template-columns:repeat(3,1fr)!important}
  .tv .cases,.tv .coop{grid-template-columns:repeat(2,1fr)!important}
  .tv .certlogos .cl{flex:0 1 calc(33.333% - 7px);max-width:calc(33.333% - 7px)}
}

/* [tv-featrow-split] */
/* inside a two-column split the icon row must stay 2x2 — the wider layout
   let auto-fit squeeze in a 3rd column, orphaning the 4th card */
@media(min-width:901px){.tv .split .featrow,.tv .coop .featrow{grid-template-columns:repeat(2,1fr)}}

/* [tv-featrow-split] */
@media(min-width:901px){.tv .split .featrow,.tv .coop .featrow{grid-template-columns:repeat(2,1fr)}}

/* [tv-compare] */
/* ===== disinfection comparison ===== */
.tv .cmp{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:38px;align-items:stretch}
.tv .cmpcol{background:#fff;border:1px solid #e3efeb;border-radius:18px;padding:0 0 6px;
  display:flex;flex-direction:column;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.tv .cmpcol:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(22,78,72,.10)}
.tv .cmpcol .cmph{padding:18px 18px 14px;border-bottom:1px solid #eef5f2}
.tv .cmpcol .cmph b{display:block;font-size:16px;font-weight:700;color:var(--ink);letter-spacing:.01em}
.tv .cmpcol .cmph small{display:block;font-size:12px;color:var(--sub);margin-top:4px}
.tv .cmpcol dl{margin:0;padding:4px 18px 10px}
.tv .cmpcol dl>div{padding:11px 0;border-bottom:1px dashed #edf4f1}
.tv .cmpcol dl>div:last-child{border-bottom:0}
.tv .cmpcol dt{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#8fa8a2;margin-bottom:5px}
.tv .cmpcol dd{margin:0;font-size:13.5px;line-height:1.55;color:var(--ink)}
/* the highlighted column */
.tv .cmpcol.hi{background:linear-gradient(160deg,#164e48,#1d6259);border-color:#164e48;
  box-shadow:0 20px 44px rgba(22,78,72,.22)}
.tv .cmpcol.hi .cmph{border-bottom-color:rgba(255,255,255,.18)}
.tv .cmpcol.hi .cmph b{color:#fff}
.tv .cmpcol.hi .cmph small{color:#a9d9cf}
.tv .cmpcol.hi dl>div{border-bottom-color:rgba(255,255,255,.14)}
.tv .cmpcol.hi dt{color:#7fc4b6}
.tv .cmpcol.hi dd{color:#eafaf5;font-weight:600}
.tv .cmpnote{margin-top:20px;font-size:12.5px;color:var(--sub);line-height:1.7}
.dark .tv .cmpcol{background:#132420;border-color:#22413a}
.dark .tv .cmpcol .cmph{border-bottom-color:#22413a}
.dark .tv .cmpcol .cmph b{color:#eaf3ef}
.dark .tv .cmpcol dl>div{border-bottom-color:#1e3832}
.dark .tv .cmpcol dd{color:#dcefe9}
.dark .tv .cmpcol.hi{background:linear-gradient(160deg,#14544c,#1d6f63);border-color:#2a7d70}
@media(max-width:1100px){.tv .cmp{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.tv .cmp{grid-template-columns:1fr;gap:12px}
  .tv .cmpcol dd{font-size:14px}}

/* [tv-scenes] */
/* keep the icon block optically centred beside the copy */
@media(min-width:901px){.tv .split>.featrow{align-self:center}}
/* ===== application-setting scene cards ===== */
.tv .scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.tv .scene{background:#fff;border:1px solid #e3efeb;border-radius:18px;overflow:hidden;
  transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;display:flex;flex-direction:column}
.tv .scene:hover{transform:translateY(-5px);box-shadow:0 26px 50px rgba(22,78,72,.14)}
.tv .scene .art{display:block;width:100%;aspect-ratio:16/10;background:#eef7f4}
.tv .scene .cap{padding:15px 17px 17px}
.tv .scene .cap b{display:block;font-size:15.5px;font-weight:700;color:var(--ink);letter-spacing:.01em}
.tv .scene .cap small{display:block;font-size:12.5px;color:var(--sub);margin-top:5px;line-height:1.55}
.tv .scene svg .mv{transform-box:fill-box;transform-origin:center}
.tv .scene:hover svg .mv{animation:scfloat 2.4s ease-in-out infinite}
@keyframes scfloat{0%,100%{translate:0 0}50%{translate:0 -3px}}
.tv .scene:hover svg .sp{animation:scpulse 2s ease-in-out infinite}
@keyframes scpulse{0%,100%{opacity:.35}50%{opacity:.9}}
.dark .tv .scene{background:#132420;border-color:#22413a}
.dark .tv .scene .cap b{color:#eaf3ef}
.dark .tv .scene .art{background:#16302a}
@media(max-width:1100px){.tv .scenes{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.tv .scenes{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.tv .scenes{grid-template-columns:1fr;gap:14px}}
@media(prefers-reduced-motion:reduce){.tv .scene:hover svg .mv,.tv .scene:hover svg .sp{animation:none}}

/* [tv-reveal-bp] */
/* horizontal slide-ins sit flush to the container edge, so below the desktop
   breakpoint they push past the viewport before revealing — go vertical-only */
@media(max-width:1100px){
  .tv .rv-l,.tv .rv-r{transform:translateY(24px)!important}
  .tv .rv-l.in,.tv .rv-r.in{transform:none!important}
}

/* [tv-cmpcta] */
.tv .cmpcta{margin-top:26px}
.tv .cmpcta .hicta{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap}
.tv .cmpcta .hictxt{flex:1 1 460px;min-width:0}
.tv .cmpcta h3{margin:8px 0 8px;font-size:clamp(19px,2.4vw,24px);font-weight:800;color:#fff;letter-spacing:.01em}
.tv .cmpcta p{margin:0;color:#d7ece6;font-size:14.5px;line-height:1.75;max-width:640px}
.tv .cmpcta p strong{color:#fff}
.tv .cmpcta .btn{flex:0 0 auto}
@media(max-width:640px){.tv .cmpcta .hicta{flex-direction:column;align-items:flex-start}
 .tv .cmpcta .btn{width:100%;justify-content:center}}

/* [tv-clin] */
/* ===== clinical-evidence bridge (self-contained: the theme was overriding .btn) ===== */
.tv .clin{position:relative;overflow:hidden;border-radius:24px;margin-top:28px;
  background:linear-gradient(135deg,#164e48 0%,#1d6259 55%,#227264 100%);
  padding:38px 40px;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.tv .clin:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 300px at 88% 20%,rgba(255,255,255,.10),transparent 70%)}
.tv .clin>*{position:relative;z-index:1}
.tv .clin .ceyebrow{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:#8fd3c4;font-weight:600}
.tv .clin h3{margin:10px 0 12px;font-size:clamp(21px,2.6vw,27px);font-weight:800;color:#fff;letter-spacing:.01em;line-height:1.3}
.tv .clin p{margin:0;color:#cfe6df;font-size:14.5px;line-height:1.8;max-width:620px}
.tv .clin p strong{color:#fff;font-weight:700}
.tv .clin .clink{display:inline-flex;align-items:center;gap:9px;margin-top:22px;
  background:#fff;color:#164e48;font-weight:700;font-size:14.5px;text-decoration:none;
  padding:13px 26px;border-radius:999px;min-height:44px;box-sizing:border-box;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,gap .3s}
.tv .clin .clink:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.24);gap:13px}
/* the number, given the weight it deserves */
.tv .clin .stat{flex:0 0 auto;text-align:center;background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.20);border-radius:18px;padding:24px 30px;min-width:250px;
  backdrop-filter:blur(2px)}
.tv .clin .stat .row{display:flex;align-items:baseline;justify-content:center;gap:12px;color:#fff}
.tv .clin .stat .from{font-size:24px;font-weight:700;color:#9dc9c0;text-decoration:line-through;text-decoration-thickness:2px}
.tv .clin .stat .arrow{font-size:17px;color:#8fd3c4}
.tv .clin .stat .to{font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1}
.tv .clin .stat .unit{display:block;font-size:11.5px;color:#a9d9cf;margin-top:9px;letter-spacing:.04em}
.tv .clin .stat .drop{display:block;margin-top:14px;padding-top:13px;border-top:1px solid rgba(255,255,255,.18);
  font-size:15px;font-weight:800;color:#fff}
.tv .clin .stat .drop b{font-size:23px;color:#8fe5d0}
@media(max-width:900px){
  .tv .clin{grid-template-columns:1fr;gap:26px;padding:32px 26px}
  .tv .clin .stat{min-width:0;width:100%}
}
@media(max-width:640px){
  .tv .clin{padding:26px 20px;border-radius:20px}
  .tv .clin .clink{width:100%;justify-content:center}
  .tv .clin .stat .to{font-size:34px}
}

/* [tv-typescale] */
/* ===== type scale =====
   Body copy was 17px but every secondary element sat at 12.5–14.5px. Against a
   1360px layout that reads small. Many of these carry inline font-size from the
   page markup, hence !important. */
.tv .matpanel li{font-size:16px!important;line-height:1.8!important}
.tv .matbody ul{gap:2px}
.tv .chip{font-size:13.5px!important;padding:7px 14px!important}
.tv .feat .ft{font-size:15.5px!important;line-height:1.4!important}
.tv .feat .ft small{font-size:13px!important;line-height:1.5!important;margin-top:4px}
.tv .feat .fi{flex:0 0 34px;width:34px;height:34px}
.tv .card p,.tv .card .muted{font-size:16px!important;line-height:1.75!important}
.tv .card h3{font-size:20px!important;line-height:1.5!important}
.tv .cmpcol dd{font-size:15.5px!important;line-height:1.6!important}
.tv .cmpcol dt{font-size:12.5px!important}
.tv .cmpcol .cmph b{font-size:17.5px!important}
.tv .cmpcol .cmph small{font-size:13px!important}
.tv .cmpnote{font-size:13.5px!important;line-height:1.8!important}
.tv .scene .cap b{font-size:17px!important}
.tv .scene .cap small{font-size:13.5px!important;line-height:1.6!important}
.tv .eyebrow{font-size:13px!important}
.tv .checks li{font-size:17px!important}
.tv .clin p{font-size:16px!important;line-height:1.85!important}
.tv .cs .meta p{font-size:15.5px!important;line-height:1.7!important}
.tv .cs .meta h3{font-size:20px!important}
.tv .cs .meta .d{font-size:13px!important}
.tv .certrow{font-size:14px!important}
.tv .trust .t{font-size:14px!important}
.tv .mattag{font-size:13.5px!important}
.tv .more{font-size:16px!important}
.tv .btn,.tv .clin .clink{font-size:15.5px!important}
@media(max-width:640px){
  .tv .matpanel li{font-size:15.5px!important}
  .tv .card p,.tv .card .muted{font-size:15.5px!important}
  .tv .cmpcol dd{font-size:15.5px!important}
  .tv .checks li{font-size:16px!important}
  .tv .clin p{font-size:15.5px!important}
}

/* [tv-faq] */
/* ===== FAQ accordion — native <details> so it works without JS and is keyboard-accessible ===== */
.tv .faq{max-width:880px;margin:40px auto 0}
.tv .faq details{background:#fff;border:1px solid #e3efeb;border-radius:16px;margin-bottom:12px;
  overflow:hidden;transition:border-color .3s,box-shadow .3s}
.tv .faq details[open]{border-color:#bcdfd6;box-shadow:0 14px 34px rgba(22,78,72,.09)}
.tv .faq summary{list-style:none;cursor:pointer;display:flex;align-items:flex-start;gap:16px;
  padding:20px 22px;font-size:16.5px;font-weight:700;color:var(--ink);line-height:1.6;
  min-height:44px;box-sizing:border-box;transition:color .25s}
.tv .faq summary::-webkit-details-marker{display:none}
.tv .faq summary:hover{color:var(--teal-d)}
.tv .faq summary:focus-visible{outline:3px solid var(--teal-l);outline-offset:-3px;border-radius:16px}
.tv .faq summary .q{flex:0 0 26px;width:26px;height:26px;margin-top:1px;border-radius:8px;
  background:var(--mint);color:var(--teal-d);font-size:13px;font-weight:800;
  display:grid;place-items:center}
.tv .faq summary .qt{flex:1 1 auto;min-width:0}
.tv .faq summary .chev{flex:0 0 auto;width:20px;height:20px;margin-top:3px;
  transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.tv .faq details[open] summary .chev{transform:rotate(180deg)}
.tv .faq .ans{padding:0 22px 22px 64px;font-size:15.5px;line-height:1.9;color:var(--sub)}
.tv .faq .ans strong{color:var(--teal-d);font-weight:700}
.tv .faq details[open] .ans{animation:faqin .35s ease}
@keyframes faqin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.dark .tv .faq details{background:#132420;border-color:#22413a}
.dark .tv .faq details[open]{border-color:#2f5e54}
.dark .tv .faq summary{color:#eaf3ef}
.dark .tv .faq summary:hover{color:#8fe0cc}
.dark .tv .faq summary .q{background:#16302a;color:#8fe0cc}
.dark .tv .faq .ans{color:#a3c2ba}
@media(max-width:640px){
  .tv .faq summary{padding:17px 16px;font-size:15.5px;gap:12px}
  .tv .faq .ans{padding:0 16px 18px 50px;font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  .tv .faq details[open] .ans{animation:none}
  .tv .faq summary .chev{transition:none}
}

/* [tv-checks2] */
/* checklist items now carry a result line under the label */
.tv .checks li b{display:block;font-weight:700;color:var(--ink);font-size:16.5px;line-height:1.5}
.tv .checks li small{display:block;font-weight:500;font-size:13.5px;color:var(--sub);margin-top:3px;line-height:1.55;letter-spacing:.01em}
.tv .checks li{align-items:flex-start!important;padding-top:15px!important;padding-bottom:15px!important}
.dark .tv .checks li b{color:#eaf3ef}
.dark .tv .checks li small{color:#8fb6ac}
/* technology track record */
.tv .trk{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:36px}
.tv .trk .tk{background:#fff;border:1px solid #e3efeb;border-radius:16px;padding:22px 18px;text-align:center;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.tv .trk .tk:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(22,78,72,.10)}
.tv .trk .tk .ic{width:42px;height:42px;margin:0 auto 14px;border-radius:12px;background:var(--mint);display:grid;place-items:center}
.tv .trk .tk b{display:block;font-size:16px;font-weight:700;color:var(--ink);letter-spacing:.01em}
.tv .trk .tk small{display:block;font-size:13.5px;color:var(--sub);margin-top:7px;line-height:1.65}
.dark .tv .trk .tk{background:#132420;border-color:#22413a}
.dark .tv .trk .tk b{color:#eaf3ef}
.dark .tv .trk .tk .ic{background:#16302a}
@media(max-width:1100px){.tv .trk{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.tv .trk{grid-template-columns:1fr;gap:12px}
 .tv .trk .tk{display:flex;align-items:center;gap:14px;text-align:left;padding:16px}
 .tv .trk .tk .ic{margin:0;flex:0 0 42px}}

/* [tv-feat-odd] */
/* an odd last card in a 2-up grid would sit alone — let it span the row */
@media(min-width:901px){
  .tv .split .featrow .feat:nth-child(odd):last-child{grid-column:1/-1}
}

/* [tv-hero-type] */
/* hero rhythm: 60 → 23 → 16px dropped away too fast, and the third line sat
   at body-caption size against a very large H1. Tighten the ladder. */
.tv .phero h1{margin-bottom:18px!important}
.tv .phero .sub{
  font-size:clamp(18px,2.4vw,25px)!important;font-weight:700!important;
  color:var(--teal-d)!important;letter-spacing:.01em!important;line-height:1.45!important;margin-bottom:10px!important}
.tv .phero .sub2{
  font-size:clamp(15px,1.45vw,18px)!important;font-weight:500!important;
  color:#4a6560!important;letter-spacing:.02em!important;line-height:1.7!important;max-width:34em}
.tv .phero .kick{margin-bottom:16px!important}
.dark .tv .phero .sub{color:#8fdccb!important}
.dark .tv .phero .sub2{color:#b3cec7!important}
@media(max-width:640px){
  .tv .phero .sub{font-size:18px!important}
  .tv .phero .sub2{font-size:15px!important}
}

/* [tv-home-hero] */
/* homepage hero used a different class set, so the earlier ladder fix missed it.
   The English line (17px) was smaller than the paragraph below it (18px) — the
   hierarchy inverted. */
.tv .phero .en{
  font-size:clamp(16px,1.7vw,21px)!important;font-weight:600!important;
  color:var(--teal)!important;letter-spacing:.14em!important;line-height:1.5!important;
  margin:0 0 18px!important}
.tv .phero .lead{
  font-size:clamp(15px,1.45vw,18px)!important;line-height:1.85!important;
  color:#4a6560!important;max-width:35em}
.tv .phero h1{margin-bottom:14px!important}
.dark .tv .phero .en{color:#6fcbb9!important}
.dark .tv .phero .lead{color:#b3cec7!important}
@media(max-width:640px){
  .tv .phero .en{font-size:16px!important;letter-spacing:.1em!important;margin-bottom:14px!important}
  .tv .phero .lead{font-size:15px!important}
}

/* [tv-hero-cta] */
/* three CTAs wrapped 2+1 on phones, leaving an orphan — stack them full width */
@media(max-width:640px){
  .tv .phero .btns{flex-direction:column;align-items:stretch;gap:10px}
  .tv .phero .btns .btn{width:100%;justify-content:center}
}
/* the kicker should break between segments, never mid-phrase */
.tv .phero .kick{text-wrap:balance}
.tv .phero .kick .seg{white-space:nowrap}

/* [tv-trkbar] */
/* a deliberately different treatment from the photo case cards, so the two
   kinds of proof don't read as the same thing */
.tv .trkbar{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  margin-top:26px;padding:20px 26px;border-radius:16px;
  background:var(--mint);border:1px dashed #b9dbd2}
.tv .trkbar p{margin:0;font-size:15px;line-height:1.7;color:var(--sub);flex:1 1 420px;min-width:0}
.tv .trkbar p b{color:var(--teal-d);font-weight:700}
.tv .trkbar a{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-height:44px;
  font-size:15px;font-weight:700;color:var(--teal-d);text-decoration:none;transition:gap .3s}
.tv .trkbar a:hover{gap:12px}
.dark .tv .trkbar{background:#16302a;border-color:#2f5e54}
.dark .tv .trkbar p b{color:#8fe0cc}
.dark .tv .trkbar a{color:#8fe0cc}
@media(max-width:640px){.tv .trkbar{padding:18px 18px;gap:12px}.tv .trkbar p{flex:1 1 100%}}

/* [tv-certlogos-center] */
/* seven logos always leave an orphan on the last row below desktop —
   centre it so it reads as intentional rather than broken */
.tv .certlogos{justify-content:center}

/* [tv-langsw] */
.tv-lang{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;padding:0 .5rem;border-radius:.5rem;font-size:.8125rem;font-weight:600;line-height:1;letter-spacing:.02em;white-space:nowrap;color:rgb(107 114 128);text-decoration:none;transition:color .2s,background-color .2s}
.tv-lang:hover{color:rgb(3 7 18);background:rgba(3,7,18,.05)}
.dark .tv-lang{color:rgb(156 163 175)}
.dark .tv-lang:hover{color:rgb(249 250 251);background:rgba(249,250,251,.08)}

/* [tv-solspec] */
/* tv-solspec-align */
body[class*="page-en"] .tv .cards .card:has(.solspec) .body h3{min-height:2.9em}
@media(max-width:900px){body[class*="page-en"] .tv .cards .card:has(.solspec) .body h3{min-height:0}}

.tv .cards .card .solspec{margin:16px 0 0;padding-top:15px;border-top:1px solid #e3efec;display:grid;grid-template-columns:max-content 1fr;column-gap:16px;row-gap:10px;align-items:baseline}
.tv .cards .card .solspec dt{margin:0;font-size:12.5px;line-height:1.5;color:var(--sub);white-space:nowrap}
.tv .cards .card .solspec dd{margin:0;font-size:14px;line-height:1.55;color:var(--ink)}
.tv .cards .card .solspec dd b{font-weight:650;color:var(--teal-d);font-variant-numeric:tabular-nums}
.tv .cards .card .solspec dd small{font-size:12.5px;color:var(--sub)}
.dark .tv .cards .card .solspec{border-top-color:rgba(255,255,255,.10)}
@media(max-width:430px){
.tv .cards .card .solspec{grid-template-columns:1fr;row-gap:3px}
.tv .cards .card .solspec dt{margin-top:9px}
.tv .cards .card .solspec dt:first-of-type{margin-top:0}
}

/* [tv-solicon] */
.tv .cards .card .solhead + .solspec{margin-top:4px}
.tv .cards .card .solhead{display:flex;align-items:flex-start;gap:14px}
.tv .cards .card .solicon{flex:none;width:52px;height:52px;border-radius:14px;background:var(--mint);display:flex;align-items:center;justify-content:center;color:var(--teal)}
.tv .cards .card .solicon svg{display:block;width:30px;height:30px}
.dark .tv .cards .card .solicon{background:rgba(79,184,166,.13)}
@media(max-width:430px){
.tv .cards .card .solicon{width:44px;height:44px;border-radius:12px}
.tv .cards .card .solicon svg{width:26px;height:26px}
}

/* [tv-solicon-anim] */
.tv .cards .card .solicon{transition:background-color .3s ease}
.tv .cards .card .solicon svg{transition:transform .3s cubic-bezier(.34,1.4,.64,1)}
.tv .cards .card:hover .solicon svg{transform:scale(1.08)}
.dark .tv .cards .card:hover .solicon{background:rgba(79,184,166,.2)}
.tv .cards .card:hover .solicon{background:#dcece7}
.tv .cards .card .solicon [data-tvdraw]{transition:stroke-dashoffset .7s cubic-bezier(.4,0,.2,1)}
.tv .cards .card .solicon [data-tvfade]{transition:opacity .35s ease}
@media(prefers-reduced-motion:reduce){
.tv .cards .card .solicon svg,
.tv .cards .card .solicon [data-tvdraw],
.tv .cards .card .solicon [data-tvfade]{transition:none !important}
}

/* [tv-solicon-motion] */
@keyframes tvMist{0%{transform:translate(0,0);opacity:0}18%{opacity:1}65%{opacity:.9}100%{transform:translate(6px,-7px);opacity:0}}
@keyframes tvWave{0%,100%{transform:translateX(-4.5px)}50%{transform:translateX(4.5px)}}
@keyframes tvPellet{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.tv .solicon .tv-mist{animation:tvMist 2.9s ease-out infinite}
.tv .solicon .tv-m2{animation-delay:.55s}
.tv .solicon .tv-m3{animation-delay:1.1s}
.tv .solicon .tv-wave{animation:tvWave 3.6s ease-in-out infinite}
.tv .solicon .tv-w2{animation-delay:.3s}
.tv .solicon .tv-w3{animation-delay:.6s}
.tv .solicon .tv-pellet{animation:tvPellet 2.5s ease-in-out infinite}
.tv .solicon .tv-p2{animation-delay:.42s}
.tv .solicon .tv-p3{animation-delay:.18s}
.tv .solicon .tv-p4{animation-delay:.62s}
.tv .solicon .tv-mist,.tv .solicon .tv-wave,.tv .solicon .tv-pellet{transform-box:fill-box;transform-origin:center;animation-play-state:paused}
.tv .solicon.tv-live .tv-mist,.tv .solicon.tv-live .tv-wave,.tv .solicon.tv-live .tv-pellet{animation-play-state:running}
@media(prefers-reduced-motion:reduce){
.tv .solicon .tv-mist,.tv .solicon .tv-wave,.tv .solicon .tv-pellet,
.tv .solicon.tv-live .tv-mist,.tv .solicon.tv-live .tv-wave,.tv .solicon.tv-live .tv-pellet{animation:none !important}
}

/* [tv-txcert] 紡織品檢驗與認證清單：寬螢幕改雙欄，避免右側大片空白 */
@media(min-width:900px){
  .tv .checks.txcert{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
}


/* [tv-matphoto] 鍍膜材料卡：右側放實拍照片，填滿原本的留白 */
.tv .matpanel.has-photo{display:grid;grid-template-columns:minmax(0,1fr) clamp(340px,40%,480px);column-gap:30px;align-items:start}
.tv .matpanel.has-photo > .mattag,
.tv .matpanel.has-photo > .matbody,
.tv .matpanel.has-photo > .chips{grid-column:1}
.tv .matpanel.has-photo > .mattag{justify-self:start}
.tv .matpanel.has-photo > .matphoto{grid-column:2;grid-row:1 / span 3;align-self:stretch;width:100%;height:100%;min-height:210px;object-fit:cover;border-radius:14px;display:block}
.tv .matpanel.has-photo .maticon{display:none}
@media(max-width:860px){
  .tv .matpanel.has-photo{grid-template-columns:minmax(0,1fr)}
  .tv .matpanel.has-photo > .matphoto{grid-column:1;grid-row:auto;height:auto;min-height:0;aspect-ratio:16/9;margin-top:18px}
}


/* [tv-scenephoto] 適用場域卡改放實拍照片 */
.tv .scenes .scene .artphoto{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;background:none;border:0}
