/* Module styles: Affiliates (unlock, adverts), Licenses and Downloads.
   Loaded by the member shell and by every theme, so the same classes work on
   a CMS page and inside the member area. Tokens come from site.css. */

/* ---- the export unlock page ---- */
.unlock-hero{display:flex;gap:20px;align-items:center;flex-wrap:wrap;border-left:4px solid var(--a500)}
.unlock-hero.on{border-left-color:var(--g600)}
.unlock-hero>div:first-child{flex:1;min-width:260px}
.unlock-count{text-align:center;padding:14px 22px;border-radius:16px;background:var(--n100);min-width:104px}
.unlock-count b{display:block;font-family:var(--fh);font-weight:400;font-size:34px;line-height:1;color:var(--g800)}
.unlock-count span{font-size:12px;color:var(--n600)}
.unlock-strip{display:flex;gap:18px;align-items:center;flex-wrap:wrap;border-left:4px solid var(--a500)}
.unlock-strip.on{border-left-color:var(--g600)}
.unlock-strip>div{flex:1;min-width:250px}
.unlock-strip h2{font-size:18px}
.apphead .warnlink{color:var(--a800);font-weight:700}

.steps3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px;margin-bottom:18px}
.step{background:#fff;border:1px solid var(--div);border-radius:18px;padding:22px;position:relative}
.step.now{border-color:var(--g400);box-shadow:0 0 0 3px var(--g100)}
.step.done{background:var(--g100);border-color:var(--g300)}
.step .n{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--n200);
  color:var(--n700);font-weight:700;font-size:14px;margin-bottom:12px}
.step.now .n{background:var(--g600);color:#fff}
.step.done .n{background:var(--g700);color:#fff}
.step h3{margin:0 0 6px;font-size:17px}
.step p{margin:0 0 12px;font-size:13.5px;color:var(--n700);line-height:1.55}
.step .mini{font-size:13px;color:var(--n700)}
.step .mini b{font-family:var(--fh);font-weight:400;font-size:20px;color:var(--g800)}
.bar2{height:6px;border-radius:99px;background:var(--n200);overflow:hidden;margin-top:8px}
.bar2 i{display:block;height:100%;background:var(--g600);border-radius:99px}

.invgrid{display:grid;gap:9px}
.invrow{display:grid;grid-template-columns:26px 1fr 1fr;gap:9px;align-items:center}
.invrow .ix{font-size:12px;color:var(--n600);text-align:right;font-variant-numeric:tabular-nums}
.invrow input{width:100%;font-family:var(--fb);font-size:14.5px;padding:10px 13px;border:1px solid var(--n400);border-radius:10px;background:#fff;min-width:0}

.worth{border-radius:16px;border:1px solid var(--div);padding:20px;background:var(--n100)}
.worth.alt{background:var(--k100,var(--n100));border-color:var(--k300,var(--div))}
.worth b{display:block;font-family:var(--fh);font-weight:400;font-size:24px;margin:12px 0 6px;color:var(--g800)}
.worth p{margin:0;font-size:13.5px;color:var(--n700)}

/* ---- the buy / download panel on the two build pages ---- */
.dl-buy{display:flex;gap:26px;align-items:center;flex-wrap:wrap;background:var(--surface);border:1px solid var(--div);
  border-radius:var(--rl);padding:26px 28px;box-shadow:var(--sm)}
.dl-buy>div:first-child{flex:1;min-width:250px}
.dl-buy h3{margin:0 0 8px;font-size:24px}
.dl-buy.locked{border-style:dashed}
.dl-buy.owned{border-color:var(--g400);background:var(--g100)}
.dl-meta{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--n700)}
.dl-meta span{background:var(--n200);border-radius:99px;padding:4px 12px}
.dl-act{display:flex;flex-direction:column;gap:8px;align-items:flex-start;min-width:230px}
.dl-act .btn{width:100%;text-align:center}
.dl-price{font-family:var(--fh);font-weight:400;font-size:38px;line-height:1;color:var(--g800)}
.dl-key{margin-top:14px;background:#fff;border:1px solid var(--g300);border-radius:12px;padding:12px 14px}
.dl-key span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--n700);margin-bottom:4px}
.dl-key code{font-size:16px;letter-spacing:.06em;color:var(--g900)}
.buybox{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:14px;border:1px solid var(--div);
  border-radius:16px;padding:18px;background:var(--n100)}
.buybox div span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--n600);margin-bottom:4px}
.buybox div b{font-size:15px}
.buybox div b.pr{font-family:var(--fh);font-weight:400;font-size:26px;color:var(--g800)}

