/* ==========================================================================
   NULLIFIER — THE ABOUT PAGE
   Loaded on the About page only (templates/page-about.html). Markup from
   inc/about.php; words set in Appearance → About page. Ported from Jack's
   "About Nullifier" concept (24 Sep 2026). Scoped to #nullifier-about so the
   theme's own heading and link rules cannot reach in.
   ========================================================================== */

/* Full width, edge to edge: undo the interior-page gutter and top margin on <main>. */
body .wp-site-blocks > main.nf-about-main {
	margin-block: 0 !important;
	padding: 0 !important;
}

body .wp-site-blocks > main.nf-about-main + footer,
body .wp-site-blocks > main.nf-about-main ~ footer {
	margin-block-start: 0 !important;
}

body .wp-site-blocks > main.nf-about-main > * {
	margin-block: 0 !important;
}

#nullifier-about {
  --nf-ink: #08080b;
  --nf-paper: #f0f0eb;
  --nf-white: #f8f8f4;
  --nf-blue: #0000fe;
  --nf-grey: #b5b5be;
  width: 100%;
  max-width: none;
  margin: 0;
  background: var(--nf-ink);
  color: var(--nf-white);
  font-family: var(--wp--preset--font-family--outfit, "Outfit"), system-ui, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
  isolation: isolate;
}
#nullifier-about *, #nullifier-about *::before, #nullifier-about *::after { box-sizing: border-box; }
#nullifier-about h1, #nullifier-about h2, #nullifier-about h3, #nullifier-about p { margin: 0; padding: 0; font-family: inherit; color: inherit; }
#nullifier-about h1, #nullifier-about h2, #nullifier-about h3 { font-style: normal; text-transform: none; }
#nullifier-about a { color: inherit; text-decoration: none; }
#nullifier-about a:focus-visible { outline: 3px solid #8e8eff; outline-offset: 6px; }
#nullifier-about .nfa-wrap { width: min(100%, 1360px); margin: 0 auto; padding-left: 6%; padding-right: 6%; }
#nullifier-about .nfa-kicker { display: flex; gap: 12px; align-items: center; font-size: 11px; line-height: 1.5; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
#nullifier-about .nfa-kicker::before { content: ""; width: 7px; height: 7px; background: var(--nf-blue); flex: 0 0 7px; }
#nullifier-about .nfa-hero { position: relative; overflow: hidden; background: #070709; }
#nullifier-about .nfa-hero::before { position: absolute; content: ""; inset: 0; background: radial-gradient(ellipse at 85% 32%, #181827 0%, #070709 66%); }
#nullifier-about .nfa-hero-inner { position: relative; min-height: 650px; padding-top: 51px; padding-bottom: 42px; display: flex; flex-direction: column; z-index: 2; }
#nullifier-about .nfa-hero .nfa-kicker { color: #c6c6d3; }
#nullifier-about .nfa-hero h1 { position: relative; margin-top: 78px; font-size: clamp(62px, 8.8vw, 122px); font-weight: 900; line-height: .94; letter-spacing: -.055em; text-transform: uppercase; max-width: 1000px; }
#nullifier-about .nfa-hero h1 span { display: block; }
#nullifier-about .nfa-hero .nfa-deck { position: relative; max-width: 475px; margin-top: 27px; font-size: 20px; color: #c8c8d1; line-height: 1.45; }
#nullifier-about .nfa-hero-bottom { margin-top: auto; padding-top: 55px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
#nullifier-about .nfa-meta { font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
#nullifier-about .nfa-text-link { display: inline-flex; min-height: 44px; align-items: center; gap: 24px; font-size: 13px; font-weight: 700; }
#nullifier-about .nfa-text-link span:last-child { font-size: 19px; }
#nullifier-about .nfa-text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
#nullifier-about .nfa-orbit { position: absolute; width: 625px; height: 625px; top: -45px; right: -178px; border-radius: 50%; background: radial-gradient(circle at 50% 50%, #020207 0 47%, #05051f 52%, #060654 56%, #1515bf 60%, #7b7bff 62.3%, #e4e4ff 62.5%, #2424ff 63%, #090993 64%, #00002b 67%, transparent 72%); box-shadow: 0 0 120px 30px #1111f21c; transform: rotate(-28deg) scaleX(.82); }
#nullifier-about .nfa-orbit::after { content: ""; position: absolute; inset: 80px; border-radius: 50%; background: radial-gradient(circle at 72% 25%, #101017, #020206 65%); box-shadow: -15px 25px 70px #000; }
#nullifier-about .nfa-horizon { position: absolute; left: 49%; right: -15%; bottom: 38px; height: 1px; transform: rotate(-31deg); background: linear-gradient(90deg, transparent, #5e5ed0 60%, #0000fe); opacity: .65; }
#nullifier-about .nfa-story { background: var(--nf-paper); color: var(--nf-ink); padding-top: 78px; padding-bottom: 81px; }
#nullifier-about .nfa-story-grid { display: grid; grid-template-columns: 1.06fr 1fr; gap: 10%; margin-top: 31px; }
#nullifier-about .nfa-story h2 { font-size: clamp(35px, 4vw, 56px); line-height: 1.06; letter-spacing: -.045em; font-weight: 700; max-width: 480px; }
#nullifier-about .nfa-prose p + p { margin-top: 18px; }
#nullifier-about .nfa-prose { font-size: 17px; line-height: 1.62; }
#nullifier-about .nfa-story .nfa-prose { color: #36363d; }
#nullifier-about .nfa-principles { padding-top: 75px; padding-bottom: 73px; }
#nullifier-about .nfa-section-title { display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding-bottom: 34px; }
#nullifier-about .nfa-section-title h2 { font-size: clamp(28px, 3.2vw, 44px); line-height: 1.13; letter-spacing: -.035em; font-weight: 700; }
#nullifier-about .nfa-section-title .nfa-meta { color: #9999a6; white-space: nowrap; }
#nullifier-about .nfa-values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid #34343d; }
#nullifier-about .nfa-value { padding-top: 23px; padding-right: 28px; }
#nullifier-about .nfa-value + .nfa-value { border-left: 1px solid #34343d; padding-left: 28px; }
#nullifier-about .nfa-value:last-child { padding-right: 0; }
#nullifier-about .nfa-number { display: block; font-size: 11px; color: #9999ad; margin-bottom: 32px; letter-spacing: .1em; }
#nullifier-about .nfa-value h3 { font-size: 23px; line-height: 1.2; font-weight: 700; letter-spacing: -.025em; margin-bottom: 13px; }
#nullifier-about .nfa-value p { color: var(--nf-grey); font-size: 16px; line-height: 1.6; }
#nullifier-about .nfa-world { display: grid; grid-template-columns: 1fr 1fr; min-height: 418px; border-top: 1px solid #34343d; border-bottom: 1px solid #34343d; }
#nullifier-about .nfa-type-panel { background: #0000fe; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 39px 12%; }
#nullifier-about .nfa-type-panel::before { content: ""; position: absolute; width: 315px; height: 315px; right: -130px; top: -112px; border: 1px solid #6f6fff; border-radius: 50%; }
#nullifier-about .nfa-type-panel::after { content: ""; position: absolute; width: 450px; height: 450px; right: -197px; top: -179px; border: 1px solid #4545ff; border-radius: 50%; }
#nullifier-about .nfa-type-panel .nfa-kicker::before { background: #fff; }
#nullifier-about .nfa-art-type { font-weight: 900; font-size: clamp(45px, 5.5vw, 76px); letter-spacing: -.04em; line-height: .97; margin: 30px 0; position: relative; z-index: 1; }
#nullifier-about .nfa-art-type span { display: block; }
#nullifier-about .nfa-world-copy { padding: 53px 12% 42px; display: flex; flex-direction: column; justify-content: center; background: #111116; }
#nullifier-about .nfa-world-copy h2 { font-size: clamp(29px, 3.1vw, 43px); font-weight: 700; line-height: 1.1; letter-spacing: -.035em; margin-bottom: 23px; }
#nullifier-about .nfa-world-copy p { color: #bcbcc6; font-size: 16px; line-height: 1.6; }
#nullifier-about .nfa-world-copy .nfa-text-link { align-self: flex-start; margin-top: 19px; border-bottom: 1px solid #6d6d7a; }
#nullifier-about .nfa-cta { padding-top: 68px; padding-bottom: 64px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
#nullifier-about .nfa-cta h2 { font-size: clamp(38px, 4.5vw, 64px); line-height: 1.07; font-weight: 700; letter-spacing: -.045em; margin-bottom: 15px; }
#nullifier-about .nfa-cta p { color: var(--nf-grey); font-size: 15px; }
#nullifier-about .nfa-cta p a { border-bottom: 1px solid #777781; padding-bottom: 2px; }
#nullifier-about .nfa-cta p a:hover { color: white; }
#nullifier-about .nfa-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 58px; background: var(--nf-paper); color: var(--nf-ink); padding: 16px 24px; font-size: 14px; font-weight: 700; white-space: nowrap; transition: background-color .15s, color .15s; }
#nullifier-about .nfa-button:hover { background: var(--nf-blue); color: white; }
#nullifier-about .nfa-button span:last-child { font-size: 22px; line-height: 1; }
@media (min-width: 1450px) {
  #nullifier-about .nfa-orbit { right: calc(50% - 825px); }
}
@media (max-width: 850px) {
  #nullifier-about .nfa-hero-inner { min-height: 595px; }
  #nullifier-about .nfa-hero h1 { margin-top: 82px; font-size: 9.5vw; }
  #nullifier-about .nfa-orbit { width: 525px; height: 525px; right: -220px; top: -7px; opacity: .78; }
  #nullifier-about .nfa-story-grid { gap: 6%; }
  #nullifier-about .nfa-prose { font-size: 16px; }
  #nullifier-about .nfa-value { padding-right: 19px; }
  #nullifier-about .nfa-value + .nfa-value { padding-left: 19px; }
  #nullifier-about .nfa-value h3 { font-size: 21px; }
  #nullifier-about .nfa-world-copy { padding: 40px 10%; }
  #nullifier-about .nfa-type-panel { padding: 34px 12%; }
  #nullifier-about .nfa-art-type { font-size: 6.2vw; }
}
@media (max-width: 600px) {
  #nullifier-about .nfa-wrap { padding-left: 7%; padding-right: 7%; }
  #nullifier-about .nfa-hero-inner { min-height: 614px; padding-top: 34px; padding-bottom: 25px; }
  #nullifier-about .nfa-hero h1 { font-size: clamp(43px, 10.4vw, 63px); margin-top: 169px; line-height: .98; letter-spacing: -.05em; }
  #nullifier-about .nfa-hero .nfa-deck { max-width: 360px; font-size: 17px; margin-top: 22px; }
  #nullifier-about .nfa-orbit { width: 385px; height: 385px; top: -35px; right: -135px; opacity: .94; }
  #nullifier-about .nfa-horizon { bottom: 272px; left: 54%; }
  #nullifier-about .nfa-hero-bottom { gap: 12px; padding-top: 34px; }
  #nullifier-about .nfa-meta { font-size: 9px; letter-spacing: .1em; }
  #nullifier-about .nfa-text-link { font-size: 12px; gap: 12px; }
  #nullifier-about .nfa-story { padding-top: 49px; padding-bottom: 48px; }
  #nullifier-about .nfa-story-grid { grid-template-columns: 1fr; gap: 25px; margin-top: 25px; }
  #nullifier-about .nfa-story h2 { font-size: 38px; max-width: 420px; }
  #nullifier-about .nfa-principles { padding-top: 47px; padding-bottom: 29px; }
  #nullifier-about .nfa-section-title { align-items: flex-start; flex-direction: column; gap: 15px; padding-bottom: 26px; }
  #nullifier-about .nfa-section-title .nfa-meta { order: -1; }
  #nullifier-about .nfa-section-title h2 { font-size: 31px; max-width: 300px; }
  #nullifier-about .nfa-values { grid-template-columns: 1fr; }
  #nullifier-about .nfa-value, #nullifier-about .nfa-value + .nfa-value { border-left: 0; padding: 25px 0; display: grid; grid-template-columns: 26px 1fr; gap: 0 14px; }
  #nullifier-about .nfa-value + .nfa-value { border-top: 1px solid #34343d; }
  #nullifier-about .nfa-number { grid-row: 1 / 3; padding-top: 4px; margin: 0; }
  #nullifier-about .nfa-value h3 { font-size: 23px; margin-bottom: 10px; }
  #nullifier-about .nfa-value p { grid-column: 2; }
  #nullifier-about .nfa-world { grid-template-columns: 1fr; }
  #nullifier-about .nfa-type-panel { min-height: 347px; padding: 29px 7%; }
  #nullifier-about .nfa-art-type { font-size: clamp(42px, 13vw, 64px); margin: 32px 0; }
  #nullifier-about .nfa-world-copy { padding: 44px 7%; }
  #nullifier-about .nfa-world-copy h2 { font-size: 34px; max-width: 390px; }
  #nullifier-about .nfa-cta { align-items: flex-start; flex-direction: column; gap: 27px; padding-top: 46px; padding-bottom: 47px; }
  #nullifier-about .nfa-cta h2 { font-size: 44px; }
  #nullifier-about .nfa-button { min-height: 56px; }
}
@media (prefers-reduced-motion: reduce) {
  #nullifier-about .nfa-button { transition: none; }
}

