/* TenthCommerce storefront v2. Ink navy + saffron; system fonts (no web-font download); one square frame for every product photo. */
:root{--ink:#0d1b2a;--ink2:#16283d;--ink3:#22384f;--sun:#ffb81c;--sun2:#f2a500;--teal:#0b6e69;--teal2:#0a5a56;--bg:#f2f4f7;--card:#fff;--line:#dde3ea;--line2:#7d8a99;--line3:#c3ccd6;--muted:#566476;--text:#0f1722;--ok:#0a7a3a;--warn:#9a5200;--err:#b42318;--r:14px;--r-sm:10px;--shadow:0 1px 2px rgba(13,27,42,.06),0 6px 18px rgba(13,27,42,.07);--shadow-lg:0 18px 50px rgba(13,27,42,.22);--tab:64px;--safe:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:128px}
html.tn-locked{overflow:hidden}
body{margin:0;font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--teal);text-underline-offset:2px}
a:hover{color:var(--ink)}
h1,h2,h3{line-height:1.2;letter-spacing:-.015em;margin:0 0 .5rem}
p{margin:0 0 .75rem}
button,input,select,textarea{font:inherit;color:inherit}
main{display:block;min-height:60vh;outline:none}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 6px var(--sun);border-radius:4px}
.tn-header :focus-visible,.tn-hero :focus-visible,.tn-b2b :focus-visible,.tn-footer :focus-visible,.tn-toast :focus-visible,.tn-comparebar :focus-visible{outline-color:var(--sun);box-shadow:none}
.tn-sprite{position:absolute;width:0;height:0;overflow:hidden}
.tn-i{flex:none;vertical-align:middle}
.tn-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.tn-skip{position:absolute;left:-999px;top:8px;background:var(--sun);color:var(--ink);padding:.5rem 1rem;border-radius:8px;z-index:200;font-weight:700}
.tn-skip:focus{left:8px}
.tn-wrap{max-width:1360px;margin:0 auto;padding:0 20px}
[hidden]{display:none!important}

