/* Welcome composition scales with the browser, with readable control minima. */
.welcome-wall {
  --welcome-text: clamp(16px, min(.9vw, 1.65dvh), 20px);
  --welcome-small: clamp(13px, min(.78vw, 1.4dvh), 17px);
  --welcome-gap: clamp(16px, min(1.1vw, 2dvh), 24px);
  --welcome-control: clamp(48px, min(3vw, 5.4dvh), 64px);
  --welcome-padding: clamp(26px, min(1.8vw, 3.2dvh), 44px);
  grid-template-rows: auto minmax(min-content, 1fr) auto;
}
.wall-main {
  width: 70%;
  max-width: 2100px;
  grid-template-columns: minmax(0, 1fr) clamp(340px, 25vw, 620px);
  gap: clamp(40px, 4vw, 120px);
  padding: clamp(24px, 3dvh, 48px) 0;
}
.wall-eyebrow {
  font-size: var(--welcome-small);
  margin-bottom: var(--welcome-gap);
  gap: 12px;
}
.wall-eyebrow::before { width: 1.8em; }
.wall-hero h1 {
  font-size: clamp(40px, min(3vw, 5.5dvh), 80px);
  line-height: 1.22;
  margin-bottom: var(--welcome-gap);
}
.wall-intro {
  max-width: none;
  font-size: var(--welcome-text);
  line-height: 1.85;
  margin: 0;
}
.wall-map {
  width: min(100%, 1000px, 80dvh);
  max-height: none;
  margin: clamp(24px, 3.5dvh, 48px) 0 0;
}
.wall-topics {
  font-size: var(--welcome-small);
  gap: 10px clamp(18px, 1.5vw, 34px);
  margin-top: var(--welcome-gap);
}
.wall-access { padding: var(--welcome-padding); }
.wall-access h2 {
  font-size: clamp(26px, min(1.5vw, 2.7dvh), 36px);
  margin-bottom: 8px;
}
.wall-access .auth-lead {
  font-size: var(--welcome-small);
  margin-bottom: var(--welcome-gap);
}
.wall-access .auth-tabs { margin-bottom: var(--welcome-gap); }
.wall-access .auth-tabs button {
  font-size: var(--welcome-text);
  min-height: var(--welcome-control);
  padding: 10px 16px;
}
.wall-access .auth-form { gap: var(--welcome-gap); }
.wall-access .auth-field {
  font-size: var(--welcome-small);
  line-height: 1.5;
  gap: clamp(8px, .65vw, 14px);
}
.wall-access .auth-input {
  height: var(--welcome-control);
  font-size: var(--welcome-text);
  line-height: 1.5;
  padding: 10px clamp(12px, 1vw, 22px);
}
.wall-access .auth-password .auth-input { padding-right: var(--welcome-control); }
.wall-access .auth-reveal {
  width: calc(var(--welcome-control) - 8px);
  height: calc(var(--welcome-control) - 8px);
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
}
.wall-access .auth-reveal svg { width: 1.4em; height: 1.4em; font-size: var(--welcome-text); }
.wall-access .auth-submit {
  height: var(--welcome-control);
  font-size: var(--welcome-text);
  gap: 12px;
}
.wall-access .auth-submit svg { width: 1.3em; height: 1.3em; }
.wall-access .auth-footer-actions {
  font-size: var(--welcome-small);
  margin-top: var(--welcome-gap);
}
.wall-access .auth-help { font-size: inherit; }
.wall-access .auth-contract {
  font-size: clamp(12px, min(.78vw, 1.4dvh), 17px);
  padding-top: var(--welcome-gap);
  margin-top: var(--welcome-gap);
}
.wall-access .auth-message { font-size: var(--welcome-small); }
@media (max-width: 1200px) {
  .wall-main { width: 90%; gap: 32px; }
}
@media (max-width: 1000px) {
  .wall-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    max-width: 680px;
    width: calc(100% - 48px);
    gap: 36px;
    margin: 0 auto;
    padding: 28px 0 40px;
  }
  .wall-hero h1 { font-size: clamp(36px, 5.4vw, 48px); }
  .wall-map { width: 100%; max-width: 640px; margin-top: 28px; }
  .wall-access { padding: 28px; }
}
@media (max-width: 700px) {
  .wall-main { width: calc(100% - 40px); gap: 28px; padding: 22px 0 32px; }
  .wall-hero h1 { font-size: clamp(30px, 8.2vw, 40px); }
  .wall-access { padding: 22px; }
  .wall-intro { font-size: 15px; }
}