/* ============================================================
   TMG SECURITY — RESEARCH & SECURITY LABS
   Loads alongside tmg-home.css (tokens, header, footer) and
   tmg-services.css (shared section furniture).

   Visual language for this page: A LAB YOU WALK INTO.
   Solutions goes inward toward a core. Industries is a map you
   read across. Research is an ENVIRONMENT — a room with depth,
   instruments on the walls, a terminal running in the corner.
   The camera moves in, then looks around.

   Prefixes are unique on purpose: tmg-home.css already owns
   .labs-tag*, .arch-*, .acc*, .surf*/.surface-*, so this file
   uses rsc-, rhero-, rcore-, lab-, asm-, rpil-, wf-, rterm-,
   pub-, rarc- and lacc-.

   CSS 3D + SVG only. No WebGL, no library.
   ============================================================ */

.rsc{
  --acc:var(--cyan);
  --acc2:var(--violet);
  --acc-soft:rgba(79,216,234,.13);
  --acc-line:rgba(79,216,234,.42);
  --glow:0 0 38px rgba(79,216,234,.17);
}

/* Technical grid. Parallaxed via --gy, fixed so it reads as the room
   the content sits inside rather than as page decoration. */
.rsc-grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(79,216,234,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79,216,234,.04) 1px, transparent 1px);
  background-size:60px 60px;
  transform:translate3d(0, var(--gy,0px), 0);
  mask-image:radial-gradient(ellipse 92% 68% at 50% 28%, #000 18%, transparent 76%);
  -webkit-mask-image:radial-gradient(ellipse 92% 68% at 50% 28%, #000 18%, transparent 76%);
}
.rsc > *{ position:relative; z-index:1; }

/* Status chip. Colour carries meaning: cyan = built, amber = not yet. */
.rsc-status{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:8.5px; letter-spacing:1.8px;
  border-radius:20px; padding:5px 11px; white-space:nowrap;
  border:1px solid var(--line2); color:var(--fog); background:rgba(8,12,24,.7);
}
.rsc-status i{ width:5px; height:5px; border-radius:50%; background:var(--line3); flex:none; }
.rsc-status.ready{ border-color:rgba(79,216,234,.4); color:var(--cyan); }
.rsc-status.ready i{ background:var(--cyan); box-shadow:0 0 8px var(--cyan); animation:rscPulse 2.6s var(--ease) infinite; }
.rsc-status.dev{ border-color:rgba(245,180,78,.36); color:var(--warn); }
.rsc-status.dev i{ background:var(--warn); box-shadow:0 0 8px var(--warn); }
@keyframes rscPulse{ 0%,100%{opacity:1} 50%{opacity:.3} }

.rsc-cap{
  font-family:var(--mono); font-size:8px; letter-spacing:1.7px; color:var(--fog);
  text-align:center; margin-top:var(--s4);
}

/* ============================================================
   01 — HERO
   Three depth planes. Scroll drives the camera forward: the
   research core recedes as the lab environment resolves out of
   blur, which is the section's whole argument — research becomes
   a place you can enter.
   ============================================================ */
.rhero{ padding-top:var(--s7); padding-bottom:var(--s7); }
.rhero-grid{ display:grid; grid-template-columns:1.04fr .96fr; gap:var(--s6); align-items:center; }
.rhero-h{
  font-family:var(--display); font-size:clamp(31px,4.5vw,56px); font-weight:700;
  line-height:1.04; letter-spacing:-1.7px; margin:18px 0 20px; text-wrap:balance;
}
.rhero-h .accent{
  background:linear-gradient(96deg, var(--cyan), var(--violet) 64%, var(--hyper));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.rhero-lead{ font-size:16.5px; color:var(--ice); line-height:1.68; max-width:604px; margin-bottom:var(--s4); }
.rhero-ctas{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; }

.rcore-stage{
  position:relative; width:100%; max-width:540px; margin:0 auto;
  aspect-ratio:1/1; perspective:1300px; perspective-origin:50% 46%;
}
.rcore-rig{
  position:absolute; inset:0; transform-style:preserve-3d;
  transform:translateZ(var(--cz,0px)) rotateX(var(--crx,11deg)) rotateY(var(--cry,-6deg));
  transition:transform .45s var(--ease);
}
.rplane{ position:absolute; inset:0; transform-style:preserve-3d; }
.rplane-back { transform:translateZ(-140px); }
.rplane-mid  { transform:translateZ(-46px); }
.rplane-front{ transform:translateZ(52px); }

.rcore-svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.rcore-ring{ fill:none; stroke:var(--line2); stroke-width:1; }
.rcore-ring.dash{ stroke:var(--line); stroke-dasharray:2 9; }
.rcore-link{
  stroke:rgba(140,165,225,.22); stroke-width:1; fill:none;
  stroke-dasharray:var(--len,200); stroke-dashoffset:var(--len,200);
  transition:stroke-dashoffset 1.2s var(--ease), stroke .5s;
}
.rhero.on .rcore-link{ stroke-dashoffset:0; }
.rcore-link.lit{ stroke:var(--acc-line); }

/* Particles: six slow drifting motes, not a snowstorm. */
.rcore-dust{ position:absolute; inset:0; pointer-events:none; }
.rcore-dust i{
  position:absolute; left:var(--x); top:var(--y);
  width:3px; height:3px; border-radius:50%; background:var(--acc);
  opacity:.24; animation:rscDrift var(--d,9s) var(--ease) infinite alternate;
  animation-delay:var(--dl,0s);
}
@keyframes rscDrift{ to{ transform:translate3d(var(--tx,10px), var(--ty,-14px), 26px); opacity:.55; } }

.rcore-core{
  position:absolute; top:50%; left:50%; width:158px; height:158px;
  transform:translate(-50%,-50%) translateZ(30px); transform-style:preserve-3d;
}
.rcore-shell{ position:absolute; inset:0; border-radius:50%; border:1px solid var(--line2); }
.rcore-shell.s1{
  inset:15%; border-color:rgba(79,216,234,.48);
  background:radial-gradient(circle at 42% 36%, rgba(79,216,234,.26), rgba(13,20,36,.96) 68%);
  box-shadow:0 0 58px rgba(79,216,234,.2), inset 0 0 32px rgba(79,216,234,.13);
}
.rcore-shell.s2{ inset:0; border-color:rgba(124,92,250,.3); transform:translateZ(-14px) rotateX(74deg); }
.rcore-shell.s3{ inset:-15%; border-style:dashed; border-color:var(--line); transform:translateZ(-28px); }
.rcore-core.spin .rcore-shell.s2{ animation:rscSpin 26s linear infinite; }
.rcore-core.spin .rcore-shell.s3{ animation:rscSpin 40s linear infinite reverse; }
@keyframes rscSpin{ to{ transform:translateZ(-14px) rotateX(74deg) rotateZ(360deg); } }

.rcore-mark{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) translateZ(22px);
  text-align:center; width:150px; pointer-events:none;
}
.rcore-mark b{
  display:block; font-family:var(--display); font-size:16px; font-weight:700;
  letter-spacing:.3px; color:var(--white); line-height:1.12;
}
.rcore-mark span{
  display:block; font-family:var(--mono); font-size:7px; letter-spacing:2.3px;
  color:var(--acc); margin-top:5px;
}

.rcore-dom{
  position:absolute; left:var(--x); top:var(--y);
  transform:translate(var(--ax,-50%),-50%) translateZ(var(--dz,0px));
  display:flex; align-items:center; gap:7px; white-space:nowrap;
  font-family:var(--mono); font-size:8px; letter-spacing:1.4px; color:var(--fog);
  background:rgba(4,6,12,.9); border:1px solid var(--line2); border-radius:20px;
  padding:6px 11px; transition:border-color .45s, color .45s, box-shadow .45s;
}
.rcore-dom i{
  width:5px; height:5px; border-radius:50%; background:var(--line3); flex:none;
  transition:background .45s, box-shadow .45s;
}
/* The ring shrinks faster than the labels do. Below 1000px the short label
   is swapped in so chips stay clear of each other and of the core. */
.dom-short{ display:none; }
@media (max-width:1000px){
  .dom-full{ display:none; }
  .dom-short{ display:inline; }
}
.rcore-dom[data-side="e"]{ --ax:-100%; }
.rcore-dom[data-side="w"]{ --ax:0%; }
.rcore-dom.lit{ border-color:var(--acc-line); color:var(--white); box-shadow:var(--glow); }
.rcore-dom.lit i{ background:var(--acc); box-shadow:0 0 8px var(--acc); }

@media (max-width:1000px){
  .rhero-grid{ grid-template-columns:1fr; gap:var(--s5); }
  .rcore-stage{ max-width:420px; order:-1; }
  .rplane-back{ transform:translateZ(-86px); }
  .rcore-dom{ font-size:7px; letter-spacing:1px; padding:5px 9px; gap:6px; }
}
@media (max-width:430px){
  .rcore-stage{ max-width:306px; }
  .rcore-dom{ font-size:6.8px; letter-spacing:.8px; padding:4px 8px; gap:5px; }
  .rcore-core{ width:114px; height:114px; }
  .rcore-mark b{ font-size:13px; } .rcore-mark span{ font-size:6px; letter-spacing:1.5px; }
  .rcore-dust{ display:none; }
}

/* At 320 the ring is only ~270px across, so the two top chips still met.
   Tightening the chip box (not the ring) buys the clearance back. */
@media (max-width:340px){
  .rcore-dom{ font-size:6px; letter-spacing:.5px; padding:3px 6px; gap:4px; }
  .rcore-dom i{ width:4px; height:4px; }
}

/* ============================================================
   02/03 — LAB CARD SYSTEM
   ONE card component. Every lab uses it unchanged: same frame,
   same type ramp, same metadata row, same CTA position. What
   differs between labs is content and status, never treatment.
   ============================================================ */
.lab-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }

