/* ==========================================================================
   Mashman Investments: per-property values on the shared MASHMAN design
   system (site.css is byte-identical to mashmancg.com's; do not edit it here).
   Mark: the M/I monogram, 685 x 520. No icon exists.
   Signature: STAKE to STANDING, the thesis. Capital buys a stake;
   positioning turns that stake into standing.
   ========================================================================== */

.brand-icon{height:22px; aspect-ratio:685/520;}
.footer-brand-mark .brand-icon{height:20px; aspect-ratio:685/520;}
.hero-mark,.page-mark,.cta-mark{aspect-ratio:685/520;}
.hero-mark{width:min(48vw, 600px); opacity:0.055;}
.page-mark{width:min(38vw, 400px); opacity:0.06;}
.cta-mark{opacity:0.035;}

/* The monogram carries no lettering, so the name stays beside it. */
.brand-name{color:var(--white); font-size:10.5px; letter-spacing:0.22em;}
@media (min-width:1101px){
  .brand-div{display:block;}
  .brand-name{display:inline;}
}
@media (max-width:620px){
  .brand-div{display:block;}
  .brand-name{display:inline; font-size:9.5px;}
}

/* The thesis line sits over the section it opens */
.signature-lg + .sr-only + .split{margin-top:0;}

/* Watermarks sit wholly inside the frame at every width: the mark is never
   cropped by the edge of the section. object-fit keeps its proportions when
   a short section caps its height. */
.hero-mark,.page-mark,.cta-mark{object-fit:contain;}
.hero-mark{right:var(--gutter); transform:translateY(-50%); max-height:calc(100% - 190px); object-position:right center;}
.page-mark{right:var(--gutter); top:calc(50% + 38px); transform:translateY(-50%); max-height:calc(100% - 140px); object-position:right center;}
.cta-mark{left:var(--gutter); max-height:calc(100% - 90px); object-position:left center;}
@media (max-width:1024px){ .hero-mark{width:60vw;} }
@media (max-width:880px){
  .page-mark{width:46vw;}
  .cta-mark{width:50vw;}
}