/* ---------- header ---------- */
.tn-header{position:sticky;top:0;z-index:60;background:var(--ink);color:#fff;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.tn-bar{max-width:1360px;margin:0 auto;padding:10px 20px;display:grid;grid-template-columns:auto auto 1fr auto;gap:16px;align-items:center}
.tn-iconbtn.tn-burger{display:none}
.tn-icontool>span{margin-left:6px}
.tn-brand{display:inline-flex;align-items:center;text-decoration:none;border-radius:8px}
.tn-logo{height:38px;width:auto;display:block}
.tn-iconbtn{display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer}
.tn-iconbtn:hover{background:rgba(127,127,127,.15)}
.tn-search{display:flex;height:48px;border-radius:12px;background:#fff;box-shadow:0 0 0 2px transparent;transition:box-shadow .15s;min-width:0;position:relative}
.tn-search:focus-within{box-shadow:0 0 0 3px var(--sun)}
.tn-search select{border:0;background:#e8edf2;color:var(--ink);padding:0 8px;font-size:.85rem;max-width:112px;border-right:1px solid var(--line);border-radius:12px 0 0 12px;cursor:pointer}
.tn-combo{flex:1;min-width:0;position:relative;display:flex}
.tn-search input{flex:1;min-width:0;border:0;padding:0 14px;color:var(--text);background:transparent;outline:none}
.tn-search>button{border:0;background:var(--sun);color:var(--ink);width:58px;cursor:pointer;display:grid;place-items:center;border-radius:0 12px 12px 0}
.tn-search>button:hover{background:var(--sun2)}
.tn-suggest{position:absolute;top:calc(100% + 8px);left:-1px;right:-58px;margin:0;padding:6px;list-style:none;background:#fff;color:var(--text);border-radius:12px;box-shadow:var(--shadow-lg);z-index:80;max-height:min(70vh,520px);overflow:auto}
.tn-sg{cursor:pointer}
.tn-sgrow{display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--text)}
.tn-sg[aria-selected=true] .tn-sgrow,.tn-sg:hover .tn-sgrow{background:#eef3f7}
.tn-sg-img{width:40px;height:40px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.tn-sg-img img{width:100%;height:100%;object-fit:contain}
.tn-sg span:not(.tn-sg-img){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tn-sg b{white-space:nowrap;font-size:.92rem}
.tn-sg small{color:var(--muted)}
.tn-sg-dept .tn-sgrow,.tn-sg-all .tn-sgrow{color:var(--teal);font-weight:600}
.tn-sg-dept .tn-i,.tn-sg-all .tn-i{justify-self:center}
.tn-tools{display:flex;gap:4px;align-items:center}
.tn-tool{color:#fff;text-decoration:none;padding:6px 10px;border-radius:10px;border:1px solid transparent;line-height:1.15;position:relative;display:flex;align-items:center;gap:6px}
.tn-tool:hover{border-color:rgba(255,255,255,.45);color:#fff}
.tn-tool small{display:block;font-size:.72rem;color:#b5c3d1}
.tn-tool b{font-size:.88rem}
.tn-tool>span{font-weight:700;font-size:.92rem}
.tn-count{position:absolute;left:24px;top:0;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--sun);color:var(--ink);font-size:.72rem;font-weight:800;display:grid;place-items:center;line-height:1}
.tn-depts{background:var(--ink2);border-top:1px solid rgba(255,255,255,.06)}
.tn-depts ul{max-width:1360px;margin:0 auto;padding:0 12px;list-style:none;display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;align-items:center}
.tn-depts ul::-webkit-scrollbar{display:none}
.tn-depts a,.tn-alldepts{display:flex;align-items:center;gap:6px;white-space:nowrap;color:#e3eaf2;text-decoration:none;font-size:.9rem;padding:9px 10px;border-radius:8px;border:0;background:none;cursor:pointer}
.tn-alldepts{font-weight:700;color:#fff}
.tn-depts a:hover,.tn-alldepts:hover{background:rgba(255,255,255,.1);color:#fff}
.tn-depts a[aria-current]{box-shadow:inset 0 -3px 0 var(--sun);color:#fff;font-weight:600}

/* mega menu */
.tn-menu{position:fixed;inset:0;z-index:90;background:rgba(8,15,24,.55);display:flex;justify-content:flex-start}
.tn-menu-inner{background:#fff;color:var(--text);width:min(1100px,100%);max-height:100%;overflow:auto;padding:18px 22px 28px;box-shadow:var(--shadow-lg);animation:tn-slide .18s ease-out}
@keyframes tn-slide{from{transform:translateX(-24px);opacity:.4}to{transform:none;opacity:1}}
.tn-menu-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.tn-menu-head h2{font-size:1.25rem;margin:0}
.tn-menu-grid{list-style:none;margin:0;padding:0;columns:3 260px;column-gap:28px}
.tn-menu-dept{break-inside:avoid;margin:0 0 18px}
.tn-menu-name{display:flex;justify-content:space-between;gap:8px;font-weight:800;color:var(--ink);text-decoration:none;padding:6px 0;border-bottom:2px solid var(--sun)}
.tn-menu-name span{color:var(--muted);font-weight:600;font-size:.85rem}
.tn-menu-dept ul{list-style:none;margin:6px 0 0;padding:0}
.tn-menu-dept li a{display:block;padding:4px 0;color:var(--text);text-decoration:none;font-size:.93rem}
.tn-menu-dept li a:hover{color:var(--teal);text-decoration:underline}

/* buttons */
.tn-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:44px;padding:.6rem 1.15rem;border-radius:999px;border:1px solid transparent;font-weight:700;text-decoration:none;cursor:pointer;background:var(--ink);color:#fff;transition:background .15s,transform .05s}
.tn-btn:active{transform:translateY(1px)}
.tn-btn:hover{color:#fff;background:var(--ink3)}
.tn-primary{background:var(--sun);color:var(--ink)}
.tn-primary:hover{background:var(--sun2);color:var(--ink)}
.tn-buy{background:var(--teal);color:#fff}
.tn-buy:hover{background:var(--teal2)}
.tn-ghost{background:#fff;color:var(--ink);border-color:var(--line2)}
.tn-ghost:hover{background:#eef2f6;color:var(--ink)}
.tn-onDark{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.tn-onDark:hover{background:rgba(255,255,255,.1);color:#fff}
.tn-btn[aria-disabled=true]{opacity:.4;pointer-events:none}
.tn-wide{width:100%}
.tn-linkbtn{background:none;border:0;padding:0;min-height:24px;color:var(--teal);text-decoration:underline;cursor:pointer;display:inline-flex;align-items:center;gap:4px;font-size:.92rem}
.tn-linkbtn:hover{color:var(--ink)}

/* hero */
.tn-hero{background:radial-gradient(1000px 420px at 90% -20%,rgba(255,184,28,.25),transparent 60%),linear-gradient(160deg,var(--ink) 0%,var(--ink2) 100%);color:#fff;padding:44px 0 80px}
.tn-herogrid{display:grid;grid-template-columns:1.3fr 1fr;gap:44px;align-items:center}
.tn-eyebrow{text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;font-weight:800;color:#8a5c00;margin-bottom:.5rem}
.tn-hero .tn-eyebrow,.tn-b2b .tn-eyebrow{color:var(--sun)}
.tn-hero h1{font-size:clamp(2rem,4.4vw,3.5rem);letter-spacing:-.03em;max-width:15ch}
.tn-lead{font-size:1.08rem;color:#d1dbe6;max-width:58ch}
.tn-herosearch{display:flex;gap:8px;margin:18px 0 10px;max-width:580px}
.tn-herosearch input{flex:1;min-width:0;height:50px;border-radius:999px;border:0;padding:0 20px;font-size:1rem;color:var(--text)}
.tn-herosearch input:focus{outline:3px solid var(--sun)}
.tn-404 .tn-herosearch{margin:20px auto}
.tn-404 .tn-herosearch input{border:1px solid var(--line2)}
.tn-quick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.9rem;color:#b5c3d1}
.tn-quick a{color:#fff;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:4px 12px;text-decoration:none}
.tn-quick a:hover{background:rgba(255,255,255,.2);color:#fff}
.tn-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.1rem}
.tn-steps{list-style:none;margin:0;padding:0;counter-reset:s;display:grid;gap:12px}
.tn-steps li{counter-increment:s;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);padding:14px 16px 14px 62px;position:relative}
.tn-steps li::before{content:counter(s);position:absolute;left:16px;top:14px;width:32px;height:32px;border-radius:50%;background:var(--sun);color:var(--ink);font-weight:800;display:grid;place-items:center}
.tn-steps b{display:block}
.tn-steps span{color:#c4d0dc;font-size:.92rem}
.tn-trust{list-style:none;margin:-44px 0 8px;padding:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background:#fff;border-radius:var(--r);box-shadow:var(--shadow);position:relative}
.tn-trust li{display:flex;gap:12px;padding:8px 12px;align-items:flex-start}
.tn-trust .tn-i{color:var(--teal);margin-top:2px}
.tn-trust b{display:block;font-size:.95rem}
.tn-trust span{font-size:.85rem;color:var(--muted)}

/* shelves, tiles, cards */
.tn-shelf{margin:34px 0}
.tn-shead{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.tn-shead h2{font-size:1.4rem;margin:0}
.tn-shead a{font-weight:600;white-space:nowrap}
.tn-tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
.tn-tile{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px;text-decoration:none;color:var(--text);transition:transform .15s,box-shadow .15s}
.tn-tile:hover{transform:translateY(-2px);box-shadow:var(--shadow);color:var(--text)}
.tn-timg{aspect-ratio:1;display:block;position:relative;background:#fff;border-radius:8px;margin-bottom:10px;overflow:hidden}
.tn-timg img,.tn-timg .tn-noimg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.tn-tile b{font-size:.96rem;line-height:1.25}
.tn-tile small{color:var(--muted)}
.tn-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(206px,230px);gap:12px;overflow-x:auto;padding:2px 2px 14px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
.tn-rail>*{scroll-snap-align:start}
.tn-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:box-shadow .15s,border-color .15s;position:relative}
.tn-card:hover{box-shadow:var(--shadow);border-color:var(--line3)}
.tn-cmedia{display:block;aspect-ratio:1;background:#fff;position:relative;border-bottom:1px solid #edf0f3}
.tn-cmedia img,.tn-cmedia .tn-noimg{position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px);object-fit:contain;display:block}
.tn-noimg{display:block;border-radius:8px;background:linear-gradient(135deg,#eef2f6 25%,#e4e9ef 25% 50%,#eef2f6 50% 75%,#e4e9ef 75%) 0 0/24px 24px}
.tn-badge{position:absolute;top:10px;left:10px;z-index:2;background:#eaf2ff;color:#1d4ed8;border:1px solid #bcd3fb;border-radius:999px;padding:2px 9px;font-size:.72rem;font-weight:800;letter-spacing:.02em}
.tn-badge-inline{position:static;display:inline-block;margin-left:6px;vertical-align:middle;text-transform:none;letter-spacing:0}
.tn-save{position:absolute;top:8px;right:8px;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.95);color:var(--muted);display:grid;place-items:center;cursor:pointer;z-index:2}
.tn-save:hover,.tn-save.tn-on{color:#c62828;border-color:#f3c1c1}
.tn-cbody{display:flex;flex-direction:column;gap:3px;padding:12px 14px 14px;flex:1}
.tn-cbrand{font-size:.76rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0}
.tn-cbrand a{color:inherit}
.tn-card h3{font-size:.94rem;font-weight:600;margin:0 0 4px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:3.6em;line-height:1.2}
.tn-card h3 a{color:var(--text);text-decoration:none}
.tn-card h3 a:hover{color:var(--teal);text-decoration:underline}
.tn-price{font-size:1.32rem;font-weight:800;color:var(--ink);margin:0;letter-spacing:-.01em}
.tn-price-lg{font-size:2.1rem;margin:0}
.tn-exvat{font-size:.8rem;color:var(--muted);margin:0}
.tn-stock{font-size:.85rem;font-weight:700;margin:2px 0 0;display:flex;align-items:center;gap:6px}
.tn-stock::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}
.tn-in-stock{color:var(--ok)}
.tn-limited{color:var(--warn)}
.tn-on-order{color:var(--muted)}
.tn-cactions{margin-top:auto;padding-top:10px;display:flex;flex-direction:column;gap:6px}
.tn-add{background:var(--sun);color:var(--ink);min-height:42px;font-size:.92rem;width:100%}
.tn-add:hover{background:var(--sun2);color:var(--ink)}
.tn-cmp{display:inline-flex;align-items:center;gap:6px;font-size:.84rem;color:var(--muted);cursor:pointer;align-self:flex-start;min-height:28px}
.tn-cmp input{width:16px;height:16px;accent-color:var(--teal)}
.tn-comparebar{position:fixed;left:50%;bottom:calc(16px + var(--safe));transform:translateX(-50%);z-index:55;background:var(--ink);color:#fff;border-radius:999px;padding:8px 8px 8px 18px;display:flex;gap:12px;align-items:center;box-shadow:var(--shadow-lg);font-size:.92rem}
.tn-comparebar .tn-btn{min-height:38px;padding:.4rem 1rem}
.tn-comparebar .tn-linkbtn{color:#cfe0ee;margin-right:10px}

/* listing */
.tn-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:16px 0 4px;margin:0;font-size:.86rem;color:var(--muted)}
.tn-crumbs li+li::before{content:"›";margin-right:6px}
.tn-crumbs span{color:var(--text)}
.tn-listhead h1{font-size:clamp(1.6rem,3vw,2.2rem);margin-top:6px}
.tn-listhead p{color:var(--muted);max-width:75ch}
.tn-listing{display:grid;grid-template-columns:268px 1fr;gap:24px;align-items:start;margin:12px 0 40px}
.tn-filters{position:sticky;top:128px;max-height:calc(100vh - 140px);overflow:auto;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;overscroll-behavior:contain}
.tn-fhead{display:flex;justify-content:space-between;align-items:center}
.tn-fhead h2{font-size:1.08rem;margin:0}
.tn-fclose,.tn-fapply,.tn-fopen{display:none}
.tn-f{display:flex;flex-direction:column;gap:4px;margin:12px 0;border:0;padding:0;min-width:0}
.tn-f label,.tn-f legend{font-size:.85rem;font-weight:700;padding:0}
.tn-f input,.tn-f select,.tn-f textarea{padding:9px 10px;border:1px solid var(--line2);border-radius:var(--r-sm);background:#fff;color:var(--text);width:100%}
.tn-facet{border-top:1px solid var(--line);padding:8px 0}
.tn-facet summary{font-weight:800;font-size:.92rem;cursor:pointer;padding:6px 0;list-style:none;display:flex;justify-content:space-between}
.tn-facet summary::-webkit-details-marker{display:none}
.tn-facet summary::after{content:"+";color:var(--muted);font-weight:600}
.tn-facet[open] summary::after{content:"–"}
.tn-facet ul{list-style:none;margin:0;padding:0}
.tn-check{display:flex;gap:8px;align-items:center;font-size:.9rem;padding:4px 0;cursor:pointer;min-height:32px}
.tn-check input{width:18px;height:18px;accent-color:var(--teal);flex:none}
.tn-check span{flex:1}
.tn-check small{color:var(--muted);font-variant-numeric:tabular-nums}
.tn-zero{opacity:.45}
.tn-price-f{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;border-top:1px solid var(--line);padding-top:10px}
.tn-price-f legend{grid-column:1/-1;margin-bottom:4px;float:left;width:100%}
.tn-resbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.tn-resbar p{margin:0;color:var(--muted)}
.tn-sort{flex-direction:row;align-items:center;gap:8px;margin:0}
.tn-sort select{width:auto}
.tn-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;align-items:center}
.tn-chip{display:inline-flex;align-items:center;gap:6px;background:#e6f2f1;color:var(--teal2);border:1px solid #bfe0dd;border-radius:999px;padding:5px 10px 5px 12px;font-size:.86rem;font-weight:600;cursor:pointer}
.tn-chip:hover{background:#d4ebe9}
.tn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.tn-empty{background:#fff;border:1px dashed var(--line2);border-radius:var(--r);padding:28px;text-align:center}
.tn-pager{display:flex;justify-content:center;align-items:center;gap:16px;margin:24px 0}

/* product page */
.tn-product{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr) 320px;gap:28px;align-items:start;margin:12px 0 28px}
.tn-pmedia{background:#fff;border:1px solid var(--line);border-radius:var(--r);aspect-ratio:1;position:sticky;top:128px;overflow:hidden}
.tn-zoom{all:unset;position:absolute;inset:0;cursor:zoom-in}
.tn-zoom:focus-visible{outline:3px solid var(--sun);outline-offset:-3px}
.tn-pmedia img,.tn-pmedia .tn-noimg{position:absolute;inset:24px;width:calc(100% - 48px);height:calc(100% - 48px);object-fit:contain}
.tn-pinfo h1{font-size:clamp(1.35rem,2.4vw,1.9rem)}
.tn-code{font-size:.88rem;color:var(--muted);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tn-code code{background:#eef2f6;border-radius:6px;padding:2px 8px;color:var(--text);font-size:.9rem}
.tn-highlights{padding-left:1.1rem;margin:12px 0}
.tn-highlights li{margin-bottom:5px}
.tn-more{font-weight:600}
.tn-buybox{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;display:flex;flex-direction:column;gap:10px;position:sticky;top:128px;box-shadow:var(--shadow)}
.tn-fine{font-size:.85rem;color:var(--muted);margin:0}
.tn-qtyrow{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:600}
.tn-stepper{display:inline-flex;align-items:stretch;border:1px solid var(--line2);border-radius:999px;overflow:hidden;background:#fff;height:40px}
.tn-stepper button{width:40px;border:0;background:#f1f4f7;font-size:1.2rem;cursor:pointer;color:var(--ink)}
.tn-stepper button:hover{background:#e3e9ef}
.tn-stepper input{width:48px;border:0;text-align:center;font-weight:700;-moz-appearance:textfield;appearance:textfield}
.tn-stepper input::-webkit-inner-spin-button,.tn-stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.tn-pactions{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;padding-top:4px}
.tn-pactions [data-save].tn-on{color:#c62828}
.tn-bulk{font-size:.88rem;margin:0;background:#fff8e6;border:1px solid #f6dc9b;border-radius:var(--r-sm);padding:8px 10px}
.tn-assure{list-style:none;padding:12px 0 0;margin:2px 0 0;border-top:1px solid var(--line);font-size:.86rem;display:grid;gap:6px}
.tn-assure li::before{content:"✓";color:var(--ok);font-weight:800;margin-right:6px}
.tn-specs{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 24px;margin-bottom:24px}
.tn-specs dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px 24px;margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.tn-specs dt{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.tn-specs dd{margin:0;font-weight:600}
.tn-specs ul{columns:2 320px;column-gap:32px;margin:0;padding-left:1.1rem}
.tn-specs li{break-inside:avoid;margin-bottom:6px}
.tn-buybar{display:none}
.tn-lightbox{border:0;border-radius:var(--r);padding:16px;max-width:min(92vw,1000px);max-height:92vh;box-shadow:var(--shadow-lg)}
.tn-lightbox::backdrop{background:rgba(8,15,24,.75)}
.tn-lightbox img{display:block;width:min(86vw,920px);height:auto;max-height:84vh;object-fit:contain}
.tn-lightbox .tn-iconbtn{position:absolute;top:8px;right:8px;background:#fff}

/* app pages */
.tn-page{padding-top:26px;padding-bottom:48px}
.tn-page>h1{font-size:clamp(1.6rem,3vw,2.2rem)}
.tn-sub{color:var(--muted);max-width:70ch}
.tn-loading{color:var(--muted)}
.tn-legal{max-width:880px}
.tn-legal h2{font-size:1.2rem;margin-top:1.6rem}
.tn-howto{padding-left:1.2rem}
.tn-howto h2{font-size:1.1rem;margin-top:1.2rem}
.tn-featurelist{list-style:none;padding:0;margin:20px 0;display:grid;gap:14px}
.tn-featurelist li{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}
.tn-featurelist .tn-i{color:var(--teal);margin-top:2px}
.tn-featurelist h2{font-size:1.05rem;margin:0 0 4px}
.tn-featurelist p{margin:0}
.tn-compact li{padding:12px 14px}
.tn-cartwrap{display:grid;grid-template-columns:1fr 340px;gap:24px;align-items:start}
.tn-cartlist{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:4px 20px}
.tn-cartrow{display:grid;grid-template-columns:104px 1fr auto;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.tn-cartrow:last-child{border-bottom:0}
.tn-thumb{display:block;position:relative;aspect-ratio:1;background:#fff;border:1px solid #edf0f3;border-radius:var(--r-sm);overflow:hidden}
.tn-thumb img,.tn-thumb .tn-noimg{position:absolute;inset:6px;width:calc(100% - 12px);height:calc(100% - 12px);object-fit:contain}
.tn-cartinfo h3{font-size:1rem;margin-bottom:2px}
.tn-cartinfo h3 a{color:var(--text);text-decoration:none}
.tn-cartinfo h3 a:hover{text-decoration:underline}
.tn-cartinfo .tn-code{font-size:.82rem;margin:0}
.tn-cartctl{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;margin-top:8px}
.tn-cartctl .tn-stepper{height:36px}
.tn-cartctl .tn-stepper button{width:34px}
.tn-cartctl .tn-stepper input{width:42px}
.tn-lineprice{text-align:right}
.tn-lineprice b{display:block;font-size:1.12rem}
.tn-lineprice small{color:var(--muted)}
.tn-summary{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px;display:flex;flex-direction:column;gap:10px;position:sticky;top:128px}
.tn-summary h2{font-size:1.15rem;margin:0}
.tn-totals{margin:0;display:grid;gap:6px}
.tn-totals div{display:flex;justify-content:space-between;gap:12px;font-size:.92rem}
.tn-totals dd{margin:0;font-weight:600;text-align:right}
.tn-totals .tn-grand{border-top:1px solid var(--line);padding-top:8px;font-size:1.1rem;font-weight:800}
.tn-totals .tn-grand dd{font-weight:800}
.tn-emptycart{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:36px;grid-column:1/-1;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.tn-emptycart .tn-i{color:var(--line2)}
.tn-notice{grid-column:1/-1;background:#fff7e6;border:1px solid #f3d08a;border-radius:var(--r-sm);padding:10px 14px}
.tn-savedbar{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 16px}
.tn-sharenote{background:#e6f2f1;border:1px solid #bfe0dd;border-radius:var(--r);padding:14px 16px;margin-bottom:16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.tn-sharenote p{margin:0}
.tn-cmpscroll{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.tn-cmptable{border-collapse:collapse;width:100%;min-width:640px;table-layout:fixed}
.tn-cmptable th,.tn-cmptable td{border-bottom:1px solid var(--line);padding:12px 14px;text-align:left;vertical-align:top;font-size:.92rem}
.tn-cmptable thead th,.tn-cmptable thead td{width:auto}
.tn-cmptable thead td:first-child,.tn-cmptable tbody th{width:160px;color:var(--muted);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;background:#fafbfc}
.tn-cmptable .tn-thumb{width:120px;margin-bottom:8px}
.tn-cmpname{font-weight:600;margin-bottom:6px}
.tn-cmpname a{color:var(--text)}
.tn-cmptable ul{margin:0;padding-left:1rem}
.tn-toast{min-width:min(92vw,360px);justify-content:space-between;position:fixed;left:50%;bottom:calc(20px + var(--safe));transform:translate(-50%,160%);background:var(--ink);color:#fff;padding:12px 16px;border-radius:12px;display:flex;gap:14px;align-items:center;box-shadow:var(--shadow-lg);transition:transform .25s,opacity .25s,visibility .25s;z-index:70;max-width:calc(100vw - 24px);opacity:0;visibility:hidden}
.tn-toast.tn-show{transform:translate(-50%,0);opacity:1;visibility:visible}
.tn-toast a{color:var(--sun);font-weight:700;white-space:nowrap}
.tn-contact{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start}
.tn-form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}
.tn-status{margin:10px 0 0;font-weight:600}
.tn-ok{color:var(--ok)}
.tn-error,.tc-error{color:var(--err)}
.tn-404{text-align:center;max-width:680px}
.tn-b2b{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;align-items:center;background:linear-gradient(135deg,var(--ink),var(--ink3));color:#fff;border-radius:20px;padding:34px;margin:36px 0}
.tn-b2b h2{font-size:clamp(1.4rem,2.6vw,2rem)}
.tn-b2b p{color:#d1dbe6}
.tn-b2b ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tn-b2b li{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px 14px}
.tn-b2b .tn-i{color:var(--sun)}

/* checkout */
.tn-costeps{list-style:none;display:flex;gap:6px;padding:0;margin:0 0 18px;counter-reset:c;flex-wrap:wrap}
.tn-costeps li{counter-increment:c;display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--muted);padding-right:18px}
.tn-costeps li::before{content:counter(c);width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#e3e8ee;font-weight:800;font-size:.8rem}
.tn-costeps li[aria-current]{color:var(--text);font-weight:700}
.tn-costeps li[aria-current]::before{background:var(--sun);color:var(--ink)}
.tn-costeps li.tn-done::before{content:"✓";background:var(--ok);color:#fff}
.tc-checkout{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
.tc-coform{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:22px}
.tc-coform fieldset{border:0;padding:0;margin:0 0 18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tc-coform legend{font-size:1.1rem;font-weight:800;margin-bottom:10px}
.tn-cobiz{border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 14px;margin:0 0 18px;background:#fafbfc}
.tn-cobiz summary{cursor:pointer;font-weight:700;color:var(--teal)}
.tn-cobiz fieldset{margin:12px 0 4px}
.tc-f{display:flex;flex-direction:column;gap:4px}
.tc-f label{font-size:.85rem;font-weight:700}
.tc-f input,.tc-f select,.tc-f textarea{padding:11px;border:1px solid var(--line2);border-radius:var(--r-sm);width:100%;background:#fff}
.tc-f [aria-invalid=true],.tn-f [aria-invalid=true],.tc-f input:user-invalid,.tc-f select:user-invalid,.tn-f input:user-invalid,.tn-f textarea:user-invalid{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
.tc-wide{grid-column:1/-1}
.tc-ferr{color:var(--err);font-size:.84rem;font-weight:600;margin:2px 0 0}
.tc-errsum{background:#fdecea;border:1px solid #f3b7b0;border-radius:var(--r-sm);padding:12px 14px;margin:0 0 16px}
.tc-errsum h2{font-size:1rem;margin:0 0 6px;color:var(--err)}
.tc-errsum ul{margin:0;padding-left:1.1rem}
.tn-storagewarn{background:#fff7e6;border-bottom:1px solid #f3d08a;padding:8px 16px;text-align:center;font-size:.9rem}
.tc-check{display:block;position:relative;padding-left:30px;font-size:.92rem;margin:6px 0 14px}
.tc-check input{position:absolute;left:0;top:3px;width:18px;height:18px;margin:0;accent-color:var(--teal)}
.tc-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.tc-place{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:.6rem 1.8rem;border-radius:999px;border:0;background:var(--sun);color:var(--ink);font-weight:800;cursor:pointer;width:100%;max-width:340px}
.tc-place:hover{background:var(--sun2)}
.tc-place:disabled{opacity:.6;cursor:progress}
.tc-status{margin:10px 0 0;font-weight:600;scroll-margin-top:160px}
.tc-side{display:grid;gap:16px;position:sticky;top:128px}
.tc-summary,.tc-trust{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:18px}
.tc-summary h2,.tc-trust h2{font-size:1.1rem}
.tc-sumrow{display:flex;justify-content:space-between;gap:12px;font-size:.92rem;padding:7px 0;border-bottom:1px solid #eef1f4}
.tc-sumrow b{white-space:nowrap}
.tc-total{font-weight:800;font-size:1.15rem;margin:10px 0 4px}
.tc-trust ul{padding-left:1.1rem;margin:0;font-size:.92rem}
.tc-trust li{margin-bottom:6px}
.tc-done{grid-column:1/-1;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px}
.tc-ref b{font-size:1.25rem;letter-spacing:.02em}

/* quotation (screen + print) */
.tn-quotebar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.tn-quote{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:32px;max-width:960px}
.tn-qhead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;border-bottom:3px solid var(--sun);padding-bottom:16px;margin-bottom:18px}
.tn-qlogo svg{height:40px;width:auto}
.tn-qmeta h2{font-size:1.6rem;margin:0 0 6px;text-align:right}
.tn-qmeta dl{margin:0;display:grid;gap:2px;font-size:.9rem}
.tn-qmeta dl div{display:flex;gap:10px;justify-content:flex-end}
.tn-qmeta dt{color:var(--muted)}
.tn-qmeta dd{margin:0;font-weight:700}
.tn-qparties{display:grid;grid-template-columns:1fr 1.4fr;gap:24px;margin-bottom:18px}
.tn-qparties h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.tn-qfields{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}
.tn-qfields label{display:flex;flex-direction:column;font-size:.78rem;color:var(--muted);font-weight:700}
.tn-qfields input{border:0;border-bottom:1px solid var(--line2);padding:4px 0;font-size:.95rem;color:var(--text);background:transparent;border-radius:0}
.tn-qscroll{overflow-x:auto}
.tn-qtable{width:100%;min-width:560px;border-collapse:collapse;font-size:.92rem}
.tn-qtable th,.tn-qtable td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tn-qtable thead th{background:var(--ink);color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.04em}
.tn-qtable .tn-num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tn-qtable tfoot th{text-align:right;font-weight:600}
.tn-qtable tfoot .tn-grand th,.tn-qtable tfoot .tn-grand td{font-weight:800;font-size:1.05rem;border-top:2px solid var(--ink)}
.tn-qnotes{margin-top:18px;font-size:.84rem;color:var(--muted)}

/* footer */
.tn-footer{background:var(--ink);color:#c4d0dc;margin-top:48px;padding:40px 0 20px}
.tn-fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px}
.tn-footer h2{font-size:.95rem;color:#fff;margin-bottom:10px}
.tn-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.tn-footer a{color:#e3eaf2;text-decoration:none;font-size:.92rem}
.tn-footer a:hover{color:var(--sun);text-decoration:underline}
.tn-footer p{font-size:.9rem;margin-top:12px}
.tn-legal-row{border-top:1px solid rgba(255,255,255,.12);margin-top:28px;padding-top:16px;font-size:.82rem}
.tn-tabbar{display:none}

/* ---------- responsive ---------- */
@media (max-width:1360px){.tn-hide-md{display:none}}
@media (max-width:1180px){.tn-product{grid-template-columns:1fr 1fr}.tn-buybox{grid-column:2;position:static}.tn-pinfo{grid-column:2;grid-row:1}.tn-pmedia{grid-row:1/3}}
@media (max-width:900px){
 html{scroll-padding-top:120px}
 body{padding-bottom:calc(var(--tab) + var(--safe))}
 .tn-bar{grid-template-columns:auto auto 1fr auto;gap:6px;padding:8px 12px}
 .tn-iconbtn.tn-burger{display:inline-grid}
 .tn-search{grid-column:1/-1;grid-row:2;height:44px}
 .tn-hide-sm{display:none}
 .tn-tools{justify-self:end}
 .tn-depts{display:none}
 .tn-tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:65;background:#fff;border-top:1px solid var(--line);padding-bottom:var(--safe);box-shadow:0 -4px 16px rgba(13,27,42,.08)}
 .tn-tabbar a,.tn-tabbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:var(--tab);color:var(--muted);text-decoration:none;font-size:.7rem;font-weight:600;border:0;background:none;position:relative;cursor:pointer}
 .tn-tabbar [aria-current]{color:var(--ink)}
 .tn-tabbar [aria-current] .tn-i{color:var(--teal)}
 .tn-tabbar .tn-count{left:calc(50% + 4px);top:6px}
 .tn-menu-inner{width:min(420px,92vw)}
 .tn-menu-grid{columns:1}
 .tn-herogrid{grid-template-columns:1fr}.tn-steps{display:none}.tn-trust{grid-template-columns:1fr 1fr}
 .tn-b2b{grid-template-columns:1fr;padding:24px}
 .tn-listing{grid-template-columns:1fr}
 .tn-fopen{display:inline-flex}
 .tn-fopen b{background:var(--sun);color:var(--ink);border-radius:999px;min-width:20px;height:20px;display:inline-grid;place-items:center;font-size:.75rem;padding:0 5px}
 .tn-filters{position:fixed;inset:0;z-index:95;max-height:none;border-radius:0;border:0;padding:0;display:none;flex-direction:column}
 .tn-filters.tn-open{display:flex}
 .tn-fhead{padding:12px 16px;border-bottom:1px solid var(--line)}
 .tn-filters form{flex:1;overflow:auto;padding:0 16px}
 .tn-fclose{display:inline-grid}
 .tn-fapply{display:flex;gap:10px;padding:12px 16px calc(12px + var(--safe));border-top:1px solid var(--line);background:#fff}
 .tn-fapply .tn-btn{flex:1}
 .tn-resbar p{order:3;width:100%}
 .tn-cartwrap,.tc-checkout,.tn-contact{grid-template-columns:1fr}.tn-summary,.tc-side{position:static}.tc-side{order:-1}
 .tn-fgrid{grid-template-columns:1fr 1fr}
 .tn-buybar{display:flex;position:fixed;left:0;right:0;bottom:calc(var(--tab) + var(--safe));z-index:58;background:#fff;border-top:1px solid var(--line);padding:10px 14px;gap:12px;align-items:center;justify-content:space-between;box-shadow:0 -4px 16px rgba(13,27,42,.08);transform:translateY(120%);visibility:hidden;transition:transform .2s,visibility .2s}
 .tn-buybar.tn-show{transform:none;visibility:visible}
 .tn-buybar b{display:block;font-size:1.15rem}
 .tn-buybar small{color:var(--muted)}
 .tn-toast,.tn-comparebar{bottom:calc(var(--tab) + 12px + var(--safe))}
 body.tn-has-cmp{padding-bottom:calc(var(--tab) + 76px + var(--safe))}
 html.tn-cmp-on{scroll-padding-bottom:calc(var(--tab) + 80px)}
 body.tn-has-cmp .tn-toast{bottom:calc(var(--tab) + 70px + var(--safe))}
 body.tn-has-cmp .tn-buybar{bottom:calc(var(--tab) + 58px + var(--safe))}
 .tn-qparties{grid-template-columns:1fr}
}
@media (max-width:640px){
 html{scroll-padding-top:116px}
 .tn-wrap{padding:0 12px}.tn-logo{height:30px}.tn-search select{display:none}
 .tn-hero{padding:26px 0 62px}.tn-trust{grid-template-columns:1fr;margin-top:-40px}
 .tn-herosearch{flex-direction:column}.tn-herosearch input{flex:none;width:100%}.tn-herosearch .tn-btn{width:100%}
 .tn-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tn-cbody{padding:10px}.tn-price{font-size:1.1rem}.tn-card h3{font-size:.88rem}
 .tn-rail{grid-auto-columns:minmax(164px,46%)}
 .tn-tiles{grid-template-columns:repeat(2,1fr)}
 .tn-product{grid-template-columns:1fr}.tn-pmedia,.tn-pinfo,.tn-buybox{grid-column:auto;grid-row:auto;position:static}.tn-pmedia{position:relative;top:auto}
 .tn-cartrow{grid-template-columns:80px 1fr}.tn-lineprice{grid-column:2;text-align:left}
 .tc-coform{padding:16px}.tc-coform fieldset,.tn-qfields{grid-template-columns:1fr}
 .tn-fgrid{grid-template-columns:1fr}
 .tn-quote{padding:18px}.tn-qhead{flex-direction:column}.tn-qmeta h2{text-align:left}.tn-qmeta dl div{justify-content:flex-start}
 .tn-comparebar{left:12px;right:12px;transform:none;justify-content:space-between;padding:6px 6px 6px 14px;font-size:.84rem}.tn-comparebar .tn-btn{min-height:34px;padding:.3rem .8rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media print{
 .tn-header,.tn-footer,.tn-tabbar,.tn-noprint,.tn-toast,.tn-comparebar,.tn-skip,.tn-menu,.tn-buybar{display:none!important}
 body{background:#fff;padding:0;font-size:12px}
 .tn-page{padding:0}.tn-wrap{max-width:none;padding:0}
 .tn-quote{border:0;padding:0;max-width:none}
 .tn-qfields input{border:0}
 .tn-qtable thead th{background:#fff!important;color:#000;border-bottom:2px solid #000}
 a{color:inherit;text-decoration:none}
 @page{margin:14mm}
}