/* ============================================================
   AURIS — cover hero, layered:
   bg scene (z0) → top line (z1) → subject cutout (z2) → bottom line (z3)
   ============================================================ */
.hero-cover { position: relative; min-height: 100svh; overflow: hidden; background: var(--wine-deep); }

.hero-cover .hero-cover-img,
.hero-cover .hero-fg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 16%;
  transform: scale(0.86);
  transform-origin: 50% 100%;
}
.hero-cover .hero-cover-img { z-index: 0; }
.hero-cover .hero-fg {
  z-index: 2;
  pointer-events: none;
  filter: drop-shadow(0 18px 50px color-mix(in oklab, var(--wine-deep) 55%, #000));
}

.hero-cover .line {
  position: absolute;
  max-width: 56%;
  margin: 0;
}
.hero-cover .line.top {
  top: clamp(92px, 13vh, 150px);
  left: var(--gutter);
  z-index: 1;
}
.hero-cover .line.bottom {
  bottom: clamp(22px, 4vh, 52px);
  right: var(--gutter);
  text-align: right;
  line-height: 0.84;
  z-index: 3;
}
@media (max-width: 720px) {
  .hero-cover .line { max-width: 86%; }
}

/* fix: models title was constrained by ch computed on the small container font */
.models-head { max-width: 760px; }

/* ============================================================
   PORTAL MOCK (recreated client area, anonymised)
   ============================================================ */
.portal-ui {
  font-family: var(--font-sans);
  color: var(--cream);
  padding: clamp(16px, 2vw, 26px);
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.4vw, 18px);
  container-type: inline-size;
}
.portal-ui .pu-top {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding-bottom: 4px;
}
.portal-ui .pu-brand { display: flex; align-items: baseline; gap: 8px; }
.portal-ui .pu-auris { font-weight: 700; font-size: clamp(15px,1.5vw,20px); color: var(--accent-glow); letter-spacing: -0.02em; }
.portal-ui .pu-tag { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-faint); }
.portal-ui .pu-area { font-size: clamp(12px,1.2vw,15px); color: var(--ink-dim); }
.portal-ui .pu-area strong { color: var(--cream); font-weight: 700; }
.portal-ui .pu-user { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.06em; color: var(--ink-faint); }
@container (max-width: 460px) { .portal-ui .pu-area, .portal-ui .pu-user { display: none; } }

.portal-ui .pu-card {
  background: var(--cream);
  color: var(--wine-deep);
  border-radius: 14px;
  padding: clamp(14px,1.8vw,22px);
  display: flex; justify-content: space-between; gap: 16px;
}
.portal-ui .pu-eyebrow { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wine-mid); }
.portal-ui .pu-title { font-weight: 700; font-size: clamp(16px,2vw,26px); letter-spacing: -0.03em; margin-top: 6px; line-height: 1.05; }
.portal-ui .pu-sub { color: var(--wine-mid); font-size: clamp(11px,1.1vw,14px); margin-top: 4px; }
.portal-ui .pu-meta { font-size: clamp(9px,0.85vw,11px); color: color-mix(in oklab, var(--wine-deep) 60%, var(--cream)); margin-top: 12px; line-height: 1.5; }
.portal-ui .pu-status { background: var(--cream-warm); color: var(--wine-mid); font-weight: 700; padding: 2px 8px; border-radius: 6px; }
.portal-ui .pu-card-r { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; min-width: 120px; }
.portal-ui .pu-prog-label { font-family: var(--font-mono); font-size: 8px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wine-mid); }
.portal-ui .pu-prog-num { font-weight: 700; font-size: clamp(22px,3vw,40px); color: var(--wine-deep); line-height: 1; letter-spacing: -0.03em; }
.portal-ui .pu-prog-sub { font-family: var(--font-mono); font-size: 8px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wine-mid); }
.portal-ui .pu-bar { width: 110px; height: 5px; border-radius: 4px; background: color-mix(in oklab, var(--wine-mid) 22%, var(--cream)); margin-top: 8px; overflow: hidden; }
.portal-ui .pu-bar i { display: block; height: 100%; width: 80%; background: var(--accent); border-radius: 4px; }
@container (max-width: 420px) { .portal-ui .pu-card { flex-direction: column; } .portal-ui .pu-card-r { text-align: left; align-items: flex-start; } }

.portal-ui .pu-tabs { display: flex; gap: clamp(10px,1.6vw,26px); flex-wrap: wrap; font-size: clamp(11px,1.1vw,15px); border-bottom: 1px solid var(--line); padding-bottom: 10px; }
.portal-ui .pu-tabs span { color: var(--ink-dim); }
.portal-ui .pu-tabs span.on { color: var(--cream); position: relative; }
.portal-ui .pu-tabs span.on::after { content: ""; position: absolute; left: 0; right: 0; bottom: -11px; height: 2px; background: var(--accent-glow); }
.portal-ui .pu-subtabs { display: flex; gap: clamp(8px,1.4vw,20px); flex-wrap: wrap; font-size: clamp(10px,1vw,13px); }
.portal-ui .pu-subtabs span { color: var(--ink-faint); }
.portal-ui .pu-subtabs span.on { color: var(--accent); font-weight: 700; }

.portal-ui .pu-insight {
  background: color-mix(in oklab, var(--rose-soft) 30%, var(--cream));
  border: 1px solid color-mix(in oklab, var(--accent) 30%, transparent);
  border-radius: 14px;
  padding: clamp(14px,1.8vw,22px);
  color: var(--wine-deep);
}
.portal-ui .pu-insight-h { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); }
.portal-ui .pu-insight-t { font-weight: 700; font-size: clamp(15px,1.8vw,23px); letter-spacing: -0.03em; margin-top: 8px; }
.portal-ui .pu-insight p { font-size: clamp(11px,1.05vw,14px); line-height: 1.5; color: color-mix(in oklab, var(--wine-deep) 78%, var(--cream)); margin-top: 8px; }