/* RIVET stack strip (build spec C3): the tools a product runs in, shown inside the product, not as a logo wall.
   Only tools named in FACTS.md or on the page itself. Third-party marks are never recoloured; the one exception
   (owner, 29 Oct 2026, same as the dimmed logo strips) is that a chip's logo rests in grayscale at .7 opacity and
   lights to full colour on hover. Each logo sits on its own white tile so dark marks stay legible on dark pages.
   Cards and chips have no border (Brand OS). */

.stack{ padding-block:clamp(48px,6vw,88px); }
.stack__in{ display:grid; gap:clamp(20px,2.4vw,28px); }
.stack__row{ display:grid; gap:12px; }
.stack__chips{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:12px; }
.stack__k{ margin:0; color:var(--ink-mute,#4A4A68); }
.stack__note{ margin:0; max-width:44rem; color:var(--fg-soft,#4A4A68); }
.stack__where{ display:flex; flex-wrap:wrap; gap:8px 32px; margin:0; }
.stack__where > div{ display:flex; align-items:baseline; gap:10px; }
.stack__where dt{ color:var(--ink-mute,#4A4A68); }
.stack__where dd{ margin:0; color:var(--ink,#000); font-weight:500; }

/* chip */
.tchip{ display:inline-flex; align-items:center; gap:8px; height:40px; padding-block:0; padding-inline:6px 16px; border-radius:999px;
  background:#fff; box-shadow:var(--card-shadow); color:var(--ink,#000); font:500 14px/1 var(--font-sans); white-space:nowrap; }
.tchip--cat{ padding-inline-start:12px; }
.tchip__lg{ flex:none; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#fff; }
.tchip__lg--ink{ background:#000; }   /* marks drawn for dark grounds (the ChatGPT file is #EEE) */
.tchip__lg :is(img,svg){ display:block; width:20px; height:20px; object-fit:contain;
  filter:grayscale(1); opacity:.7; transition:filter var(--dur-instant,120ms) var(--ease-standard,ease), opacity var(--dur-instant,120ms) var(--ease-standard,ease); }
.tchip:hover .tchip__lg :is(img,svg), .tchip:focus-within .tchip__lg :is(img,svg), .tchip.is-lit .tchip__lg :is(img,svg){ filter:none; opacity:1; }
.tchip__ic{ flex:none; width:20px; height:20px; color:var(--purple,#3B06D4); }
.tchip em{ font-style:normal; color:var(--purple-600,#5E5FFF); }
@media (prefers-reduced-motion:reduce){ .tchip__lg :is(img,svg){ transition:none; } }

/* inline row (membership page: no heading of its own) */
.stack--inline{ padding-block:0; margin-top:clamp(28px,3vw,40px); }
.stack--inline .stack__in{ gap:12px; justify-items:center; text-align:center; }
.stack--inline .stack__chips{ justify-content:center; }
.stack--inline .stack__note{ margin-inline:auto; }

/* dark grounds: corporate pages and the dark course pages (body.gtm-dark on a light-mode document).
   The dark course pages whiten p/li/dd (0,8,2) and dt, headings and b (0,11,2) with rules carrying up to nine :not() escapes;
   the gtm-dark text rules below repeat all nine so they outrank both (0,12,2+). */
html[data-mode="dark"] .tchip, body.gtm-dark main .tchip{ background:var(--elev-2,#12121A); box-shadow:none; color:#fff; }
html[data-mode="dark"] .tchip__ic, body.gtm-dark main .tchip__ic{ color:var(--purple-on-dark,#7B87FF); }
html[data-mode="dark"] .tchip em, body.gtm-dark main .tchip em{ color:var(--purple-on-dark,#7B87FF) !important; }
body.gtm-dark main .tchip span{ color:#fff !important; }
html[data-mode="dark"] .stack__note,
body.gtm-dark main .stack .stack__note:not(.cx-ui):not(.cx-ui *):not(.room__phone *):not(.ipd *):not(.gcal *):not(.cstage__ds *):not(.cstage__art *):not(.cstage__mnote *):not(.cstage__tcard *){ color:var(--slate-on-dark,#9A9BBD) !important; }
html[data-mode="dark"] .stack__where dt,
body.gtm-dark main .stack .stack__where dt:not(.cx-ui):not(.cx-ui *):not(.room__phone *):not(.ipd *):not(.gcal *):not(.cstage__ds *):not(.cstage__art *):not(.cstage__mnote *):not(.cstage__tcard *){ color:var(--slate-on-dark,#9A9BBD) !important; }
html[data-mode="dark"] .stack__where dd,
body.gtm-dark main .stack .stack__where dd:not(.cx-ui):not(.cx-ui *):not(.room__phone *):not(.ipd *):not(.gcal *):not(.cstage__ds *):not(.cstage__art *):not(.cstage__mnote *):not(.cstage__tcard *){ color:#fff !important; }
html[data-mode="dark"] .stack .stack__k,
body.gtm-dark main .stack .stack__k:not(.cx-ui):not(.cx-ui *):not(.room__phone *):not(.ipd *):not(.gcal *):not(.cstage__ds *):not(.cstage__art *):not(.cstage__mnote *):not(.cstage__tcard *){ color:var(--slate-on-dark,#9A9BBD) !important; }
body.gtm-dark main .stack .t-eyebrow:not(.cx-ui):not(.cx-ui *):not(.room__phone *):not(.ipd *):not(.gcal *):not(.cstage__ds *):not(.cstage__art *):not(.cstage__mnote *):not(.cstage__tcard *){ color:var(--cyan,#4CF3FE) !important; }   /* matches the page's own eyebrows */

:lang(ar) .tchip{ font-family:var(--font-ar); }
