/* Growing Automation — category, manufacturer and market hub pages.
   Loaded AFTER the shared site stylesheets; every class is prefixed tx- so it can
   never collide with the site theme. Matches the premium product page. */
.tx{
  --tx-navy:#0b1520;--tx-navy-2:#142033;--tx-navy-3:#1c2d46;--tx-blue:#0057a8;--tx-amber:#f5a623;--tx-amber-2:#ffc266;
  --tx-ink:#0b1520;--tx-muted:#4d6783;--tx-line:#dce4ef;--tx-bg:#f4f7fb;--tx-card:#fff;
  --tx-ease:cubic-bezier(.23,1,.32,1);
  --tx-font:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,system-ui,sans-serif;
  --tx-mono:ui-monospace,"SF Mono","Cascadia Mono",Consolas,monospace;
  font:16px/1.6 var(--tx-font);color:var(--tx-ink);background:var(--tx-bg);-webkit-font-smoothing:antialiased;
}
.tx,.tx *{box-sizing:border-box}
.tx img{max-width:100%;display:block}
.tx :focus-visible{outline:3px solid var(--tx-amber);outline-offset:3px;border-radius:6px}
.tx-wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto}
.tx-skip{position:absolute;left:12px;top:0;transform:translateY(-250%);background:#fff;color:#000;padding:10px 14px;border-radius:8px;z-index:100}
.tx-skip:focus{transform:none;top:8px}

/* ---------- hero ---------- */
.tx-hero{position:relative;overflow:hidden;color:#fff;padding:30px 0 84px;
  background:radial-gradient(1100px 480px at 80% -10%,#1d4f8f55,transparent 60%),radial-gradient(700px 360px at 0% 100%,#f5a62312,transparent 60%),linear-gradient(180deg,var(--tx-navy),var(--tx-navy-2))}
.tx-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse at 70% 20%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 70% 20%,#000,transparent 70%);pointer-events:none}
.tx-crumbs{position:relative;display:flex;flex-wrap:wrap;gap:6px;font-size:.84rem;color:#8fa3bc;margin-bottom:30px}
.tx-crumbs a{color:#b8c8dd;text-decoration:none}.tx-crumbs a:hover{color:#fff}
.tx-crumbs span[aria-hidden]{opacity:.5}
.tx-eyebrow{position:relative;display:inline-flex;align-items:center;gap:8px;color:var(--tx-amber);font-weight:800;letter-spacing:.14em;font-size:.78rem;text-transform:uppercase}
.tx-eyebrow::before{content:"";width:22px;height:2px;background:var(--tx-amber);border-radius:2px}
.tx h1{position:relative;margin:14px 0 16px;font-size:clamp(2rem,4.2vw,3.4rem);line-height:1.05;letter-spacing:-.025em;font-weight:800;color:#fff;text-wrap:balance;max-width:20ch}
.tx-lead{position:relative;color:#b9c9dd;font-size:1.06rem;max-width:62ch;margin:0 0 26px}
.tx-stats{position:relative;display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px;padding:0;list-style:none}
.tx-stat{padding:8px 15px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);color:#dbe6f4;font-size:.88rem;font-weight:600}
.tx-stat b{color:#fff}

/* search */
.tx-search{position:relative;display:flex;gap:10px;max-width:640px;padding:8px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.tx-search input{flex:1;min-width:0;height:50px;border:0;border-radius:12px;padding:0 16px;font:500 1rem var(--tx-font);background:#fff;color:var(--tx-ink)}
.tx-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:12px;border:1px solid transparent;font:800 .98rem var(--tx-font);text-decoration:none;cursor:pointer;transition:transform .16s var(--tx-ease),box-shadow .2s,background-color .15s}
.tx-btn:active{transform:scale(.97)}
.tx-btn.is-amber{background:linear-gradient(180deg,#ffb73d,var(--tx-amber));color:#1a1206;box-shadow:0 10px 28px -10px #f5a62399}
.tx-btn.is-ghost{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.2);color:#fff}
@media (hover:hover) and (pointer:fine){.tx-btn.is-amber:hover{background:linear-gradient(180deg,#ffc266,#f5a623)}.tx-btn.is-ghost:hover{background:rgba(255,255,255,.14)}}

/* ---------- body ---------- */
.tx-main{padding:0 0 88px}
.tx-chipbar{position:relative;z-index:2;margin-top:-34px;padding:16px 20px;background:var(--tx-card);border:1px solid var(--tx-line);border-radius:20px;box-shadow:0 30px 60px -44px rgba(11,21,32,.4);display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center}
.tx-chipbar strong{font-size:.82rem;text-transform:uppercase;letter-spacing:.1em;color:var(--tx-muted);margin-right:6px}
.tx-chip{padding:7px 14px;border-radius:999px;border:1px solid var(--tx-line);background:#fff;color:var(--tx-ink);font-weight:600;font-size:.88rem;text-decoration:none;transition:background-color .15s,border-color .15s,transform .15s var(--tx-ease)}
.tx-chip:active{transform:scale(.97)}
.tx-chip.is-on{background:var(--tx-navy);border-color:var(--tx-navy);color:#fff}
@media (hover:hover){.tx-chip:hover{border-color:#9db4d1;background:#f2f6fb}.tx-chip.is-on:hover{background:var(--tx-navy-3)}}

.tx-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin:44px 0 18px}
.tx-head h2{margin:0;font-size:1.35rem;letter-spacing:-.01em;color:var(--tx-ink)}
.tx-head span{color:var(--tx-muted);font-size:.92rem}
.tx-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tx-card{display:flex;flex-direction:column;background:var(--tx-card);border:1px solid var(--tx-line);border-radius:20px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .22s var(--tx-ease),box-shadow .22s var(--tx-ease),border-color .2s}
.tx-card:active{transform:scale(.985)}
.tx-ph{position:relative;aspect-ratio:4/3;background:radial-gradient(circle at 50% 40%,#fff,#eef3f9)}
.tx-ph img{position:absolute;inset:12%;width:76%;height:76%;max-width:none;object-fit:contain;mix-blend-mode:multiply}
.tx-ph.is-tile img{inset:29%;width:42%;height:42%;opacity:.85;mix-blend-mode:normal}
.tx-brandtag{position:absolute;left:12px;top:12px;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--tx-navy);color:#fff;font-weight:800;letter-spacing:.07em;font-size:.66rem;padding:6px 10px;border-radius:999px;text-transform:uppercase}
.tx-tx{display:flex;flex-direction:column;gap:6px;padding:14px 16px 18px;flex:1}
.tx-sku{font:600 .78rem var(--tx-mono);color:var(--tx-muted)}
.tx-name{margin:0;font-size:.98rem;line-height:1.35;font-weight:700;color:var(--tx-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.tx-sub{font-size:.82rem;color:var(--tx-muted)}
.tx-more{margin-top:auto;padding-top:8px;color:var(--tx-blue);font-weight:700;font-size:.88rem}
@media (hover:hover) and (pointer:fine){.tx-card:hover{transform:translateY(-4px);box-shadow:0 24px 40px -24px rgba(11,21,32,.38);border-color:#b8c8dd}}

.tx-pager{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:44px 0 0}
.tx-pager a,.tx-pager span{min-width:44px;height:44px;padding:0 16px;display:inline-grid;place-items:center;border-radius:12px;border:1px solid var(--tx-line);background:#fff;color:var(--tx-ink);font-weight:700;text-decoration:none;transition:transform .15s var(--tx-ease),border-color .15s}
.tx-pager a:active{transform:scale(.95)}
.tx-pager .is-current{background:var(--tx-navy);border-color:var(--tx-navy);color:#fff}
@media (hover:hover){.tx-pager a:hover{border-color:#9db4d1}}

.tx-cta{margin-top:64px;padding:44px;border-radius:26px;color:#fff;display:grid;grid-template-columns:1.3fr auto;gap:28px;align-items:center;
  background:radial-gradient(700px 300px at 100% 0,#2b8be033,transparent 60%),linear-gradient(135deg,var(--tx-navy),var(--tx-navy-3))}
.tx-cta h2{margin:0 0 8px;font-size:1.6rem;letter-spacing:-.015em;color:#fff}
.tx-cta p{margin:0;color:#b9c9dd;max-width:52ch}
.tx-cta .tx-actions{display:flex;flex-wrap:wrap;gap:10px}

/* market page steps */
.tx-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px}
.tx-step{padding:26px;background:var(--tx-card);border:1px solid var(--tx-line);border-radius:20px}
.tx-step b{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(180deg,#0b6fd1,var(--tx-blue));color:#fff;font-weight:800;margin-bottom:14px}
.tx-step h3{margin:0 0 6px;font-size:1.05rem;color:var(--tx-ink)}
.tx-step p{margin:0;color:var(--tx-muted);font-size:.95rem}

/* entrance */
@keyframes txrise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.tx-rise{animation:txrise .55s var(--tx-ease) backwards}
.tx-d2{animation-delay:.08s}.tx-d3{animation-delay:.16s}.tx-d4{animation-delay:.24s}
@media (prefers-reduced-motion:reduce){.tx-rise{animation:none}.tx-card,.tx-chip,.tx-btn{transition:none}}

@media (max-width:1060px){.tx-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.tx-grid{grid-template-columns:repeat(2,1fr)}.tx-cta{grid-template-columns:1fr;padding:30px}.tx-steps{grid-template-columns:1fr}}
@media (max-width:540px){
  .tx-wrap{width:calc(100% - 32px)}
  .tx-grid{gap:12px}.tx-tx{padding:12px}
  .tx-search{flex-direction:column}.tx-search .tx-btn{width:100%}
  .tx-hero{padding-bottom:104px}
}
@media (prefers-contrast:more){.tx-stat,.tx-search{border-color:#fff}}

/* Dark mode (site toggle sets html.dark) */
html.dark .tx{--tx-ink:#e8eef6;--tx-muted:#8fa3bc;--tx-line:#26364d;--tx-bg:#0b1520;--tx-card:#142033;--tx-blue:#6db3ff}
html.dark .tx-chip{background:#142033;border-color:var(--tx-line);color:var(--tx-ink)}
html.dark .tx-chip.is-on{background:var(--tx-blue);border-color:var(--tx-blue);color:#0b1520}
html.dark .tx-pager a,html.dark .tx-pager span{background:#142033;border-color:var(--tx-line);color:var(--tx-ink)}
html.dark .tx-pager .is-current{background:var(--tx-blue);border-color:var(--tx-blue);color:#0b1520}
html.dark .tx-ph{background:#fff}
html.dark .tx-card{border-color:var(--tx-line)}
html.dark .tx-name{color:var(--tx-ink)}
html.dark .tx-step b{color:#fff}

/* Arabic / right-to-left */
html[dir="rtl"] .tx-brandtag{left:auto;right:12px}
html[dir="rtl"] .tx-chipbar strong{margin-right:0;margin-left:6px}