.lab{
  position:relative; isolation:isolate; overflow:hidden;
  display:flex; flex-direction:column;
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:linear-gradient(180deg, rgba(13,20,36,.72), rgba(6,9,17,.88));
  padding:26px 26px 24px;
  transform-style:preserve-3d;
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
  /* sequential reveal */
  opacity:0; transform:translateY(26px) scale(.985); filter:blur(6px);
}
.lab.in{ opacity:1; transform:none; filter:none; transition:opacity .7s var(--ease), transform .7s var(--ease), filter .7s var(--ease); }
.lab:hover, .lab:focus-within{ border-color:var(--acc-line); box-shadow:0 22px 60px rgba(0,0,0,.45), var(--glow); }

/* cursor spotlight */
.lab::before{
  content:''; position:absolute; inset:0; z-index:-2; opacity:var(--pl,0);
  background:radial-gradient(460px circle at var(--mx,50%) var(--my,50%), rgba(79,216,234,.12), transparent 66%);
  transition:opacity .35s;
}
/* technical hatch that activates on hover */
.lab::after{
  content:''; position:absolute; inset:0; z-index:-1; opacity:0; pointer-events:none;
  background-image:repeating-linear-gradient(135deg, rgba(79,216,234,.05) 0 1px, transparent 1px 9px);
  transition:opacity .45s;
}
.lab:hover::after, .lab:focus-within::after{ opacity:1; }

