/* UsefulIndicators product page v3 — layout + logic locked 2026-09-07 (git tag test3-locked-2026-09-07).
   Shared by every product page built on this template; product content lives in the page, not here. */

.t3-sbar{
  position:fixed;
  inset:0 0 auto 0;
  z-index:1201;
  height:58px;
  padding:0 48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  background:#000;
  border-bottom:1px solid rgba(255,255,255,0.14);
  transform:translateY(-100%);
  visibility:hidden;
  transition:transform .28s ease, visibility 0s linear .28s;
}
.t3-sbar.on{ transform:translateY(0); visibility:visible; transition:transform .28s ease, visibility 0s; }
.t3-sbar-l{ display:flex; align-items:center; gap:18px; min-width:0; }
.t3-sbar-r{ display:flex; align-items:center; gap:10px; min-width:0; }
.t3-sbar-name{
  font-family:'DM Sans', var(--sans);
  font-size:19px;
  font-weight:600;
  letter-spacing:-0.3px;
  color:#F4F4F4;
  white-space:nowrap;
  -webkit-font-smoothing:antialiased;
}
.t3-sbar-name small{ font:400 12px 'Inter', var(--sans); letter-spacing:0; color:rgba(255,255,255,0.38); margin-left:10px; }
.t3-sbar-nav{
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  transform:translateX(-50%);
  display:flex;
  gap:34px;
}
.t3-sbar-nav a{
  position:relative;
  display:flex;
  align-items:center;
  height:100%;
  text-decoration:none;
  white-space:nowrap;
  font:500 13.5px 'Inter', var(--sans);
  color:rgba(255,255,255,0.48);
  transition:color .18s ease;
}
.t3-sbar-nav a:hover{ color:rgba(255,255,255,0.8); }
.t3-sbar-nav a.on, .t3-sbar-nav a.on:hover{ color:#fff; }
.t3-sbar-price{ display:inline-flex; align-items:baseline; white-space:nowrap; margin-right:10px; }
.t3-sbar-price b{ font:600 16px 'Inter', var(--sans); color:#F4F4F4; }
.t3-sbar-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:36px;
  padding:0 20px;
  font:600 13px 'Inter', var(--sans);
  letter-spacing:0.01em;
  color:#fff;
  background:#000;
  border:1px solid rgba(255,255,255,0.5);
  text-decoration:none;
  white-space:nowrap;
}
.t3-sbar-btn:hover{ border-color:rgba(255,255,255,0.9); }
.t3-sbar-btn.solid{ background:#fff; color:#000; border-color:#fff; }
.t3-sbar-btn.solid:hover{ background:#EDEDED; border-color:#EDEDED; }
#demo, #compare, #reviews, #faq, #vault,
#how-it-works, #works-on, #features, #gallery, #download, #how-traders-use-it, #video, #playground, #free-trial{ scroll-margin-top:78px; }
/* Link-list variant, used by any product whose data sets `sbar` (Live IB Range first, 2026-09-14). Kristian asked
   for more links, centred; a 1180 px wrapper that pulled the name and button in to the page edges was tried the same
   day and reverted on his word ("name + for NinjaTrader 8 to the left and free + download button to the right like it
   was"), so the wrapper is full width and the bar keeps the original 48 px side padding. The wrapper stays because
   it is the nav's positioned ancestor and gives the nav the full bar height. */
.t3-sbar-mid .t3-sbar-in{
  position:relative;
  align-self:stretch;  /* full bar height: the nav is 58 px tall and anchors to this box's top, so a shorter box pushed the links 11 px low (measured) */
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
/* width:max-content — left:50% caps an absolute box at half its container, and a shared rule adds 48 px side
   padding, so a long list overflowed rightwards and sat off-centre (cold review, measured 49 px) */
.t3-sbar-mid .t3-sbar-nav{ gap:0; width:max-content; padding:0; }
/* thin vertical divider between links (Kristian 2026-09-14: "use thin vertical spaces between") */
.t3-sbar-mid .t3-sbar-nav a{ padding:0 13px; }
.t3-sbar-mid .t3-sbar-nav a:first-child{ padding-left:0; }
.t3-sbar-mid .t3-sbar-nav a:last-child{ padding-right:0; }
.t3-sbar-mid .t3-sbar-nav a + a::before{ content:''; position:absolute; left:0; top:50%; width:1px; height:14px; margin-top:-7px; background:rgba(255,255,255,0.22); }
/* current-section link a step softer than pure white (Kristian 2026-09-14: "slightly less highlight"); idle 48%, hover 80% */
.t3-sbar-mid .t3-sbar-nav a.on, .t3-sbar-mid .t3-sbar-nav a.on:hover{ color:rgba(255,255,255,0.86); }
/* lists differ per page (6 to 9 links) and so do product names, so no single width fits: product-v3.js measures the
   row on load and resize and sets .t3-sbar-tight when a link would come within 40 px of the name or the price (on Live
   IB Range at 1241 px the first link sat 23 px from "for NinjaTrader 8"). The shared ≤1240 px rule still applies. */
.t3-sbar-mid.t3-sbar-tight .t3-sbar-nav{ visibility:hidden; }
/* Laptop widths (2026-09-24, Kristian: "fix the scaling issues on the sticky bar"): measured on the live pages, 14 of 17 bars hid
   their links between 1260 and 1400 px - the centred link row met the name (+ "for NinjaTrader 8") or the price + buttons
   inside the 40 px guard. Below 1440 the suffix goes (it already goes at 1240), the side padding drops 48 -> 28 px and the
   links tighten to 10 px / 13 px: about 150 px back per page, so 16 of 17 pages show their links from 1260; the page with the
   widest price block (ATM Risk Reward) is handled by product-v3.js sliding the row into the free side instead of hiding it. */
@media (max-width:1440px){
  .t3-sbar.t3-sbar-mid{ padding:0 28px; }
  .t3-sbar-mid .t3-sbar-name small{ display:none; }
  .t3-sbar-mid .t3-sbar-nav a{ padding:0 10px; font-size:13px; }
}
@media (max-width:1240px){
  .t3-sbar-nav{ display:none; }
  .t3-sbar-name small{ display:none; }
  .t3-sbar{ padding:0 20px; }
  .t3-sbar.t3-sbar-mid{ padding:0 20px; }  /* two classes: the line above cannot reach it */
}
#nav{ background:#000; transition:box-shadow .3s; }
.t3-herolight{
  position:absolute;
  left:50%;
  top:471px;
  width:2300px;
  height:1150px;
  transform:translate(-50%,-50%);
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse closest-side at 50% 50%, rgba(255,255,255,0.0975) 0%, rgba(255,255,255,0.056) 40%, rgba(255,255,255,0.019) 72%, rgba(255,255,255,0) 100%);
}
.t3-hbtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:46px;
  padding:0 24px;
  font:600 15px 'Inter', var(--sans);
  letter-spacing:0.005em;
  color:rgba(255,255,255,0.94);
  background:#000;
  border:1px solid rgba(255,255,255,0.42);
  border-radius:4px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.10);
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color .15s ease, color .15s ease;
}
.t3-hbtn:hover{ border-color:rgba(255,255,255,0.7); color:#fff; }
.t3-hbtn-arr{ display:inline-flex; align-items:center; margin-left:10px; line-height:0; }
.t3-hbtn-arr svg{ display:block; }
.ecz-bar{
  height:28px;
  box-sizing:border-box;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#1C1D21;
  border:none;
  position:relative;
}
.ecz-hero{ border:none !important; box-shadow:none !important; background:transparent !important; }
.ecz-cell{
  display:inline-flex;
  align-items:center;
  gap:7px;
  height:100%;
  padding:0 15px;
  background:transparent;
  border:none;
  border-left:1px solid rgba(255,255,255,0.52);
}
.ecz-bar-left .ecz-cell:first-child{ padding-left:0; border-left:none; }
@media (max-width:1060px){
  .ecz-p3{ display:none; }
}
@media (max-width:980px){
  .ecz-p4{ display:none; }
}
@media (max-width:840px){
  .ecz-p6{ display:none; }
}
.ecz-stars{ color:#E8212A; font-size:13px; letter-spacing:1.8px; line-height:1; }
.np-counter{
  display:flex;
  align-items:center;
  justify-content:center;
  top:0;
  right:0;
  bottom:auto;
  left:auto;
  height:29px;
  min-width:66px;
  padding:0 13px;
  background:#262626;
  border:1px solid rgba(255,255,255,0.28);
  border-radius:0;
  font-family:var(--sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:0.5px;
  font-variant-numeric:tabular-nums;
  color:#fff;
}
.np-hero::after{ content:none; }
@media (min-width:1400px){
  .np-hero{ overflow:visible; }
  .np-arrow{ width:52px; height:60px; background:#16171B; border:1px solid rgba(255,255,255,0.28); border-radius:0; color:rgba(255,255,255,0.8); }
  .np-arrow svg{ width:32px; height:32px; }
  .np-arrow:hover{ background:#fff; color:#111; border-color:#fff; }
  .np-prev{ left:-64px; }
  .np-next{ right:-66px; }
}
.ecz-topband{ position:relative; isolation:isolate; z-index:1001; }
.ecz-showzone{ background:var(--bg); margin:0 -24px; padding:44px 24px 92px; padding-top:30px; }
.ecz-topband, .ecz-showzone{ background:transparent !important; }
.ecz-rule.t3-rule-upper{ border-top-color:rgba(255,255,255,0.32); }
nav:not(.scrolled){ background:transparent; }
nav li > a{ padding-top:5px; }
body, .t1-footghostwrap, .t3-tail{ background-color:#000 !important; }
.product-page{ --bg:#080808; --ecz-lower:#1A1A1A; position:relative; z-index:0; background-color:#000 !important; }
.ecz-rule{ height:0; border-top:1px solid rgba(232,33,42,0.18); margin:0 -24px; }
.t3-pricing{ max-width:1160px; margin:134.6px auto 0; padding:0; }
.t3-pr-h{
  font-family:var(--sans);
  font-weight:700;
  font-size:40px;
  letter-spacing:-0.024em;
  text-shadow:0 0 34px rgba(255,255,255,0.091),
    0 3px 14px rgba(0,0,0,0.9),
    0 1px 3px rgba(0,0,0,0.9);
  line-height:1.15;
  color:#fff;
  text-align:center;
  margin:0;
}
.t3-pr-lede{ font:400 16px/1.5 'Inter', var(--sans); color:#9A9A9A; text-align:center; max-width:none; white-space:nowrap; margin:12px auto 36px; }
@media (max-width:1000px){ .t3-pr-lede{ white-space:normal; } }   /* the one-line lede is clipped on tablets once the sentence is longer than the screen (IRL's 843 px sentence lost "…required." at 820 — 2026-09-12) */
.t3-pricing--nolede .t3-pr-h{ margin-bottom:40px; }   /* a page without a lede sentence (ProVWAP since 2026-09-10) keeps a gap between the heading and the cards */
.t3-pr-rule{
  position:relative;
  height:1px;
  width:1140px;
  max-width:100%;
  margin:7px auto 32px;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.10) 18%, rgba(255,255,255,0.55) 50%, rgba(255,255,255,0.10) 82%, transparent 100%);
}
.t3-pr-rule::after{
  content:"";
  position:absolute;
  left:20%;
  right:20%;
  top:1px;
  height:6px;
  background:radial-gradient(ellipse at 50% 0%, rgba(255,255,255,0.14), transparent 70%);
  pointer-events:none;
}
.t3-pr-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:16px; align-items:stretch; }
.t3-pr-card{
  display:flex;
  flex-direction:column;
  background:#0A0A0A;
  border:1px solid rgba(255,255,255,0.16);
  border-radius:12px;
  box-shadow:0 0 22px rgba(255,255,255,0.045),
    0 0 70px rgba(255,255,255,0.020),
    0 10px 34px rgba(0,0,0,0.55);
  padding:24px;
  font-family:'Inter', var(--sans);
}
.t3-pr-card-main{ border-color:rgba(255,255,255,0.16); }
.t3-pr-name{
  font-family:inherit;
  font-weight:600;
  font-size:16px;
  line-height:22px;
  letter-spacing:-0.1px;
  color:#FFFFFF;
  margin:0;
  text-align:left;
  padding:0;
  border:0;
}
.t3-pr-price{ display:flex; align-items:baseline; gap:4px; margin:22px 0 0; }
.t3-pr-amt{ font-weight:600; font-size:32px; line-height:36px; letter-spacing:-0.8px; color:#EDEDED; }
.t3-pr-per{ font-size:14px; line-height:20px; letter-spacing:-0.9px; color:#7D7D7D; }
.t3-pr-small{ font-size:12px; line-height:16px; color:#7D7D7D; margin:6px 0 0; min-height:16px; }
.t3-pr-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:flex-start;
  width:auto;
  margin-top:24px;
  padding:0 22px;
  height:40px;
  box-sizing:border-box;
  font-family:inherit;
  font-weight:500;
  font-size:14px;
  line-height:20px;
  color:#EDEDED;
  text-decoration:none;
  background:#0A0A0A;
  border:1px solid rgba(255,255,255,0.15);
  border-radius:999px;
  transition:none;
}
.t3-pr-btn:hover{ background:#fff; color:#111; border-color:#fff; }
.t3-pr-feat{ margin-top:28px; padding-top:20px; border-top:1px solid rgba(255,255,255,0.08); flex:1; }
.t3-pr-featlab{ font-size:12px; line-height:16px; color:#8A8A8A; margin:0 0 12px; }
.t3-pr-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px; }
.t3-pr-list li{
  display:flex;
  align-items:flex-start;
  gap:10px;
  font-size:13px;
  line-height:1.5;
  font-weight:400;
  color:#C8C8C8;
}
.t3-pr-ck{ flex:0 0 14px; width:14px; height:14px; margin-top:2px; color:#6E6E6E; }
.t3-pr-foot{ font-size:12px; line-height:17px; color:#7D7D7D; margin:22px 0 0; }
@media (max-width:1100px){
  .t3-pr-grid{ grid-template-columns:1fr; }
  .t3-pr-small{ min-height:0; }
}
.np-faq{ max-width:860px; padding-bottom:16px; }
.np-faq-item{ border-bottom:1px solid rgba(255,255,255,0.11); }
.np-faq-row{ display:flex; align-items:center; gap:14px; padding:16px 4px; cursor:pointer; }
.np-faq-row:hover .np-faq-q{ color:#fff; }
.np-faq-q{
  flex:1;
  font-family:var(--sans);
  font-size:15.5px;
  font-weight:600;
  color:rgba(255,255,255,0.95);
  letter-spacing:-0.1px;
  transition:color .18s ease;
}
.np-faq-ico{ flex:none; width:18px; height:18px; position:relative; }
.np-faq-ico::before, .np-faq-ico::after{
  content:'';
  position:absolute;
  background:#E8212A;
  border-radius:1px;
  transition:transform .25s ease, opacity .25s ease;
}
.np-faq-ico::before{ left:0; right:0; top:8px; height:2px; }
.np-faq-ico::after{ top:0; bottom:0; left:8px; width:2px; }
.np-faq-item.open .np-faq-ico::after{ transform:scaleY(0); opacity:0; }
.np-faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.np-faq-item.open .np-faq-a{ max-height:1200px; }   /* was 600: the longest CandleStyler answer measures 681 px at 320 px wide and lost its last three lines; overflow is hidden, so the text was simply gone (2026-09-14) */
.np-faq-a .np-desc{ margin:0; padding:2px 4px 20px; }
.ecz-header .product-page-title{
  font-size:clamp(32px,3.6vw,56px);
  letter-spacing:-1.4px;
  text-shadow:0 0 30px rgba(255,255,255,0.16),
    0 2px 14px rgba(0,0,0,0.9),
    0 1px 2px rgba(0,0,0,0.8);
}
.ecz-header > div > div:last-child{ color:rgba(232,238,244,0.72); }
.ecz-bar::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:1px;
  background:rgba(255,255,255,0.52);
  top:0;
  bottom:auto;
}
.ecz-bar{ align-items:stretch; order:2; background:#262626; height:31px; padding:0; }
.ecz-bar-name, .ecz-bar-meta, .ecz-bar-count, .ecz-cell{
  font-family:var(--sans);
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  line-height:1;
  color:#fff;
  font-size:12.5px;
}
.ecz-cell{ flex:1 1 auto; justify-content:center; padding-top:1px; padding:0 9px; }
.ecz-bar-left{ align-items:stretch; gap:0; display:flex; width:100%; flex-wrap:nowrap; white-space:nowrap; }
.ecz-bar-left .ecz-cell:first-child{ padding-left:11px; }
.np-slide{
  top:0;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height:100%;
  z-index:1;
  transition:opacity .3s ease, transform .32s cubic-bezier(.22,1,.36,1);
  will-change:opacity, transform;
}
.np-slide.active{ z-index:2; }
.np-slide.t1-from-right{ transform:translateX(26px); }
.np-slide.t1-from-left{ transform:translateX(-26px); }
.np-slide.t1-snap{ transition:none; }
@media (prefers-reduced-motion:reduce){
  .np-slide{ transition:none; }
}
.ecz-topband::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:radial-gradient(circle,
      rgba(255,255,255,0.30) 0 1.6px,
      rgba(255,255,255,0.10) 2.6px,
      transparent 5.5px),

    linear-gradient(rgba(255,255,255,0.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.16) 1px, transparent 1px);
  background-size:70px 70px, 35px 35px, 35px 35px;
  background-position:calc(50% - 594.5px) top, calc(50% - 612px) top, calc(50% - 612px) top;
  -webkit-mask-image:radial-gradient(55% 41% at 50% 57%,
    #000 0 42%, rgba(0,0,0,0.40) 69%, transparent 91%);
  mask-image:radial-gradient(55% 41% at 50% 57%,
    #000 0 42%, rgba(0,0,0,0.40) 69%, transparent 91%);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  display:none;
}
.ecz-topband::after{ display:none; }
.ecz-header .product-page-title, .ecz-header .t3-price{
  font-family:var(--sans);
  font-weight:800;
  letter-spacing:-1px !important;
  text-shadow:0 0 34px rgba(255,255,255,0.091),
    0 3px 14px rgba(0,0,0,0.9),
    0 1px 3px rgba(0,0,0,0.9);
}
#t3Trial, #t3Buy{
  height:46px;
  padding:0 24px;
  box-sizing:border-box;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  border-color:rgba(255,255,255,0.42) !important;
  color:#fff;
  background:#000;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.10);
  transition:border-color .15s ease;
}
#t3Trial:hover, #t3Buy:hover{ border-color:rgba(255,255,255,0.7) !important; color:#fff; }
/* The hero buttons' load-time light-up (beam lap + arrow glow, ~45 lines) was removed 2026-09-10 on Kristian's word: "remove the effect so buttons look normal". */
.t3-bracket{
  position:absolute;
  pointer-events:none;
  z-index:7;
  background-color:#FFFFFF;
  opacity:0.8;
  -webkit-mask-image:linear-gradient(#000, #000), linear-gradient(#000, #000), linear-gradient(to bottom, #000 0%, rgba(0,0,0,0.9) 9%, transparent 46%, transparent 54%, rgba(0,0,0,0.9) 91%, #000 100%), linear-gradient(to bottom, #000 0%, rgba(0,0,0,0.9) 9%, transparent 46%, transparent 54%, rgba(0,0,0,0.9) 91%, #000 100%);
  mask-image:linear-gradient(#000, #000), linear-gradient(#000, #000), linear-gradient(to bottom, #000 0%, rgba(0,0,0,0.9) 9%, transparent 46%, transparent 54%, rgba(0,0,0,0.9) 91%, #000 100%), linear-gradient(to bottom, #000 0%, rgba(0,0,0,0.9) 9%, transparent 46%, transparent 54%, rgba(0,0,0,0.9) 91%, #000 100%);
  -webkit-mask-position:top left, bottom left, top left, top right;
  mask-position:top left, bottom left, top left, top right;
  -webkit-mask-size:100% 0.8px, 100% 0.8px, 0.8px 100%, 0.8px 100%;
  mask-size:100% 0.8px, 100% 0.8px, 0.8px 100%, 0.8px 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
.t3-price-div{ display:inline-block; width:1px; height:34px; background:rgba(255,255,255,0.22); align-self:center; margin:0 2px; }
.np-arrow{ background:#2E2E2E; border-color:rgba(255,255,255,0.18) !important; color:#fff; transition:none; }
.np-arrow:hover{ background:#fff; }
.t3-side-l{ right:calc(50% + 630px); border-right:1px solid rgba(255,255,255,0.18); padding-right:24px; }
.t3-side-r{ left:calc(50% + 630px); border-left:1px solid rgba(255,255,255,0.18); padding-left:24px; }
.t3-side{
  position:absolute;
  top:0;
  bottom:31px;
  transform:none;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  z-index:5;
  width:178px;
  text-align:center;
}
.t3-sbox-nav{
  width:88px;
  height:120px;
  margin-bottom:28px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;
  border:0;
  color:rgba(255,255,255,0.55);
  cursor:pointer;
  transition:none;
}
.t3-sbox-nav svg{ width:50px; height:50px; stroke-width:1.5; }
.t3-sbox-nav{ position:absolute; top:50%; margin-top:-60px; margin-bottom:0; transform:translateX(-50%); }
.t3-side-l .t3-sbox-nav{ left:calc(50% + 41px); }
.t3-side-r .t3-sbox-nav{ left:calc(50% - 41px); }
.t3-sbox-nav:hover{ color:#fff; }
.t3-side-l{ border-right:0; padding-right:0; }
.t3-side-r{ border-left:0; padding-left:0; }
.t3-gridbuy-wrap{ position:relative; height:0; }
.t3-gridbuy{
  position:absolute;
  bottom:0;
  left:50%;
  margin-left:-50vw;
  width:100vw;
  height:961px;
  z-index:-1;
  pointer-events:none;
  opacity:0.5;
  background-image:linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size:64px 64px, 64px 64px;
  -webkit-mask-image:linear-gradient(to top, #000 0%, #000 8%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask-image:linear-gradient(to top, #000 0%, #000 8%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
/* The same faint grid behind the pricing cards, the other way up: it starts on the rule above the cards
   and fades down the page (Kristian 2026-09-10). Same cell, opacity and side fade as .t3-gridbuy. */
.t3-gridpay-wrap{ position:relative; height:0; }
.t3-gridpay{
  position:absolute;
  top:0;
  left:50%;
  margin-left:-50vw;
  width:100vw;
  height:961px;
  z-index:-1;
  pointer-events:none;
  opacity:0.5;
  background-image:linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size:64px 64px, 64px 64px;
  -webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 8%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  mask-image:linear-gradient(to bottom, #000 0%, #000 8%, transparent 100%),
    linear-gradient(90deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.t3-vwapdiag{ max-width:1260px; margin:135px auto 0; padding:0; }
.t3-diag-copy{ display:block; }
.t3-diag-top{
  font-family:'DM Sans', var(--sans);
  font-size:46px;
  font-weight:600;
  line-height:1.06;
  letter-spacing:-1.2px;
  text-align:center;
  text-wrap:balance;
  color:#F4F4F4;
  margin:0;
}
.t3-diag-rule{ margin-bottom:32px; }
.t3-art-vol rect.hot{ fill:#1E90FF; fill-opacity:0.55; }
.t3-art-candles .up rect{ fill:#2EC27E; }
.t3-art-candles .up line{ stroke:#2EC27E; }
.t3-art-candles .down rect{ fill:#E8212A; }
.t3-art-candles .down line{ stroke:#E8212A; }
.t3-art-tag.red{ fill:#E8212A; }
.t3-diag-legend .sw{ width:34px; height:0; align-self:center; display:block; }
.t3-diag-lab .d{ font-weight:400; fill:rgba(255,255,255,0.42); font-size:12.5px; }
.t3-diag-candles .up rect{ fill:#2EC27E; }
.t3-diag-candles .up line{ stroke:#2EC27E; }
.t3-diag-candles .down rect{ fill:#E8212A; }
.t3-diag-candles .down line{ stroke:#E8212A; }
@media (max-width:980px){
  .t3-diag-top{ font-size:30px; letter-spacing:-0.5px; margin-bottom:28px; }
}
.t3-read-candles .up rect{ fill:#2EC27E; }
.t3-read-candles .up line{ stroke:#2EC27E; }
.t3-read-candles .down rect{ fill:#E8212A; }
.t3-read-candles .down line{ stroke:#E8212A; }
.t3-rcard{ position:relative; max-width:1150px; height:566px; margin:88px auto 0; overflow:hidden; }
.t3-rc-imgwrap{
  position:absolute;
  right:0;
  top:0;
  width:1058px;
  height:566px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.26);
  box-sizing:border-box;
  -webkit-mask-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='1058' height='566'><filter id='f' x='-20%25' y='-20%25' width='140%25' height='140%25'><feGaussianBlur stdDeviation='60'/></filter><path filter='url(%23f)' fill='%23000' d='M765,-80 C665,30 595,120 495,170 C430,205 410,240 383,320 C355,395 330,470 291,566 L255,700 L1300,700 L1300,-80 Z'/></svg>");
  mask-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='1058' height='566'><filter id='f' x='-20%25' y='-20%25' width='140%25' height='140%25'><feGaussianBlur stdDeviation='60'/></filter><path filter='url(%23f)' fill='%23000' d='M765,-80 C665,30 595,120 495,170 C430,205 410,240 383,320 C355,395 330,470 291,566 L255,700 L1300,700 L1300,-80 Z'/></svg>");
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
}
.t3-rc-imgwrap img{
  display:block;
  position:absolute;
  width:1102px;
  height:auto;
  max-width:none;
  left:-44px;
  top:-13px;
}
.t3-rc-copy{ position:relative; z-index:2; max-width:680px; padding:0; }
.t3-rc-h{
  font-family:'DM Sans', var(--sans);
  font-size:48px;
  font-weight:600;
  line-height:1.06;
  letter-spacing:-1.2px;
  color:#F4F4F4;
  margin:28px 0 44px;
  max-width:680px;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.t3-rc-hl{ color:#E8212A; display:inline-block; }
.t3-rc-hl::after{
  content:'';
  display:block;
  height:2px;
  background:#E8212A;
  margin-top:0;
  width:calc(100% + 14px);
  margin-left:-7px;
}
.t3-rc-ann{ position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none; }
.t3-rc-ann line{ stroke-width:1; vector-effect:non-scaling-stroke; }
.t3-ann-tip{ fill:none; stroke:#FFFFFF; stroke-width:2; stroke-linejoin:miter; stroke-linecap:butt; vector-effect:non-scaling-stroke; }
.t3-rc-labels{ position:absolute; inset:0; z-index:2; pointer-events:none; }
.t3-lab{
  position:absolute;
  left:0;
  width:236px;
  transform:translateY(-50%);
  background:rgba(255,255,255,0.035);
  border:1px solid rgba(255,255,255,0.16);
  padding:13px 16px;
  font-family:'Inter', var(--sans);
  font-size:13px;
  font-weight:400;
  line-height:1.55;
  letter-spacing:0.1px;
  color:rgba(255,255,255,0.70);
  box-shadow:0 12px 28px -18px rgba(0,0,0,0.85);
}
.t3-lab b{ font-weight:600; color:rgba(255,255,255,0.98); }
.t3-spec-row{ display:grid; grid-template-columns:150px 1fr; align-items:center; border-top:1px solid rgba(255,255,255,0.24); }
.ecz-rule.t3-rule-fold{ border-top-color:transparent; margin-top:31px; }
.t3-spec-lab{
  font-family:var(--mono);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.72);
  padding:10px 0;
}
.t3-spec-cells{ display:flex; padding:10px 0; }
.t3-spec-c{ flex:1; display:flex; flex-direction:column; gap:3px; padding-left:22px; border-left:1px solid rgba(255,255,255,0.13); }
.t3-spec-c:first-child{ border-left:0; padding-left:0; }
.t3-spec-c .n{ font-family:var(--sans); font-size:16px; font-weight:500; color:#fff; letter-spacing:0.01em; }
.t3-spec-c .v{ font-family:var(--sans); font-size:13.5px; font-weight:400; color:rgba(255,255,255,0.70); letter-spacing:0.005em; }
@media (max-width:900px){
  .t3-spec-row{ grid-template-columns:1fr; }
  .t3-spec-lab{ padding-bottom:0; }
  .t3-spec-cells{ flex-wrap:wrap; }
  .t3-spec-c{ flex:0 0 50%; padding-left:0; border-left:0; padding-bottom:10px; }
}
@media (max-width:1620px){
  .t3-side{ display:none; }
}
/* the overlay arrows are hidden ONLY while the side boxes carry the prev/next buttons (≥1621 px); between 761 and
   1620 px neither was visible and slide 2+ could not be reached with a mouse (audit 2026-09-10, every product page) */
@media (min-width:1621px){ .np-arrow{ display:none !important; } }
.np-hero{
  border-radius:0;
  max-width:1260px;
  background:#232429;
  border:1px solid rgba(255,255,255,0.33);
  box-shadow:0 0 0 2px rgba(0,0,0,0.85),
    0 6px 18px -6px rgba(0,0,0,0.9),
    0 26px 58px -34px rgba(0,0,0,0.95);
  box-sizing:content-box;
  padding:0;
  aspect-ratio:1260 / 674;
  overflow:hidden;
}
.t3-zoom{
  position:absolute;
  top:0;
  right:66px;
  bottom:auto;
  left:auto;
  z-index:6;
  display:flex;
  align-items:stretch;
  gap:0;
  background:#262626;
  border:1px solid rgba(255,255,255,0.28);
  border-right:none;
}
.t3-zoom button{
  height:27px;
  min-width:27px;
  padding:0 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:none;
  border:0;
  cursor:pointer;
  font-family:var(--sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:0.5px;
  line-height:1;
  color:#fff;
}
.t3-zoom button:hover:not(:disabled){ background:#333; }
.t3-zoom button:disabled{ color:rgba(255,255,255,0.30); cursor:default; }
.t3-zoom .t3-zoom-lvl{
  width:56px;
  padding:0;
  font-variant-numeric:tabular-nums;
  border-left:1px solid rgba(255,255,255,0.28);
  border-right:1px solid rgba(255,255,255,0.28);
}
.np-hero.is-zoomed .np-slide{ cursor:grab; }
.np-hero.is-zoomed.is-panning .np-slide{ cursor:grabbing; }
.np-hero .t3-zoom, .np-hero .np-counter{
  top:10px !important;
  bottom:auto;
  left:auto;
  height:28px;
  box-sizing:border-box;
  z-index:6;
  background:rgba(0,0,0,0.62);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.18);
  border-radius:6px;
  overflow:hidden;
  box-shadow:none;
  font-family:'JetBrains Mono', Consolas, 'Courier New', monospace;
  font-size:11.5px;
  font-weight:500;
  letter-spacing:0;
  color:rgba(255,255,255,0.85);
  font-variant-numeric:tabular-nums;
}
.np-hero .np-counter{ right:10px !important; padding:0 12px; color:rgba(255,255,255,0.85); }
.np-hero .t3-zoom{ right:84px; }
.np-hero .t3-zoom button{
  height:26px;
  min-width:26px;
  padding:0;
  font-family:inherit;
  font-size:12px;
  font-weight:500;
  letter-spacing:0;
  color:rgba(255,255,255,0.7);
}
.np-hero .t3-zoom button:hover:not(:disabled){ background:rgba(255,255,255,0.08); }
.np-hero .t3-zoom button:disabled{ color:rgba(255,255,255,0.3); }
.np-hero .t3-zoom .t3-zoom-lvl{
  width:auto;
  min-width:50px;
  padding:0 10px;
  color:rgba(255,255,255,0.85);
  border-left:1px solid rgba(255,255,255,0.12);
  border-right:1px solid rgba(255,255,255,0.12);
}
.t3-sh-label{ font-family:'Inter', var(--sans); font-size:14px; font-weight:500; letter-spacing:0.2px; color:rgba(255,255,255,0.68); white-space:nowrap; }
.t3-sh-sep{ width:1px; height:14px; flex-shrink:0; background:rgba(255,255,255,0.22); }   /* flex-shrink:0 (2026-09-24): a tagline that fills the row shrank both separators to 0 px */
.t3-sh-mid{ display:flex; align-items:center; justify-content:center; gap:12px; margin-top:9px; }
.t3-sh-info{ font-family:'Inter', var(--sans); font-size:14px; font-weight:500; letter-spacing:0.2px; color:rgba(255,255,255,0.68); white-space:nowrap; }
.ecz-header{ z-index:3; margin-top:-10px !important; height:101px; padding-top:28.1px; position:relative; }
.np-heroband{
  background:transparent;
  display:flex;
  flex-direction:column;
  margin-top:13.6px !important;
  border:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.08),
    0 1px 0 rgba(0,0,0,0.75),
    0 48px 110px -50px rgba(0,0,0,0.95),
    0 0 40px rgba(255,255,255,0.0221),
    0 0 160px rgba(255,255,255,0.0158);   /* outer glow ×0.8 (Kristian 2026-09-10: "turn down the outer glow 20%"); was 0.0276 / 0.0197 */
}
.t3-demo-h{
  font-family:'DM Sans', var(--sans);
  font-size:52px;
  font-weight:600;
  line-height:1.05;
  letter-spacing:-1.3px;
  text-align:center;
  text-wrap:balance;
  color:#F4F4F4;
  margin:0 0 10px;
  -webkit-font-smoothing:antialiased;
}
.t3-demo-h + .t3-diag-rule{ margin-bottom:18px; }
.t3-demo-loop{ display:block; width:100%; height:100%; object-fit:cover; background:#000; }
.t3-demo-hit{ position:absolute; inset:0; background:none; border:0; padding:0; cursor:pointer; }
.t3-demo-hit:focus-visible{ outline:1px solid rgba(255,255,255,0.6); outline-offset:-3px; }
.t3-demo-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  height:46px;
  padding:0 22px;
  font:600 15px 'Inter', var(--sans);
  letter-spacing:0.005em;
  color:rgba(255,255,255,0.94);
  background:#000;
  border:1px solid rgba(255,255,255,0.42);
  border-radius:4px;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.10);
  transition:border-color .15s ease, color .15s ease;
}
.t3-demo-btn:hover{ border-color:rgba(255,255,255,0.7); color:#fff; }
.t3-demo-btn-ico{ display:inline-flex; }
.t3-lb{
  position:fixed;
  inset:0;
  z-index:5000;
  background:rgba(0,0,0,0.88);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.t3-lb[hidden]{ display:none; }
.t3-lb-box{ width:min(1260px, 100%); }
.t3-lb-frame{
  position:relative;
  aspect-ratio:16/9;
  background:#000;
  border:1px solid rgba(255,255,255,0.42);
  box-shadow:0 0 40px rgba(255,255,255,0.06), 0 40px 80px -30px rgba(0,0,0,1);
}
.t3-lb-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
.t3-lb-bar{ display:flex; justify-content:space-between; align-items:center; margin-top:12px; font:500 13px 'Inter', var(--sans); }
.t3-lb-yt{ color:rgba(255,255,255,0.62); text-decoration:none; }
.t3-lb-yt:hover{ color:#fff; }
.t3-lb-x{
  background:none;
  border:1px solid rgba(255,255,255,0.42);
  border-radius:4px;
  color:#fff;
  font:600 13px 'Inter', var(--sans);
  height:36px;
  padding:0 14px;
  cursor:pointer;
}
.t3-lb-x:hover{ border-color:#fff; }
/* ── Gallery full-size viewer (2026-09-10) ─────────────────────────────────────────────── */
.t3-quad-fr{ cursor:zoom-in; }
.t3-quad-zoom{
  position:absolute; left:0; bottom:0; z-index:4;   /* fused into the bottom-left corner, against the edges (Kristian 2026-09-10) */
  width:36px; height:30px; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  background:#0A0A0C;   /* solid, not translucent (Kristian 2026-09-10) */
  border:1px solid rgba(255,255,255,0.30); border-left:0; border-bottom:0;
  border-radius:0 4px 0 0;
  color:rgba(255,255,255,0.88);
  cursor:zoom-in;
  opacity:1;
  transition:border-color .15s ease, background .15s ease;
}
.t3-quad-fr:hover .t3-quad-zoom, .t3-quad-zoom:focus-visible{ border-color:rgba(255,255,255,0.75); background:#141416; }
.t3-ilb{
  position:fixed; inset:0; z-index:5000;
  background:rgba(0,0,0,0.9);
  display:flex; align-items:center; justify-content:center;
  padding:56px 84px;
  cursor:zoom-out;
}
.t3-ilb[hidden]{ display:none; }
.t3-ilb-fig{ margin:0; display:flex; flex-direction:column; align-items:center; cursor:default; animation:t3ilbPop .22s cubic-bezier(.2,.7,.3,1); }
@keyframes t3ilbPop{ from{ opacity:0; transform:scale(.97); } }
.t3-ilb-img{ display:block; max-width:100%; width:auto; height:auto; background:#000; border:1px solid rgba(255,255,255,0.28); box-shadow:0 40px 90px -30px rgba(0,0,0,1); }
.t3-ilb-cap{ display:flex; justify-content:space-between; align-items:flex-start; gap:24px; width:100%; margin-top:14px; font:500 14px 'Inter', var(--sans); color:rgba(255,255,255,0.82); }
.t3-ilb-text{ display:flex; flex-direction:column; gap:4px; max-width:90ch; }
.t3-ilb-title{ font:600 15px/1.3 'Inter', var(--sans); color:#fff; }
.t3-ilb-desc{ font:400 14px/1.5 'Inter', var(--sans); color:rgba(255,255,255,0.7); }   /* 1–2 lines explaining the feature under the big picture (Kristian 2026-09-10) */
.t3-ilb-count{ font-family:var(--mono); font-size:12px; letter-spacing:0.06em; color:rgba(255,255,255,0.5); }
.t3-ilb-x{
  position:fixed; top:16px; right:20px;
  background:rgba(8,8,10,0.7); border:1px solid rgba(255,255,255,0.42); border-radius:4px;
  color:#fff; font:600 13px 'Inter', var(--sans); height:36px; padding:0 14px; cursor:pointer;
}
.t3-ilb-nav{
  position:fixed; top:50%; transform:translateY(-50%);
  width:44px; height:64px; padding:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(8,8,10,0.7); border:1px solid rgba(255,255,255,0.30); border-radius:4px; color:#fff; cursor:pointer;
}
.t3-ilb-prev{ left:20px; } .t3-ilb-next{ right:20px; }
.t3-ilb-x:hover, .t3-ilb-nav:hover{ border-color:#fff; }
@media (max-width:760px){ .t3-ilb{ padding:64px 10px 24px; } .t3-ilb-nav{ width:36px; height:52px; } .t3-ilb-prev{ left:6px; } .t3-ilb-next{ right:6px; } .t3-quad-zoom{ width:44px; height:40px; } }   /* phone: a 44×40 tap target (was 32×26; Kristian 2026-09-10) */
.t3-demo{
  max-width:1160px;
  margin:135px auto 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  column-gap:24px;
}
.t3-demo-h{ flex:0 0 auto; font-size:44px; letter-spacing:-1.1px; text-align:left; margin:0; }
.t3-demo-h + .t3-diag-rule{ display:none; }
.t3-demo-cta{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
  font:400 15px/1.5 'Inter', var(--sans);
  color:rgba(255,255,255,0.62);
  flex:0 0 auto;
  margin:0;
}
.t3-demo-frame{
  position:relative;
  border:1px solid rgba(255,255,255,0.42);
  background:#000;
  box-shadow:0 0 26px rgba(255,255,255,0.08), 0 0 90px rgba(255,255,255,0.05), 0 20px 44px -24px rgba(0,0,0,0.95);
  aspect-ratio:1246/700;
  overflow:hidden;
  flex:0 0 100%;
  width:100%;
  box-sizing:border-box;
  margin-top:26px;
}
.t3-nv{ max-width:1160px; margin:135px auto 0; padding:0; }
.t3-nv-cap{ font:600 11px 'Inter', var(--sans); letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); }
.t3-nv-cap.on{ color:#F4F4F4; }
.t3-nv-eyebrow{ display:block; text-align:center; margin:0 0 48px; font-size:13px; }
.t3-nv-h{
  font-family:'DM Sans', var(--sans);
  font-size:52px;
  font-weight:600;
  line-height:1.05;
  letter-spacing:-1.3px;
  text-align:center;
  text-wrap:balance;
  color:#F4F4F4;
  margin:0 0 10px;
  -webkit-font-smoothing:antialiased;
}
.t3-nv-txt{ margin:0; font:400 15px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.82); }
.t3-nv-txt b{ font-weight:600; color:#F4F4F4; }
.t3-nv-txt.small{ margin-top:14px; font-size:13.5px; color:rgba(255,255,255,0.45); }
.t3-nv-panel{ background:rgba(255,255,255,0.035); border:1px solid rgba(255,255,255,0.14); box-shadow:0 12px 28px -18px rgba(0,0,0,0.85); }
.t3-nv-calc{ display:grid; grid-template-columns:minmax(0,1fr) 600px; }
.t3-nv-calc-l{ padding:36px 40px 30px; border-right:1px solid rgba(255,255,255,0.14); display:flex; flex-direction:column; gap:26px; }
.t3-nv-calc-r{ padding:26px 28px 22px; display:flex; flex-direction:column; gap:14px; }
.t3-nv-f{ display:flex; flex-direction:column; gap:8px; }
.t3-nv-eq{ font:500 26px/1.25 'DM Sans', var(--sans); letter-spacing:-0.4px; color:#F4F4F4; white-space:nowrap; }
.t3-nv-eq small{ font-size:15px; letter-spacing:0; color:rgba(255,255,255,0.62); }
.t3-nv-eq .sig, .t3-nv-term.sig{ color:#1E90FF; }
.t3-nv-eq .sd, .t3-nv-term.sd{ color:#20B2AA; }
.t3-nv-f .t3-nv-txt{ font-size:14.5px; color:rgba(255,255,255,0.62); }
.t3-nv-term{ cursor:default; border-bottom:1px dotted rgba(255,255,255,0.28); transition:border-color .15s ease; }
.t3-nv-term:hover{ border-bottom-color:#fff; }
.t3-nv-hint{ margin-top:auto; padding-top:8px; color:rgba(255,255,255,0.3); }
.t3-nv-legend{ display:flex; gap:18px; flex-wrap:wrap; }
.t3-nv-legend span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font:500 11px 'Inter', var(--sans);
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
}
.t3-nv-legend i{ width:16px; height:2px; display:inline-block; }
.t3-nv-chart{ display:block; width:100%; height:auto; background:#050505; border:1px solid rgba(255,255,255,0.1); }
.t3-nv-chart .l-tp{ opacity:0; transition:opacity .15s ease; }
.t3-nv[data-hi] .t3-nv-chart .l-bands, .t3-nv[data-hi] .t3-nv-chart .l-vwap, .t3-nv[data-hi] .t3-nv-chart .l-bars{
  opacity:0.28;
  transition:opacity .15s ease;
}
.t3-nv[data-hi="vwap"] .t3-nv-chart .l-vwap, .t3-nv[data-hi="bands"] .t3-nv-chart .l-bands, .t3-nv[data-hi="sd"] .t3-nv-chart .l-sd, .t3-nv[data-hi="tp"] .t3-nv-chart .l-bars, .t3-nv[data-hi="cpv"] .t3-nv-chart .l-bars, .t3-nv[data-hi="cv"] .t3-nv-chart .l-bars{
  opacity:1;
}
.t3-nv[data-hi="tp"] .t3-nv-chart .l-tp{ opacity:1; }
.t3-nv[data-hi="vwap"] .c-vwap, .t3-nv[data-hi="sd"] .c-sd, .t3-nv[data-hi="tp"] .c-tp, .t3-nv[data-hi="cpv"] .c-cpv, .t3-nv[data-hi="cv"] .c-cv{
  background:rgba(255,255,255,0.09);
  color:#fff;
}
.t3-nv[data-hi="bands"] .c-sd, .t3-nv[data-hi="bands"] .c-vwap{ background:rgba(255,255,255,0.09); color:#fff; }
.t3-nv-work{ grid-column:1 / -1; border-top:1px solid rgba(255,255,255,0.14); }
.t3-nv-work-h{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 40px; flex-wrap:wrap; }
.t3-nv-tblwrap{ overflow-x:auto; }
.t3-nv-ex{ width:100%; border-collapse:collapse; }
.t3-nv-ex th, .t3-nv-ex td{
  padding:9px 12px;
  text-align:right;
  font:400 13px 'JetBrains Mono', Consolas, monospace;
  color:rgba(255,255,255,0.82);
  border-top:1px solid rgba(255,255,255,0.07);
  font-variant-numeric:tabular-nums;
  transition:background .15s ease;
}
.t3-nv-ex th{
  font:600 10.5px 'Inter', var(--sans);
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
  border-top:0;
  padding-bottom:6px;
}
.t3-nv-ex td:first-child, .t3-nv-ex th:first-child{ text-align:left; padding-left:40px; }
.t3-nv-ex td:last-child, .t3-nv-ex th:last-child{ padding-right:40px; }
.t3-nv-ex td.c-vwap{ color:#1E90FF; }
.t3-nv-ex td.c-sd{ color:#20B2AA; }
.t3-nv-ex tr.gap td{ text-align:center; color:rgba(255,255,255,0.3); font-size:12px; padding:6px 12px; }
.t3-nv-work-foot{ margin:0; padding:14px 40px 20px; font:400 13.5px/1.55 'Inter', var(--sans); color:rgba(255,255,255,0.62); }
.t3-nv-rules{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:14px; }
.t3-nv-rule{ padding:22px 22px 20px; display:flex; flex-direction:column; gap:12px; }
.t3-nv-rule .t3-nv-txt{ font-size:14px; color:rgba(255,255,255,0.62); }
.t3-nv-rule .t3-nv-txt b{ color:#F4F4F4; }
.t3-nv-mini{ display:block; width:100%; height:auto; }
.t3-nv-rowh{
  display:flex;
  align-items:center;
  gap:16px;
  padding:18px 4px;
  cursor:pointer;
  background:none;
  border:0;
  width:100%;
  color:inherit;
  font:inherit;
  text-align:left;
}
.t3-nv-rowh .q{ flex:1; font:600 15.5px 'Inter', var(--sans); color:rgba(255,255,255,0.95); }
.t3-nv-rowh .n{ font:500 11px 'Inter', var(--sans); letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); white-space:nowrap; }
.t3-nv-rowh:hover .q{ color:#fff; }
.t3-nv-rowh:focus-visible{ outline:1px solid rgba(255,255,255,0.6); outline-offset:-2px; }
.t3-nv-ico{ flex:none; width:18px; height:18px; position:relative; }
.t3-nv-ico::before, .t3-nv-ico::after{
  content:'';
  position:absolute;
  background:#E8212A;
  border-radius:1px;
  transition:transform .25s ease, opacity .25s ease;
}
.t3-nv-ico::before{ left:0; right:0; top:8px; height:2px; }
.t3-nv-ico::after{ top:0; bottom:0; left:8px; width:2px; }
.t3-nv-row.open .t3-nv-ico::after{ transform:scaleY(0); opacity:0; }
.t3-nv-rowa{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.t3-nv-row.open .t3-nv-rowa{ max-height:9000px; }   /* was 4000: the settings table is taller than that on phones (ProVWAP lost 704 px at 390, 1413 at 600; IRL 437 at 600 — 2026-09-12) and overflow:hidden simply cut the last rows off */
.t3-nv-rows{ margin-top:14px; border-top:1px solid rgba(255,255,255,0.14); border-top-color:rgba(255,255,255,0.10); }
.t3-nv-row{ border-bottom:1px solid rgba(255,255,255,0.14); border-bottom-color:rgba(255,255,255,0.10); }
.t3-nv-rowh{ padding:22px 0; gap:24px; }
.t3-nv-rowh .q{ font:500 16px/1.4 'Inter', var(--sans); color:#F4F4F4; }
.t3-nv-ico{ width:14px; height:14px; }
.t3-nv-ico::before{ top:6.5px; height:1px; background:#fff; border-radius:0; }
.t3-nv-ico::after{ left:6.5px; width:1px; background:#fff; border-radius:0; }
.t3-nv-rowin{ padding:0 0 26px; }
.t3-nv-shots{ margin:0 0 22px; }
.t3-nv-shots figure{ margin:0; }
.t3-nv-shots img{ display:block; width:100%; max-width:521px; height:auto; }
.t3-nv-set{ width:100%; border-collapse:collapse; }
.t3-nv-set th, .t3-nv-set td{
  padding:8px 10px;
  text-align:left;
  font:400 13.5px 'Inter', var(--sans);
  color:rgba(255,255,255,0.82);
  border-top:1px solid rgba(255,255,255,0.07);
}
.t3-nv-set thead th{ font:600 10.5px 'Inter', var(--sans); letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); border-top:0; }
.t3-nv-set tr.g th{
  padding:18px 10px 6px;
  font:600 11px 'Inter', var(--sans);
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:#F4F4F4;
  border-top:0;
}
.t3-nv-set td.mono{ font:400 13px 'JetBrains Mono', Consolas, monospace; color:rgba(255,255,255,0.62); }
.t3-nv-dl{ margin:0; display:grid; gap:10px; }
.t3-nv-dl div{ display:grid; grid-template-columns:130px 1fr; gap:14px; }
.t3-nv-dl dt{ font:600 11px 'Inter', var(--sans); letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.45); padding-top:3px; }
.t3-nv-dl dd{ margin:0; font:400 14.5px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.82); }
.t3-nv-ver{ display:grid; grid-template-columns:1fr 1fr; gap:32px 48px; }
.t3-nv-ver > div{ display:flex; flex-direction:column; gap:14px; }
@media (max-width:900px){
  .t3-nv-ver{ grid-template-columns:1fr; }
}
a.t3-verified{ text-decoration:none; color:rgba(255,255,255,0.94); gap:8px; }
a.t3-verified svg{ color:rgba(255,255,255,0.7); flex:none; }
a.t3-verified:hover{ color:#fff; background:rgba(255,255,255,0.05); }
.t3-nv-plots{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px 24px; }
.t3-nv-plots div{
  display:flex;
  justify-content:space-between;
  gap:12px;
  font:400 13px 'JetBrains Mono', Consolas, monospace;
  color:rgba(255,255,255,0.82);
  border-bottom:1px solid rgba(255,255,255,0.07);
  padding:6px 0;
}
.t3-nv-plots div span:last-child{ color:rgba(255,255,255,0.62); }
@media (max-width:1100px){
  .t3-nv-calc{ grid-template-columns:1fr; }
  .t3-nv-calc-l{ border-right:0; border-bottom:1px solid rgba(255,255,255,0.14); }
  .t3-nv-rules, .t3-nv-plots{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .t3-nv-rules{ grid-template-columns:1fr; }
  .t3-nv-h{ font-size:38px; }
  .t3-nv-eq{ white-space:normal; font-size:22px; }
}
.t3-use{ max-width:1160px; margin:135px auto 0; padding:0; }
.t3-use-h{
  font-family:'DM Sans', var(--sans);
  font-size:52px;
  font-weight:600;
  line-height:1.05;
  letter-spacing:-1.3px;
  text-align:center;
  text-wrap:balance;
  color:#F4F4F4;
  margin:0 0 10px;
  -webkit-font-smoothing:antialiased;
}
.t3-use-p{ margin:0 auto 52px; max-width:700px; text-align:center; font:400 17px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.62); }
.t3-use-grid{ display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(255,255,255,0.14); border-left:1px solid rgba(255,255,255,0.14); }
.t3-use-cell{
  position:relative;
  padding:30px 32px;
  border-right:1px solid rgba(255,255,255,0.14);
  border-bottom:1px solid rgba(255,255,255,0.14);
  display:flex;
  flex-direction:column;
  gap:12px;
}
.t3-use-lab{
  font:500 11px/1 'JetBrains Mono', Consolas, monospace;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.42);
  margin-bottom:2px;
}
.t3-use-cell b{ display:block; font:600 22px/1.2 'DM Sans', var(--sans); letter-spacing:-0.4px; color:#F4F4F4; margin:0; }
.t3-use-cell p{ margin:0; max-width:46ch; font:400 15px/1.55 'Inter', var(--sans); color:rgba(255,255,255,0.62); }
.t3-use-foot{ margin:44px auto 0; max-width:760px; text-align:center; font:400 13px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.42); }
.t3-use-foot a{ color:#F4F4F4; text-decoration:underline; text-underline-offset:3px; }
/* Product feature section (.t3-feat — ProVWAP and Intraday Reference Levels, 2026-09-23): the "How traders use it"
   grid with <h3> headings in the phrases people search. The <b> setting codes inside the paragraphs must stay inline
   body text — the grid's own `.t3-use-cell b` rule would otherwise turn each one into a 22px block line (measured:
   two cells grew to 444px). Lives here, not in the partials, so the section cannot lose its typography with one
   deleted <style> block. */
.t3-feat .t3-feat-h{ display:block; font:600 22px/1.2 'DM Sans', var(--sans); letter-spacing:-0.4px; color:#F4F4F4; margin:0; }
.t3-feat .t3-use-cell p b{ display:inline; font:inherit; font-weight:600; letter-spacing:inherit; color:rgba(255,255,255,0.82); margin:0; }
/* 2026-09-24 (SuperTrend review): between 601 and 1259 px some feature headings wrap to two lines and their neighbours do not, so the
   paragraphs of a row started 27 px apart; two lines of room for every heading keeps the rows even (single-line headings gain 26 px). */
@media (min-width:601px) and (max-width:1259px){ .t3-feat .t3-feat-h{ min-height:2.4em; } }
@media (min-width:601px) and (max-width:700px){ .t3-feat .t3-feat-h{ min-height:3.6em; } }   /* 2026-09-24 (Futures News review): a heading reaches three lines around 625-655 px */
@media (max-width:980px){
  .t3-use-h{ font-size:40px; }
}
@media (max-width:600px){
  .t3-use-grid{ grid-template-columns:1fr; }
  .t3-use-cell{ padding:22px 20px; }
}
.t3-close{ position:relative; isolation:isolate; max-width:1160px; margin:135px auto 0; padding:56px 0 8px !important; text-align:center; }
.t3-close::before{
  content:'';
  position:absolute;
  inset:-40% -26% -30%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse closest-side at 50% 42%, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.06) 30%, rgba(255,255,255,0.025) 60%, rgba(255,255,255,0) 100%);
}
.t3-close-h{
  font-family:'DM Sans', var(--sans);
  font-size:60px;
  font-weight:600;
  line-height:1.02;
  letter-spacing:-1.8px;
  color:#F4F4F4;
  margin:0 auto 18px;
  max-width:18ch;
  text-wrap:balance;
  -webkit-font-smoothing:antialiased;
}
.t3-close-btns{ display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }
.t3-close-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:46px;
  padding:0 24px;
  font:600 14px 'Inter', var(--sans);
  letter-spacing:0.01em;
  color:#fff;
  background:#000;
  border:1px solid rgba(255,255,255,0.5);
  text-decoration:none;
  white-space:nowrap;
}
.t3-close-btn:hover{ border-color:rgba(255,255,255,0.9); }
.t3-close-btn.solid{ background:#fff; color:#000; border-color:#fff; }
.t3-close-btn.solid:hover{ background:#EDEDED; }
.t3-close-not{ margin:26px auto 0; max-width:640px; font:400 14px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.45); }
.t3-close-not b{ font-weight:600; color:rgba(255,255,255,0.75); }
.t3-close-btn{
  height:48px;
  padding:0 26px;
  border-radius:4px;
  font-size:15px;
  border-color:rgba(255,255,255,0.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.10);
}
.t3-close-btn.solid{ box-shadow:none; }
.t3-close-arr{ display:inline-flex; margin-left:10px; }
.t3-close-p{
  margin:0 auto 30px;
  font:400 17px/1.6 'Inter', var(--sans);
  color:rgba(255,255,255,0.66);
  max-width:600px;
  font-size:18px;
  line-height:1.55;
  margin-bottom:34px;
}
@media (max-width:1100px){
  .t3-close-h{ font-size:44px; }
}
.t3-quad{ position:relative; display:grid; grid-template-columns:623px 623px; gap:44px 14px; width:1260px; margin:105px auto 28px; }
.t3-quad-f{ margin:0; display:flex; flex-direction:column; }
.t3-quad-fr{
  position:relative;
  width:623px;
  height:350px;
  aspect-ratio:auto;
  overflow:hidden;
  background:#000;
  box-sizing:border-box;
  border:0;
  border-radius:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.08),
    0 1px 0 rgba(0,0,0,0.75),
    0 24px 55px -25px rgba(0,0,0,0.95),
    0 0 20px rgba(255,255,255,0.035),
    0 0 80px rgba(255,255,255,0.027);
}
.t3-quad-fr::after{ content:""; position:absolute; inset:0; pointer-events:none; z-index:3; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.45); }
.t3-quad-fr img{ display:block; width:100%; height:100%; object-fit:cover; }
.t3-quad figcaption{ text-align:center; padding:20px 12px 0; }
.t3-quad figcaption h3{
  margin:0 0 10px;
  font:700 24px/1.2 'DM Sans', var(--sans);
  letter-spacing:-0.4px;
  color:#FFFFFF;
  text-shadow:0 0 18px rgba(255,255,255,0.28), 0 0 2px rgba(255,255,255,0.25);
}
.t3-quad{ gap:56px 14px; }
.t3-quad-fr{
  background:#0A0A0A;
  border:1px solid rgba(255,255,255,0.22);
  border-radius:0;
  box-shadow:0 0 34px rgba(255,255,255,0.04), 0 0 110px rgba(255,255,255,0.026), 0 10px 34px rgba(0,0,0,0.55);
}
@media (max-width:1320px){
  .t3-quad{ width:auto; max-width:1260px; margin-left:24px; margin-right:24px; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .t3-quad-f{ min-width:0; }
  .t3-quad-fr{ width:100%; height:auto; aspect-ratio:623/350; }
  .t3-quad figcaption p{ white-space:normal; }
}
@media (max-width:760px){
  .t3-quad{ grid-template-columns:1fr; }
}
.t3-quad-fr::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:0;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,0.75);
  background:none;
  -webkit-mask:none;
  mask:none;
  pointer-events:none;
  z-index:3;
}
.t3-quad figcaption{ text-align:left; padding:16px 0 0; }
.t3-quad figcaption h3{ font:600 18px/1.3 'DM Sans', var(--sans); letter-spacing:-0.2px; color:#F4F4F4; margin:0 0 5px; text-shadow:none; }
.t3-quad figcaption p{ margin:0; font:400 14px/1.55 'Inter', var(--sans); color:rgba(255,255,255,0.55); }
/* one line only where the four tiles sit side by side at full width; below 1321 px the caption wraps. (The 1320 px
   override further up came BEFORE this rule and never won, so captions ran under the next tile and off the phone
   screen on LiveBrackets and IRL — measured +236 / +247 px at 390 on 2026-09-12. The 58ch cap that sat here was
   already narrower than every caption and did nothing.) */
@media (min-width:1321px){ .t3-quad figcaption p{ white-space:nowrap; } }
.ecz-showzone{ position:relative; }
/* 1016 on EVERY product page (Kristian 2026-09-10: "make all comparison tables 1016") — the 10% wider table IRL and
   FNI had as page overrides is now the shared rule; the "Works on" plate follows it so their edges align. Between
   1001 and 1099 px the old 924 stays (a 1016 panel overran a 1024 viewport, measured 2026-09-09); ≤1000 = auto. */
.t3-cmp-panel{ width:1016px !important; max-width:1016px !important; margin-left:auto !important; margin-right:auto !important; }
.t3-cmp{ width:100%; }
.t3-cmp thead .a, .t3-cmp thead .b, .t3-cmp tbody td.a, .t3-cmp tbody td.b{ width:130px !important; min-width:0; }
.t3-cmp thead .a, .t3-cmp thead .b, .t3-cmp tbody td{ border-left:0 !important; }
.t3-cmp tbody tr{ border-top:1px solid rgba(255,255,255,0.14); }
.t3-cmp tbody tr:last-child{ border-bottom:1px solid rgba(255,255,255,0.40); }
.t3-cmp tbody td{ padding:0 8px; height:40px; box-sizing:border-box; vertical-align:middle; }
.t3-cmp tbody th{ padding-top:10px !important; padding-bottom:10px !important; color:rgba(255,255,255,0.86) !important; }
.t3-cmp tbody tr.grp td, .t3-cmp thead .f{ color:rgba(255,255,255,0.78) !important; }
.t3-cmp thead .b{ color:rgba(255,255,255,0.86) !important; }
.t3-cmp .sqr{ display:flex; align-items:center; justify-content:center; height:100%; background:none; border:0; }
.t3-cmp .sqr .yes{ color:#FF2F38; }
.t3-cmp .sqr .yes-dim{ color:rgba(255,255,255,0.72); }
.t3-spec{
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  max-width:1016px;
  margin:0 auto 0 !important;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
/* the 1001–1099 px fallback for both (after the base .t3-spec rule so it wins on equal specificity) */
@media (max-width:1099px){ .t3-cmp-panel{ width:924px !important; max-width:924px !important; } .t3-spec{ max-width:924px; } }
.t3-spec-row{ border-top:1px solid rgba(255,255,255,0.14) !important; }
.t3-spec-grp{
  padding:26px 0 10px;
  font-family:'Inter', var(--sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:0.09em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.78);
}
.t3-spec-sum{
  margin:0;
  padding:18px 0 0;
  border-top:1px solid rgba(255,255,255,0.40);
  text-align:center;
  font:500 14px/1.6 'Inter', var(--sans);
  color:rgba(255,255,255,0.82);
}
.t3-spec-note{ margin:0; padding:4px 0 0; text-align:center; font:400 12.5px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.45); }
.t3-rule-faq, .t3-rule-white{ height:0; margin:135px -24px 0; border-top:1px solid rgba(255,255,255,0.32); }
.t3-rule-white.t3-rule-flush{ margin-top:0; }
.t3-faq{
  max-width:1160px;
  margin:135px auto 0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,7fr);  /* was re-declared AFTER the phone rule below (2026-09-16 fix: every product page kept two columns at 390) */
  gap:96px;
  align-items:start;
}
.t3-faq-side{ position:sticky; top:96px; }
.t3-faq-p{ margin:0; font:400 15.5px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.62); }
.t3-faq-p a{ color:#F4F4F4; text-decoration:underline; text-underline-offset:3px; }
.t3-faq .np-faq-row{ width:100%; background:none; border:0; color:inherit; font:inherit; text-align:left; }
.t3-faq .np-faq-row:focus-visible{ outline:1px solid rgba(255,255,255,0.6); outline-offset:-2px; }
@media (max-width:980px){
  .t3-faq{ grid-template-columns:1fr; gap:24px; }
  .t3-faq-side{ position:static; }
}
.t3-faq-h{
  font-family:'DM Sans', var(--sans);
  color:#F4F4F4;
  text-wrap:balance;
  -webkit-font-smoothing:antialiased;
  font-size:52px;
  font-weight:500;
  letter-spacing:-1.8px;
  line-height:1.05;
  margin:0 0 22px;
}
.t3-faq-p{ max-width:none; white-space:nowrap; }
.t3-faq-list{ max-width:none; padding-bottom:0; border-top:1px solid rgba(255,255,255,0.10); }
.t3-faq .np-faq-item{ border-bottom:1px solid rgba(255,255,255,0.10); }
.t3-faq .np-faq-row{ padding:22px 0; gap:24px; }
.t3-faq .np-faq-q{ font:500 16px/1.4 'Inter', var(--sans); color:#F4F4F4; }
.t3-faq .np-faq-row:hover .np-faq-q{ color:#fff; }
.t3-faq .np-faq-ico{ width:14px; height:14px; }
.t3-faq .np-faq-ico::before{ top:6.5px; height:1px; background:#fff; border-radius:0; }
.t3-faq .np-faq-ico::after{ left:6.5px; width:1px; background:#fff; border-radius:0; }
.t3-faq .np-faq-a .np-desc{ font:400 15px/1.7 'Inter', var(--sans); color:rgba(255,255,255,0.55); padding:0 0 26px; max-width:62ch; }
.t3-faq .np-faq-a .np-desc b{ color:rgba(255,255,255,0.8); font-weight:500; }
.t3-faq .np-faq-a a, .t3-faq .np-faq-a a:visited{ color:#F4F4F4; text-decoration:underline; text-underline-offset:3px; }
.t3-faq .np-faq-a a:hover{ color:#fff; }
nav.scrolled{ box-shadow:none; }
@media (max-width:1100px){
  .t3-sbar-nav{ display:none; }
}
.t3-rl{ margin:135px 0 0; padding:0; }
.t3-rl-h{
  font-family:'DM Sans', var(--sans);
  font-size:52px;
  font-weight:600;
  line-height:1.05;
  letter-spacing:-1.3px;
  text-align:center;
  text-wrap:balance;
  color:#F4F4F4;
  margin:0 0 14px;
  -webkit-font-smoothing:antialiased;
}
.t3-rl-readout{
  margin:0 0 36px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:0;
  flex-wrap:wrap;
  font:400 15px/1.5 'Inter', var(--sans);
  color:rgba(255,255,255,0.72);
  white-space:nowrap;
}
.t3-rl-readout i{ display:inline-block; width:1px; height:14px; background:rgba(255,255,255,0.22); margin:0 16px; }
.t3-rl-readout[hidden]{ display:none; }
.t3-rl-rail{ position:relative; width:100vw; left:50%; margin-left:-50vw; }
.t3-rl-track{
  --rl-inset:max(24px, calc((100vw - 1488px) / 2));
  display:flex;
  gap:16px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x proximity;
  padding:6px var(--rl-inset);
  scrollbar-width:none;
  cursor:grab;
  scroll-padding-left:var(--rl-inset);
  scroll-padding-right:var(--rl-inset);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, transparent var(--rl-inset), #000 calc(var(--rl-inset) + 140px), #000 calc(100% - var(--rl-inset) - 140px), transparent calc(100% - var(--rl-inset)), transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, transparent var(--rl-inset), #000 calc(var(--rl-inset) + 140px), #000 calc(100% - var(--rl-inset) - 140px), transparent calc(100% - var(--rl-inset)), transparent 100%);
}
.t3-rl-track::-webkit-scrollbar{ display:none; }
.t3-rl-track.dragging{ cursor:grabbing; scroll-snap-type:none; }
.t3-rl-track:focus-visible{ outline:1px solid rgba(255,255,255,0.6); outline-offset:-2px; }
.t3-rl-card{
  flex:0 0 360px;
  min-height:276px;
  box-sizing:border-box;
  scroll-snap-align:start;
  background:#0A0A0A;
  border:1px solid rgba(255,255,255,0.10);
  border-radius:12px;
  padding:22px 24px 20px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.t3-rl-st{ color:#E8212A; font-size:13px; letter-spacing:2px; line-height:1; white-space:nowrap; }
.t3-rl-st i{ font-style:normal; color:rgba(255,255,255,0.18); }
.t3-rl-flag{ width:20px; height:15px; object-fit:cover; border-radius:2px; flex:none; }
.t3-rl-globe{ width:16px; height:16px; color:rgba(255,255,255,0.55); flex:none; }
.t3-rl-body{ display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden; }
.t3-rl-card.expanded .t3-rl-body{ display:block; -webkit-line-clamp:unset; overflow:visible; }
.t3-rl-more{
  align-self:flex-start;
  background:none;
  border:0;
  padding:10px 14px;            /* a 40px-tall, 14px-wider hit area; the negative margins keep the text where it was (Kristian 2026-09-10: 'hard to press') */
  margin:-14px -14px -10px;
  min-height:40px;
  display:inline-flex; align-items:center;
  font:600 13px 'Inter', var(--sans);
  color:#F4F4F4;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}
.t3-rl-more[hidden]{ display:none; }
.t3-rl-more:hover{ color:#fff; }
.t3-rl-more:focus-visible{ outline:1px solid rgba(255,255,255,0.6); outline-offset:2px; }
.t3-rl-slot{
  justify-content:center;
  align-items:center;
  text-align:center;
  border-style:dashed;
  border-color:rgba(255,255,255,0.16);
  background:transparent;
}
.t3-rl-slot-t{ font:600 15px 'Inter', var(--sans); color:rgba(255,255,255,0.62); }
.t3-rl-slot-p{ margin:0; font:400 13px/1.5 'Inter', var(--sans); color:rgba(255,255,255,0.42); max-width:24ch; }
.t3-rl-dlg{
  position:fixed;
  inset:0;
  z-index:5000;
  background:rgba(0,0,0,0.88);
  display:flex;
  align-items:flex-start;   /* 2026-09-20: with align-items:center a form taller than the screen was cut off at BOTH ends and nothing scrolled (small phones, short laptop windows). flex-start + the box's auto margins centre it when it fits and let it scroll when it does not */
  justify-content:center;
  padding:24px;
  overflow-y:auto;
  overscroll-behavior:contain;
}
.t3-rl-dlg[hidden]{ display:none; }
.t3-rl-dlg-p{ margin:0 0 18px; font:400 14.5px/1.55 'Inter', var(--sans); color:rgba(255,255,255,0.62); }
.t3-rl-dlg-copy, .t3-rl-dlg-x{
  background:#000;
  border:1px solid rgba(255,255,255,0.42);
  border-radius:4px;
  color:#fff;
  font:600 14px 'Inter', var(--sans);
  height:42px;   /* same height and type size as Send review (was 38 / 13) */
  padding:0 18px;
  cursor:pointer;
  white-space:nowrap;
  transition:border-color .12s ease;
}
.t3-rl-dlg-copy:hover, .t3-rl-dlg-x:hover{ border-color:#fff; }
.t3-rl-dlg-box{
  background:#0A0A0A;
  border:1px solid rgba(255,255,255,0.34);   /* 0.34: the frame must not read weaker than the boxes inside it (they are 0.38) */
  box-shadow:0 0 40px rgba(255,255,255,0.05), 0 40px 80px -30px rgba(0,0,0,1);
  width:min(580px, 100%);
  padding:32px 32px 28px;
  margin:auto 0;
}
.t3-rl-dlg-box:focus{ outline:none; }   /* it takes the keyboard focus when the form opens, so Enter no longer hits Close */
.t3-rl-dlg-box :is(button, a):focus-visible{ outline:2px solid rgba(255,255,255,0.8); outline-offset:2px; }   /* keyboard-focus ring for the buttons and the link; the text boxes show focus by their edge turning white */
.t3-rl-dlg-box .t3-rl-dlg-send:focus-visible{ outline-offset:3px; }   /* a white ring on a white button needs a wider dark gap */
.t3-rl-dlg-h{ font:600 24px/1.2 'DM Sans', var(--sans); letter-spacing:-0.4px; color:#F4F4F4; margin:0 0 20px; }
.t3-rl-hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.t3-rl-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.t3-rl-f{ display:block; margin:0 0 16px; min-width:0; }   /* min-width:0 — a grid child otherwise refuses to shrink below its longest unbreakable text (2026-09-19: a long email hint squeezed the name box to 106 px and pushed the form 60 px past a phone screen) */
.t3-rl-lab{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:8px; }
.t3-rl-lab > span:first-child, .t3-rl-lab > label{ font:600 12px 'Inter', var(--sans); letter-spacing:0.06em; text-transform:uppercase; color:rgba(255,255,255,0.72); white-space:nowrap; }
.t3-rl-hint{ font:400 12px 'Inter', var(--sans); color:rgba(255,255,255,0.42); text-align:right; }   /* may wrap: the label never does, the hint gives way */
.t3-rl-stars{
  border:0;
  padding:0;
  margin:0;
  display:flex;
  align-items:center;
  gap:4px;
  position:relative;
}
.t3-rl-stars label{ position:relative; cursor:pointer; }
.t3-rl-stars input{ position:absolute; opacity:0; width:1px; height:1px; }
.t3-rl-stars span{ display:inline-block; font-size:30px; line-height:1; color:rgba(255,255,255,0.34); transition:color .12s ease; }   /* 0.34 = 3:1 on the form: the empty stars were 1.9:1 and hard to see */
.t3-rl-stars[data-stars="1"] label:nth-of-type(-n+1) span, .t3-rl-stars[data-stars="2"] label:nth-of-type(-n+2) span, .t3-rl-stars[data-stars="3"] label:nth-of-type(-n+3) span, .t3-rl-stars[data-stars="4"] label:nth-of-type(-n+4) span, .t3-rl-stars[data-stars="5"] label:nth-of-type(-n+5) span{
  color:#fff;
}
.t3-rl-stars[data-hover="1"] label:nth-of-type(-n+1) span, .t3-rl-stars[data-hover="2"] label:nth-of-type(-n+2) span, .t3-rl-stars[data-hover="3"] label:nth-of-type(-n+3) span, .t3-rl-stars[data-hover="4"] label:nth-of-type(-n+4) span, .t3-rl-stars[data-hover="5"] label:nth-of-type(-n+5) span{
  color:#fff;
}
.t3-rl-stars input:focus-visible + span{ outline:1px solid rgba(255,255,255,0.7); outline-offset:3px; border-radius:2px; }
.t3-rl-f textarea, .t3-rl-f input{
  width:100%;
  box-sizing:border-box;
  background:#000;
  border:1px solid rgba(255,255,255,0.38);   /* 0.38 = 3:1: the box edge is the only thing that says "type here" (was 0.18 = 1.5:1) */
  color:#F4F4F4;
  font:400 14px/1.5 'Inter', var(--sans);
  padding:10px 12px;
  border-radius:4px;
  transition:border-color .12s ease;
}
.t3-rl-f textarea:hover, .t3-rl-f input:hover{ border-color:rgba(255,255,255,0.55); }
.t3-rl-f textarea{ resize:vertical; min-height:120px; }
.t3-rl-f textarea:focus, .t3-rl-f input:focus{ outline:none; border-color:rgba(255,255,255,0.85); }
.t3-rl-f textarea::placeholder, .t3-rl-f input::placeholder{ color:rgba(255,255,255,0.5); }
.t3-rl-f2{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:end; }   /* equal halves whatever the labels say; align-items:end keeps the two boxes on one line even if a hint wraps */
.t3-rl-f2 .t3-rl-f{ margin:0 0 16px; }
.t3-rl-form-note{
  margin:4px 0 20px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,0.10);
  font:400 12.5px/1.6 'Inter', var(--sans);
  color:rgba(255,255,255,0.5);
}
.t3-rl-form-note a{ color:rgba(255,255,255,0.72); }
.t3-rl-dlg-actions{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.t3-rl-dlg-send{
  background:#fff;
  color:#000;
  border:1px solid #fff;
  border-radius:4px;
  font:600 14px 'Inter', var(--sans);
  height:42px;
  padding:0 24px;
  cursor:pointer;
  transition:background .12s ease, border-color .12s ease;
}
.t3-rl-dlg-send:hover:not(:disabled){ background:#EDEDED; border-color:#EDEDED; }   /* the same hover as the page's other white buttons */
.t3-rl-dlg-send:disabled{ opacity:0.6; cursor:default; }
.t3-rl-form-err{ margin:12px 0 0; font:400 13px/1.5 'Inter', var(--sans); color:#ff6b6b; }
@media (max-width:600px){
  .t3-rl-dlg{ padding:12px; }
  .t3-rl-dlg-box{ padding:24px 20px 22px; }
  .t3-rl-f textarea{ min-height:96px; }
  .t3-rl-f2{ grid-template-columns:minmax(0,1fr); }
}
.t3-rl-body{
  margin:0;
  font:400 14px/1.55 'Inter', var(--sans);
  color:rgba(255,255,255,0.62);
  display:-webkit-box;
  -webkit-line-clamp:5;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.t3-rl-meta, .t3-rl-cap{ font:600 10.5px 'Inter', var(--sans); letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.4); }
.t3-rl-meta{ margin-top:auto; padding-top:8px; }
.t3-rl-side[hidden]{ display:none; }
.t3-rl-side{
  width:40px;
  height:34px;
  background:#2E2E2E;
  border:1px solid rgba(255,255,255,0.18);
  color:#fff;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
}
.t3-rl-side:hover{ background:#fff; color:#111; border-color:#fff; }
.t3-rl-side:focus-visible{ outline:1px solid rgba(255,255,255,0.8); outline-offset:2px; }
.t3-rl-foot{ display:flex; justify-content:center; align-items:center; gap:16px; margin-top:32px; }
.t3-rl-btn{
  font:600 12px 'Inter', var(--sans);
  letter-spacing:0.02em;
  color:#fff;
  background:#000;
  border:1px solid rgba(255,255,255,0.5);
  height:34px;
  padding:0 17px;
  cursor:pointer;
}
.t3-rl-btn:hover{ border-color:rgba(255,255,255,0.85); }
.t3-brag{ max-width:1160px; margin:135px auto 0; padding:0; }
.t3-brag-h{
  font-family:'DM Sans', var(--sans);
  font-size:52px;
  font-weight:600;
  line-height:1.05;
  letter-spacing:-1.3px;
  text-align:center;
  text-wrap:balance;
  color:#F4F4F4;
  margin:0 0 30px;   /* 30px to the row: the white rule under the heading is gone and the 43px gap is 30% less (Kristian 2026-09-10) */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.t3-brag-p{
  max-width:660px;
  margin:0 auto 56px;
  text-align:center;
  text-wrap:pretty;
  font-family:'Inter', var(--sans);
  font-size:17px;
  font-weight:400;
  line-height:1.6;
  letter-spacing:-0.1px;
  color:rgba(255,255,255,0.52);
  -webkit-font-smoothing:antialiased;
}
.t3-brag-p b{ font-weight:400; color:inherit; }
.t3-brag-tile b .t3-brag-num{ font:inherit; letter-spacing:inherit; text-transform:none; color:inherit; }
.t3-brag-map{ position:relative; margin:8px auto 0; isolation:isolate; width:1160px; max-width:calc(100vw - 48px); }
.t3-brag-map::before{
  content:'';
  position:absolute;
  inset:-44% -28% -50%;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse closest-side at 50% 46%,
    rgba(255,255,255,0.064) 0%, rgba(255,255,255,0.045) 26%, rgba(255,255,255,0.022) 56%, rgba(255,255,255,0) 100%);
    /* 2026-09-10 (Kristian): glow around the map turned down 20% — every stop's alpha × 0.8 (was 0.08 / 0.056 / 0.028). */
}
.t3-brag-row{
  display:grid;
  grid-template-columns:70px 180px 700px 180px 70px;
  column-gap:62px;
  align-items:stretch;
  width:1448px;
  margin:0 0 56px calc((1160px - 1448px) / 2);
}
.t3-brag-row .t3-brag-p{ margin:0; max-width:none; padding:0; align-self:center; }
.t3-bstat{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:8px 4px;
}
.t3-bstat-r::after{ right:auto; left:-31px; }
.t3-bstat::after{
  content:'';
  position:absolute;
  top:50%;
  height:72px;
  transform:translateY(-50%);
  width:1px;
  right:-31px;
  background:rgba(255,255,255,0.18);
  display:none;
}
.t3-brag-row > .t3-bstat:nth-child(2)::before, .t3-brag-row > .t3-bstat:nth-child(2)::after, .t3-brag-row > .t3-bstat:nth-child(4)::before, .t3-brag-row > .t3-bstat:nth-child(4)::after{
  content:'';
  display:block;
  position:absolute;
  top:50%;
  height:72px;
  transform:translateY(-50%);
  width:1px;
  background:rgba(255,255,255,0.18);
}
.t3-brag-row > .t3-bstat:nth-child(2)::before, .t3-brag-row > .t3-bstat:nth-child(4)::before{ left:12px; right:auto; }
.t3-brag-row > .t3-bstat:nth-child(2)::after, .t3-brag-row > .t3-bstat:nth-child(4)::after{ right:12px; left:auto; }
.t3-brag-row > .t3-bstat:nth-child(1){ transform:translateX(48.4px); }
.t3-brag-row > .t3-bstat:nth-child(5){ transform:translateX(-25.1px); }
@media (max-width:1560px){
  .t3-brag-row{ grid-template-columns:repeat(4, 1fr); column-gap:24px; row-gap:36px; width:auto; margin:0 24px 56px; }
  .t3-brag-row .t3-brag-p{ grid-column:1 / -1; grid-row:1; max-width:700px; margin:0 auto; }
  .t3-brag-row > .t3-bstat:nth-child(1){ transform:none; }
  .t3-brag-row > .t3-bstat:nth-child(5){ transform:none; }
}
@media (max-width:1000px){
  .t3-cmp-panel{ width:auto !important; margin-left:24px; margin-right:24px; }
  .t3-cmp{ width:100%; }
  .t3-spec{ max-width:none; margin-left:24px; margin-right:24px; }
}
@media (max-width:1260px){
  /* 2026-09-23 (ProVWAP design review): the hero sub-header row is nowrap and only its two 1px
     separators can shrink, so between 1101 and ~1218px six product pages clipped the line off BOTH
     screen edges (measured: ProVWAP row left -35px at 1101). Letting the tagline wrap from 1260px
     down, exactly as it already did from 1100px down, removes the clip; 1320px and up are untouched. */
  .t3-sh-info{ white-space:normal; text-wrap:balance; }
  /* Same day, second finding (IRL design review): once the tagline wraps, the header must grow with it.
     .ecz-header is a fixed 101px until 760px, so a 2-line tagline (1230px and below) was drawn 13px over
     the hero image and a 3-line one (809px and below) 36px over it, on every product page whose tagline
     wraps. min-height keeps the one-line pages byte-identical. */
  .ecz-header{ height:auto; min-height:101px; }
}
@media (max-width:760px){
  #t3-sbar{ padding:0 16px; }
  .t3-sbar-r{ gap:8px; }
  .t3-sbar-btn{ height:38px; padding:0 12px; font-size:13px; }
  .ecz-header{ height:auto; padding-top:16px; margin:16px auto 0 !important; padding-left:16px; padding-right:16px; }
  .ecz-header > div:first-child{ flex-wrap:wrap; justify-content:flex-start; gap:10px 14px; }
  .product-page-title{ white-space:normal !important; font-size:30px; }
  .t3-price-div{ display:none; }
  .ecz-header > div:first-child > div{ width:100%; flex-direction:column; align-items:stretch; gap:10px; margin-top:6px; }
  .t3-hbtn{ width:100%; justify-content:center; }
  .t3-sh-mid{ flex-wrap:wrap; justify-content:flex-start; gap:6px 10px; margin-top:12px; }
  .t3-sh-sep{ display:none; }
  .t3-sh-info{ display:block; width:100%; }
  .np-heroband{ margin-top:16px !important; }
  .np-hero{ aspect-ratio:1260/674; }
  .t3-zoom{ display:none; }
  .t3-side{ display:none; }
  .np-arrow{ display:flex !important; }
  .ecz-bar{ flex-wrap:wrap; height:auto; }
  .ecz-bar .ecz-cell{
    flex:1 1 50%;
    min-width:0;
    justify-content:center;
    padding:10px 8px;
    border-left:0 !important;
    border-top:1px solid rgba(255,255,255,0.12);
    font-size:11px;
    white-space:normal;
    text-align:center;
  }
  .t3-rc-imgwrap{
    position:static;
    width:100%;
    height:auto;
    aspect-ratio:1159/620;
    -webkit-mask:none;
    mask:none;
    margin-bottom:24px;
  }
  .t3-rc-imgwrap img{ width:100%; height:100%; object-fit:cover; }
  .t3-rc-ann, .t3-rc-labels{ display:none; }
  .t3-rc-h{ font-size:36px; letter-spacing:-1px; }
  .t3-cmp tbody th{ white-space:normal; }
  .t3-cmp th em{ display:block; }
  .t3-diag-top, .t3-brag-h, .t3-rl-h, .t3-pr-h, .t3-nv-h, .t3-close-h, .t3-use-h, .t3-demo-h, .t3-faq-h{
    font-size:34px !important;
    letter-spacing:-0.9px !important;
    line-height:1.1;
  }
  .t3-rc-hl::after{ height:2px; }
  .t3-quad{ margin-left:16px; margin-right:16px; gap:32px 0; }
  .t3-use{ margin-left:16px; margin-right:16px; }
  .t3-use-cell{ padding:22px 18px; }
  .t3-demo{ justify-content:flex-start; margin-left:16px; margin-right:16px; row-gap:14px; }
  .t3-demo-cta{ flex-basis:100%; justify-content:flex-start; }
  .t3-demo-frame{ margin-top:12px; }
  .t3-brag{ margin-left:16px; margin-right:16px; }
  .t3-brag-row{ grid-template-columns:1fr 1fr; column-gap:16px; row-gap:24px; margin:0 0 40px; }
  .t3-brag-row .t3-brag-p{ max-width:100%; font-size:15px; text-align:left; }
  .t3-brag-row > .t3-bstat::before, .t3-brag-row > .t3-bstat::after{ display:none !important; }
  .t3-brag-row > .t3-bstat{ transform:none; }
  .t3-rl-h{ padding:0 16px; }
  .t3-rl-readout{ white-space:normal; flex-direction:column; align-items:center; text-align:center; gap:6px; padding:0 16px; }
  .t3-rl-slot{ display:none; }
  .t3-rl-readout i{ display:none; }
  .t3-rl-card{ flex:0 0 calc(100vw - 48px); min-height:0; }
  .t3-rl-track{ scroll-snap-type:x mandatory; }
  .t3-rl-foot{ flex-wrap:wrap; gap:10px; padding:0 16px; }
  .t3-pricing{ margin-left:16px; margin-right:16px; }
  .t3-pr-lede{ white-space:normal; font-size:15px; }
  .t3-pr-card{ padding:22px 20px; }
  .t3-pr-btn{ width:100%; justify-content:center; }
  .t3-faq{ margin-left:16px; margin-right:16px; gap:16px; }
  .t3-faq-p{ white-space:normal; }
  .t3-faq .np-faq-row{ padding:16px 0; gap:14px; }
  .t3-faq .np-faq-a .np-desc{ padding:0 0 18px; }
  .t3-nv{ margin-left:16px; margin-right:16px; }
  .t3-nv *{ min-width:0; }
  .t3-nv-calc{ grid-template-columns:1fr; }
  .t3-nv-calc-l{ padding:22px 18px; }
  .t3-nv-calc-r{ padding:18px 16px; }
  .t3-nv-eq{ white-space:normal; font-size:20px; overflow-wrap:anywhere; }
  .t3-nv-rules, .t3-nv-plots{ grid-template-columns:1fr; }
  .t3-nv-rowh{ padding:16px 0; gap:12px; flex-wrap:wrap; }
  .t3-nv-rowh .n{ flex-basis:100%; white-space:normal; }
  .t3-nv-rowin{ overflow-x:auto; }
  .t3-nv-rowin table{ min-width:520px; }
  .t3-close{ padding:32px 16px 8px !important; }
  .t3-close-btns{ flex-direction:column; align-items:stretch; }
  .t3-close-btn{ justify-content:center; }
  .t3-close-p, .t3-close-not{ max-width:none; }
  .t3-close-pairs{ max-width:none; padding:0; }   /* the phone block already pads .t3-close 16 px */
  .t3-rl-more, .t3-use-foot a, .t3-faq .np-faq-a a{ display:inline-block; min-height:40px; line-height:40px; }
  .np-hero .np-counter{ top:8px; right:8px; height:32px; }
  .t3-cmp-panel{ width:auto !important; margin-left:16px !important; margin-right:16px !important; }
  .t3-cmp{ width:100%; table-layout:fixed; }
  .t3-cmp th, .t3-cmp td{ width:auto; }
  .t3-cmp{ min-width:0 !important; }
  .t3-cmp thead th, .t3-cmp tbody th, .t3-cmp tbody td{ width:auto; min-width:0; }
  .t3-spec{ margin-left:16px; margin-right:16px; }
  .t3-demo-h{ flex:1 1 100%; white-space:normal; }
  .t3-nv-calc-r, .t3-nv-calc-l{ overflow-x:auto; }
  .t3-nv-ex{ min-width:520px; }
  .t3-nv-tblwrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .ecz-bar{ display:block; height:auto; }
  .ecz-bar-left{ display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .ecz-bar-left > .ecz-cell{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-width:0;
    padding:10px 8px;
    border-left:0 !important;
    border-top:1px solid rgba(255,255,255,0.12);
    font-size:11px;
    white-space:normal;
    text-align:center;
  }
  .ecz-bar-left > .ecz-rating-cell{ grid-column:1 / -1; border-top:0; }
  .ecz-bar-left > .t3-verified{ grid-column:1 / -1; }
  .ecz-bar-left > .ecz-cell:nth-child(odd):not(.ecz-rating-cell){ border-right:1px solid rgba(255,255,255,0.12); }
  .t3-rcard{ height:auto; margin-top:80px; overflow:visible; display:block; }
  .t3-rc-imgwrap{ position:relative; display:block; left:auto; right:auto; top:auto; transform:none; }
  .t3-rc-imgwrap picture, .t3-rc-imgwrap img{
    position:static;
    left:auto;
    top:auto;
    width:100%;
    height:auto;
    transform:none;
  }
  .t3-rc-copy{
    max-width:none;
    padding:0 16px;
    position:static;
    top:auto;
    left:auto;
    transform:none;
    margin-top:8px;
  }
  .t3-cmp thead th{
    font-size:10px !important;
    letter-spacing:0.08em !important;
    white-space:normal !important;
    padding-left:4px !important;
    padding-right:4px !important;
    text-align:center;
  }
  .t3-cmp thead th:first-child{ text-align:left; }
  .t3-cmp thead th:nth-child(2), .t3-cmp thead th:nth-child(3), .t3-cmp tbody td:nth-child(2), .t3-cmp tbody td:nth-child(3){ width:64px !important; }
  /* a one-word product name is wider than the 64 px column and was being CUT, not wrapped: measured at 500 px,
     CandleStyler lost 29 px, SessionLevels 31, LiveBrackets 25, MultiTrend 13 — "CANDLEST" (2026-09-14) */
  .t3-cmp thead th{ overflow-wrap:anywhere; }
  .t3-brag-map{ width:100%; max-width:100%; margin-left:0; margin-right:0; }
  .t3-sbar-btn, .t3-rl-side, .t3-rl-btn{ min-height:40px; }
}
@media (max-width:480px){
  /* the paid pages put TWO buttons here and only need to drop the second; a free page has ONE, and it is the solid
     one — so this rule left every free page with no call to action at all on a phone (2026-09-14) */
  .t3-sbar-btn.solid:not(:only-of-type){ display:none; }
  .ecz-bar .ecz-cell{ flex-basis:100%; }
}
.t3-bstat b{
  display:flex;
  align-items:baseline;
  font-family:'DM Sans', var(--sans);
  font-size:34px;
  font-weight:600;
  letter-spacing:-1.1px;
  line-height:1;
  color:#F4F4F4;
  font-variant-numeric:tabular-nums;
}
.t3-bstat b .t3-brag-num{ font:inherit; letter-spacing:inherit; text-transform:none; color:inherit; }
.t3-bstat b small{ font:500 15px 'Inter', var(--sans); letter-spacing:0; color:rgba(255,255,255,0.55); margin-left:2px; }
.t3-bstar{ font-style:normal; font-size:17px; line-height:1; color:#fff; margin-left:7px; align-self:center; }
.t3-bstat:has(> .t3-bstat-sub) > span{ line-height:1; }   /* both label lines hug their letters when a second line exists */
.t3-bstat > .t3-bstat-sub{ margin-top:-7px; }   /* optional second label line, same style as the label, directly under it (Kristian 2026-09-10) */
.t3-bstat > span{
  font:600 10.5px 'Inter', var(--sans);
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.42);
  white-space:nowrap;
}
.t3-mstat b .t3-brag-num{ font:inherit; letter-spacing:inherit; text-transform:none; color:inherit; }
.t3-map-armed .t3-mstat{ opacity:0; transition:opacity .7s ease var(--d, 0s); }
.t3-map-armed.t3-map-lit .t3-mstat{ opacity:1; }
.t3-brag-map img, .t3-map-svg{ display:block; width:100%; height:auto; }
.t3-map-svg .mbase, .t3-map-svg .mhalo, .t3-map-svg .mgrat{ pointer-events:none; }
.t3-map-svg .mhot path:hover{ fill:rgba(255,255,255,0.24); stroke:rgba(255,255,255,0.95); }
.t3-maptip{
  position:absolute;
  left:0;
  top:0;
  z-index:5;
  pointer-events:none;
  white-space:nowrap;
  will-change:transform;
  background:rgba(10,10,10,0.94);
  border:1px solid rgba(255,255,255,0.18);
  padding:9px 13px;
  box-shadow:0 12px 28px -16px rgba(0,0,0,0.9);
}
.t3-maptip b{
  display:block;
  font-family:'Inter', var(--sans);
  font-size:12px;
  font-weight:600;
  letter-spacing:0.09em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.95);
  margin-bottom:3px;
}
.t3-maptip span{ font-family:'Inter', var(--sans); font-size:11.5px; font-weight:400; color:rgba(255,255,255,0.55); }
@media (max-width:820px){
  .t3-brag-h{ font-size:30px; letter-spacing:-0.5px; }
}
.t3-cmp-panel{
  max-width:1040px;
  margin-left:auto;
  margin-right:auto;
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
  overflow-x:auto;
}
.t3-cmp{ width:100%; border-collapse:collapse; min-width:620px; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.t3-cmp thead th{
  font-family:var(--mono);
  font-size:11px;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  padding:14px 0 12px;
  white-space:nowrap;
}
.t3-cmp thead .f{ text-align:left; font-size:11px; letter-spacing:0.2em; color:rgba(255,255,255,0.60); }
.t3-cmp thead .a{ text-align:center; width:150px; color:rgba(255,255,255,0.62); }
.t3-cmp thead .b{ text-align:center; width:150px; color:#fff; }
.t3-cmp tbody th{
  text-align:left;
  font-family:var(--sans);
  font-size:15px;
  font-weight:500;
  color:#fff;
  letter-spacing:0.01em;
  padding:11px 24px 11px 0;
}
.t3-cmp tbody th em{
  font-style:normal;
  font-family:var(--sans);
  font-size:13px;
  font-weight:400;
  color:rgba(255,255,255,0.58);
  letter-spacing:0;
  margin-left:12px;
}
.t3-cmp tbody td{ text-align:center; padding:11px 0; line-height:1; }
.t3-cmp thead .a, .t3-cmp thead .b, .t3-cmp tbody td{ border-left:1px solid rgba(255,255,255,0.09); }
.t3-cmp tbody tr{ border-top:1px solid rgba(255,255,255,0.26); }
.t3-cmp tbody tr:last-child{ border-bottom:1px solid rgba(255,255,255,0.26); }
.t3-cmp tbody tr.grp td{
  font-family:var(--mono);
  font-size:13px;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.88);
  padding:26px 0 10px;
  text-align:left;
  border-left:0;
}
.t3-cmp tbody tr.grp{ border-top:1px solid rgba(255,255,255,0.40); }
.t3-cmp .no{ font-family:var(--mono); font-size:15px; color:rgba(255,255,255,0.42); }
.t3-cmp .yes{ font-family:var(--mono); font-size:17px; font-weight:700; color:#FF2F38; }
.t3-cmp .yes-dim{ font-family:var(--mono); font-size:17px; color:rgba(255,255,255,0.72); }
.t3-cmp .yes, .t3-cmp .yes-dim{
  display:inline-block;
  width:17px;
  height:17px;
  font-size:0;
  line-height:0;
  vertical-align:-3px;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.4 8.4l3.6 3.6 7.6-7.6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.4 8.4l3.6 3.6 7.6-7.6' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='square' stroke-linejoin='miter'/%3E%3C/svg%3E") center/contain no-repeat;
}
.t3-cmp tbody tr.grp td, .t3-cmp thead .f, .t3-cmp thead th, .t3-spec-lab{
  font-family:'Inter', var(--sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:0.09em;
  text-transform:uppercase;
}
.t3-cmp tbody tr.grp td, .t3-cmp thead .f, .t3-spec-lab{ color:rgba(255,255,255,0.92); }
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}
@media (max-width:700px){
  .t3-cmp thead .a, .t3-cmp thead .b{ width:110px; }
  .t3-cmp tbody th{ font-size:14.5px; }
}
.t1-footghostwrap{ width:100vw; position:relative; left:50%; margin-left:-50vw; padding-top:90px; background:#0D0D0D; }
.t3-ghost-top{ margin-top:64px; background:transparent; padding-top:56px; }
.t1-footghost{
  width:100%;
  position:relative;
  margin-top:0;
  margin-bottom:0;
  height:0.73em;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  font-family:var(--sans);
  font-weight:800;
  font-size:clamp(44px, 9.4vw, 180px);
  line-height:0.8;
  letter-spacing:-0.045em;
  text-align:center;
  white-space:nowrap;
  color:#161616;
  user-select:none;
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 18%, #000 82%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 18%, #000 82%, transparent 100%);
  pointer-events:auto;
}
.t1-footghost b{
  color:transparent;
  background:radial-gradient(300px circle at var(--mx,-999px) var(--my,-999px), rgba(255,255,255,0.20), transparent 72%),
    linear-gradient(#191919,#191919);
  -webkit-background-clip:text;
  background-clip:text;
}
.t1-footghost b span{
  color:transparent;
  background:radial-gradient(300px circle at var(--sx,-999px) var(--sy,-999px), rgba(255,255,255,0.20), transparent 72%),
    linear-gradient(#1b1214,#1b1214);
  -webkit-background-clip:text;
  background-clip:text;
}
.t3-ghost-top .t1-footghost b span{
  background:radial-gradient(300px circle at var(--sx,-999px) var(--sy,-999px), rgba(255,255,255,0.20), transparent 72%),
    linear-gradient(#191919,#191919);
  -webkit-background-clip:text;
  background-clip:text;
}
.t1-footghost b{ display:block; font-weight:800; transform:translateY(0.19em); }
footer.home-footer{ border-top-color:rgba(255,255,255,0.32); }
footer .hf-bottom{ border-top-color:rgba(255,255,255,0.18); }

/* ── Inline styles moved to classes (refactor step 3c, 2026-09-07) ─────────────────────── */
.product-page.t3-page{ padding:14px 24px 0; background:var(--ecz-lower); }
.t3-page .ecz-topband{ margin:-14px -24px 0; padding:14px 24px 0; }
.t3-page .ecz-header{ max-width:1180px; margin-left:auto; margin-right:auto; }
.t3-page .ecz-header > .t3-h-row{ display:flex; align-items:baseline; justify-content:center; gap:18px; }
.ecz-header .product-page-title.t3-h1{ margin:0; white-space:nowrap; font-size:clamp(28px,2.3vw,42px) !important; line-height:1.15; color:#fff; }
.ecz-header .t3-price{ font-family:var(--sans); font-weight:800; font-size:clamp(28px,2.3vw,42px); line-height:1.15; color:#fff; white-space:nowrap; }
.t3-page .t3-h-row > .t3-h-btns{ display:flex; gap:12px; align-items:center; flex-shrink:0 !important; align-self:center; }   /* !important: product-page.css sets flex:1 1 100% on this div with a :has() selector no class chain outranks */
.t3-hero-wrap{ position:relative; margin-top:10px; }
.t3-page .np-heroband{ max-width:1260px; margin-left:auto; margin-right:auto; }
.t3-page .np-hero{ margin:0; }
.t3-quad-wrap{ max-width:1260px; margin:0 auto; }
.t3-nv-legend-note{ margin-left:auto; }
.t3-nv-txt-lead{ margin-bottom:16px; }
.np-faq-a .np-desc.t3-faq-more{ margin-top:12px; }
.t3-tail{ width:100vw; position:relative; left:50%; right:50%; margin-left:-50vw; margin-right:-50vw; margin-top:135px; padding-bottom:54px; background:#000; border-top:1px solid rgba(255,255,255,0.32); }
.t3-legal{ max-width:1180px; margin:135px auto 0; padding:0 24px; }
.t3-legal p{ font-family:var(--sans); font-size:11px; line-height:1.7; color:rgba(240,240,240,0.4); text-align:center; max-width:820px; margin:0 auto; }
.t3-legal p + p{ margin-top:10px; }
/* Optional cross-links line under the close (2026-09-10, ProVWAP): keeps the inbound links the old page gave its sister products. */
.t3-close-pairs{ margin:18px auto 0; max-width:760px; padding:0 24px; text-wrap:balance; text-align:center; font:400 14px/1.6 'Inter', var(--sans); color:rgba(255,255,255,0.55); }   /* 2026-09-24 (SuperTrend review): width limit + side padding - with phrase anchors the line ran edge to edge between 761 and 1024 px; .t3-close-not next to it is 640 wide */
.t3-close-pairs a{ color:rgba(255,255,255,0.8); text-decoration:underline; text-underline-offset:3px; }
.t3-close-pairs a:hover{ color:#fff; }