/* Corrected brand asset treatment: transparent lockups on dark surfaces. */
.brand { width: min(330px, 42vw); }
.brand img { width: 100%; max-height: 62px; object-fit: contain; object-position: left center; }

.monogram {
  position: relative;
  min-height: 390px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(145deg, #fff, #f1f4ed);
  box-shadow: var(--shadow);
}
.monogram::before { content: ""; position: absolute; inset: 28px; border: 1px solid rgba(11,29,58,.08); border-radius: 4px; }
.monogram::after { display: none; }
.mark-ring { position: absolute; width: 280px; height: 280px; border: 1px solid rgba(123,170,40,.25); border-radius: 50%; }
.mark-ring::after { content: ""; position: absolute; inset: 18px; border: 1px solid rgba(11,29,58,.07); border-radius: 50%; }
.monogram img { position: relative; z-index: 1; width: min(310px, 70%); filter: drop-shadow(0 16px 18px rgba(11,29,58,.12)); }

.footer-main img { width: min(340px, 46vw); max-height: 90px; object-fit: contain; object-position: left center; }

@media (max-width: 560px) {
  .brand { width: 230px; }
  .monogram { min-height: 300px; }
  .mark-ring { width: 230px; height: 230px; }
  .footer-main img { width: min(300px, 82vw); }
}