/* Contact and About: lead with the information visitors came for. */
#af-black.info-page.fx-site.fx-hud {
  --af-muted: #b0b7aa;
}
#af-black.info-page.fx-site.fx-hud .info-main {
  padding-top: 116px;
}
#af-black.info-page.fx-site.fx-hud .info-wrap {
  max-width: 1280px;
}
#af-black.info-page.fx-site.fx-hud .info-intro {
  margin-bottom: 28px;
}
#af-black.info-page.fx-site.fx-hud .info-eyebrow {
  color: var(--af-accent);
  font-family: var(--fx-mono);
  font-size: 11px;
  line-height: 1.8;
  letter-spacing: .12em;
}
#af-black.info-page.fx-site.fx-hud .info-intro h1 {
  margin: 12px 0 16px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: clamp(27px, 2.7vw, 38px);
  font-weight: 700;
  line-height: 1.65;
  letter-spacing: .01em;
  text-wrap: pretty;
}
#af-black.info-page.fx-site.fx-hud .info-summary {
  font-size: 14px;
  line-height: 1.9;
  color: var(--af-muted);
}
#af-black.info-page.fx-site.fx-hud .fx-cursor {
  display: none;
}
#af-black.info-page.fx-site.fx-hud .fx-grain {
  opacity: .018;
}
#af-black.info-page.fx-site.fx-hud .fx-grid {
  opacity: .3;
}

/* A compact introduction lets the form appear in the first screen. */
#af-black.ct-site.fx-site.fx-hud #ct-form {
  scroll-margin-top: 100px;
}
#af-black.ct-site.fx-site.fx-hud .ct-form-notice {
  margin-top: 10px;
  font-size: 12px;
  line-height: 1.8;
  color: var(--af-muted);
}
#af-black.ct-site.fx-site.fx-hud .ct-form-grid {
  gap: 24px;
  padding-bottom: 0;
}
#af-black.ct-site.fx-site.fx-hud .ct-form,
#af-black.ct-site.fx-site.fx-hud .ct-preview {
  border-radius: 16px;
  background: #0e110f;
  box-shadow: none;
}
#af-black.ct-site.fx-site.fx-hud .ct-preview-bar {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 12px;
  letter-spacing: .03em;
  padding-block: 15px;
}
#af-black.ct-site.fx-site.fx-hud .ct-preview-bar i {
  display: none;
}
#af-black.ct-site.fx-site.fx-hud .ct-preview-bar span {
  margin-left: 0;
}
#af-black.ct-site.fx-site.fx-hud .ct-preview-text {
  min-height: 190px;
}
#af-black.ct-site.fx-site.fx-hud .ct-flow {
  margin: 32px 0 56px;
}
#af-black.ct-site.fx-site.fx-hud .ct-flow h2 {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 14px;
}
#af-black.ct-site.fx-site.fx-hud .ct-steps {
  border-radius: 12px;
  background: rgba(255,255,255,.015);
}
#af-black.ct-site.fx-site.fx-hud .ct-steps b {
  font-family: var(--fx-mono);
  font-size: 16px;
}
#af-black.ct-site.fx-site.fx-hud .ins-section {
  padding-block: 36px;
}
#af-black.ct-site.fx-site.fx-hud .ins-head {
  margin-bottom: 24px;
  gap: 18px;
}
#af-black.ct-site.fx-site.fx-hud .ins-head h2 {
  margin-top: 12px;
  font-family: 'Noto Sans JP', sans-serif;
  font-stretch: normal;
  font-weight: 700;
  font-size: clamp(23px, 2.1vw, 28px);
  line-height: 1.5;
  letter-spacing: .02em;
}
#af-black.ct-site.fx-site.fx-hud .ct-card,
#af-black.ct-site.fx-site.fx-hud .ct-notes li,
#af-black.ct-site.fx-site.fx-hud .ct-reach {
  border-radius: 14px;
}
#af-black.ct-site.fx-site.fx-hud .ct-card h3 {
  font-size: 16px;
}

