:root {
  --ink: #171764;
  --deep: #10114b;
  --ivory: #fbfbff;
  --paper: #ffffff;
  --violet: #7f00e7;
  --aqua: #08a8ca;
  --green: #25b96e;
  --gold: #f0ad16;
  --teal: #064a52;
  --mist: #eef4ff;
  --line: rgba(23, 23, 100, .16);
  --serif: "EB Garamond", Garamond, Georgia, serif;
  --sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.brand { gap: .72rem; }
.brand-logo {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: 50%;
}
.brand-wordmark {
  position: relative;
  display: block;
  width: 158px;
  height: 52px;
  overflow: hidden;
}
.brand-wordmark img {
  position: absolute;
  width: 158px;
  height: auto;
  max-width: none;
  top: -41px;
  left: 0;
}

.hero-image img {
  filter: saturate(.9) contrast(.98);
  object-position: center 22%;
}
.hero-image::after,
.about-image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at 50% 48%, rgba(127, 0, 231, .1), transparent 42%),
              radial-gradient(ellipse at 52% 50%, rgba(8, 168, 202, .06), transparent 66%);
  mix-blend-mode: soft-light;
  z-index: 1;
}
.hero-image .photo-brand-mark,
.about-image .photo-brand-mark,
.akashic-photo .photo-brand-mark {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: clamp(82px, 14vw, 150px);
  height: clamp(82px, 14vw, 150px);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 50%;
  filter: none;
  opacity: .09;
  mix-blend-mode: multiply;
  pointer-events: none;
}
.hero-image .photo-brand-mark { top: 53%; }
.about-image .photo-brand-mark { top: 47%; }
.image-note { z-index: 3; }

.akashic-band { grid-template-columns: .92fr 1.08fr; }
.akashic-photo { position: relative; }
.akashic-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: radial-gradient(circle at 50% 50%, rgba(127, 0, 231, .08), transparent 58%);
  mix-blend-mode: soft-light;
}
.akashic-photo img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  display: block;
  border-radius: 52% 48% 45% 55% / 45% 58% 42% 55%;
  filter: saturate(.9);
}

.about-image img { object-position: center 20%; }
.cta { background: linear-gradient(135deg, var(--deep), var(--violet)); }
.cta-mark { display: none; }

.footer-brand { display: flex; align-items: center; gap: .8rem; }
.footer-brand .footer-primary-logo {
  width: min(190px, 100%);
  height: auto;
  object-fit: contain;
  border-radius: 18px;
}

@media (max-width: 900px) {
  .akashic-band { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .brand-logo { width: 42px; height: 42px; }
  .brand-wordmark { width: 128px; height: 45px; }
  .brand-wordmark img { width: 128px; top: -33px; }
}