.lab-top{ display:flex; align-items:center; gap:10px; margin-bottom:20px; flex-wrap:wrap; }
.lab-n{
  margin-left:auto; font-family:var(--display); font-size:30px; font-weight:900;
  letter-spacing:-1.4px; color:var(--line3); line-height:1;
  transition:color .35s, text-shadow .35s, transform .35s var(--ease);
}
.lab:hover .lab-n, .lab:focus-within .lab-n{
  color:var(--acc); text-shadow:0 0 24px var(--acc-soft); transform:translateY(-2px);
}

.lab-badge{
  font-family:var(--mono); font-size:8px; letter-spacing:1.6px; color:var(--acc);
  border:1px solid var(--acc-line); background:var(--acc-soft);
  border-radius:8px; padding:5px 9px; white-space:nowrap;
}
.lab-t{ font-family:var(--display); font-size:22px; font-weight:700; letter-spacing:-.6px; line-height:1.2; margin-bottom:8px; }
.lab-aud{ font-family:var(--mono); font-size:8.5px; letter-spacing:1.4px; color:var(--fog); margin-bottom:14px; }
.lab-d{ font-size:13.5px; color:var(--fog); line-height:1.72; margin-bottom:16px; }

.lab-sec{ margin-bottom:16px; }
.lab-sec h4{ font-family:var(--mono); font-size:8px; letter-spacing:1.8px; color:var(--acc); margin-bottom:9px; }
.lab-caps{ display:flex; flex-wrap:wrap; gap:6px; }
.lab-caps li{
  font-family:var(--mono); font-size:8px; letter-spacing:.9px; color:var(--fog);
  border:1px solid var(--line2); border-radius:8px; padding:5px 9px;
}
.lab-meta{
  display:grid; grid-template-columns:repeat(2,1fr); gap:8px 14px;
  border-top:1px solid var(--line); padding-top:14px; margin-bottom:16px;
}
.lab-meta div{ display:flex; flex-direction:column; gap:3px; }
.lab-meta dt{ font-family:var(--mono); font-size:7.5px; letter-spacing:1.4px; color:var(--fog); }
.lab-meta dd{ font-family:var(--mono); font-size:10.5px; color:var(--ice); }

