
/* Three purposeful rooms, with a quieter architectural frame. */
.ne-lobby {
  --ne-rooms:url('assets/entrance-rooms-v5.jpg');
  --entrance-display:'Bricolage Grotesque',var(--display);
  --door-height:clamp(290px,calc(100svh - 500px),440px);
  padding:34px var(--gutter) 24px;
  min-height:calc(100svh - 88px);
}
.ne-lobby:before {
  background:radial-gradient(ellipse at 50% 62%,#27153629,transparent 72%);
}
.ne-lobby:after {
  background:radial-gradient(270px 210px at var(--ne-x) var(--ne-y),#b697ff0a,transparent 78%);
}
.ne-intro {
  width:100%;
  max-width:1040px;
  margin:0 auto 40px;
  text-align:center;
}
.ne-intro h1 {
  margin:0;
  font:500 clamp(2.75rem,4.3vw,4rem)/1.12 var(--entrance-display);
  font-optical-sizing:auto;
  letter-spacing:-.035em;
}
.ne-intro h1 span {
  display:inline;
}
.ne-intro h1 span:last-child {
  color:var(--accent);
}
.ne-intro p.ne-positioning {
  margin:18px auto 0;
  max-width:580px;
  font-size:1.0625rem;
  line-height:1.65;
  color:var(--muted);
}
.ne-portals {
  width:100%;
  max-width:calc(var(--door-height) * 1.8 + 140px);
  gap:70px;
}
.ne-portal {
  isolation:isolate;
}
.ne-door {
  height:var(--door-height);
  padding:1px;
  border-radius:50% 50% 2px 2px / 34% 34% 2px 2px;
  background:linear-gradient(130deg,#c6b4e273,#3e34464f 40%,#826eaa5c 72%,#dfd5f59c);
  box-shadow:0 20px 40px #0007,0 0 28px #b697ff09;
}
.ne-door:before {
  inset:-5px;
  border-radius:inherit;
  border:0;
  box-shadow:none;
}
.ne-world {
  box-shadow:inset 0 0 18px #0008;
}
.ne-scenery {
  background-size:300% auto;
  background-repeat:no-repeat;
  filter:brightness(.9) saturate(.88);
  transform:scale(1.015);
}
.ne-glass {
  background:linear-gradient(180deg,#06040a08,transparent 54%,#08040b19);
  box-shadow:inset 0 0 18px #0005;
}
.ne-floor-light {
  opacity:.45;
}
.ne-reflection {
  top:calc(var(--door-height) - 1px);
  height:38px;
  opacity:.4;
  background:radial-gradient(ellipse at 50% 0%,#b697ff27,transparent 72%);
}
.ne-portal-copy {
  margin-top:25px;
  min-height:90px;
  gap:6px;
}
.ne-portal-copy .ne-room {
  color:var(--muted);
  font-size:.875rem;
}
.ne-portal-copy strong {
  font:500 clamp(1.375rem,1.9vw,1.75rem)/1.2 var(--entrance-display);
  letter-spacing:-.025em;
  overflow-wrap:anywhere;
  position:relative;
}
.ne-portal-copy strong:after {
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:-5px;
  height:1px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .4s ease;
}
.ne-portal-copy .ne-description {
  margin-top:5px;
  max-width:240px;
  font-size:.875rem;
  line-height:1.5;
}
.ne-portal:focus-visible {
  outline:none;
}
.ne-portal:focus-visible .ne-door {
  outline:2px solid var(--accent);
  outline-offset:5px;
}
.ne-portal:focus-visible .ne-portal-copy strong:after {
  transform:scaleX(1);
}
@media(hover:hover) and (pointer:fine) {
  .ne-portal:hover .ne-portal-copy strong:after {
    transform:scaleX(1);
  }
  .ne-portal:hover .ne-scenery {
    filter:brightness(1.07) saturate(1);
    transform:scale(1.06) translate(calc(var(--ne-px) * -5px),calc(var(--ne-py) * -3px));
  }
}
.ne-exit {
  width:100%;
  max-width:1040px;
  border:0;
  padding:0;
  margin:26px auto 0;
  align-items:center;
}
.ne-exit a {
  font-size:.875rem;
  color:var(--muted);
  text-decoration-color:var(--line);
  transition:color .2s,text-decoration-color .2s;
}
.ne-exit a:hover,.ne-exit a:focus-visible {
  color:var(--ink);
  text-decoration-color:var(--accent);
}
@media(min-width:1500px) {
  .ne-lobby {
    justify-content:flex-start;
  }
  .ne-intro {margin-bottom:40px}
  .ne-exit {margin-top:26px}
}
@media(max-width:900px) and (min-width:601px) {
  .ne-lobby {
    --door-height:clamp(270px,calc(100svh - 420px),380px);
    padding-top:26px;
  }
  .ne-intro {
    margin-bottom:36px;
  }
  .ne-intro h1 {font-size:clamp(2rem,4.5vw,2.5rem)}
  .ne-intro p.ne-positioning {font-size:1rem;max-width:530px}
  .ne-portals {gap:28px}
  .ne-portal-copy {margin-top:24px}
  .ne-portal-copy .ne-description {max-width:190px}
}
@media(max-width:600px) {
  .ne-lobby {
    --door-height:230px;
    padding:26px 24px 22px;
    min-height:0;
  }
  .ne-intro {
    margin-bottom:38px;
    text-align:left;
  }
  .ne-intro h1 {font-size:clamp(2.3rem,8.5vw,3.1rem);line-height:1.08}
  .ne-intro h1 span {display:block}
  .ne-intro p.ne-positioning {
    margin:20px 0 0;
    max-width:340px;
    font-size:1rem;
    line-height:1.6;
  }
  .ne-portals {max-width:460px;gap:32px}
  .ne-portal {
    grid-template-columns:138px minmax(0,1fr);
    gap:26px;
    min-height:var(--door-height);
  }
  .ne-door {grid-column:1;grid-row:1;width:100%;height:var(--door-height)}
  .ne-portal-copy {grid-column:2;grid-row:1;min-height:0;margin:0;gap:8px}
  .ne-portal-copy strong {font-size:1.6rem;letter-spacing:-.03em}
  .ne-portal-copy .ne-description {max-width:185px;margin-top:4px}
  .ne-reflection {left:0;right:auto;width:138px;top:calc(var(--door-height) - 1px)}
  .ne-exit {margin-top:32px;gap:24px}
  .ne-exit a {max-width:150px}
}
@media(max-width:370px) {
  .ne-lobby {--door-height:200px;padding-inline:20px}
  .ne-portal {grid-template-columns:110px minmax(0,1fr);gap:22px}
  .ne-portal-copy strong {font-size:1.375rem}
  .ne-reflection {width:110px}
}
@media(max-height:800px) and (min-width:601px) {
  .ne-lobby {
    --door-height:clamp(240px,calc(100svh - 420px),330px);
    padding-block:20px 18px;
  }
  .ne-intro {margin-bottom:28px}
  .ne-intro h1 {font-size:clamp(2rem,4vw,3.25rem)}
  .ne-intro p.ne-positioning {margin-top:14px;font-size:1rem}
  .ne-portal-copy {margin-top:22px;min-height:82px}
  .ne-exit {margin-top:18px}
}
@media(prefers-reduced-motion:reduce) {
  .ne-portal:hover .ne-scenery,.ne-portal:focus-visible .ne-scenery {transform:none}
}
@media(forced-colors:active) {
  .ne-door {border:1px solid CanvasText}
  .ne-portal:focus-visible {outline:2px solid Highlight;outline-offset:6px}
}

/* Credibility is part of the introduction, with direct routes to the evidence. */
.ne-credibility {max-width:650px; margin:22px auto 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:12px 28px; text-align:left;}
.ne-credibility>p {font-size:.8125rem; line-height:1.7; color:var(--muted); margin:0;}
.ne-credibility>p a {color:var(--ink); text-underline-offset:4px; text-decoration-color:var(--line);}
.ne-proof {display:flex; align-items:center; gap:12px; padding:10px 0; color:var(--ink); border-block:1px solid var(--line);}
.ne-proof>strong {font:500 1.7rem/1 var(--display); color:var(--accent); letter-spacing:-.04em;}
.ne-proof>span {font-size:.75rem; line-height:1.6;}
.ne-proof small {display:block; font-size:.625rem; color:var(--muted);}
.ne-proof .ne-proof-label {font-size:.6875rem; text-decoration:underline; text-underline-offset:4px; margin-left:12px;}
.ne-proof:hover,.ne-credibility a:hover {color:var(--accent);}
.ne-lobby {--door-height:clamp(270px,calc(100svh - 570px),420px);}
.ne-intro {margin-bottom:28px;}
@media(max-width:600px) {
 .ne-credibility {justify-content:flex-start; margin-top:20px; gap:10px;}
 .ne-proof {width:100%; gap:12px;}
 .ne-proof .ne-proof-label {display:none;}
 .ne-intro {margin-bottom:30px;}
 .ne-lobby {--door-height:210px;}
}
@media(max-width:370px) {.ne-lobby {--door-height:190px;} .ne-proof>strong {font-size:1.5rem;} .ne-proof small {font-size:.625rem;}}
@media(forced-colors:active) {.ne-proof {border-color:CanvasText;}}
