/*
 * SCROLLBAR OWNER: Styles/scrollbars.css
 * Scrollbar appearance is centralized there. This file may own overflow,
 * scroll-snap and scrollbar-gutter behavior, but must not style scrollbar chrome.
 */

.page-info {
  background:
    radial-gradient(circle at 14% 8%, rgba(255,58,167,.08), transparent 32rem),
    radial-gradient(circle at 88% 28%, rgba(110,242,255,.035), transparent 30rem),
    var(--mn-bg);
}

.info-page {
  width: var(--mn-shell);
  margin: 0 auto;
  padding: clamp(4rem, 8vw, 7rem) 0 clamp(6rem, 10vw, 10rem);
}

.info-hero {
  max-width: 980px;
  padding-bottom: clamp(3rem, 7vw, 6rem);
}

.info-hero h1 {
  max-width: 10ch;
  margin: 0;
  font-family: var(--mn-font-display);
  font-size: clamp(4rem, 9vw, 8rem);
  font-weight: 500;
  letter-spacing: -.08em;
  line-height: .86;
}

.info-hero > p:not(.mn-kicker) {
  max-width: 48rem;
  margin: 1.4rem 0 0;
  color: var(--mn-text-soft);
  font-size: clamp(1rem, 1.45vw, 1.2rem);
  line-height: 1.75;
}

.info-hero > span {
  display: inline-block;
  margin-top: 1.2rem;
  color: var(--mn-muted);
  font-size: .64rem;
}

.contact-layout {
  display: grid;
  grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr);
  gap: 1rem;
  align-items: start;
}

.contact-card,
.contact-form-card {
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius-lg);
  background: rgba(12,14,20,.78);
}

.contact-card {
  position: sticky;
  top: 96px;
  padding: clamp(1.5rem, 4vw, 2.5rem);
}

.contact-card h2 {
  max-width: 9ch;
  margin: .45rem 0 1rem;
  font-family: var(--mn-font-display);
  font-size: clamp(2rem, 4vw, 3.4rem);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .96;
}

.contact-card > a {
  color: var(--mn-cyan);
  font-size: .85rem;
  text-decoration: none;
}

.contact-card > p {
  color: var(--mn-muted);
  font-size: .76rem;
  line-height: 1.7;
}

.contact-socials {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin-top: 1.5rem;
}

.contact-socials a {
  padding: .45rem .62rem;
  border: 1px solid var(--mn-line);
  border-radius: 999px;
  color: var(--mn-text-soft);
  font-size: .6rem;
  text-decoration: none;
}

.contact-socials a:hover {
  border-color: rgba(255,58,167,.28);
  color: var(--mn-text);
}

.contact-form-card {
  padding: clamp(1.5rem, 4vw, 3rem);
}

.contact-form {
  display: grid;
  gap: 1.1rem;
}

.contact-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.contact-form label {
  display: grid;
  gap: .48rem;
  color: var(--mn-text-soft);
  font-size: .68rem;
  font-weight: 650;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  background: #080a0f;
  color: var(--mn-text);
  font: inherit;
}

.contact-form input,
.contact-form select {
  min-height: 54px;
  padding: 0 .9rem;
}

.contact-form textarea {
  min-height: 220px;
  padding: .9rem;
  resize: vertical;
  line-height: 1.6;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
  outline: none;
  border-color: rgba(110,242,255,.5);
  box-shadow: 0 0 0 3px rgba(110,242,255,.05);
}

.contact-form .mn-button {
  justify-self: start;
}

.contact-honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.contact-errors,
.contact-success {
  margin-bottom: 1.2rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(255,58,167,.24);
  border-radius: 14px;
  background: rgba(255,58,167,.045);
}

.contact-errors p {
  margin: .25rem 0;
  color: var(--mn-text-soft);
  font-size: .72rem;
}

.contact-success span {
  color: var(--mn-pink);
  font-size: .56rem;
  font-weight: 800;
  letter-spacing: .13em;
}

.contact-success h2 {
  margin: .35rem 0;
  font-family: var(--mn-font-display);
  font-size: clamp(2rem, 4vw, 3.4rem);
  font-weight: 500;
}

.contact-success p,
.contact-form__offline {
  color: var(--mn-muted);
  line-height: 1.6;
}

.contact-form__offline a {
  color: var(--mn-cyan);
}

.privacy-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
}

.privacy-index {
  position: sticky;
  top: 96px;
  display: grid;
  gap: .65rem;
  padding: 1.2rem;
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  background: rgba(12,14,20,.72);
}

.privacy-index strong {
  margin-bottom: .3rem;
  color: var(--mn-text);
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.privacy-index a {
  color: var(--mn-muted);
  font-size: .68rem;
  text-decoration: none;
}

.privacy-index a:hover {
  color: var(--mn-pink);
}

.privacy-content {
  display: grid;
  gap: 1rem;
}

.privacy-content section {
  scroll-margin-top: 110px;
  padding: clamp(1.4rem, 4vw, 2.4rem);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius-lg);
  background: rgba(12,14,20,.72);
}

.privacy-content section > span {
  color: var(--mn-pink);
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: .12em;
}

.privacy-content h2 {
  margin: .55rem 0 1rem;
  font-family: var(--mn-font-display);
  font-size: clamp(1.8rem, 3.5vw, 3rem);
  font-weight: 500;
  letter-spacing: -.045em;
}

.privacy-content p {
  max-width: 58rem;
  margin: .7rem 0 0;
  color: var(--mn-text-soft);
  font-size: .82rem;
  line-height: 1.8;
}

.privacy-content a {
  color: var(--mn-cyan);
}

@media (max-width: 820px) {
  .contact-layout,
  .privacy-layout {
    grid-template-columns: 1fr;
  }

  .contact-card,
  .privacy-index {
    position: static;
  }

  .privacy-index {
    display: none;
  }
}

@media (max-width: 560px) {
  .contact-form__row {
    grid-template-columns: 1fr;
  }

  .info-hero h1 {
    font-size: clamp(3.4rem, 17vw, 5.5rem);
  }
}


/* Shared governance pages */
.policy-list {
  max-width: 58rem;
  margin: 1rem 0 0;
  padding-left: 1.15rem;
  color: var(--mn-text-soft);
  font-size: .82rem;
  line-height: 1.8;
}

.policy-list li + li {
  margin-top: .45rem;
}

.page-policy .privacy-content section {
  background:
    radial-gradient(circle at 100% 0%, rgba(255,58,167,.035), transparent 18rem),
    rgba(12,14,20,.72);
}