/* Telemetry strip: revealed on hover, but it is decoration — it repeats
   what the card already states in plain text above. */
.lab-tel{
  max-height:0; opacity:0; overflow:hidden; margin:0;
  border-left:2px solid var(--acc-line); padding-left:12px;
  transition:max-height .45s var(--ease), opacity .35s, margin .45s var(--ease);
}
.lab:hover .lab-tel, .lab:focus-within .lab-tel{ max-height:120px; opacity:1; margin:0 0 16px; }
.lab-tel span{ display:block; font-family:var(--mono); font-size:9px; letter-spacing:1.1px; color:var(--fog); line-height:1.9; }
.lab-tel span b{ color:var(--ice); font-weight:400; }

.lab-go{
  margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:9px;
  min-height:46px; padding:12px 18px; border-radius:11px; align-self:flex-start;
  font-family:var(--mono); font-size:10px; letter-spacing:1.7px;
  border:1px solid var(--acc-line); background:var(--acc-soft); color:var(--white);
  transition:background .3s, border-color .3s, transform .3s var(--ease);
}
.lab-go span{ transition:transform .3s var(--ease); }
.lab:hover .lab-go span{ transform:translateX(4px); }
.lab-go:hover{ background:rgba(79,216,234,.2); }
.lab-go.muted{ border-color:var(--line2); background:transparent; color:var(--fog); }

@media (max-width:900px){
  .lab-grid{ grid-template-columns:1fr; }
  /* Touch: no hover, so the telemetry strip is simply always open. */
  .lab-tel{ max-height:120px; opacity:1; margin:0 0 16px; }
}
@media (hover:none){ .lab-tel{ max-height:120px; opacity:1; margin:0 0 16px; } }
@media (max-width:400px){ .lab{ padding:22px 19px 20px; } .lab-t{ font-size:19px; } .lab-meta{ grid-template-columns:1fr; } }

/* Highlight driven by the attack-surface map further down. */
.lab.flag{ border-color:var(--acc); box-shadow:0 0 0 1px var(--acc-line), var(--glow); }

/* ============================================================
   04 — ATTACK SURFACE MAP
   Three Z-tiers that separate on scroll: surfaces at the front,
   labs behind them, research at the back.
   ============================================================ */
.asm-stage{
  position:relative; perspective:1400px; padding:var(--s4) 0 var(--s5);
}
.asm-world{
  position:relative; transform-style:preserve-3d;
  transform:rotateX(var(--arx,4deg)) rotateY(var(--ary,0deg));
  transition:transform .5s var(--ease);
}
.asm-tier{ position:relative; transform-style:preserve-3d; margin-bottom:var(--s4); }
.asm-tier.surfaces{ transform:translateZ(calc(var(--sep,0) * 60px)); }
.asm-tier.labs    { transform:translateZ(calc(var(--sep,0) * -10px)); }
.asm-tier.base    { transform:translateZ(calc(var(--sep,0) * -76px)); }
.asm-lbl{ font-family:var(--mono); font-size:8px; letter-spacing:2.2px; color:var(--fog); margin-bottom:11px; }

.asm-row{ display:flex; flex-wrap:wrap; gap:9px; }
.asm-node{
  display:flex; align-items:center; gap:9px; min-height:46px;
  padding:11px 15px; border-radius:11px; cursor:pointer;
  border:1px solid var(--line); background:rgba(8,12,24,.9); color:var(--ice);
  font-family:var(--mono); font-size:9.5px; letter-spacing:1.5px;
  transition:border-color .3s, background .3s, transform .3s var(--ease), box-shadow .3s;
}
.asm-node i{ width:6px; height:6px; border-radius:50%; background:var(--line3); flex:none; transition:background .3s, box-shadow .3s; }
.asm-node:hover, .asm-node[aria-pressed="true"]{
  border-color:var(--acc-line); background:var(--panel); transform:translateY(-2px); box-shadow:var(--glow);
}
.asm-node:hover i, .asm-node[aria-pressed="true"] i{ background:var(--acc); box-shadow:0 0 8px var(--acc); }
.asm-node .asm-none{ color:var(--fog); font-size:8px; letter-spacing:1.1px; }

