/* ============================================================
   EnableX Glossary — shared page-local patterns
   Loads AFTER enx-theme.css. Used by dialogs/glossary/*.html only.
   ============================================================ */

/* Compact hero for a dictionary-style page (lighter than the full enx-hero) */
.gloss-hero-tight{padding:52px 0 40px}
@media (max-width:768px){.gloss-hero-tight{padding:40px 0 32px}}

/* Breadcrumb */
.gloss-crumb{font-size:12.5px;color:var(--enx-ink-mute);margin-bottom:18px}
.gloss-crumb a{color:var(--enx-ink-mute);text-decoration:none}
.gloss-crumb a:hover{color:var(--enx-red)}
.gloss-crumb .sep{margin:0 6px;opacity:.5}

/* Category badge pill (Concept / Pattern / Engineering / UX / Legacy) */
.gloss-tag{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--enx-red);background:var(--enx-red-light);
  padding:5px 11px;border-radius:999px;margin-right:10px;vertical-align:middle}

/* "Three things to remember" checklist */
.gloss-check{list-style:none;padding:0;margin:0 auto;max-width:760px}
.gloss-check li{position:relative;padding:12px 0 12px 36px;font-size:16.5px;line-height:1.6;
  color:var(--enx-ink-soft);border-bottom:1px solid var(--enx-line)}
.gloss-check li:last-child{border-bottom:0}
.gloss-check li::before{content:"";position:absolute;left:0;top:14px;width:20px;height:20px;
  border-radius:50%;background:var(--enx-grad-btn)}
.gloss-check li::after{content:"\2713";position:absolute;left:5px;top:14.5px;color:#fff;
  font-size:11px;font-weight:800;line-height:20px}

/* Prose blocks: detailed explanation / how EnableX implements */
.gloss-body{max-width:760px;margin:0 auto;font-size:16.5px;line-height:1.75;color:var(--enx-ink-soft)}
.gloss-body p{margin-bottom:1.1em}
.gloss-body p:last-child{margin-bottom:0}
.gloss-body strong{color:var(--enx-ink)}

/* Related-term cards */
.gloss-related-eyebrow{font-size:10.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--enx-purple);margin-bottom:8px}
.gloss-related-link{color:var(--enx-red-dark);font-weight:700;font-size:13px;
  text-decoration:none;display:inline-block;margin-top:auto;padding-top:10px}
.gloss-related-link:hover{color:var(--enx-red)}

/* "Where to dive deeper" pill row */
.gloss-pill-row{display:flex;flex-wrap:wrap;justify-content:center;gap:9px}
.gloss-pill{display:inline-block;background:#fff;border:1px solid var(--enx-line);
  padding:7px 15px;border-radius:999px;color:var(--enx-red-dark);font-weight:700;
  text-decoration:none;font-size:13.5px}
.gloss-pill:hover{border-color:var(--enx-purple);color:var(--enx-purple)}

/* Index page: term grid */
.gloss-section{margin-bottom:56px}
.gloss-section:last-child{margin-bottom:0}
.gloss-section h2{font-size:1.5rem;margin-bottom:.35rem}
.gloss-lead-tiny{color:var(--enx-ink-mute);margin-bottom:26px;font-size:15px}
.gloss-index-card{background:#fff;border:1px solid var(--enx-line);border-radius:var(--enx-radius-card);
  padding:24px;height:100%;transition:box-shadow .15s,transform .15s;text-decoration:none;
  color:inherit;display:flex;flex-direction:column}
.gloss-index-card:hover{box-shadow:var(--enx-shadow);transform:translateY(-2px);color:inherit}
.gloss-index-card h3{font-size:1.08rem;margin-bottom:8px;color:var(--enx-ink)}
.gloss-index-card p{font-size:14px;color:var(--enx-ink-soft);line-height:1.55;margin:0}