/* Mix Chops Pro launch (Nov 2026): a slim strip (.mclw > .mcl) and the home hero's pill (.mclp).
   Markup comes from pdf-sources/products/mc_launch.py; remove it everywhere with that script's --remove.
   Mix Chops' colours: warm black, cream ink, and Pro's gold. */
.mclw,.mclp{--mc-ink:#f4efe7;--mc-dim:#a8a197;--mc-gold-t:#e2bd66;--mc-gold-g:linear-gradient(135deg,#f3d58f 0%,#d8ad4e 45%,#b8892f 100%);--mc-btn-ink:#1b1406}

/* ── where the strip sits: its wrapper takes the width of what it lines up with ──
   tool: first box in the tool's own column, so it has the same width and centring as the tool's boxes
   deck: under the title, exactly as wide as the deck (same font size and 62ch measure)
   full: under the title, the full width of the cards below */
div.mclw{container-type:inline-size;box-sizing:border-box;width:100%;margin:0;padding:0}
div.mclw.mclw--tool{margin:0 0 var(--mcl-gap,16px)}   /* the tool's own gap between its boxes (set per page by the generator) */
div.mclw--deck{max-width:62ch;margin:26px 0 0;font-size:clamp(16px,1.9vw,21px);font-weight:500}
div.mclw--full{margin:28px 0 0}

/* ── the strip ── */
aside.mcl{display:flex;align-items:center;gap:16px;box-sizing:border-box;width:100%;margin:0;padding:14px 14px 14px 16px;
  font-family:'Archivo',sans-serif;text-align:left;color:var(--mc-ink);
  background:#100d0a;border:1px solid rgba(216,173,78,.26);border-radius:12px}
/* under a title it comes in with the title block; inside a tool it stays still, like the tool's boxes */
.mclw--deck aside.mcl,.mclw--full aside.mcl{animation:rvIn .85s .4s both}
aside.mcl *{box-sizing:border-box;font-family:inherit}   /* the tools reset everything inside them */
.mcl .mcl__ic{display:block;flex:none;width:40px;height:40px;margin:0;padding:0;border-radius:10px}
.mcl .mcl__t{flex:1;min-width:0;margin:0;padding:0}
.mcl .mcl__h{margin:0;padding:0;max-width:none;font-weight:700;font-size:16.5px;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--mc-ink);animation:none}
.mcl .mcl__h em{font-style:normal;color:var(--mc-gold-t)}
.mcl .mcl__p{margin:3px 0 0;padding:0;max-width:none;font-weight:400;font-size:14px;line-height:1.45;letter-spacing:0;text-transform:none;color:var(--mc-dim);animation:none}
.mcl .mcl__p b{font-weight:600;color:var(--mc-ink)}
.mcl a.mcl__btn,.mcl a.mcl__btn:visited{display:inline-flex;flex:none;align-items:center;gap:8px;margin:0;padding:11px 15px;border:0;border-radius:9px;background:var(--mc-gold-g);color:var(--mc-btn-ink);font-weight:600;font-size:14px;line-height:1.2;letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;transition:filter .15s}
.mcl a.mcl__btn:hover{color:var(--mc-btn-ink);filter:brightness(1.08)}
.mcl a.mcl__btn svg{display:block;width:15px;height:15px;flex:none}

/* too narrow for one row (the calculator, troubleshooter and LUFS columns, a phone): text beside the icon,
   the button under the text */
@container (max-width:720px){
  aside.mcl{flex-wrap:wrap;align-items:flex-start;gap:10px 14px;padding:14px}
  .mcl .mcl__ic{width:36px;height:36px;border-radius:9px}
  .mcl .mcl__t{flex-basis:calc(100% - 50px)}
  .mcl a.mcl__btn{margin-left:50px}
}
@container (max-width:380px){
  .mcl a.mcl__btn{margin-left:0;width:100%;justify-content:center}
}

/* ── the home hero's pill ── */
a.mclp,a.mclp:visited{display:inline-flex;align-items:center;gap:10px;max-width:100%;box-sizing:border-box;margin:0 0 26px;padding:5px 14px 5px 5px;border:1px solid rgba(216,173,78,.38);border-radius:999px;background:rgba(10,8,6,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--mc-ink);font-family:'Archivo',sans-serif;font-weight:500;font-size:14px;line-height:1.3;letter-spacing:0;text-transform:none;text-decoration:none;transition:border-color .2s,background .2s;animation:rvIn .8s .05s both}
a.mclp:hover{border-color:rgba(243,213,143,.7);background:rgba(20,16,10,.85);color:var(--mc-ink)}
.mclp .mclp__pro{display:inline-block;font-family:'Archivo Expanded','Archivo',sans-serif;font-weight:800;font-size:11px;line-height:1;letter-spacing:.06em;color:var(--mc-btn-ink);background:var(--mc-gold-g);padding:5px 9px;border-radius:999px}
.mclp .mclp__t{min-width:0}
.mclp .mclp__t b{font-weight:600;color:var(--mc-gold-t)}
.mclp .mclp__arr{flex:none;color:var(--mc-gold-t);transition:transform .2s}
a.mclp:hover .mclp__arr{transform:translateX(3px)}
@media (max-width:560px){
  a.mclp{font-size:13px;gap:8px;margin-bottom:20px}
  .mclp .mclp__long{display:none}
}

@media (prefers-reduced-motion:reduce){
  .mclw aside.mcl,a.mclp{animation:none}
  .mcl a.mcl__btn,.mclp .mclp__arr{transition:none}
}