.asm-map{ display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }
.asm-card{
  display:block; padding:15px 16px; border-radius:11px;
  border:1px solid var(--line); background:var(--deep);
  transition:border-color .35s, background .35s, opacity .35s, transform .35s var(--ease);
}
.asm-card b{ display:block; font-family:var(--display); font-size:13.5px; font-weight:600; line-height:1.3; margin-bottom:6px; }
.asm-card span{ display:block; font-family:var(--mono); font-size:7.5px; letter-spacing:1.3px; color:var(--fog); }
.asm-card.lit{ border-color:var(--acc); background:var(--panel); transform:translateY(-3px); box-shadow:var(--glow); }
.asm-card.dim{ opacity:.34; }

.asm-svg{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
.asm-wire{
  stroke:rgba(140,165,225,.2); stroke-width:1; fill:none;
  stroke-dasharray:var(--len,180); stroke-dashoffset:var(--len,180);
  transition:stroke-dashoffset .9s var(--ease), stroke .4s;
}
.asm-wire.on{ stroke-dashoffset:0; }
.asm-wire.lit{ stroke:var(--acc); }

@media (max-width:900px){
  /* Mobile transformation: the spatial map becomes an explicit
     SURFACE -> LAB list. No perspective, no Z separation, no hover. */
  .asm-stage{ perspective:none; }
  .asm-world{ transform:none; }
  .asm-tier{ transform:none !important; }
  .asm-svg{ display:none; }
  .asm-map{ grid-template-columns:1fr; }
  .asm-card.dim{ opacity:1; }
}

/* Mobile-only paired list, hidden on desktop where the map does the job. */
.asm-mobile{ display:none; }
@media (max-width:900px){
  .asm-mobile{ display:block; }
  .asm-desktop{ display:none; }
  .asm-pair{ margin-bottom:12px; }
  .asm-pair .asm-node{ width:100%; cursor:default; }
  .asm-pair .arrow{ display:block; width:1px; height:16px; background:var(--line2); margin:7px 0 7px 24px; }
  .asm-pair .asm-card{ margin-left:14px; border-left:2px solid var(--acc-line); }
}

/* ============================================================
   05 — WHY SECURITY LABS
   Deliberately still. Four pillars, no motion, no tilt.
   ============================================================ */
.rpil-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2px; border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; }
.rpil{ position:relative; padding:30px 26px 34px; background:var(--deep); transition:background .35s; }
.rpil:hover{ background:var(--panel); }
.rpil::before{
  content:''; position:absolute; left:0; right:0; top:0; height:2px;
  background:linear-gradient(90deg, var(--cyan), var(--violet));
  transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease);
}
.rpil:hover::before{ transform:scaleX(1); }
.rpil-n{ font-family:var(--mono); font-size:10px; letter-spacing:2px; color:var(--acc); }
.rpil-k{ font-family:var(--display); font-size:19px; font-weight:700; letter-spacing:-.3px; margin:14px 0 10px; }
.rpil-d{ font-size:13.5px; color:var(--fog); line-height:1.7; }
@media (max-width:900px){ .rpil-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .rpil-grid{ grid-template-columns:1fr; } .rpil{ padding:24px 20px 26px; } }

/* ============================================================
   06 — RESEARCH WORKFLOW
   Horizontal on desktop, vertical on mobile.
   ============================================================ */
.wf{ position:relative; display:grid; grid-template-columns:repeat(5,1fr); }
.wf::before{ content:''; position:absolute; left:6%; right:6%; top:34px; height:1px; background:var(--line2); }
.wf-fill{
  position:absolute; left:6%; top:34px; height:1px; width:var(--wp,0%); max-width:88%;
  background:linear-gradient(90deg,var(--cyan),var(--violet)); transition:width 1.4s var(--ease);
}
.wf-step{ position:relative; padding:0 12px; text-align:center; }
.wf-dot{
  position:relative; z-index:2; width:15px; height:15px; border-radius:50%; margin:27px auto 0;
  background:var(--void); border:1px solid var(--line2);
  transition:border-color .5s, background .5s, box-shadow .5s;
}
.wf-step.on .wf-dot{ border-color:var(--acc); background:var(--acc); box-shadow:0 0 16px var(--acc-soft); }
.wf-k{ font-family:var(--mono); font-size:8.5px; letter-spacing:2px; color:var(--fog); margin-bottom:8px; }
.wf-step.on .wf-k{ color:var(--acc); }
.wf-t{ font-family:var(--display); font-size:16px; font-weight:600; margin:16px 0 8px; }
.wf-d{ font-size:12.5px; color:var(--fog); line-height:1.65; }
@media (max-width:860px){
  .wf{ grid-template-columns:1fr; }
  .wf::before{ left:7px; right:auto; top:8px; bottom:8px; width:1px; height:auto; }
  .wf-fill{ left:7px; top:8px; width:1px !important; height:var(--wp,0%); max-width:none;
            background:linear-gradient(180deg,var(--cyan),var(--violet)); transition:height 1.4s var(--ease); }
  .wf-step{ text-align:left; padding:0 0 26px 34px; }
  .wf-dot{ position:absolute; left:0; top:4px; margin:0; }
  .wf-t{ margin:4px 0 6px; }
}

