/* MetaMatch — Corporate Mode.
   Palette verbatim from MetaMatch Colors Palette.pdf. Single dark theme by design. */
:root{
  --bg:#191919; --front:#232323; --edge:#38383B;
  --t1:#FFFFFF; --t2:#CFCFCF; --t3:#8C8C8C; --t4:#686868;
  --cta:#FFD300; --cta-lit:#FFFD54; --on-cta:#191919;
  --red:#DD240E; --yellow:#FFEA00; --green:#3AE417; --blue:#0145F2;
  --font:'Fira Sans','Segoe UI','Helvetica Neue',Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--t1);font-family:var(--font);font-size:15.5px;
  line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
.wrap{max-width:1000px;margin:0 auto;padding-inline:22px}

.top{border-bottom:1px solid var(--edge);position:sticky;top:0;z-index:5;
  background:rgba(25,25,25,.95);backdrop-filter:blur(10px)}
.topin{max-width:1000px;margin:0 auto;padding:12px 22px;display:flex;align-items:center;
  gap:16px;justify-content:space-between;flex-wrap:wrap}
.logo{height:32px;width:auto}
.who{font-size:11.5px;color:var(--t3);letter-spacing:.04em}
.who b{color:var(--t2);font-weight:500}

.screen{display:none}
.screen.on{display:block}
.pad{padding-block:52px 64px}

h1{font-size:clamp(30px,5vw,46px);line-height:1.06;font-weight:700;letter-spacing:-.02em;
  margin-bottom:16px;text-wrap:balance}
h2{font-size:clamp(24px,3.6vw,34px);line-height:1.12;font-weight:700;letter-spacing:-.015em;
  margin-bottom:12px;text-wrap:balance}
h3{font-size:24px;font-weight:700;letter-spacing:-.01em;margin-bottom:18px}
.eyebrow{font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--cta);
  font-weight:500;margin-bottom:12px}
.lede{font-size:17px;color:var(--t2);max-width:38rem;margin-bottom:28px}

.btn{font:600 14px/1 var(--font);border-radius:4px;padding:14px 24px;cursor:pointer;
  border:1px solid transparent;text-decoration:none;display:inline-block;transition:.15s}
.btn.primary{background:var(--cta);color:var(--on-cta)}
.btn.primary:hover{background:var(--cta-lit)}
.btn.primary:disabled{background:var(--edge);color:var(--t4);cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--t1);border-color:var(--edge)}
.btn.ghost:hover{border-color:var(--cta);color:var(--cta)}
.btn:focus-visible{outline:2px solid var(--cta);outline-offset:3px}
.btnrow{display:flex;gap:11px;flex-wrap:wrap;margin-top:8px}

.pbar{height:2px;background:var(--edge);margin-bottom:30px}
.pbar span{display:block;height:100%;background:var(--cta);width:0;transition:width .35s}
.scen{color:var(--t2);max-width:60ch;margin-bottom:20px}
.instruct{font-size:13.5px;color:var(--t3);display:flex;gap:13px;align-items:center;
  flex-wrap:wrap;margin-bottom:20px}
.instruct b{color:var(--t1)}
.cnt{font-size:11.5px;font-weight:600;color:var(--cta);border:1px solid var(--edge);
  border-radius:99px;padding:3px 12px}
.opts{display:grid;gap:8px;margin-bottom:26px}
.opt{display:flex;gap:14px;align-items:flex-start;background:var(--front);
  border:1px solid var(--edge);border-radius:5px;padding:15px 17px;cursor:pointer;
  text-align:left;color:var(--t1);font:400 15px/1.5 var(--font);width:100%;transition:.14s}
.opt:hover{border-color:var(--t4)}
.opt.sel{border-color:var(--cta);background:#2A2617}
.opt.dim{opacity:.4}
.opt:focus-visible{outline:2px solid var(--cta);outline-offset:2px}
.mk{flex:0 0 20px;height:20px;border-radius:50%;border:1.5px solid var(--edge);margin-top:1px;
  display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--on-cta)}
.opt.sel .mk{background:var(--cta);border-color:var(--cta)}

.rtop{display:flex;gap:34px;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;
  border-bottom:1px solid var(--edge);padding-bottom:26px;margin-bottom:26px}
.rmeta{flex:1 1 360px;min-width:260px}
.sig{color:var(--t2);max-width:54ch;margin-bottom:14px}
.chips{display:flex;gap:7px;flex-wrap:wrap}
.chip{font-size:11.5px;border:1px solid var(--edge);border-radius:99px;padding:4px 12px;color:var(--t3)}
.chip i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px}
.wheelbox{flex:0 0 168px;text-align:center}
#wheel{width:168px;height:168px}
.wcap{font-size:10px;color:var(--t4);margin-top:8px;line-height:1.5}
.hello{font-size:clamp(17px,2vw,20px);line-height:1.55;border-left:2px solid var(--cta);
  padding:2px 0 2px 22px;margin-bottom:26px;max-width:60ch}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin-bottom:32px}
.card{background:var(--front);border:1px solid var(--edge);border-radius:6px;padding:18px 20px}
.card h4{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--cta);
  font-weight:600;margin-bottom:8px}
.card p{color:var(--t2);font-size:14.5px}
.tabs{display:flex;gap:7px;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid var(--edge);
  margin-bottom:24px}
.tab{font:500 12px/1 var(--font);background:transparent;color:var(--t3);border:1px solid var(--edge);
  border-radius:99px;padding:8px 14px;cursor:pointer;transition:.14s}
.tab:hover{color:var(--t1);border-color:var(--t4)}
.tab.on{background:var(--cta);border-color:var(--cta);color:var(--on-cta);font-weight:600}
.tab:focus-visible{outline:2px solid var(--cta);outline-offset:2px}
.sect{min-height:240px}
.sect ul{list-style:none;display:grid;gap:12px}
.sect li{background:var(--front);border:1px solid var(--edge);border-left:2px solid var(--cta);
  border-radius:0 5px 5px 0;padding:15px 19px;font-size:14.8px;color:var(--t2)}
.sect li b{display:block;color:var(--t1);font-size:11px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:6px}

.panel{background:var(--front);border:1px solid var(--edge);border-radius:6px;padding:26px 28px;
  max-width:44rem}
.panel p{color:var(--t2);margin-bottom:14px}
.panel p:last-child{margin-bottom:0}
.spinner{width:22px;height:22px;border:2px solid var(--edge);border-top-color:var(--cta);
  border-radius:50%;animation:spin .8s linear infinite;margin-bottom:16px}
@keyframes spin{to{transform:rotate(360deg)}}
.foot{border-top:1px solid var(--edge);margin-top:48px;padding-block:24px 40px;
  color:var(--t4);font-size:12px}
.foot a{color:var(--t3)}
@media (max-width:560px){.topin{gap:10px;padding:10px 22px}.logo{height:26px}.wheelbox{flex:1 1 100%}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}