/* Mafold skin over the wabi hero mechanics.
 *
 * Loaded after wabi.css so it wins on equal specificity. Everything here is
 * additive — the animation engine and layout atoms are untouched.
 */

@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/landing/fonts/InstrumentSerif-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/landing/fonts/InstrumentSerif-latinext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
                 U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ── the ground: cream + four corner blooms, lifted from the Mafold landing page ── */
:root { --wabi-viewport-bg: #FBF6EF; }

main[data-viewport-bg] { background-color: #FBF6EF; }

main[data-viewport-bg]::before {
  content: "";
  position: fixed;
  inset: -18%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(42% 38% at 12%  8%, rgba(245, 168,  60, .50) 0%, rgba(245, 168,  60, 0) 70%),
    radial-gradient(44% 40% at 90%  6%, rgba(247, 168, 200, .48) 0%, rgba(247, 168, 200, 0) 70%),
    radial-gradient(46% 42% at 88% 92%, rgba( 85, 214,  75, .34) 0%, rgba( 85, 214,  75, 0) 70%),
    radial-gradient(44% 40% at  8% 88%, rgba(243, 169, 135, .46) 0%, rgba(243, 169, 135, 0) 70%);
}
main[data-viewport-bg] > div { position: relative; z-index: 1; }

/* ── display type: Instrument Serif (licensed, already in the Mafold stack) ── */
[data-headline] {
  font-family: 'Instrument Serif', serif !important;
  font-weight: 400;
  line-height: 1.0;
  letter-spacing: -0.005em;
}

/* ── the lockup ── */
.mafold-lockup { display: inline-flex; align-items: end; gap: 13px; }
.mafold-lockup img {
  width: 48px;
  height: 48px;
  display: block;
  border-radius: 22%;                     /* clips the icon file's grey corner plate */
  box-shadow: 0 1px 3px rgba(0, 0, 0, .10);
}
.mafold-lockup span {
  font-family: 'Instrument Serif', serif;
  font-size: 40px;
  font-weight: 400;
  line-height: 1;
  color: #16181A;
  position: relative;
  top: -2px;
}

/* the token chips that replaced the facepile */
[data-ps-avatar] img { object-fit: contain; background: #F7F4EC; }

/* Real Mafold app captures replace the snapshotted wabi home screens. Keep the
 * complete 402×874 capture visible inside the slightly shorter 402×834 card;
 * the matching canvas colour makes the narrow side gutters disappear. */
.mafold-showcase {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: rgb(240, 240, 243);
  pointer-events: none;
  user-select: none;
}

@media (max-width: 1024px) {
  .mafold-lockup img { width: 32px; height: 32px; }
  .mafold-lockup span { font-size: 28px; }
  .mafold-lockup { gap: 10px; }
}