/* ============================================================
   07 — RESEARCH TERMINAL
   ============================================================ */
.rterm{
  border:1px solid var(--line); border-radius:var(--r-lg); background:var(--void);
  overflow:hidden; max-width:820px; margin:0 auto;
}
.rterm-bar{
  display:flex; align-items:center; gap:8px; padding:11px 15px;
  border-bottom:1px solid var(--line); background:var(--deep);
}
.rterm-dot{ width:8px; height:8px; border-radius:50%; background:var(--line3); }
.rterm-lbl{ font-family:var(--mono); font-size:8.5px; letter-spacing:1.8px; color:var(--fog); margin-left:4px; }
.rterm-tag{
  margin-left:auto; font-family:var(--mono); font-size:7.5px; letter-spacing:1.4px;
  color:var(--warn); border:1px solid rgba(245,180,78,.34); border-radius:8px; padding:3px 8px;
}
.rterm-body{
  padding:20px 20px 24px; font-family:var(--mono); font-size:12.5px; line-height:2;
  color:var(--ice); min-height:300px;
}
.rterm-line{ display:block; white-space:pre-wrap; }
.rterm-line .pfx{ color:var(--acc); }
.rterm-line.done .ok{ color:var(--ok); }
.rterm-cursor{
  display:inline-block; width:7px; height:14px; background:var(--acc);
  vertical-align:-2px; margin-left:3px; animation:rscCaret 1s steps(1) infinite;
}
@keyframes rscCaret{ 0%,50%{opacity:1} 51%,100%{opacity:0} }
.rterm-foot{
  padding:12px 16px; border-top:1px solid var(--line); background:var(--deep);
  font-family:var(--mono); font-size:8px; letter-spacing:1.5px; color:var(--fog);
}
@media (max-width:560px){ .rterm-body{ font-size:11px; min-height:236px; padding:16px 15px 20px; } }

/* ============================================================
   08 — RESEARCH BEYOND LABS
   Four formats. All are empty states: nothing is published yet,
   and the cards say so rather than inventing an article.
   ============================================================ */
.pub-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.pub{
  position:relative; display:flex; flex-direction:column; gap:10px;
  padding:24px 22px 26px; border-radius:var(--r-lg);
  border:1px solid var(--line); background:var(--deep);
  transition:border-color .35s, transform .35s var(--ease), background .35s;
}
.pub:hover{ border-color:var(--acc-line); transform:translateY(-3px); background:var(--panel); }
.pub-ic{
  width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
  border:1px solid var(--line2); background:var(--panel); color:var(--fog);
  transition:color .35s, border-color .35s;
}
.pub:hover .pub-ic{ color:var(--acc); border-color:var(--acc-line); }
.pub-k{ font-family:var(--mono); font-size:8px; letter-spacing:1.8px; color:var(--acc); }
.pub-t{ font-family:var(--display); font-size:17px; font-weight:600; letter-spacing:-.3px; line-height:1.25; }
.pub-d{ font-size:12.5px; color:var(--fog); line-height:1.7; flex:1; }
.pub-state{
  font-family:var(--mono); font-size:8.5px; letter-spacing:1.6px; color:var(--warn);
  border-top:1px solid var(--line); padding-top:13px;
}
@media (max-width:1000px){ .pub-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .pub-grid{ grid-template-columns:1fr; } }

/* ============================================================
   09 — RESEARCH ARCHIVE
   A real filter UI over a genuinely empty collection. The filters
   work; the result is honest.
   ============================================================ */
