/* ==========================================================================
   BuyerAware · Quick Check components
   Builds on /assets/site.css (same tokens: --shop, --amber, --line, Archivo /
   IBM Plex). Nothing here introduces a new color or typeface.
   ========================================================================== */

/* ---------- home hero with the form ---------- */
.qc-hero{padding:64px 0 72px}
.qc-hero .hero-grid{align-items:start;grid-template-columns:1.05fr 1fr}
.qc-hero h1{font-size:clamp(46px,7.2vw,88px)}
.qc-hero .copy{padding-top:14px}
.qc-hero .sub{margin-top:18px;font:500 13px/1.6 var(--mono);color:var(--ink-3)}
.qc-hero .sub b{color:var(--ink);font-weight:600}

/* ---------- the form card ---------- */
.qc-form{background:var(--shop-2);border:1px solid var(--line);padding:28px 26px 24px;box-shadow:var(--shadow)}
.qc-form .row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.qc-form .row.r3{grid-template-columns:1fr 2fr}
.qc-form .field{margin:0 0 14px}
.qc-form .field textarea{min-height:96px}
.qc-form .opt{color:var(--ink-3);text-transform:none;letter-spacing:.02em}
.qc-form .btn{width:100%;min-height:60px;font-size:17px}
.qc-form .fine{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--ink-3)}
.qc-form .fine a{color:var(--ink-2)}
.qc-form .wallet-note{border:1px solid var(--ok);color:var(--ink);background:rgba(95,174,114,.1);padding:12px 14px;margin:0 0 16px;font-size:14px}
.qc-ts{min-height:0;margin:0 0 12px}
.qc-err{display:none;border:1px solid var(--bad);background:rgba(217,88,60,.12);color:var(--ink);padding:12px 14px;margin:0 0 14px;font-size:14.5px;line-height:1.5}
.qc-err.show{display:block}
.qc-err a{color:var(--amber)}
.qc-form button[disabled]{opacity:.6;cursor:wait}

/* ---------- checking state ---------- */
.qc-wait{max-width:640px}
.qc-car{display:inline-block;border:1px solid var(--line);background:var(--shop-2);padding:10px 14px;font:500 13px/1.5 var(--mono);color:var(--ink-2);margin:6px 0 0}
.qc-bar{height:8px;background:var(--shop-3);border:1px solid var(--line);margin:26px 0 8px;overflow:hidden}
.qc-bar i{display:block;height:100%;width:6%;background:var(--amber);transition:width 1.2s ease}
.qc-steps{list-style:none;margin:16px 0 0;padding:0}
.qc-steps li{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--line);color:var(--ink-3)}
.qc-steps li:last-child{border-bottom:1px solid var(--line)}
.qc-steps li b{font:600 12px/1.6 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.qc-steps li.on{color:var(--ink)}
.qc-steps li.on b{color:var(--amber)}
.qc-steps li.done{color:var(--ink-2)}
.qc-steps li.done b{color:var(--ok)}

/* ---------- result ---------- */
.qc-result{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:40px;align-items:start}
.qc-verdict{background:var(--shop-2);border:2px solid var(--amber);padding:28px 26px;box-shadow:var(--shadow)}
.qc-verdict .k{font:600 12px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.qc-verdict .v{font:900 clamp(56px,8vw,96px)/.9 var(--display);font-stretch:72%;text-transform:uppercase;letter-spacing:-.01em;margin:10px 0 14px;color:var(--amber)}
.qc-verdict.buy{border-color:var(--ok)} .qc-verdict.buy .v{color:var(--ok)}
.qc-verdict.walk{border-color:var(--bad)} .qc-verdict.walk .v{color:var(--bad)}
.qc-verdict .take{color:var(--ink-2);font-size:17px;margin:0 0 20px}
.qc-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--line)}
.qc-stats>div{padding:14px 14px 16px;border-left:1px solid var(--line)}
.qc-stats>div:first-child{border-left:0}
.qc-stats small{display:block;font:500 11px/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.qc-stats b{font:900 34px/1 var(--display);font-stretch:75%;text-transform:uppercase}
.qc-stats b em{font-style:normal;font-size:18px;color:var(--ink-3)}
.qc-stats .t{font:700 20px/1.1 var(--display);font-stretch:85%;text-transform:uppercase}
.qc-meter{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-top:10px}
.qc-meter span{height:6px;background:var(--shop-3)}
.qc-meter[data-step="1"] span:nth-child(-n+1),.qc-meter[data-step="2"] span:nth-child(-n+2),
.qc-meter[data-step="3"] span:nth-child(-n+3),.qc-meter[data-step="4"] span:nth-child(-n+4){background:var(--amber)}
.qc-meter[data-step="4"] span{background:var(--bad)}
.qc-meter[data-step="1"] span:first-child{background:var(--ok)}

.qc-sec{margin-top:44px}
.qc-sec h2{font-size:clamp(28px,3.6vw,40px);margin-bottom:14px}
.qc-sec .note{color:var(--ink-3);font-size:14px;margin:10px 0 0}
.qc-rows{list-style:none;margin:0;padding:0;counter-reset:r}
.qc-rows li{padding:14px 0 14px 44px;border-top:1px solid var(--line);position:relative;color:var(--ink-2);line-height:1.5}
.qc-rows li:last-child{border-bottom:1px solid var(--line)}
.qc-rows li::before{counter-increment:r;content:counter(r);position:absolute;left:0;top:13px;width:28px;height:28px;border:1px solid var(--amber);color:var(--amber);font:700 13px/26px var(--mono);text-align:center}
.qc-rows li b{display:block;color:var(--ink);font-weight:600}
.qc-rows li small{display:block;font:500 12px/1.5 var(--mono);color:var(--ink-3);margin-top:3px}
.qc-rows.plain li::before{content:"";width:10px;height:10px;top:20px;left:8px;border:0;background:var(--line-2)}
.tag-safety{display:inline-block;font:700 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--amber-ink);background:var(--bad);padding:4px 6px;margin-left:8px;vertical-align:2px}

