/* Product surfaces catch a brighter light-sweep right as they settle in,
   on top of the slow always-on ambient sheen (ambient.css) — a one-time
   "just arrived" highlight gated by the window's own entrance progress. */
.product-window[data-motion="depth-window"]::after,
.app-shell[data-motion="depth-window"]::after,
.property-app[data-motion="depth-window"]::after,
.property-detail[data-motion="depth-window"]::after,
.consultant-app[data-motion="depth-window"]::after,
.procurement-brief[data-motion="depth-window"]::after,
.demand-panel[data-motion="depth-window"]::after {
  opacity: calc(var(--surface-reflection-opacity) * min(1, var(--item)) * 1.6);
}

/* Shared visual surfaces */
.visual article,
.product-window,
.app-shell,
.property-app,
.property-detail,
.consultant-app,
.procurement-brief,
.demand-panel {
  border: 1px solid var(--line);
  border-radius: var(--panel-radius);
  background: linear-gradient(180deg, rgba(18,20,27,.95), rgba(11,13,18,.96));
  box-shadow: var(--panel-shadow);
}

/* Shared identifying mark for "native app" visuals (app-shell family) — a
   small live-status dot beside each container's existing eyebrow label,
   distinct from .window-bar's browser traffic-lights (those frame real
   screenshots; this marks fictional in-product views as "live"). Zero layout
   cost — sits inline with content that already exists in each container. */
.app-chrome-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 7px;
  border-radius: 50%;
  background: rgb(var(--accent-rgb));
  box-shadow: 0 0 7px rgba(var(--accent-rgb), .75);
  vertical-align: middle;
}

