/* TRIRIGA / MREF section: tools walk-through */
.tririga-page .subnav {
  display: flex; flex-wrap: wrap; gap: 0 18px;
  padding: 4px var(--pad); border-bottom: 1px solid var(--divider);
  font-size: 14.5px; font-weight: 500;
}
.tririga-page .subnav a { color: var(--muted) }
.tririga-page .subnav a[aria-current="page"] { color: var(--cobalt) }
.tririga-page .hero-sm {
  padding: clamp(40px,6vw,88px) 0 clamp(36px,5vw,64px);
}
.tririga-page .hero-sm h1 {
  font-size: clamp(38px,5.4vw,68px); line-height: 1.02;
  letter-spacing: -.035em; margin-bottom: 22px; max-width: 14em;
}
.tririga-page .hero-sm .lead { max-width: 36em; margin-bottom: 28px }
.tririga-page .crumb {
  display: inline-flex; gap: 8px; font-size: 14.5px; font-weight: 600;
  color: var(--cobalt); margin-bottom: 22px; padding: 4px 0;
}
.tririga-page .crumb span { font-family: var(--mono) }
.tririga-page .tick-list { display: grid; gap: 14px; margin-top: 28px }
.tririga-page .tick-list li {
  display: flex; gap: 12px; align-items: flex-start;
  font-size: 16px; line-height: 1.55; color: var(--ink);
}
.tririga-page .tick-list li::before {
  content: ""; flex: none; width: 10px; height: 10px; margin-top: 7px;
  border-radius: 50%; background: var(--cobalt);
}
.tririga-page .tier-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 28px;
}
@media (max-width: 980px) { .tririga-page .tier-grid { grid-template-columns: 1fr 1fr } }
@media (max-width: 560px) { .tririga-page .tier-grid { grid-template-columns: 1fr } }
.tririga-page .tier {
  border: 1px solid var(--divider); border-radius: var(--r);
  padding: 22px 20px; background: var(--paper); min-height: 140px;
}
.tririga-page .tier h3 { font-size: 18px; margin-bottom: 8px }
.tririga-page .tier p { color: var(--muted); font-size: 14.5px }

