@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;700&display=swap');
/* ============================================================
   TDB READABILITY PASS — 2026-06-10
   Problem: dark-mode accent TEXT used #2563eb (3.7:1 on #0a0c14) — eye strain
   on links, prices, outline buttons, kickers, icons.
   Rule: fills/borders keep --accent-color; TEXT accents use --accent-ink
   (#9bb8ef dark / #1d4ed8 light). Loaded LAST sitewide via mu-plugin
   tdb-readability.php. Selectors mirror style.min.css verbatim so the
   later-cascade wins at equal specificity.
   ============================================================ */
:root{ --accent-ink: var(--tdb-body); }
body.light-mode { --accent-ink: var(--tdb-accent); }

/* 1. Generic links */
a { color: var(--accent-ink); }

/* 2. Outline buttons — readable ink text + border (fill on hover unchanged) */
.btn-primary, .woocommerce #respond input#submit, .woocommerce a.button,
.woocommerce button.button, .woocommerce input.button {
  color: var(--accent-ink) !important;
  border-color: var(--accent-ink) !important;
}

/* 3. Accent-text rules re-pointed (verbatim from style.min.css) */
.woocommerce-message a.restore-item,.woocommerce-message a[href*="undo_item"],
footer .social-icon:hover,
.product-hero-v3__main-info .price ins,
.trust-badges .badge-item a:hover,
.accordion-button:not(.collapsed),
.related.products li.product .price,.upsells.products li.product .price,
.related.products li.product .add_to_cart_button,.upsells.products li.product .add_to_cart_button,
.quantity button:hover,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins,
.woocommerce-mini-cart-item a:not(.remove):hover,
.woocommerce-mini-cart__total .woocommerce-Price-amount,
.error-404-title,
.footer-nav a:hover,.footer-contact a:hover,
.footer-social a:hover,
.footer-social-bottom a:hover,
.download-cta-section .bi-check-circle-fill,
.btn-download-glass-icon,
.tdb-ecu-spec tr:hover td,
.woocommerce-cart .shop_table td.product-name a:hover,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th,body.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td,
.layer-code,
.glass-card i,
.tdb-espec__eyebrow,
.tdb-gains-upsell__kicker,
.tdb-gains-upsell__cta,
body.single-product .badge-item.posted_in,
.tdb-hero__breadcrumbs a:hover,
.tdb-hero__bc-active,
.tdb-hero__kicker,
.tdb-hero__gain-arrow,
.tdb-hero__gain-to,
.tdb-hero__gain-d--pct,
.tdb-hero__lede strong,
.tdb-hero__micro-trust svg,
.tdb-hero__ecu-eyebrow,
.tdb-hero__proof b,
.tdb-hero__share-btn:hover { color: var(--accent-ink); }

/* 4. Low-contrast bumps */
.tdb-pw-step { color: var(--tdb-body); }
.tdb-pw-step .bi { color: var(--tdb-muted); }
.ts-code .ts-tk-com, pre .ts-tk-com { color: var(--tdb-muted); }

/* ===== TDB-MOBILE-FIX 2026-06-10 — programmatic 390px audit remediation ===== */

/* product-window: LIVE pill sits beside the domain (all viewports) so the
   "Delivered" badge can straddle the top-right corner without covering it */
.tdb-pw-live { margin-left: 10px !important; }

/* hero text legibility over bright gradients (dark theme only) */
body:not(.light-mode) .ts2-h1,
body:not(.light-mode) .ts2-lede,
body:not(.light-mode) .ts2-eyebrow,
body:not(.light-mode) .tdb-hero4-trust {
  text-shadow: 0 2px 18px rgba(2,6,23,.60), 0 1px 3px rgba(2,6,23,.50);
}

/* solid mobile navbar — stop content ghosting through */
@media (max-width: 991.98px) {
  body:not(.light-mode) .navbar {
    background-color: color-mix(in srgb, var(--tdb-ground) 94%, transparent) !important;
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  }
  body.light-mode .navbar { background-color: rgba(255,255,255,.95) !important; }
}