/* --- Additions for the live site --------------------------------------- */

/* The theme's link colours and underline sweep stay out. */
#nullifier-about a,
#nullifier-about a:visited {
  color: inherit;
  background-image: none;
}

/* ...except the light "Explore all pieces" button, which keeps dark writing
   once the shop has been visited (a:visited above outranked it). */
#nullifier-about a.nfa-button,
#nullifier-about a.nfa-button:visited {
  color: var(--nf-ink);
}
#nullifier-about a.nfa-button:hover,
#nullifier-about a.nfa-button:focus-visible {
  color: #fff;
}

/* An optional picture behind the hero, set in Appearance → About page. */
#nullifier-about .nfa-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

#nullifier-about .nfa-hero.has-picture::before {
  z-index: 1;
  background: linear-gradient(90deg, rgba(7,7,9,.7), rgba(7,7,9,.25) 70%), rgba(7,7,9,var(--nfa-dim,.55));
}

#nullifier-about .nfa-hero.has-picture .nfa-orbit,
#nullifier-about .nfa-hero.has-picture .nfa-horizon {
  z-index: 1;
}

/* The principles without their numbers, when they are switched off. */
#nullifier-about .nfa-values.no-numbers .nfa-value h3 {
  margin-top: 6px;
}

@media (max-width: 600px) {
  #nullifier-about .nfa-values.no-numbers .nfa-value,
  #nullifier-about .nfa-values.no-numbers .nfa-value + .nfa-value {
    grid-template-columns: 1fr;
  }
  #nullifier-about .nfa-values.no-numbers .nfa-value p {
    grid-column: 1;
  }
}

/* The ring glows gently, like the neon wordmark in the header. */
@keyframes nfa-ring {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.18); }
}

#nullifier-about .nfa-orbit {
  animation: nfa-ring 6s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  #nullifier-about .nfa-orbit { animation: none; }
}

/* "Our story ↓" stays on one line on a phone. */
#nullifier-about .nfa-text-link {
  white-space: nowrap;
}