/* Introduce the creator before the project imagery. */
#af-black.af-about-site.fx-site.fx-hud .about-intro {
  padding-bottom: 48px;
  scroll-margin-top: 116px;
}
#af-black.af-about-site.fx-site.fx-hud .about-intro .info-intro {
  max-width: 1040px;
}
#af-black.af-about-site.fx-site.fx-hud .about-intro .about-copy {
  max-width: 840px;
}
#af-black.af-about-site.fx-site.fx-hud .about-intro .about-copy > p {
  font-size: 15px;
  line-height: 2;
  margin-bottom: 18px;
}
#af-black.af-about-site.fx-site.fx-hud .about-intro .about-copy .af-action {
  margin-top: 10px;
}
#af-black.af-about-site.fx-site.fx-hud .about-intro .about-reach {
  margin-top: 36px;
}
#af-black.af-about-site.fx-site.fx-hud .about-worlds {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: auto;
  padding-bottom: 40px;
}
#af-black.af-about-site.fx-site.fx-hud .about-world {
  aspect-ratio: auto;
  grid-column: auto;
  border-radius: 14px;
}
#af-black.af-about-site.fx-site.fx-hud .about-world img {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
}
#af-black.af-about-site.fx-site.fx-hud .about-world::after,
#af-black.af-about-site.fx-site.fx-hud .about-world .fx-scan {
  display: none;
}
#af-black.af-about-site.fx-site.fx-hud .about-world > span {
  position: relative;
  inset: auto;
  display: block;
  padding: 20px;
  background: none;
}
#af-black.af-about-site.fx-site.fx-hud .about-world strong {
  font-size: clamp(19px, 2vw, 28px);
  padding-right: 38px;
}
#af-black.af-about-site.fx-site.fx-hud .about-world em {
  display: block;
  padding-right: 0;
  font-size: 12px;
}
#af-black.af-about-site.fx-site.fx-hud .about-world b {
  top: 20px;
  bottom: auto;
  right: 16px;
  width: 30px;
  height: 30px;
}
#af-black.af-about-site.fx-site.fx-hud .about-section {
  padding-block: 56px 32px;
}
#af-black.af-about-site.fx-site.fx-hud .about-section h2 {
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.45;
}
#af-black.af-about-site.fx-site.fx-hud .about-section h2 span {
  text-shadow: none;
}

@media (max-width: 900px) {
  #af-black.info-page.fx-site.fx-hud .info-main { padding-top: 106px; }
  #af-black.af-about-site.fx-site.fx-hud .about-worlds { gap: 12px; }
  #af-black.af-about-site.fx-site.fx-hud .about-world > span { padding: 16px; }
  #af-black.af-about-site.fx-site.fx-hud .about-world strong { font-size: 20px; }
  #af-black.af-about-site.fx-site.fx-hud .about-world b { display: none; }
  #af-black.af-about-site.fx-site.fx-hud .about-world strong { padding-right: 0; }
}
@media (max-width: 640px) {
  #af-black.info-page.fx-site.fx-hud .info-intro { margin-bottom: 22px; }
  #af-black.info-page.fx-site.fx-hud .info-intro h1 { font-size: 25px; line-height: 1.65; }
  #af-black.info-page.fx-site.fx-hud .info-summary br { display: none; }
  #af-black.af-about-site.fx-site.fx-hud .about-intro .about-copy > p { font-size: 14px; }
  #af-black.af-about-site.fx-site.fx-hud .about-worlds { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  #af-black.ct-site.fx-site.fx-hud .ct-form-grid { gap: 18px; }
  #af-black.ct-site.fx-site.fx-hud .ct-form { padding: 18px; }
  #af-black.ct-site.fx-site.fx-hud .ct-flow { margin-bottom: 40px; }
  #af-black.ct-site.fx-site.fx-hud .ins-section { padding-block: 30px; }
}