.qc-tank{border:1px solid var(--ok);background:rgba(95,174,114,.08);padding:20px 22px}
.qc-tank .k{font:600 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ok)}
.qc-tank h3{margin:10px 0 6px;font-size:26px}
.qc-tank p{margin:0 0 12px;color:var(--ink-2);font-size:15px}
.qc-tank a{color:var(--amber)}

/* side rail: next steps */
.qc-rail{position:sticky;top:92px;display:grid;gap:16px}
.qc-next{background:var(--shop-2);border:1px solid var(--line);padding:22px 22px}
.qc-next.feat{background:var(--shop-3);border:2px solid var(--amber)}
.qc-next .k{font:600 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--amber)}
.qc-next h3{margin:10px 0 8px;font-size:24px}
.qc-next ul{list-style:none;margin:0 0 16px;padding:0}
.qc-next li{position:relative;padding:7px 0 7px 22px;border-top:1px solid var(--line);font-size:14.5px;color:var(--ink-2)}
.qc-next li::before{content:"";position:absolute;left:1px;top:13px;width:10px;height:6px;border-left:2px solid var(--amber);border-bottom:2px solid var(--amber);transform:rotate(-45deg)}
.qc-next .btn{width:100%}
.qc-next .sm{display:block;margin-top:10px;font-size:13px;color:var(--ink-3);text-align:center}
.qc-next .sm b{color:var(--ink)}
.qc-share{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.qc-share button{min-height:44px;background:transparent;border:1px solid var(--line-2);color:var(--ink-2);padding:0 14px;font:500 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.qc-share button:hover{border-color:var(--amber);color:var(--amber)}
.qc-disclaim{margin-top:40px;font-size:13px;color:var(--ink-3);line-height:1.6;border-top:1px solid var(--line);padding-top:18px}

/* ---------- buy-more cards ---------- */
.qc-buy{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px;align-items:stretch}
.qc-buy .tier{padding:26px 22px 22px}
.qc-buy .tier .t-price b{font-size:52px}
.qc-buy .btn{margin-top:auto}

/* ---------- developer band (above footer, every page) ---------- */
.dev-band{border-top:1px solid var(--line);background:#0b1e30}
.dev-band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding-top:22px;padding-bottom:22px}
.dev-band p{margin:0;font-size:14.5px;color:var(--ink-2)}
.dev-band p b{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-right:12px}
.dev-band a{font:500 13px/1 var(--mono);color:var(--amber);text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px}

/* phone-only shortcut to the $29 report, right under the verdict */
.qc-mnext{display:none}
/* ---------- small screens ---------- */
@media (max-width:980px){
  .qc-hero .hero-grid{grid-template-columns:1fr;gap:32px}
  .qc-result{grid-template-columns:1fr}
  .qc-rail{position:static}
  .qc-mnext{display:flex;flex-direction:column;gap:6px;margin-top:18px}
  .qc-mnext .more{margin-top:8px;align-self:center}
  .qc-buy{grid-template-columns:1fr}
}
@media (max-width:560px){
  .qc-hero{padding:40px 0 48px}
  .qc-form{padding:22px 16px 18px}
  .qc-stats{grid-template-columns:1fr 1fr}
  .qc-stats>div:nth-child(3){grid-column:1/-1;border-left:0;border-top:1px solid var(--line)}
  .qc-verdict{padding:22px 18px}
}