@media (max-width: 640px) {
  /* homepage hero: kill intrinsic-width blow-ups (eyebrow nowrap forced 403px grid) */
  .tdb-hero4-grid > *, .tdb-hero4-copy, .tdb-hero4-visual { min-width: 0; }
  .ts2-eyebrow, .ts2-eyebrow * { white-space: normal !important; }
  .ts2-eyebrow { max-width: 100%; }
  .tdb-pw { max-width: 100% !important; }
  /* floating badges straddle top/bottom edges, never cover content */
  .tdb-pw-live { display: none !important; } /* crowded bar at phone width; the green badge carries the signal */
  .tdb-pw-bar { padding-right: 122px !important; } /* reserve the corner for the badge */
  .tdb-pw-badge { font-size: 11px !important; padding: 7px 11px !important; }
  .tdb-pw-badge-a { top: -12px !important; right: 6px !important; left: auto !important; }
  .tdb-pw-badge-b { bottom: -22px !important; left: 6px !important; right: auto !important; }
  .tdb-pw-foot { flex-wrap: wrap !important; }

  /* wide data tables become swipe-scrollable instead of clipped */
  .tdb-cmp2-wrap, .ts-table-wrap { overflow-x: auto !important; -webkit-overflow-scrolling: touch;
    scrollbar-width: thin; }
  /* bare tables without a wrapper (product description) scroll themselves */
  :not(.ts-table-wrap) > .ts-table, :not(.tdb-cmp2-wrap) > .tdb-cmp2 {
    display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }

  /* features terminal mocks: long code lines scroll, not clip */
  .ts-term, .ts-shell, .ts-code, pre[class*="ts-"] { overflow-x: auto; }

  /* contact grid had a 393px track inside a 358px container */
  .ts2-contact-grid { grid-template-columns: minmax(0,1fr) !important; }

  /* generic guard: single-column ts2 grids on phones */
  [class*="ts2-"][class*="-grid"] { grid-template-columns: minmax(0,1fr) !important; }

  /* floating chat buttons: smaller footprint on phones */
  a[href*="wa.me"], a[href*="api.whatsapp"], .whatsapp-float, .wa-float {
    transform: scale(.82); transform-origin: bottom left;
  }
}

/* recent-buys list: date chip wraps instead of poking out at ≤420px */
@media (max-width: 420px) {
  .tdb-recent-buys li { flex-wrap: wrap; min-width: 0; }
}

/* ===== TDB-MOBILE-FIX round 3 (2026-06-10): secondary pages ===== */
@media (max-width: 768px) {
  /* blog single post: grid track was 607px inside a 366px container */
  .single-layout { grid-template-columns: minmax(0,1fr) !important; }
  .single-layout > * { min-width: 0; grid-column: 1 / -1 !important; }
  .toc-sidebar, #tocCard { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; }
  .single-content { max-width: 100% !important; }
  .single-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 640px) {
  /* search results: .row.g-5 gutter (-24px) exceeds container padding (12px) */
  body.search .row.g-5 { --bs-gutter-x: 1.5rem; }
}
@media (max-width: 991.98px) {
  /* header search dropdown opened 103px off the left edge on phones */
  .header-icon-item .search-dropdown { position: fixed !important; top: 72px;
    left: 16px !important; right: 16px !important; width: auto !important;
    transform: none !important; }
  .search-dropdown .searchform, .search-dropdown #searchform { width: 100% !important; min-width: 0 !important; }
  .search-dropdown #s { width: 100% !important; }
}

/* iPhone home-indicator: keep bottom-fixed UI above the gesture bar */
#tdb-cookie-consent { padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px)) !important; }
#tdb-wa-float { bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 768px) { #tdb-wa-float { bottom: calc(20px + env(safe-area-inset-bottom, 0px)); } }
body.tdb-consent-open #tdb-wa-float { bottom: calc(var(--tdb-consent-h, 96px) + 14px) !important; }