.rarc-bar{
  display:flex; flex-wrap:wrap; gap:7px; padding:7px;
  border:1px solid var(--line); border-radius:var(--r-lg);
  background:linear-gradient(180deg, rgba(13,20,36,.7), rgba(6,9,17,.6));
  margin-bottom:var(--s4);
}
.rarc-f{
  min-height:44px; padding:11px 15px; border-radius:var(--r-md);
  border:1px solid transparent; background:none; cursor:pointer;
  font-family:var(--mono); font-size:9px; letter-spacing:1.5px; color:var(--fog);
  transition:background .3s, border-color .3s, color .3s;
}
.rarc-f:hover{ background:rgba(18,27,48,.6); color:var(--ice); }
.rarc-f[aria-pressed="true"]{ border-color:var(--acc-line); background:var(--panel); color:var(--acc); }
.rarc-empty{
  border:1px dashed var(--line2); border-radius:var(--r-lg);
  padding:var(--s6) var(--s4); text-align:center; background:rgba(8,12,24,.5);
}
.rarc-empty b{
  display:block; font-family:var(--mono); font-size:11px; letter-spacing:2.4px;
  color:var(--ice); margin-bottom:11px;
}
.rarc-empty p{ font-size:13px; color:var(--fog); line-height:1.75; max-width:520px; margin:0 auto; }
.rarc-empty .rarc-cat{ color:var(--acc); }

/* ============================================================
   10 — LAB ACCESS
   ============================================================ */
.lacc{
  position:relative; overflow:hidden;
  display:grid; grid-template-columns:1.05fr .95fr; gap:var(--s6); align-items:center;
  border:1px solid var(--line); border-radius:var(--r-xl); padding:var(--s5);
  background:linear-gradient(150deg, rgba(18,27,48,.6), rgba(6,9,17,.85));
}
.lacc::before{
  content:''; position:absolute; top:-42%; right:-14%; width:56%; aspect-ratio:1;
  background:radial-gradient(circle, rgba(124,92,250,.14), transparent 66%); pointer-events:none;
}
.lacc-h{ font-family:var(--display); font-size:clamp(24px,3.2vw,34px); font-weight:700; letter-spacing:-.9px; line-height:1.14; margin:14px 0 12px; }
.lacc-p{ font-size:14.5px; color:var(--ice); line-height:1.72; margin-bottom:var(--s4); }
.lacc-ctas{ display:flex; gap:12px; flex-wrap:wrap; }
.lacc-list{ position:relative; z-index:1; display:flex; flex-direction:column; gap:8px; }
.lacc-row{
  display:flex; align-items:center; gap:12px; min-height:52px;
  padding:13px 16px; border-radius:var(--r-md);
  border:1px solid var(--line); background:var(--deep); color:var(--ice);
  transition:border-color .3s, background .3s, transform .3s var(--ease);
}
.lacc-row:hover{ border-color:var(--acc-line); background:var(--panel); transform:translateX(3px); }
.lacc-row b{ font-family:var(--display); font-size:14px; font-weight:600; }
.lacc-row .go{ margin-left:auto; font-family:var(--mono); font-size:11px; color:var(--acc); }
@media (max-width:980px){ .lacc{ grid-template-columns:1fr; gap:var(--s5); } }
@media (max-width:560px){ .lacc{ padding:var(--s4); } }

/* ============================================================
   REVEALS + REDUCED MOTION
   ============================================================ */
.rsc [data-rv]{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.rsc [data-rv].in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .rsc *,
  .rsc *::before,
  .rsc *::after{ animation:none !important; transition-duration:.01ms !important; }
  .rsc [data-rv]{ opacity:1; transform:none; }
  .rsc-grid{ transform:none; }
  /* Anything motion would have revealed is shown outright. */
  .rcore-link, .asm-wire{ stroke-dashoffset:0; }
  .rcore-dust{ display:none; }
  .lab{ opacity:1; transform:none; filter:none; }
  .lab-tel{ max-height:120px; opacity:1; margin:0 0 16px; }
  .asm-tier{ transform:none !important; }
  .asm-card.dim{ opacity:1; }
}

/* 44px minimum on every control this page owns. */
.rsc .cta-btn, .rsc .cta-ghost{ min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
/* .lab-go already declares 46px; listing it here would lower it to 44. */
.rsc .asm-node, .rsc .rarc-f, .rsc .lacc-row{ min-height:44px; }