/* Tools walk-through console */
.walk-demo {
  border: 1px solid var(--divider); border-radius: var(--r-lg);
  overflow: hidden; background: var(--ink-deep); color: var(--paper);
  box-shadow: 0 24px 56px rgba(10,11,13,.18);
}
.walk-demo-bar {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; background: var(--ink-raised);
  border-bottom: 1px solid rgba(250,251,252,.12);
  font-family: var(--mono); font-size: 12px; letter-spacing: .12em;
  text-transform: uppercase; color: rgba(250,251,252,.7);
}
.walk-demo-bar .dots { display: flex; gap: 6px; margin-right: 8px }
.walk-demo-bar .dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(250,251,252,.28) }
.walk-demo-body { display: grid; grid-template-columns: 200px 1fr; min-height: 420px }
@media (max-width: 760px) { .walk-demo-body { grid-template-columns: 1fr } }
.walk-steps {
  border-right: 1px solid rgba(250,251,252,.12);
  padding: 18px 14px; background: rgba(0,0,0,.22);
}
@media (max-width: 760px) {
  .walk-steps {
    display: flex; gap: 6px; overflow-x: auto; border-right: 0;
    border-bottom: 1px solid rgba(250,251,252,.12); padding: 12px;
  }
}
.walk-step-btn {
  display: block; width: 100%; text-align: left;
  padding: 12px 12px; border: 0; border-radius: 8px;
  background: transparent; color: rgba(250,251,252,.72);
  font-size: 13.5px; font-weight: 500; margin-bottom: 4px;
  transition: background-color 160ms var(--ease), color 160ms var(--ease);
}
@media (max-width: 760px) {
  .walk-step-btn { flex: none; white-space: nowrap; margin: 0 }
}
.walk-step-btn .n {
  display: block; font-family: var(--mono); font-size: 12px;
  letter-spacing: .16em; text-transform: uppercase; margin-bottom: 4px;
  color: rgba(250,251,252,.5);
}
.walk-step-btn[aria-current="true"],
.walk-step-btn.is-active {
  background: rgba(31,59,255,.28); color: var(--paper);
}
.walk-step-btn[aria-current="true"] .n,
.walk-step-btn.is-active .n { color: var(--cobalt-light) }
.walk-panel { padding: 22px 22px 28px; position: relative }
.walk-panel h3 {
  color: var(--paper); font-size: clamp(20px,2vw,24px); margin-bottom: 10px;
}
.walk-panel .lead-soft {
  color: rgba(250,251,252,.74); font-size: 15px; margin-bottom: 18px; max-width: 40em;
}
.walk-console {
  font-family: var(--mono); font-size: 13px; line-height: 1.55;
  background: rgba(0,0,0,.35); border: 1px solid rgba(250,251,252,.12);
  border-radius: var(--r); padding: 16px 16px 14px; min-height: 180px;
}
.walk-console .line { margin-bottom: 8px; color: rgba(250,251,252,.78) }
.walk-console .line .tag {
  display: inline-block; min-width: 4.2em; color: var(--cobalt-light); margin-right: 8px;
}
.walk-console .line.ask .tag { color: var(--paper) }
.walk-console .line.ok .tag { color: var(--cobalt-light) }
.walk-console .line.warn .tag { color: var(--paper) }
.walk-gate {
  margin-top: 16px; padding: 14px 16px; border-radius: var(--r);
  border: 1px dashed rgba(250,251,252,.35); background: rgba(31,59,255,.14);
}
.walk-gate strong { display: block; color: var(--paper); margin-bottom: 6px; font-size: 14.5px }
.walk-gate p { color: rgba(250,251,252,.74); font-size: 14px; margin: 0 }
.walk-controls {
  display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; align-items: center;
}
.walk-controls .btn { height: 42px; padding: 0 18px; font-size: 14px }
.walk-controls .hint {
  font-size: 13px; color: rgba(250,251,252,.6); font-family: var(--mono);
  letter-spacing: .06em;
}
.walk-static { display: none }
html:not(.js) .walk-static,
.walk-demo.reduced .walk-static { display: block }
html:not(.js) .walk-live,
.walk-demo.reduced .walk-live { display: none }
.walk-static ol { margin: 0; padding: 0; list-style: none }
.walk-static li {
  padding: 16px 0; border-bottom: 1px solid rgba(250,251,252,.12);
}
.walk-static li:last-child { border-bottom: 0 }
.walk-static .n {
  font-family: var(--mono); font-size: 12px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--cobalt-light); display: block; margin-bottom: 6px;
}
.walk-static h3 { color: var(--paper); font-size: 17px; margin-bottom: 6px }
.walk-static p { color: rgba(250,251,252,.74); font-size: 14.5px }

.ops-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 28px;
}
@media (max-width: 900px) { .ops-grid { grid-template-columns: 1fr 1fr } }
@media (max-width: 520px) { .ops-grid { grid-template-columns: 1fr } }
.ops-card {
  border: 1px solid var(--divider); border-radius: var(--r);
  padding: 22px 20px; background: var(--surface);
}
.ops-card .idx {
  font-family: var(--mono); font-size: 12px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--muted); display: block; margin-bottom: 12px;
}
.ops-card h3 { font-size: 18px; margin-bottom: 8px }
.ops-card p { color: var(--muted); font-size: 14.5px }

.date-strip {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 28px;
}
@media (max-width: 800px) { .date-strip { grid-template-columns: 1fr } }
.date-card {
  border-top: 3px solid var(--cobalt); background: var(--surface);
  border-radius: 0 0 var(--r) var(--r); padding: 20px 18px;
}
.date-card .when {
  font-family: var(--mono); font-size: 12px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--cobalt-deep); margin-bottom: 8px;
}
.date-card h3 { font-size: 18px; margin-bottom: 8px }
.date-card p { color: var(--muted); font-size: 14.5px }

.hold-note {
  margin-top: 18px; font-size: 13.5px; color: var(--muted);
  border-left: 3px solid var(--divider); padding-left: 14px;
}

@media (prefers-reduced-motion: reduce) {
  .walk-step-btn { transition: none }
}