/* ===== NAVBAR + FOOTER consistency pass (2026-06-10) ===== */

/* active menu item was visually identical to the rest — show where you are */
.navbar .current-menu-item > a, .navbar .current_page_item > a,
.navbar .current-menu-parent > a, .navbar .current_page_parent > a {
  color: var(--tdb-body) !important; font-weight: 700 !important;
}
body.light-mode .navbar .current-menu-item > a, body.light-mode .navbar .current_page_item > a,
body.light-mode .navbar .current-menu-parent > a, body.light-mode .navbar .current_page_parent > a {
  color: var(--tdb-accent) !important;
}

/* light-mode footer: links/body text were rgb(174,182,198) on #f8fafc (~1.65:1) */
body.light-mode .tdb-footer { color: #475569; }
body.light-mode .tdb-footer a:not(.btn-tdbf):not([class*="btn"]) { color: #475569 !important; }
body.light-mode .tdb-footer a:not(.btn-tdbf):not([class*="btn"]):hover { color: var(--tdb-accent) !important; }
body.light-mode .tdb-footer .footer-bottom, body.light-mode .tdb-footer .footer-bottom span,
body.light-mode .tdb-footer p, body.light-mode .tdb-footer li { color: var(--tdb-muted); }
body.light-mode .tdb-footer .footer-social a { color: #475569 !important; border-color: color-mix(in srgb, var(--tdb-line) 18%, transparent) !important; }

/* header icons: 22px hit area is too small on touch screens */
@media (max-width: 991.98px) {
  .header-icons .header-icon-item > a, .header-icons .header-icon-item > button {
    padding: 10px; margin: -10px 2px; display: inline-flex; }
}

/* shop hero: self-contained fallbacks (ts2 bundle does not load on archives) */
.tdb-shop .ts2-page-header{position:relative;overflow:hidden;padding:0}
.tdb-shop .ts2-glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.tdb-shop .ts2-glow-a{width:480px;height:480px;background:color-mix(in srgb, var(--tdb-accent) 16%, transparent);top:-180px;left:8%}
.tdb-shop .ts2-glow-b{width:420px;height:420px;background:color-mix(in srgb, var(--tdb-support) 10%, transparent);top:-140px;right:6%}
.tdb-shop .ts2-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:999px;
  background:color-mix(in srgb, var(--tdb-accent) 10%, transparent);border:1px solid color-mix(in srgb, var(--tdb-accent) 30%, transparent);
  font-family:var(--mono,Menlo,monospace);font-size:10.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tdb-body)}
body.light-mode .tdb-shop .ts2-eyebrow{color:var(--tdb-accent);background:color-mix(in srgb, var(--tdb-accent) 7%, transparent);border-color:color-mix(in srgb, var(--tdb-accent) 25%, transparent)}

/* ===== TDB-SHOP 2026-06-10 — archive/category pages, homepage-grade ===== */
.tdb-shop .tdbs-hero{padding:64px 0 40px;text-align:center}
.tdb-shop .tdbs-eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:18px}
.tdb-shop .tdbs-eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--tdb-success);flex:none}
@media(prefers-reduced-motion:no-preference){.tdb-shop .tdbs-eyebrow i{animation:tdbsPulse 2.2s ease-out infinite}}
@keyframes tdbsPulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.tdb-shop .tdbs-h1{font-size:clamp(30px,5vw,46px);font-weight:800;letter-spacing:-.02em;color:var(--tdb-text);margin:0 0 14px}
body.light-mode .tdb-shop .tdbs-h1{color:var(--tdb-on-light)}
.tdb-shop .tdbs-sub{max-width:620px;margin:0 auto;color:var(--tdb-body);font-size:16.5px;line-height:1.65}
body.light-mode .tdb-shop .tdbs-sub{color:#475569}
.tdb-shop .tdbs-cats{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}
.tdb-shop .tdbs-cat{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;
  font-size:13px;font-weight:600;text-decoration:none;color:var(--tdb-text);
  background:rgba(148,163,184,.08);border:1px solid color-mix(in srgb, var(--tdb-line) 22%, transparent);
  transition:transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease}
.tdb-shop .tdbs-cat span{font-family:var(--mono,Menlo,monospace);font-size:10.5px;color:var(--tdb-muted);
  background:rgba(148,163,184,.12);border-radius:999px;padding:2px 8px}
.tdb-shop .tdbs-cat:hover{transform:translateY(-2px);border-color:color-mix(in srgb, var(--tdb-accent) 55%, transparent);
  background:color-mix(in srgb, var(--tdb-accent) 12%, transparent);color:var(--tdb-text)}
body.light-mode .tdb-shop .tdbs-cat{color:var(--tdb-on-light);background:color-mix(in srgb, var(--tdb-surface) 4%, transparent);border-color:color-mix(in srgb, var(--tdb-line) 14%, transparent)}
body.light-mode .tdb-shop .tdbs-cat:hover{color:var(--tdb-accent);background:color-mix(in srgb, var(--tdb-accent) 8%, transparent)}

/* result count + ordering row */
.tdb-shop .woocommerce-result-count{color:var(--tdb-muted);font-family:var(--mono,Menlo,monospace);font-size:12px;
  letter-spacing:.06em;text-transform:uppercase}
.tdb-shop .woocommerce-ordering select{background:color-mix(in srgb, var(--tdb-surface) 55%, transparent);border:1px solid color-mix(in srgb, var(--tdb-line) 25%, transparent);
  color:var(--tdb-text);border-radius:10px;padding:8px 12px;font-size:13.5px}
body.light-mode .tdb-shop .woocommerce-ordering select{background:#fff;color:var(--tdb-on-light);border-color:color-mix(in srgb, var(--tdb-line) 18%, transparent)}

/* product cards — glass, lift, sheen */
.tdb-shop ul.products li.product{position:relative;overflow:hidden;border-radius:16px;
  background:color-mix(in srgb, var(--tdb-surface) 45%, transparent);border:1px solid color-mix(in srgb, var(--tdb-line) 16%, transparent);
  padding:0 0 16px;text-align:center;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.tdb-shop ul.products li.product:hover{transform:translateY(-5px);border-color:color-mix(in srgb, var(--tdb-accent) 50%, transparent);
  box-shadow:0 22px 48px -22px rgba(37,99,235,.4)}
body.light-mode .tdb-shop ul.products li.product{background:#fff;border-color:color-mix(in srgb, var(--tdb-line) 10%, transparent);
  box-shadow:0 6px 20px -12px rgba(15,23,42,.12)}
@media(prefers-reduced-motion:no-preference){
  .tdb-shop ul.products li.product::after{content:"";position:absolute;top:0;bottom:0;width:90px;left:-130px;
    background:linear-gradient(105deg,transparent,rgba(148,197,255,.07),transparent);
    transform:skewX(-12deg);transition:left .6s ease;pointer-events:none;z-index:1}
  .tdb-shop ul.products li.product:hover::after{left:130%}
}
.tdb-shop ul.products li.product img{width:100%;height:auto;border-radius:0;margin:0 0 14px;
  transition:transform .35s ease;display:block}
.tdb-shop ul.products li.product:hover img{transform:scale(1.04)}
.tdb-shop ul.products li.product .woocommerce-loop-product__link{display:block;overflow:hidden;text-decoration:none}
.tdb-shop ul.products li.product .woocommerce-loop-product__title{font-size:14.5px;font-weight:700;
  color:var(--tdb-text);line-height:1.45;padding:0 16px;margin:0 0 8px;min-height:42px}
body.light-mode .tdb-shop ul.products li.product .woocommerce-loop-product__title{color:var(--tdb-on-light)}
.tdb-shop ul.products li.product .price{display:block;color:var(--tdb-body);font-weight:800;font-size:16px;
  font-variant-numeric:tabular-nums;margin:0 0 12px}
.tdb-shop ul.products li.product .price del{color:var(--tdb-muted);font-weight:500;font-size:13px;margin-right:8px}
.tdb-shop ul.products li.product .price ins{text-decoration:none}
body.light-mode .tdb-shop ul.products li.product .price{color:var(--tdb-accent)}
.tdb-shop ul.products li.product .button{display:inline-block;background:var(--tdb-accent) !important;color:var(--tdb-accent-ink) !important;border:0 !important;
  border:0;border-radius:999px;padding:9px 22px;font-size:13px;font-weight:700;
  transition:background .2s ease,transform .2s ease;text-decoration:none}
.tdb-shop ul.products li.product .button:hover{background:var(--tdb-accent);transform:translateY(-1px)}
.tdb-shop ul.products li.product .onsale{position:absolute;top:12px;left:12px;z-index:2;
  background:linear-gradient(135deg,var(--tdb-accent),var(--tdb-accent));color:var(--tdb-text);border-radius:999px;
  padding:5px 13px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  min-width:0;min-height:0;line-height:1.4}

/* reveal */
.tdb-shop .tdbs-rev{opacity:0;transform:translateY(16px)}
.tdb-shop .tdbs-rev.tdbs-vis{opacity:1;transform:none;
  transition:opacity .55s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.22,1,.36,1)}

/* pagination */
.tdb-shop .woocommerce-pagination ul.page-numbers{border:0;display:flex;gap:8px;justify-content:center}
.tdb-shop .woocommerce-pagination ul.page-numbers li{border:0}
.tdb-shop .woocommerce-pagination .page-numbers li .page-numbers{display:inline-flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;border-radius:10px;background:rgba(148,163,184,.08);
  border:1px solid color-mix(in srgb, var(--tdb-line) 20%, transparent);color:var(--tdb-text);font-weight:600;transition:all .2s ease}
.tdb-shop .woocommerce-pagination .page-numbers li .page-numbers.current,
.tdb-shop .woocommerce-pagination .page-numbers li .page-numbers:hover{background:var(--tdb-accent);color:var(--tdb-accent-ink);border-color:var(--tdb-accent)}
body.light-mode .tdb-shop .woocommerce-pagination .page-numbers li .page-numbers{color:var(--tdb-on-light);background:color-mix(in srgb, var(--tdb-surface) 4%, transparent)}

/* mobile */
@media(max-width:640px){
  .tdb-shop .tdbs-hero{padding:44px 0 28px}
  .tdb-shop ul.products{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:14px !important}
  .tdb-shop ul.products li.product{width:auto !important;margin:0 !important}
  .tdb-shop .tdbs-cats{gap:8px}
  .tdb-shop .tdbs-cat{padding:7px 12px;font-size:12px}
  .tdb-shop ul.products li.product .woocommerce-loop-product__title{font-size:13px;min-height:0}
}

/* ===== TDB-ACCT 2026-06-10 — Client Portal polish (CSS-only, zero markup risk) ===== */
body.woocommerce-account .tdb-form-container{
  border:1px solid color-mix(in srgb, var(--tdb-line) 18%, transparent);border-radius:16px;
  transition:border-color .3s ease,box-shadow .3s ease}
body.woocommerce-account .tdb-form-container:focus-within{
  border-color:color-mix(in srgb, var(--tdb-accent) 50%, transparent);box-shadow:0 0 0 1px rgba(37,99,235,.18),0 24px 60px -30px rgba(37,99,235,.35)}
body.woocommerce-account .tdb-input{transition:border-color .2s ease,box-shadow .25s ease,background .2s ease}
body.woocommerce-account .tdb-input:focus{
  border-color:var(--tdb-accent) !important;outline:none;
  box-shadow:0 0 0 4px rgba(37,99,235,.14),0 0 22px -6px rgba(37,99,235,.35)}
body.woocommerce-account .tdb-btn-primary{transition:background .2s ease,transform .2s ease,box-shadow .25s ease}
body.woocommerce-account .tdb-btn-primary:hover{transform:translateY(-2px);
  box-shadow:0 14px 30px -12px rgba(37,99,235,.5)}
body.woocommerce-account .tdb-nav-link{transition:color .2s ease,background .2s ease}
body.woocommerce-account .tdb-icon-box{transition:transform .25s ease,box-shadow .25s ease}
body.woocommerce-account .tdb-card-title{transition:color .2s ease}
body.woocommerce-account .tdb-col-left > div:hover .tdb-icon-box{transform:translateY(-3px) scale(1.05)}
@media(prefers-reduced-motion:no-preference){
  body.woocommerce-account .tdb-form-container{animation:tdbaIn .6s cubic-bezier(.22,1,.36,1) both}
  body.woocommerce-account .tdb-col-left > div{animation:tdbaIn .6s cubic-bezier(.22,1,.36,1) both}
  body.woocommerce-account .tdb-col-left > div:nth-child(2){animation-delay:.08s}
  body.woocommerce-account .tdb-col-left > div:nth-child(3){animation-delay:.16s}
  body.woocommerce-account .tdb-col-left > div:nth-child(4){animation-delay:.24s}
}
@keyframes tdbaIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ===== TDB-MOTION 2026-06-10 — sitewide premium-motion layer ===== */

/* scroll progress */
#tdbm-progress{position:fixed;top:0;left:0;right:0;height:2.5px;z-index:10050;
  transform-origin:0 50%;transform:scaleX(0);pointer-events:none;
  background:linear-gradient(90deg,var(--tdb-accent),var(--tdb-support));
  box-shadow:0 0 10px rgba(37,99,235,.45)}
body.admin-bar #tdbm-progress{top:32px}

/* ambient canvas architecture (marketing pages; html carries base + grid) */
html.tdbm-canvas{background-color:var(--tdb-ground);
  background-image:repeating-linear-gradient(0deg,rgba(122,162,232,.06) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(90deg,rgba(122,162,232,.06) 0 1px,transparent 1px 64px);
  background-size:64px 64px;background-attachment:fixed}
html.tdbm-canvas:has(body.light-mode){background-color:#f6f8fc;
  background-image:repeating-linear-gradient(0deg,rgba(37,99,235,.05) 0 1px,transparent 1px 64px),
    repeating-linear-gradient(90deg,rgba(37,99,235,.05) 0 1px,transparent 1px 64px)}
html.tdbm-canvas body{background:transparent !important}
#tdbm-bgcanvas{position:fixed;inset:0;width:100vw;height:100vh;z-index:-1;pointer-events:none}
html.tdbm-canvas .ts2{background:transparent !important}
html.tdbm-canvas .ts2-section-alt{background:color-mix(in srgb, var(--tdb-band) 55%, transparent) !important}
html.tdbm-canvas body.light-mode .ts2-section-alt{background:rgba(255,255,255,.55) !important}
html.tdbm-canvas .tdb-shop ~ * {}
html.tdbm-canvas main.site-main{background:transparent}

/* glow orbs: slow drift (was static) */
@media(prefers-reduced-motion:no-preference){
  .ts2-glow-a{animation:tdbmOrbA 26s ease-in-out infinite alternate}
  .ts2-glow-b{animation:tdbmOrbB 32s ease-in-out infinite alternate}
}
@keyframes tdbmOrbA{from{transform:translate(0,0) scale(1)}to{transform:translate(60px,30px) scale(1.12)}}
@keyframes tdbmOrbB{from{transform:translate(0,0) scale(1.08)}to{transform:translate(-70px,22px) scale(.96)}}

/* h1/h2 <em> shimmer — animated gradient ink (marketing voice) */
@media(prefers-reduced-motion:no-preference){
  .ts2 h1 em,.ts2 .ts2-h2 em{
    background:linear-gradient(100deg,#9bb8ef 0%,var(--tdb-accent) 30%,var(--tdb-support) 50%,var(--tdb-accent) 70%,#9bb8ef 100%);
    background-size:220% 100%;-webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:transparent;font-style:inherit;
    animation:tdbmShimmer 7s ease-in-out infinite}
  body.light-mode .ts2 h1 em,body.light-mode .ts2 .ts2-h2 em{
    background-image:linear-gradient(100deg,#1d4ed8 0%,#2563eb 35%,#0891b2 50%,#2563eb 65%,#1d4ed8 100%)}
}
@keyframes tdbmShimmer{0%,100%{background-position:0% 0}50%{background-position:100% 0}}

/* primary button sheen sweep */
.ts2-btn-primary,.tdb-shop ul.products li.product .button,
.single_add_to_cart_button,.buy_now_button{position:relative;overflow:hidden}
@media(prefers-reduced-motion:no-preference){
  .ts2-btn-primary::before,.tdb-shop ul.products li.product .button::before,
  .single_add_to_cart_button::before,.buy_now_button::before{
    content:"";position:absolute;top:0;bottom:0;width:46px;left:-70px;
    background:linear-gradient(105deg,transparent,rgba(255,255,255,.28),transparent);
    transform:skewX(-14deg);transition:left .55s ease;pointer-events:none}
  .ts2-btn-primary:hover::before,.tdb-shop ul.products li.product .button:hover::before,
  .single_add_to_cart_button:hover::before,.buy_now_button:hover::before{left:115%}
}

/* tilt smoothing */
.tdbm-tiltable{transition:transform .18s ease-out,border-color .25s ease,box-shadow .25s ease;will-change:transform}

/* ===== TDB-CONSISTENCY 2026-06-10 — typography + token unification ===== */
:root{--mono:'JetBrains Mono',ui-monospace,Menlo,monospace}
/* one heading voice sitewide (Jakarta loads via the @import above) */
h1,h2,h3,.tdbs-h1,.tdb-hero__h1,.ts-h2,.ts-h3{
  font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
/* (buy buttons keep their intentional mono-uppercase terminal style) */
/* product description cards harmonized with hero cards */
#ts-wrapper .ts-card{border-radius:14px !important}
#ts-wrapper .ts-kicker{font-family:var(--mono)}

/* Scene replay controls appear in two places on two different grounds, so a
   single rule cannot be right for both. In #see-it they sit on the page and
   tdb-scenes.css already handles them correctly. In the HERO they sit over
   the photograph, where that same rule darkens them to 1.0:1 on paper.
   Scoped to the hero by id, which beats the plain-class rule outright.
   The chip gets a dark scrim rather than brighter text: the photograph is
   bright behind it in places, so light-on-light was measuring 4.34:1. */
body.light-mode #hero .sc-btn, [data-bs-theme="light"] #hero .sc-btn{
  color:var(--tdb-on-dark) !important;
  background:rgba(10,14,20,.55) !important;
  border-color:rgba(255,255,255,.22) !important;
}
body.light-mode #hero .sc-btn:hover, [data-bs-theme="light"] #hero .sc-btn:hover{
  color:#fff !important;
  background:rgba(10,14,20,.72) !important;
}

/* The caption under the hero demo is the same problem one step milder: it
   measured 4.46:1 against a needed 4.5 in rendered pixels, because the
   ground under it is a photograph rather than one value. A scrim behind the
   line fixes the ground instead of guessing at the text colour, and it is
   the hero only - in #see-it the caption sits on the page and is fine.
   The base rule centres a BLOCK with margin:auto and reserves 3em so the
   demo does not jump as captions change length. width:fit-content keeps
   both of those true while shrinking the plate to the text; inline-block
   would have silently left-aligned it, because auto margins do not centre
   an inline box. */
#hero .sc-caption{
  width:fit-content;
  max-width:min(62ch,92%);
  margin:20px auto 0;
  padding:8px 16px;
  border-radius:12px;
  background:rgba(8,12,18,.58);
  color:var(--tdb-on-dark);
  display:grid;
  place-items:center;
}