.interface-caption,
.problem-caption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 0;
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding-top: 14px;
  border-top: 1px solid var(--line-soft);
  color: var(--muted);
}
.interface-caption span,
.problem-caption span {
  color: rgb(var(--accent-rgb));
  font-size: clamp(9px, .6vw, 12px);
  font-weight: 650;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.interface-caption strong,
.problem-caption strong { font-size: clamp(12px, .82vw, 17px); font-weight: 520; }

/* Portfolio opener — Oxvsys as hub, the five companies orbiting around it,
   connected by spokes. Positions are computed in VisualFactory.js (evenly
   spaced ellipse, matching the wide-short .scene--center visual pane) and
   passed down as inline left/top percentages. */
.visual--portfolio-overview { position: relative; width: 100%; height: 100%; }
.orbit-spokes { position: absolute; inset: 0; width: 100%; height: 100%; }
.orbit-spokes line { stroke: var(--line); stroke-width: 1; }
.orbit-ring {
  position: absolute; left: 50%; top: 50%; width: 86%; height: 68%;
  transform: translate(-50%, -50%);
  border: 1px dashed rgba(var(--accent-rgb), .22);
  border-radius: 50%;
}
.portfolio-hub {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  z-index: 2;
  border: 1px solid rgba(var(--accent-rgb), .38);
  border-radius: var(--list-radius);
  background: rgba(14,16,22,.92);
  display: grid; place-content: center; justify-items: center; gap: 14px;
  padding: 22px 30px;
  box-shadow: 0 20px 50px rgba(0,0,0,.4);
}
.portfolio-hub__logo { width: min(78%, 200px); max-height: 46px; }
.portfolio-hub span { color: var(--muted); font-size: clamp(10px, .66vw, 13px); white-space: nowrap; }
.portfolio-orbit-item {
  position: absolute; transform: translate(-50%, -50%);
  z-index: 2;
  border: 1px solid var(--line);
  border-radius: var(--list-radius);
  background: rgba(14,16,22,.9);
  display: grid; justify-items: center; gap: 8px;
  padding: 14px 16px;
  min-width: 118px;
}
.portfolio-orbit-item img { width: min(84%, 108px); height: 26px; object-fit: contain; }
.portfolio-orbit-item span { color: var(--muted); font-size: clamp(9px, .58vw, 12px); text-align: center; white-space: nowrap; }

/* Operational friction */
.visual--problem-stack { padding-bottom: 60px; }
.problem-stack { height: calc(100% - 48px); display: grid; align-content: center; gap: 10px; }
.problem-item {
  min-height: 90px;
  border-radius: var(--list-radius);
  padding: 18px 20px;
  display: grid;
  grid-template-columns: 42px 1fr auto;
  align-items: center;
  gap: 18px;
  box-shadow: none !important;
}
.problem-item__icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; color: rgb(var(--accent-rgb)); background: rgba(var(--accent-rgb), .1); }
.problem-item__icon svg { width: 21px; height: 21px; }
.problem-item strong, .problem-item small { display: block; }
.problem-item strong { font-size: clamp(15px, 1vw, 21px); font-weight: 560; }
.problem-item small { margin-top: 5px; color: var(--muted); font-size: clamp(11px, .68vw, 14px); }
.problem-item__status { color: #858b97; font-size: clamp(9px, .62vw, 12px); letter-spacing: .11em; text-transform: uppercase; }
.problem-caption { width: 100%; }

/* Real interface gallery */
.visual--interface-gallery { padding-bottom: 54px; }
.product-window { overflow: hidden; }
.window-bar {
  height: 42px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  gap: 7px;
  background: #101218;
  border-bottom: 1px solid var(--line-soft);
}
.window-bar i { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.23); }
.window-bar span { margin-left: 8px; color: #c9cdd5; font-size: clamp(9px, .61vw, 12px); }
.window-bar b { margin-left: auto; color: var(--quiet); font-size: clamp(8px, .54vw, 11px); font-weight: 520; letter-spacing: .05em; }
.product-window--primary { position: absolute; inset: 2% 11% 14% 0; }
.product-window--secondary { position: absolute; width: 47%; height: 48%; right: 0; bottom: 9%; box-shadow: 0 34px 70px rgba(0,0,0,.56); }
.interface-caption { width: 46%; }

/* Fictional "manufacturing budget platform" mock, Oxvsys */
.budget-mock { height: calc(100% - 42px); padding: 12px 18px; overflow: hidden; display: grid; grid-template-rows: auto repeat(4,1fr) auto; background: #0d0f14; }
.budget-mock__head { display: grid; grid-template-columns: 1.4fr .7fr .9fr; padding: 0 2px 8px; color: var(--quiet); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; border-bottom: 1px solid var(--line); }
.budget-mock__row { display: grid; grid-template-columns: 1.4fr .7fr .9fr; align-items: center; padding: 0 2px; border-bottom: 1px solid var(--line-soft); font-size: clamp(10px, .68vw, 13px); color: #d6d9df; }
.budget-mock__row span:nth-child(2) { color: var(--muted); font: 10px ui-monospace, monospace; }
.budget-mock__row span:nth-child(3) { text-align: right; font: 11px ui-monospace, monospace; color: var(--muted); }
.budget-mock__summary { margin-top: 7px; padding-top: 9px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: baseline; }
.budget-mock__summary span { color: var(--quiet); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.budget-mock__summary strong { color: rgb(var(--accent-rgb)); font-size: 15px; }

/* Fictional "field data platform" mock, Oxvsys */
.field-mock { height: calc(100% - 42px); padding: 12px 14px; overflow: hidden; display: grid; align-content: start; gap: 8px; background: #0d0f14; }
.field-mock__stat { display: flex; justify-content: space-between; align-items: center; padding: 8px 10px; border: 1px solid var(--line-soft); border-radius: 8px; }
.field-mock__stat span { color: var(--quiet); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.field-mock__stat strong { color: rgb(var(--accent-rgb)); font-size: 16px; }
.field-mock__row { display: flex; align-items: center; gap: 9px; padding: 6px 2px; }
.field-mock__row i { width: 6px; height: 6px; border-radius: 50%; background: rgb(var(--accent-rgb)); flex-shrink: 0; }
.field-mock__row b, .field-mock__row small { display: block; }
.field-mock__row b { font-size: 10px; color: #d6d9df; font-weight: 500; }
.field-mock__row small { color: var(--quiet); font-size: 8px; margin-top: 2px; }

/* Outcome list */
.visual--outcomes { display: grid; align-content: center; gap: 14px; }
.outcome-row {
  position: relative;
  min-height: 132px;
  border-radius: var(--list-radius);
  padding: 22px 25px;
  display: grid;
  grid-template-columns: 58px 1fr 88px;
  align-items: center;
  gap: 20px;
  box-shadow: none !important;
}
.outcome-number { color: rgb(var(--accent-rgb)); font: 560 clamp(14px, .9vw, 18px)/1 ui-monospace, monospace; clip-path: inset(0 calc((1 - var(--item)) * 100%) 0 0); }
.outcome-row strong, .outcome-row small { display: block; }
.outcome-row strong { font-size: clamp(19px, 1.25vw, 27px); font-weight: 550; }
.outcome-row small { margin-top: 7px; color: var(--muted); font-size: clamp(12px, .75vw, 16px); }
.outcome-row i { width: 100%; height: 1px; background: linear-gradient(90deg, rgba(var(--accent-rgb),.8), rgba(var(--accent-rgb),.05)); transform: scaleX(var(--item)); transform-origin: left; }

/* Portfolio grid */
.visual--portfolio-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.portfolio-grid__item {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--list-radius);
  background: rgba(13,15,20,.88);
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 20px;
  padding: 22px 16px;
}
.portfolio-grid__item img { width: min(88%, 174px); height: 48px; object-fit: contain; }
.portfolio-grid__item span { color: var(--muted); font-size: clamp(9px, .62vw, 13px); text-align: center; }

/* Classroom dashboard */
.app-shell { width: 100%; height: calc(100% - 50px); overflow: hidden; display: grid; grid-template-columns: 20% 1fr; }
.app-sidebar { padding: 22px 16px; background: #0c0e13; border-right: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 9px; }
.app-sidebar img { width: 90%; height: 35px; object-fit: contain; object-position: left; margin-bottom: 20px; }
.app-sidebar span { padding: 10px 12px; border-radius: 8px; color: #777d88; font-size: clamp(9px, .62vw, 13px); }
.app-sidebar span.active { background: rgba(var(--accent-rgb),.14); color: #fff; }
.app-main { padding: clamp(20px, 1.6vw, 34px); overflow: hidden; }
.app-main > header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 25px; }
.app-main > header strong, .app-main > header span { display: block; }
.app-main > header strong { font-size: clamp(17px, 1.15vw, 24px); }
.app-main > header span { margin-top: 6px; color: var(--muted); font-size: clamp(9px, .6vw, 12px); }
.app-main > header b { padding: 7px 10px; border-radius: 999px; color: rgb(var(--accent-rgb)); background: rgba(var(--accent-rgb),.1); font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.school-modules { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.school-modules article { min-height: 112px; padding: 17px; border-radius: 11px; box-shadow: none; display: grid; align-content: start; }
.school-modules svg { width: 23px; height: 23px; color: rgb(var(--accent-rgb)); }
.school-modules strong { margin-top: 13px; font-size: clamp(11px, .72vw, 15px); }
.school-modules small { margin-top: 5px; color: var(--quiet); font-size: clamp(8px, .55vw, 11px); }
.school-quick { margin-top: 14px; display: flex; align-items: center; gap: 10px; color: var(--muted); font-size: clamp(8px, .56vw, 12px); }
.school-quick strong { margin-right: 6px; color: #d9dce2; }
.school-quick span { border-left: 1px solid var(--line); padding-left: 10px; }
.visual--school-dashboard .interface-caption { width: 100%; }

/* Real documents */
.visual--documents { padding-bottom: 53px; position: relative; }
.visual--documents::before {
  content: ""; position: absolute; inset: -6% -4%; z-index: 0;
  background: radial-gradient(ellipse 60% 55% at 50% 46%, rgba(var(--accent-rgb), .16), transparent 72%);
}
.document-stack { position: absolute; inset: 0 0 48px; display: flex; align-items: center; justify-content: center; }
.document-page { position: absolute; width: 41%; height: 96%; margin: 0; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: linear-gradient(180deg, rgba(18,20,27,.97), rgba(11,13,18,.98)); box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.document-page figcaption { height: 29px; display: grid; place-content: center; color: var(--quiet); background: #101218; border-top: 1px solid var(--line-soft); font-size: clamp(8px, .54vw, 11px); }

/* Fictional document mocks, Classroom Pilot — same dark app-chrome theme as
   every other company, kept visually part of one system rather than reading
   as a stray light-mode page. */
.doc-mock { height: calc(100% - 29px); padding: 16px 14px; color: #d6d9df; font-size: 9px; display: flex; flex-direction: column; gap: 10px; overflow: hidden; }
.doc-mock header { padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.doc-mock header strong { display: block; font-size: 11px; color: #fff; }
.doc-mock header span { display: block; margin-top: 2px; color: rgb(var(--accent-rgb)); font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.doc-mock__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.doc-mock__grid b, .doc-mock__row b { display: block; color: var(--quiet); font-size: 7px; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
.doc-mock__grid span, .doc-mock__row span { display: block; margin-top: 2px; color: #d6d9df; font-size: 9px; }
.doc-mock table { width: 100%; border-collapse: collapse; font-size: 8px; }
.doc-mock th { text-align: left; padding: 5px 4px; color: var(--quiet); text-transform: uppercase; letter-spacing: .05em; font-size: 7px; border-bottom: 1px solid var(--line); }
.doc-mock td { padding: 6px 4px; border-bottom: 1px solid var(--line-soft); color: #d6d9df; }
.doc-mock__row { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--line-soft); }
.doc-mock__stamp { align-self: flex-end; margin-top: auto; padding: 6px 14px; border: 2px solid #7be0a8; border-radius: 6px; color: #7be0a8; font-weight: 700; font-size: 11px; letter-spacing: .08em; transform: rotate(-6deg); }
.document-page--1 { left: 3%; --doc-rest-angle: -3deg; --doc-fan-angle: -10deg; }
.document-page--2 { z-index: 2; left: 29%; width: 43%; height: 100%; --doc-rest-angle: 0deg; --doc-fan-angle: 5deg; }
.document-page--3 { right: 3%; --doc-rest-angle: 3deg; --doc-fan-angle: 10deg; }
.visual--documents .interface-caption { width: 100%; }

/* Procurement */
.visual--procurement { display: grid; place-items: center; }
.procurement-brief { width: 92%; height: 90%; overflow: hidden; padding: 0 28px; }
.procurement-brief header, .procurement-brief footer { height: 20%; display: flex; align-items: center; justify-content: space-between; }
.procurement-brief header { border-bottom: 1px solid var(--line); }
.procurement-brief header small, .procurement-brief header strong { display: block; }
.procurement-brief header small { color: rgb(var(--accent-rgb)); font-size: clamp(8px, .55vw, 11px); letter-spacing: .12em; text-transform: uppercase; }
.procurement-brief header strong { margin-top: 7px; font-size: clamp(17px, 1.18vw, 25px); }
.procurement-brief header > span { color: var(--quiet); font: 12px ui-monospace, monospace; }
.procurement-table { height: 60%; display: grid; grid-template-rows: auto repeat(5, 1fr); }
.procurement-table__head { display: grid; grid-template-columns: 1.6fr .8fr .9fr; padding: 0 4px 9px; color: var(--quiet); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; border-bottom: 1px solid var(--line); }
.procurement-table__row { display: grid; grid-template-columns: 1.6fr .8fr .9fr; align-items: center; padding: 0 4px; border-bottom: 1px solid var(--line-soft); font-size: clamp(11px, .72vw, 15px); }
.procurement-table__item { display: flex; align-items: center; gap: 10px; }
.procurement-table__item svg { width: 17px; height: 17px; color: rgb(var(--accent-rgb)); flex-shrink: 0; }
.procurement-table__qty { color: var(--muted); font: 11px ui-monospace, monospace; }
.procurement-table__status { justify-self: start; padding: 4px 9px; border-radius: 999px; font-size: 9px; letter-spacing: .05em; }
.procurement-table__status--ok { color: #7be0a8; background: rgba(123,224,168,.12); }
.procurement-table__status--active { color: rgb(var(--accent-rgb)); background: rgba(var(--accent-rgb), .14); }
.procurement-table__status--pending { color: var(--quiet); background: rgba(255,255,255,.06); }
.procurement-brief footer { border-top: 1px solid var(--line); }
.procurement-brief footer span { color: var(--muted); font-size: clamp(10px, .66vw, 14px); }
.procurement-brief footer strong { font-size: clamp(16px, 1.05vw, 22px); color: rgb(var(--accent-rgb)); }

/* Fulfillment */
.visual--fulfillment { display: grid; grid-template-rows: auto auto auto; gap: clamp(28px, 4.5vh, 56px); align-content: center; height: 100%; }
.fulfillment-order, .fulfillment-result { border: 1px solid var(--line); border-radius: 13px; background: rgba(15,17,23,.86); }
.fulfillment-order { padding: 18px 22px; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 5px 20px; }
.fulfillment-order span { grid-row: 1 / 3; color: rgb(var(--accent-rgb)); font: 12px ui-monospace, monospace; }
.fulfillment-order strong { font-size: clamp(16px, 1.05vw, 22px); }
.fulfillment-order small { color: var(--muted); font-size: clamp(9px, .62vw, 13px); }
.fulfillment-rail { position: relative; padding: 22px 6px 0; }
.fulfillment-rail__track { position: relative; height: 3px; margin: 0 48px; background: var(--line-soft); overflow: hidden; border-radius: 2px; }
.fulfillment-rail__fill { position: absolute; inset: 0; transform-origin: left; transform: scaleX(var(--scene-progress, 0)); background: linear-gradient(90deg, rgba(var(--accent-rgb), .95), rgba(var(--accent-rgb), .35)); }
.fulfillment-rail__nodes { margin-top: -17px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.fulfillment-node { display: grid; justify-items: center; text-align: center; gap: 13px; padding: 0 10px; }
.fulfillment-node__dot { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #0d0f14; border: 1px solid var(--line); color: var(--quiet); font: 12px ui-monospace, monospace; }
.fulfillment-node strong { font-size: clamp(16px, 1.05vw, 21px); }
.fulfillment-node small { color: var(--muted); font-size: clamp(10px, .64vw, 14px); line-height: 1.5; }
.fulfillment-result { padding: 15px 19px; display: flex; align-items: center; gap: 14px; }
.fulfillment-result svg { width: 28px; height: 28px; color: rgb(var(--accent-rgb)); }
.fulfillment-result strong, .fulfillment-result span { display: block; }
.fulfillment-result strong { font-size: clamp(14px, .88vw, 18px); }
.fulfillment-result span { color: var(--muted); font-size: clamp(9px, .58vw, 12px); }

/* PagePerk system */
.visual--growth-system { display: grid; grid-template-rows: auto 1fr auto; gap: 22px; align-content: center; height: 100%; }
.growth-system__label { display: flex; align-items: baseline; justify-content: space-between; padding-bottom: 17px; border-bottom: 1px solid var(--line); }
.growth-system__label span { color: rgb(var(--accent-rgb)); font-size: 12px; letter-spacing: .13em; text-transform: uppercase; }
.growth-system__label strong { font-size: clamp(16px, 1.06vw, 22px); font-weight: 540; }
/* Equal-height stage cards tied together by one rail (below), instead of the
   diagonally-shrinking funnel — every card lands on the same top/bottom line. */
.growth-system__funnel { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; height: 100%; }
.growth-system__step {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: var(--panel-radius);
  padding: clamp(18px, 1.8vw, 28px) clamp(12px, 1.1vw, 18px);
  display: grid;
  align-content: space-between;
  justify-items: start;
  gap: 16px;
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .14), rgba(11,13,18,.96));
}
.growth-system__step-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: rgba(var(--accent-rgb), .12); }
.growth-system__step-icon svg { width: 20px; height: 20px; color: rgb(var(--accent-rgb)); }
.growth-system__step strong { font-size: clamp(13px, .88vw, 17px); }
.growth-system__step small { display: block; margin-top: 4px; color: var(--muted); font-size: clamp(9px, .62vw, 12px); line-height: 1.55; }
.growth-system__step-index { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #0d0f14; border: 1px solid var(--line); color: var(--quiet); font: 11px ui-monospace, monospace; }
.growth-system__rail { position: relative; height: 3px; margin: 0 4px; background: var(--line-soft); border-radius: 2px; overflow: hidden; }
.growth-system__rail-fill { position: absolute; inset: 0; transform-origin: left; transform: scaleX(var(--scene-progress, 0)); background: linear-gradient(90deg, rgba(var(--accent-rgb), .95), rgba(var(--accent-rgb), .3)); }

/* PagePerk demand */
.visual--demand-dashboard { display: grid; place-items: center; }
.demand-panel { width: 100%; height: 94%; padding: clamp(20px,1.5vw,30px); }
.demand-panel header { display: flex; justify-content: space-between; align-items: flex-start; }
.demand-panel header small, .demand-panel header strong { display:block; }
.demand-panel header small { color: rgb(var(--accent-rgb)); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.demand-panel header strong { margin-top: 7px; font-size: clamp(18px,1.2vw,25px); }
.demand-panel header > span { color: var(--quiet); font-size: 10px; }
.metric-row { margin-top: 25px; display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.metric-row > div { padding: 14px 16px; border: 1px solid var(--line-soft); border-radius: 10px; }
.metric-row small, .metric-row strong, .metric-row span { display:block; }
.metric-row small { color: var(--quiet); font-size: 9px; text-transform: uppercase; letter-spacing:.1em; }
.metric-row strong { margin-top: 6px; font-size: clamp(22px,1.5vw,32px); }
.metric-row span { margin-top: 5px; color: var(--muted); font-size: 9px; }
.chart-grid { fill:none; stroke:rgba(255,255,255,.06); stroke-width:1; }
.chart-line { fill:none; stroke:rgb(var(--accent-rgb)); stroke-width:2.5; vector-effect:non-scaling-stroke; }

/* PagePerk enquiry feed — a live operational view (workflow), not a KPI
   dashboard: no fabricated headline number, just the incoming records the
   growth-system copy ("Enquiries") actually refers to. */
.enquiry-feed { margin-top: 20px; }
.enquiry-feed__head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.enquiry-feed__head span { color: var(--quiet); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }
.enquiry-feed__spark { display: block; width: 74px; height: 20px; }
.enquiry-feed__spark svg { width: 100%; height: 100%; overflow: visible; }
.enquiry-row { display: grid; grid-template-columns: 1.3fr 1fr auto; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }
.enquiry-row__name { font-size: clamp(11px, .74vw, 15px); color: #e6e8ec; }
.enquiry-row__source { justify-self: start; padding: 3px 9px; border-radius: var(--chip-radius); background: rgba(var(--accent-rgb), .11); color: rgb(var(--accent-rgb)); font-size: 9px; }
.enquiry-row__time { color: var(--quiet); font: 10px ui-monospace, monospace; }

/* Logirev product interface — fictional algorithmic-trading terminal mock */
.visual--product-interface { display:grid; place-items:center; }
.product-window--full { position:absolute; inset:1% 0 4%; }
.product-window--thumbnail { position:absolute; width:33%; height:27%; right:0; bottom:3%; z-index:3; border:1px solid rgba(var(--accent-rgb),.38); box-shadow:0 24px 70px rgba(0,0,0,.62); }

.terminal-mock { width:100%; height:calc(100% - 42px); padding:18px 22px; background:#0d1014; display:grid; grid-template-rows:auto 1fr auto; gap:14px; overflow:hidden; }
.terminal-mock__ticker { display:flex; align-items:baseline; gap:14px; }
.terminal-mock__symbol { color:var(--quiet); font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.terminal-mock__price { font:600 clamp(18px,1.3vw,26px) ui-monospace, monospace; color:#fff; }
.terminal-mock__change { padding:3px 9px; border-radius:var(--chip-radius); font:11px ui-monospace, monospace; }
.terminal-mock__change--up { color:#7be0a8; background:rgba(123,224,168,.14); }
.terminal-mock__change--down { color:#f0748b; background:rgba(240,116,139,.14); }
.terminal-mock__chart { height:100%; min-height:0; }
.terminal-mock__chart svg { width:100%; height:100%; overflow:visible; }
.terminal-mock__chart-label span { color:var(--quiet); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }
.terminal-mock__controls { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:12px; }
.terminal-mock__strategy, .terminal-mock__row { padding:12px 14px; border:1px solid var(--line-soft); border-radius:10px; }
.terminal-mock__strategy span, .terminal-mock__row span { display:block; color:var(--quiet); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.terminal-mock__strategy strong, .terminal-mock__row strong { display:block; margin-top:6px; font-size:clamp(12px,.8vw,15px); }
.terminal-mock__status { display:inline-block; margin-top:8px; padding:3px 9px; border-radius:var(--chip-radius); background:rgba(123,224,168,.14); color:#7be0a8; font-size:8px; text-transform:uppercase; letter-spacing:.06em; }

.terminal-mock--analytics { padding:16px 22px; grid-template-rows:auto auto 1fr; }
.terminal-mock__stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.terminal-mock__stats div { padding:11px 13px; border:1px solid var(--line-soft); border-radius:9px; }
.terminal-mock__stats span { display:block; color:var(--quiet); font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.terminal-mock__stats strong { display:block; margin-top:5px; font-size:clamp(15px,1vw,19px); color:rgb(var(--accent-rgb)); }

.terminal-mock--history { height:100%; padding:16px 18px; display:grid; align-content:center; gap:10px; }
.terminal-history__head { display:flex; align-items:center; padding-bottom:9px; border-bottom:1px solid var(--line); color:var(--quiet); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }
.terminal-history__row { display:flex; justify-content:space-between; align-items:center; padding:7px 0; border-bottom:1px solid var(--line-soft); }
.terminal-history__row span { color:#d6d9df; font-size:10px; font-weight:500; }
.terminal-history__row b { font: 10px ui-monospace, monospace; }
.terminal-history__row b.ok { color:#7be0a8; }
.terminal-history__row b.down { color:#f0748b; }

/* Cubic Matrix shared UI */
.property-app, .property-detail, .consultant-app { width:100%; height:96%; overflow:hidden; }
.property-app > header { height:66px; padding:0 22px; display:flex; align-items:center; border-bottom:1px solid var(--line-soft); }
.property-app > header img { width:150px; height:36px; object-fit:contain; object-position:left; }
.property-app nav { margin-left:auto; display:flex; gap:24px; color:var(--quiet); font-size:11px; }
.property-app nav .active { color:#fff; }
.property-app > header b { margin-left:26px; padding:7px 10px; border-radius:999px; background:rgba(var(--accent-rgb),.11); color:rgb(var(--accent-rgb)); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }
.property-hero { height:52%; padding:32px; display:grid; align-content:center; background:linear-gradient(110deg, rgba(var(--accent-rgb),.11), transparent 60%); }
.property-search small, .property-search strong { display:block; }
.property-search small { color:rgb(var(--accent-rgb)); font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.property-search strong { margin-top:9px; font-size:clamp(20px,1.45vw,31px); }
.property-search > div { margin-top:22px; height:58px; border:1px solid var(--line); border-radius:10px; background:#0d0f14; display:flex; align-items:center; padding:0 9px 0 17px; gap:13px; }
.property-search svg { width:20px; color:var(--muted); }
.property-search > div span { color:#c4c8d0; font-size:12px; }
.property-search button, .consultant-app button, .client-match button { margin-left:auto; border:0; border-radius:8px; background:rgb(var(--accent-rgb)); color:#07110d; font-weight:700; padding:11px 16px; font-size:11px; }
.audience-tabs { margin-top:24px; display:flex; gap:9px; }
.audience-tabs span { padding:8px 11px; border:1px solid var(--line); border-radius:8px; color:var(--muted); font-size:10px; }
.property-preview { height:calc(48% - 66px); padding:20px 28px; display:grid; grid-template-columns:38% 1fr; align-items:center; gap:26px; }
.property-preview small, .property-preview strong, .property-preview span { display:block; }
.property-preview small { color:rgb(var(--accent-rgb)); font-size:9px; text-transform:uppercase; letter-spacing:.1em; }
.property-preview strong { margin-top:7px; font-size:clamp(16px,1.05vw,22px); }
.property-preview span { margin-top:8px; color:var(--muted); font-size:10px; }
.property-visual { position:relative; height:100%; min-height:110px; border-radius:11px; overflow:hidden; background:linear-gradient(180deg, rgba(var(--accent-rgb),.16), rgba(6,7,10,.92) 70%); border:1px solid rgba(var(--accent-rgb),.2); }
.property-visual--large { min-height:0; }
.property-visual__pin { position:absolute; top:14%; left:50%; transform:translateX(-50%); width:26px; height:26px; display:grid; place-items:center; border-radius:50%; background:rgb(var(--accent-rgb)); color:#07110d; box-shadow:0 8px 20px rgba(0,0,0,.4); }
.property-visual__pin svg { width:14px; height:14px; }
.property-visual--large .property-visual__pin { width:34px; height:34px; }
.property-visual--large .property-visual__pin svg { width:18px; height:18px; }
.property-visual__skyline { position:absolute; left:0; right:0; bottom:0; height:70%; display:flex; align-items:flex-end; gap:6px; padding:0 10%; }
.property-visual__skyline i { flex:1; height:var(--h); border-radius:3px 3px 0 0; background:linear-gradient(180deg, rgba(var(--accent-rgb),.55), rgba(var(--accent-rgb),.12)); border:1px solid rgba(var(--accent-rgb),.28); border-bottom:none; }
.property-visual__chip { position:absolute; left:10px; bottom:10px; display:flex; align-items:baseline; gap:8px; padding:6px 10px; border-radius:8px; background:rgba(7,8,11,.82); font-size:10px; }
.property-visual__chip span { color:var(--muted); }
.property-visual__chip b { color:#fff; }

.property-detail { display:grid; grid-template-columns:48% 1fr; }
.property-media { position:relative; padding:22px; background:linear-gradient(140deg,rgba(var(--accent-rgb),.12),#0a0c10); }
.building-visual--large { height:100%; min-height:0; }
.property-media > span { position:absolute; left:38px; bottom:35px; padding:8px 11px; border-radius:7px; background:rgba(7,8,11,.8); color:#e6e8ec; font-size:10px; }
.property-information { padding:clamp(25px,2vw,42px); }
.property-information > small { color:rgb(var(--accent-rgb)); font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.property-information > strong { display:block; margin-top:12px; font-size:clamp(21px,1.5vw,32px); line-height:1.1; }
.property-facts { margin-top:28px; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.property-facts span { padding:13px 10px; border:1px solid var(--line-soft); border-radius:9px; color:var(--muted); font-size:8px; }
.property-facts b { display:block; margin-bottom:6px; color:#fff; font-size:clamp(15px,1vw,20px); }
.property-tabs { margin-top:25px; padding-bottom:12px; display:flex; gap:16px; border-bottom:1px solid var(--line); color:var(--quiet); font-size:10px; }
.property-tabs .active { color:rgb(var(--accent-rgb)); }
.property-information p { color:var(--muted); font-size:clamp(10px,.66vw,14px); line-height:1.55; }

.visual--comparison-ui { display:grid; grid-template-columns:1fr .36fr 1fr; gap:10px; align-items:stretch; }
.comparison-card { border-radius:var(--list-radius); padding:18px; box-shadow:none !important; }
.comparison-card header { display:flex; justify-content:space-between; align-items:center; }
.comparison-card header span { font-size:clamp(14px,.92vw,19px); font-weight:600; }
.comparison-card header b { color:rgb(var(--accent-rgb)); font-size:10px; }
.comparison-image { height:38%; margin-top:15px; }
.comparison-card dl { margin:15px 0 0; }
.comparison-card dl > div { padding:9px 0; display:flex; justify-content:space-between; gap:12px; border-top:1px solid var(--line-soft); font-size:9px; }
.comparison-card dt { color:var(--quiet); }.comparison-card dd { margin:0; color:#d8dbe1; text-align:right; }
.comparison-summary { align-self:center; padding:22px 10px; text-align:center; border-block:1px solid rgba(var(--accent-rgb),.28); }
.comparison-summary span, .comparison-summary strong, .comparison-summary small { display:block; }
.comparison-summary span { color:var(--quiet); font-size:8px; text-transform:uppercase; letter-spacing:.1em; }
.comparison-summary strong { margin-top:9px; color:rgb(var(--accent-rgb)); font-size:clamp(17px,1.1vw,23px); }
.comparison-summary small { margin-top:7px; color:var(--muted); font-size:9px; }

.consultant-app { padding:0; }
.consultant-app > header { height:78px; padding:0 26px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.consultant-app > header small, .consultant-app > header strong { display:block; }
.consultant-app > header small { color:rgb(var(--accent-rgb)); font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.consultant-app > header strong { margin-top:5px; font-size:clamp(17px,1.1vw,23px); }
.consultant-body { height:calc(100% - 78px); padding:22px; display:grid; grid-template-columns:1.15fr .85fr; gap:14px; }
.inventory-table, .client-match { border:1px solid var(--line-soft); border-radius:11px; overflow:hidden; }
.table-head, .table-row { min-height:52px; display:grid; grid-template-columns:.7fr 1.6fr .8fr .8fr; align-items:center; padding:0 16px; }
.table-head { color:var(--quiet); background:#0d0f14; font-size:8px; text-transform:uppercase; letter-spacing:.08em; }
.table-row { border-top:1px solid var(--line-soft); color:#d6d9df; font-size:9px; }
.table-status { justify-self:start; padding:3px 9px; border-radius:999px; font-size:8px; letter-spacing:.05em; }
.table-status--ok { color:#7be0a8; background:rgba(123,224,168,.12); }
.table-status--pending { color:rgb(var(--accent-rgb)); background:rgba(var(--accent-rgb),.14); }
.client-match { padding:20px; }
.client-match > small { color:rgb(var(--accent-rgb)); font-size:8px; text-transform:uppercase; letter-spacing:.1em; }
.client-match > strong { display:block; margin-top:9px; font-size:clamp(14px,.92vw,19px); line-height:1.35; }
.client-match > div { margin-top:17px; padding-top:13px; border-top:1px solid var(--line-soft); display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:9px; }
.client-match > div b { color:#fff; font-size:18px; }
.client-match button { width:100%; margin:20px 0 0; display:flex; align-items:center; justify-content:center; gap:8px; }
.client-match button svg { width:16px; }

/* Connected portfolio */
.visual--portfolio-stack { display:grid; grid-template-rows:.85fr 1fr; gap:14px; }
.portfolio-stack__parent { border:1px solid rgba(var(--accent-rgb),.32); border-radius:15px; display:flex; align-items:center; justify-content:center; gap:30px; background:rgba(var(--accent-rgb),.055); }
.portfolio-stack__parent img { width:min(240px,25%); max-height:52px; }
.portfolio-stack__parent span { color:var(--muted); font-size:clamp(11px,.72vw,15px); }
.portfolio-stack__companies { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.portfolio-stack__companies > div { min-width:0; border:1px solid var(--line); border-radius:var(--list-radius); display:grid; place-content:center; justify-items:center; gap:13px; padding:15px; background:rgba(13,15,20,.82); }
.portfolio-stack__companies img { width:min(100%,165px); height:40px; object-fit:contain; }
.portfolio-stack__companies span { color:var(--muted); font-size:clamp(8px,.55vw,11px); text-align:center; }

.visual--operating-method { display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:1fr auto; gap:12px; align-content:center; }
.visual--operating-method article { position:relative; min-height:250px; border-radius:var(--list-radius); padding:24px; box-shadow:none; }
.visual--operating-method article > span { color:rgb(var(--accent-rgb)); font:11px ui-monospace,monospace; }
.visual--operating-method article strong, .visual--operating-method article small { display:block; }
.visual--operating-method article strong { margin-top:70px; font-size:clamp(18px,1.18vw,25px); line-height:1.18; }
.visual--operating-method article small { margin-top:10px; color:var(--muted); font-size:clamp(9px,.61vw,13px); }
.visual--operating-method article i { position:absolute; right:-20px; top:50%; z-index:2; color:rgb(var(--accent-rgb)); font:300 38px/1 sans-serif; }
.method-examples { grid-column:1/-1; padding-top:15px; display:flex; flex-wrap:wrap; justify-content:center; gap:0; border-top:1px solid var(--line); color:var(--muted); }
.method-examples span { font-size:clamp(9px,.6vw,12px); }
.method-examples span:not(:last-child)::after { content:""; display:inline-block; height:11px; width:1px; margin:0 13px; vertical-align:-1px; background:var(--line); }

/* Closing */
.visual--closing { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:38px; }
.closing-logo { justify-self:end; width:min(360px,80%); max-height:80px; object-fit:contain; }
.closing-rule { width:1px; height:120px; background:linear-gradient(transparent,rgba(var(--accent-rgb),.9),transparent); transform:scaleY(var(--item)); }
.closing-cta { justify-self:start; display:flex; align-items:center; gap:19px; text-align:left; }
.closing-cta > img { width:112px; height:112px; padding:7px; border-radius:9px; background:#fff; }
.closing-cta strong, .closing-cta span { display:block; }
.closing-cta strong { font-size:clamp(17px,1.1vw,23px); }
.closing-cta span { margin-top:7px; color:var(--muted); font-size:clamp(10px,.66vw,14px); }

@media (max-height: 760px) {
  .problem-item { min-height:68px; padding:12px 16px; }
  .outcome-row { min-height:94px; }
  .school-modules article { min-height:82px; }
  .growth-system__step { min-height:118px; }
  .fulfillment-node__dot { width:20px; height:20px; }
  .visual--operating-method article { min-height:180px; }
  .visual--operating-method article strong { margin-top:40px; }
}

@media (min-width:3000px) {
  .portfolio-hub__logo { max-width:340px; }
  .portfolio-orbit-item img, .portfolio-grid__item img, .portfolio-stack__companies img { height:75px; max-width:280px; }
  .problem-item { min-height:160px; padding:30px; }
  .problem-item__icon { width:68px; height:68px; }.problem-item__icon svg { width:34px;height:34px; }
  .window-bar { height:72px; }.product-window img { height:calc(100% - 72px); }
  .outcome-row { min-height:220px; }
  .school-modules article { min-height:190px; }
  .growth-system__step { min-height:280px; }
  .fulfillment-node__dot { width:32px; height:32px; }
  .closing-cta > img { width:190px; height:190px; }
}

/* The comparison is a decision surface, not a pair of empty browser columns. */
.visual--comparison-ui { align-items: center; }
.comparison-card { height: 68%; align-self: center; }

@media (min-width: 3000px) {
  .header-parent img { width: 220px; height: 52px; }
  .header-parent span, .header-chapter, .header-domain, .header-count { font-size: 18px; }
  .header-scene { gap: 22px; }
  .header-scene i { width: 34px; }
  .scene-brand { gap: 28px; min-height: 92px; margin-bottom: 48px; }
  .scene-brand img { width: 330px; height: 82px; }
  .scene-brand span { font-size: 18px; }
}