/* Compare cards (readiness) */
.tririga-page .compare {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px;
}
@media (max-width: 760px) { .tririga-page .compare { grid-template-columns: 1fr } }
.tririga-page .compare-card {
  border: 1px solid var(--divider); border-radius: var(--r-lg);
  padding: 28px 26px; background: var(--paper);
}
.tririga-page .compare-card.featured {
  background: var(--surface); box-shadow: inset 0 0 0 2px var(--cobalt);
}
.tririga-page .compare-card .eyebrow { margin-bottom: 10px }
.tririga-page .compare-card h3 { font-size: 26px; margin-bottom: 18px }
.tririga-page .compare-card ul { display: grid; gap: 10px }
.tririga-page .compare-card li {
  position: relative; padding-left: 18px; color: var(--muted); font-size: 15.5px;
}
.tririga-page .compare-card li::before {
  content: ""; position: absolute; left: 0; top: 10px;
  width: 8px; height: 1.5px; background: var(--cobalt);
}

/* Product range cards */
.tririga-page .range-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
}
@media (max-width: 900px) { .tririga-page .range-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) } }
@media (max-width: 560px) { .tririga-page .range-grid { grid-template-columns: minmax(0, 1fr) } }
.tririga-page .range-card {
  border: 1px solid var(--divider); border-radius: var(--r-lg);
  padding: 24px 22px; background: var(--paper);
  display: flex; flex-direction: column; min-height: 200px;
}
.tririga-page .range-card .top {
  display: flex; justify-content: space-between; gap: 10px;
  margin-bottom: auto; padding-bottom: 20px;
}
.tririga-page .range-card .top { flex-wrap: wrap; align-items: flex-start }
.tririga-page .range-card .url { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere }
.tririga-page .range-card h3 { font-size: 22px; margin-bottom: 10px }
.tririga-page .range-card p { color: var(--muted); font-size: 15px; margin-bottom: 18px }
.tririga-page .range-card .go { margin-top: auto; color: var(--cobalt); font-weight: 600 }
.tririga-page .status-badge {
  display: inline-block; font-family: var(--mono); font-size: 12px;
  letter-spacing: .14em; text-transform: uppercase;
  background: var(--surface-alt); color: var(--ink);
  border-radius: 6px; padding: 5px 9px; white-space: nowrap;
}
.tririga-page .status-badge.dev { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink) }
.tririga-page .status-badge.built { background: #E9EBFF; color: var(--cobalt-deep) }

/* AI architecture */
.tririga-page .ai-arch {
  border: 1px solid var(--divider); border-radius: var(--r-lg);
  background: var(--ink-deep); color: var(--paper);
  padding: 28px 24px; box-shadow: 0 18px 48px rgba(10,11,13,.12);
}
.tririga-page .ai-arch h3 { color: var(--paper); font-size: 22px; margin-bottom: 8px }
.tririga-page .ai-arch p { color: rgba(250,251,252,.74); font-size: 15px }
.tririga-page .ai-layers { display: grid; gap: 12px; margin-top: 22px }
.tririga-page .ai-layer {
  border: 1px solid rgba(250,251,252,.16); border-radius: var(--r);
  padding: 16px 18px; background: rgba(250,251,252,.04);
}
.tririga-page .ai-layer .n {
  font-family: var(--mono); font-size: 12px; letter-spacing: .16em;
  text-transform: uppercase; color: var(--cobalt-light); display: block; margin-bottom: 6px;
}
.tririga-page .ai-layer strong { color: var(--paper); display: block; margin-bottom: 4px }

/* Dark section on tririga pages */
.tririga-page .sec.on-dark {
  background: var(--ink-deep); color: var(--paper);
}
.tririga-page .sec.on-dark h2,
.tririga-page .sec.on-dark h3 { color: var(--paper) }
.tririga-page .sec.on-dark .eyebrow { color: rgba(250,251,252,.72) }
.tririga-page .sec.on-dark .sec-head p,
.tririga-page .sec.on-dark .hold-note { color: rgba(250,251,252,.74) }
.tririga-page .sec.on-dark .hold-note a { color: var(--cobalt-light) }