/* ---- licence tiers: this module's own pricing, shown on the build pages ---- */
.dl-head{margin-bottom:16px}
.dl-head h3{margin:0 0 10px;font-size:26px}
.tiergrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;align-items:start}
.tiercard{position:relative;background:var(--surface);border:1px solid var(--div);border-radius:var(--rl);padding:26px 24px;box-shadow:var(--sm)}
.tiercard.pick{border-color:var(--g400);box-shadow:0 0 0 3px var(--g100),var(--sm)}
.tiercard .tag{position:absolute;top:-11px;left:22px}
.tiercard h4{margin:0 0 6px;font-family:var(--fh);font-weight:400;font-size:22px}
.tiercard .tb{margin:0 0 14px;font-size:13.5px;color:var(--n700);line-height:1.55}
.tiercard .tp{font-family:var(--fh);font-weight:400;font-size:34px;line-height:1;color:var(--g800);display:flex;align-items:baseline;gap:9px}
.tiercard .tp s{font-family:var(--fb);font-size:15px;color:var(--n600)}
.tiercard .tmeta{font-size:12.5px;color:var(--n600);margin:8px 0 16px}
.tiercard .btn{width:100%;text-align:center}
.tfeat{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:7px}
.tfeat li{font-size:13.5px;color:var(--n800);padding-left:22px;position:relative}
.tfeat li:before{content:"\2713";position:absolute;left:0;color:var(--g600);font-weight:700}
.tfeat li.more{color:var(--n600);font-style:italic}
.tfeat li.more:before{content:""}
.tsla{margin-top:16px;padding-top:14px;border-top:1px solid var(--div);font-size:12.5px;color:var(--n600)}

.tierpick{display:grid;gap:10px}
.tierradio{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"r n p" ". d d" ". m m";gap:2px 12px;
  border:1px solid var(--n400);border-radius:14px;padding:16px 18px;cursor:pointer;margin:0;font-weight:400}
.tierradio.on{border-color:var(--g500);background:var(--g100)}
.tierradio:hover{border-color:var(--g400)}
.tierradio input{grid-area:r;width:auto;margin:3px 0 0;align-self:start}
.tierradio .tn{grid-area:n;font-weight:700;font-size:15.5px}
.tierradio .tn em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  background:var(--a200);color:var(--a900);border-radius:99px;padding:2px 9px;margin-left:8px;vertical-align:1px}
.tierradio .tpr{grid-area:p;font-family:var(--fh);font-weight:400;font-size:22px;color:var(--g800)}
.tierradio .td{grid-area:d;font-size:13.5px;color:var(--n700)}
.tierradio .tm{grid-area:m;font-size:12.5px;color:var(--n600);margin-top:4px}
.featlist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
.featlist li{font-size:14px;padding-left:22px;position:relative}
.featlist li:before{content:"\2713";position:absolute;left:0;color:var(--g600);font-weight:700}

@media (max-width:760px){
  .invrow{grid-template-columns:22px 1fr}
  .invrow input:last-child{grid-column:2}
  .dl-act{min-width:0;width:100%}
  .unlock-count{width:100%}
  .tierradio{grid-template-columns:auto 1fr;grid-template-areas:"r n" ". p" ". d" ". m"}
}