/* Legal + Export Check mockup extras — on top of live studio.css */

.legal-wrap{max-width:760px;margin:0 auto}
.legal{color:var(--ink);font-size:16px;line-height:1.55}
.legal h2{
  font-family:var(--display);font-weight:600;letter-spacing:-.02em;
  font-size:clamp(22px,2.4vw,28px);margin:36px 0 12px;color:var(--ink)
}
.legal h3{
  font-family:var(--display);font-weight:600;letter-spacing:-.015em;
  font-size:18px;margin:28px 0 10px;color:var(--ink)
}
.legal p{margin:0 0 14px;color:var(--ink)}
.legal p.lede,.legal .note{color:var(--slate)}
.legal ul,.legal ol{margin:0 0 16px;padding-left:1.25em;color:var(--ink)}
.legal li{margin:0 0 8px}
.legal a{color:var(--teal)}
.legal a:hover{color:var(--ink)}
.legal .meta-line{font-size:14px;color:var(--slate);margin:0 0 8px}
.legal address{font-style:normal;margin:0 0 16px;line-height:1.5}

.toc{
  display:flex;flex-wrap:wrap;gap:8px;justify-content:center;
  max-width:760px;margin:0 auto 8px;padding:0 var(--pad) 12px
}
.toc a{
  font-size:13px;font-weight:500;color:var(--ink);
  background:var(--white);border:1px solid var(--mist);
  border-radius:999px;padding:6px 12px;text-decoration:none
}
.toc a:hover{border-color:var(--teal);color:var(--teal)}

.product-cards{display:grid;gap:12px;margin:16px 0 8px}
.product-card{
  background:var(--white);border:1px solid var(--mist);
  border-radius:var(--r-md);padding:16px 18px
}
.product-card h3{margin:0 0 6px;font-size:16px}
.product-card p{margin:0;font-size:15px;color:var(--slate)}

/* Categories table: 5-col desktop, stacked cards on small screens */
.cat-table{margin:16px 0 20px;border:1px solid var(--mist);border-radius:var(--r-md);overflow:hidden}
.cat-row{display:grid;grid-template-columns:1.1fr 1.3fr 1fr 1.2fr 1.4fr}
.cat-row > div{padding:12px 12px;border-bottom:1px solid var(--mist);font-size:14px;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.cat-head{background:var(--cloud);font-size:12px;font-weight:600;color:var(--slate);letter-spacing:.02em}
.cat-row:last-child > div{border-bottom:0}
@media (max-width:820px){
  .cat-head{display:none}
  .cat-row{grid-template-columns:1fr;padding:12px 14px;border-bottom:1px solid var(--mist)}
  .cat-row:last-child{border-bottom:0}
  .cat-row > div{border-bottom:0;padding:6px 0}
  .cat-row > div::before{
    content:attr(data-label);
    display:block;font-size:11px;font-weight:600;letter-spacing:.04em;
    text-transform:uppercase;color:var(--slate);margin-bottom:2px
  }
}

.legal-nav-links{display:flex;flex-wrap:wrap;gap:10px 16px;margin:8px 0 0;font-size:14px}

/* Export Check product — split night hero + flagged-cell grid (signature device) */
.check-hero{
  background:var(--night);color:#fff;
  padding:clamp(40px,6vw,72px) 0 clamp(36px,5vw,64px)
}
.check-hero-inner{
  max-width:var(--max);margin:0 auto;padding:0 var(--pad);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(28px,4vw,48px);align-items:center
}
.check-kicker{
  font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--teal-on-dark);margin:0 0 12px
}
.check-hero .h-hero{color:#fff;font-size:clamp(32px,4.4vw,52px);max-width:14em}
.check-hero .sub{color:var(--fog);margin:0 0 22px;max-width:32em}
.check-hero .btn-primary{font-size:15px;padding:12px 18px}
.check-legal-near{
  margin:14px 0 0;font-size:13px;color:var(--fog);max-width:36em;line-height:1.45
}
.check-legal-near a{color:var(--teal-on-dark)}
.check-legal-near a:hover{color:#fff}
.check-refund{margin:10px 0 0;font-size:14px;color:var(--fog);max-width:36em}
.check-refund a{color:var(--teal-on-dark)}

.flag-device{min-width:0}
.flag-grid{
  background:#11182f;border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r-lg);padding:14px 14px 12px;box-shadow:var(--e3-night)
}
.flag-grid-bar{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  margin-bottom:10px;font-size:11px;color:var(--fog);font-family:var(--mono)
}
.flag-grid-bar strong{color:#fff;font-weight:600;letter-spacing:.02em}
.flag-sheet{width:100%;border-collapse:collapse;font-size:12px;font-family:var(--mono)}
.flag-sheet th,.flag-sheet td{
  text-align:left;padding:8px 8px;border-bottom:1px solid rgba(255,255,255,.08);
  vertical-align:middle;overflow-wrap:anywhere
}
.flag-sheet th{color:var(--fog);font-weight:600;font-size:10px;letter-spacing:.06em;text-transform:uppercase}
.flag-sheet td{color:#e8ebf4}
.flag-sheet tr:last-child td{border-bottom:0}
.flag-cell{
  position:relative;background:rgba(245,184,46,.16);
  box-shadow:inset 3px 0 0 var(--amber);color:#fff
}
.flag-tick{
  display:inline-block;width:8px;height:8px;margin-right:6px;
  background:var(--amber);border-radius:1px;vertical-align:middle
}
.flag-note{color:var(--amber);font-size:11px}
.flag-caption{margin:8px 2px 0;font-size:11px;color:var(--fog)}

.check-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0}
.check-step{
  background:var(--white);border:1px solid var(--mist);
  border-radius:var(--r-md);padding:18px
}
.check-step .n{
  font-family:var(--mono);font-size:12px;font-weight:600;color:var(--teal);letter-spacing:.06em
}
.check-step h3{margin:8px 0 6px;font-size:17px}
.check-step p{margin:0;color:var(--slate);font-size:15px}

.check-list{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin:16px 0 8px;padding:0;list-style:none}
.check-list li{
  position:relative;padding:10px 12px 10px 36px;
  background:var(--cloud);border-radius:var(--r-sm);font-size:15px
}
.check-list li::before{
  content:"";position:absolute;left:12px;top:16px;width:10px;height:10px;
  background:var(--amber);border-radius:2px
}

.buy-band{background:var(--cloud)}
.buy-box{
  max-width:760px;margin:0 auto;padding:8px 0;
  display:flex;flex-direction:column;align-items:flex-start;gap:8px
}
.scope-note{font-size:15px;color:var(--slate);max-width:42em}

@media (max-width:820px){
  .check-hero-inner{grid-template-columns:1fr}
  .check-steps{grid-template-columns:1fr}
  .check-list{grid-template-columns:1fr}
  .flag-sheet{font-size:11px}
  .flag-sheet th,.flag-sheet td{padding:7px 6px}
}

.buy-band .check-legal-near{color:var(--slate)}
.buy-band .check-legal-near a{color:var(--teal)}
.buy-band .check-legal-near a:hover{color:var(--ink)}
@media (max-width:820px){
  .flag-sheet th:nth-child(3),
  .flag-sheet td:nth-child(3){display:none}
  .flag-sheet th{white-space:nowrap}
}