body { background: var(--bg-deepest); }

.mhero {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(100px, 15vh, 140px) 0 clamp(40px, 8vh, 80px);
  position: relative;
  overflow: hidden;
  text-align: center;
}
.mhero__title {
  font-family: var(--font-display);
  font-size: clamp(40px, 6vw, 88px);
  line-height: 1.1;
  font-weight: var(--headline-weight);
  letter-spacing: -0.025em;
  max-width: 18ch;
  margin: 0 auto 32px;
  text-wrap: balance;
}
.mhero__sub { color: var(--text-muted); font-size: clamp(16px, 1.3vw, 19px); max-width: 50ch; margin: 0 auto 32px; line-height: 1.7; }
.mhero__actions { margin-bottom: 80px; }
.mhero__candles { display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; margin: 0 auto; max-width: 700px; }
.mh-candle { display: flex; flex-direction: column; align-items: center; opacity: 0; animation: candleAppear 1.6s var(--ease-out) forwards; }
.mh-candle:nth-child(1) { animation-delay: 600ms; }
.mh-candle:nth-child(2) { animation-delay: 1100ms; }
.mh-candle:nth-child(3) { animation-delay: 1600ms; }
.mh-candle:nth-child(4) { animation-delay: 2100ms; }
.mh-candle:nth-child(5) { animation-delay: 2600ms; }
@keyframes candleAppear { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.mh-candle__flame {
  width: 14px;
  height: 22px;
  background: radial-gradient(ellipse at center bottom, var(--candle-halo) 0%, var(--accent) 50%, transparent 75%);
  border-radius: 50% 50% 30% 30% / 60% 60% 40% 40%;
  transform-origin: 50% 100%;
  animation: flicker 2.4s ease-in-out infinite;
  filter: drop-shadow(0 0 12px var(--tone-gold-60));
}
.mh-candle:nth-child(2n) .mh-candle__flame { animation-delay: -0.6s; animation-duration: 2.8s; }
.mh-candle:nth-child(3n) .mh-candle__flame { animation-delay: -1.2s; animation-duration: 3.1s; }
.mh-candle__body { width: 8px; height: 60px; background: linear-gradient(180deg, var(--candle-shaft-top), var(--candle-shaft-bot)); margin-top: 6px; box-shadow: inset -2px 0 4px var(--inset-deep); }
@keyframes flicker {
  0%, 100% { transform: scale(1) rotate(-2deg); opacity: 1; }
  25% { transform: scale(0.95) rotate(2deg); opacity: 0.92; }
  50% { transform: scale(1.05) rotate(-1deg); opacity: 1; }
  75% { transform: scale(0.97) rotate(3deg); opacity: 0.94; }
}

.wall { padding: var(--section-y) 0; background: var(--bg-primary); }
.wall__head { text-align: center; margin-bottom: 80px; max-width: 720px; margin-left: auto; margin-right: auto; }
.wall__head .eyebrow { display: block; margin-bottom: 20px; }
.wall__head h2 { font-size: clamp(36px, 4.5vw, 60px); margin-bottom: 20px; }
.wall__head p { color: var(--text-muted); font-size: 16px; line-height: 1.7; max-width: 56ch; margin: 0 auto; }

.wall__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 14px; }
@media (max-width: 1100px) { .wall__grid { grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 720px)  { .wall__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px)  { .wall__grid { grid-template-columns: repeat(2, 1fr); } }

.wall__expand-wrap { position: relative; max-height: 860px; overflow: hidden; transition: max-height 1.5s var(--ease-in-out); }
@media (max-width: 1100px) { .wall__expand-wrap { max-height: 1080px; } }
@media (max-width: 720px)  { .wall__expand-wrap { max-height: 620px; } }
@media (max-width: 480px)  { .wall__expand-wrap { max-height: 880px; } }
.wall__expand-wrap.is-expanded { max-height: 30000px; }
.wall__fade { position: absolute; bottom: 0; left: 0; right: 0; height: 300px; background: linear-gradient(180deg, transparent, var(--bg-primary) 90%); pointer-events: none; transition: opacity 0.6s; }
.wall__expand-wrap.is-expanded .wall__fade { opacity: 0; }


.vc {
  aspect-ratio: 3/4;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  position: relative;
  perspective: 800px;
  cursor: pointer;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out), border-color var(--t-fast);
  overflow: hidden;
}
.vc.is-in { opacity: 1; transform: translateY(0); }
.vc:hover { border-color: var(--border-strong); }
.vc__inner { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform 700ms var(--ease-out); }
.vc.is-flipped .vc__inner { transform: rotateY(180deg); }
.vc__face {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  padding: 14px 12px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  min-height: 0;
  box-sizing: border-box;
}
.vc__face--back {
  transform: rotateY(180deg);
  background: var(--bg-elevated);
  padding: 16px 14px;
}
.vc__sil { flex: 1; display: grid; place-items: center; color: var(--text-faint); opacity: 0.55; }
.vc__sil svg { width: 60%; height: auto; max-width: 70px; }

.vc.has-photo .vc__face--front { padding: 0; }

.vc__face--front > div:last-child:not(.vc__sil) {
  min-width: 0;
}
.vc.has-photo .vc__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  background: var(--bg-card);
}
.vc.has-photo .vc__media .vc__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}
.vc.has-photo .vc__front-meta {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  min-width: 0;
  max-width: 100%;
  padding: 12px 12px 14px;
  box-sizing: border-box;
  background: linear-gradient(180deg, transparent 0%, rgb(0 0 0 / 0.78) 65%, rgb(0 0 0 / 0.9) 100%);
  overflow: hidden;
}
.vc.has-photo .vc__name {
  color: #fff;
  text-shadow: 0 1px 2px rgb(0 0 0 / 0.5);
}
.vc.has-photo .vc__age {
  color: var(--accent);
  text-shadow: 0 1px 3px rgb(0 0 0 / 0.65);
}
.vc__name {
  font-family: var(--font-display);
  font-size: 12.5px;
  font-weight: 500;
  color: var(--text-primary);
  line-height: 1.2;
  letter-spacing: -0.01em;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.vc__age {
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--accent);
  margin-top: 4px;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.vc__age--hint {
  margin-top: auto;
  flex-shrink: 0;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.vc__bio {
  font-size: 11.5px;
  color: var(--text-muted);
  line-height: 1.5;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 10;
}
.vc__bio-name {
  font-family: var(--font-display);
  font-size: 13px;
  color: var(--text-primary);
  margin-bottom: 6px;
  flex-shrink: 0;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: break-word;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.vc.is-lit { border-color: var(--accent); }
.vc.is-lit .vc__face--front::before {
  content: '';
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 4;
  width: 6px;
  height: 6px;
  background: var(--accent);
  border-radius: 50%;
  box-shadow: 0 0 8px var(--accent);
}


.lac { background: var(--bg-deepest); padding: var(--section-y) 0; text-align: center; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); }
.lac__count { font-family: var(--font-display); font-size: clamp(80px, 12vw, 160px); line-height: 1; font-weight: 600; color: var(--accent); letter-spacing: -0.04em; margin-bottom: 16px; }
.lac__label { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 48px; }
.lac__hint { color: var(--text-muted); font-size: 16px; max-width: 50ch; margin: 0 auto; line-height: 1.7; }


.mwall { padding: var(--section-y) 0; }
.mwall__hc-wrap {
  grid-column: 1 / -1;
  margin: 4px 0 0;
  min-width: 0;
}
.mwall__hc-field-error { display: block; margin-top: 6px; }
.mwall__hc { margin-top: 4px; }

.mwall__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px 24px;
  width: 100%;
  max-width: min(720px, 100%);
  margin: 0 auto 80px;
  padding: 48px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-top: 2px solid var(--accent);
  box-sizing: border-box;
}

.mwall__form > .field {
  min-width: 0;
}
.mwall__form .field input,
.mwall__form .field textarea,
.mwall__form .field select {
  width: 100%;
  max-width: 100%;
}
.mwall__hc-wrap .minabhc__simple,
.mwall__hc-wrap .minabhc__card {
  min-width: 0;
  max-width: 100%;
}
.mwall__hc-wrap .minabhc__field-col {
  min-width: 0;
}
.mwall__hc-wrap .minabhc__image-wrap {
  width: min(180px, 100%);
  max-width: 100%;
  flex-shrink: 1;
}
@media (max-width: 720px) {
  .mwall__form {
    grid-template-columns: 1fr;
    padding: clamp(18px, 4vw, 28px);
    gap: clamp(20px, 4vw, 28px);
  }
}
@media (max-width: 480px) {
  .mwall__form .field input,
  .mwall__form .field textarea,
  .mwall__form .field select {
    padding: 12px 14px;
  }
  .mwall__form-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .mwall__form-actions .btn {
    width: 100%;
    justify-content: center;
  }
}
.mwall__form .field--full { grid-column: 1 / -1; }
.mwall__hp {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  width: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  border: 0;
  white-space: nowrap;
  position: absolute;
}
.mwall__form-feedback {
  grid-column: 1 / -1;
  margin: -8px 0 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--accent);
}
.mwall__form-feedback.is-error { color: var(--accent-red); }
.mwall__form-actions { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 8px; }
.mwall__counter { font-family: var(--font-mono); font-size: 11px; color: var(--text-faint); letter-spacing: 0.1em; }
.mwall__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
@media (max-width: 880px) { .mwall__list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .mwall__list { grid-template-columns: 1fr; } }
.mwall-card { background: var(--bg-card); border: 1px solid var(--border-soft); border-left: 2px solid var(--accent); padding: 24px; display: flex; flex-direction: column; gap: 14px; }
.mwall-card__msg { font-size: 14.5px; line-height: 1.6; color: var(--text-primary); }
.mwall-card__attr { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-faint); display: flex; justify-content: space-between; gap: 16px; padding-top: 14px; border-top: 1px solid var(--border-soft); }
.mwall-card__attr strong { color: var(--accent); font-weight: 500; }

.mwall__expand-wrap { position: relative; max-height: 720px; overflow: hidden; transition: max-height 1.5s var(--ease-in-out); }
@media (max-width: 880px) { .mwall__expand-wrap { max-height: 640px; } }
@media (max-width: 560px) { .mwall__expand-wrap { max-height: 460px; } }
.mwall__expand-wrap.is-expanded { max-height: 30000px; }
.mwall__expand-wrap.is-expanded .wall__fade { opacity: 0; }