/* Shared only by the five commissioned pages. The track represents project
   hours, never a fee breakdown or an automatic percentage discount. */
.ma-model{--ma-ink:#111;--ma-paper:#f5f3ec;--ma-cyan:#2aace3;--ma-magenta:#e51d8f;--ma-yellow:#fed006;background:var(--ma-paper);color:var(--ma-ink);padding-block:60px;border-block:1px solid #cccac1}
.ma-model *{box-sizing:border-box}
.ma-model .ma-inner{display:grid;grid-template-columns:minmax(0,.83fr) minmax(0,1.17fr);column-gap:56px;row-gap:28px;align-items:start}
.ma-model .ma-inner>*{min-width:0}
.ma-model .ma-head{grid-column:1/-1;max-width:950px}
.ma-model .ma-head .eyebrow{font-size:12px;line-height:1.75;font-weight:800;letter-spacing:.04em;margin:0 0 16px;color:#111}
.ma-model .ma-head h2{font:700 clamp(32px,3.7vw,49px)/1.08 var(--display,Arial,sans-serif);letter-spacing:-.05em;text-wrap:balance;margin:0 0 17px;color:#111}
.ma-model .ma-head>p:not(.eyebrow){font-size:17px;line-height:1.8;max-width:820px;margin:0;color:#111}
.ma-model .ma-time-figure{position:relative;margin:0;padding:25px 27px 24px;background:#fff;border:1px solid #111;box-shadow:6px 6px 0 var(--ma-yellow)}
.ma-model .ma-time-figure:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:var(--ma-magenta)}
.ma-model .ma-time-figure>strong{display:block;font:700 clamp(77px,8vw,113px)/1 var(--display,Arial,sans-serif);letter-spacing:-.07em;margin:5px 0 11px;color:#111}
.ma-model .ma-time-figure>figcaption{font-size:15px;line-height:1.75;font-weight:700;margin:0 0 20px;color:#111;max-width:360px}
.ma-model .ma-time-track{width:100%;height:25px;display:flex;overflow:hidden;border:1px solid #111;background:#fff;margin:0 0 21px}
.ma-model .ma-time-volunteer{display:block;flex:0 0 90%;width:90%;height:100%;background:var(--ma-cyan);color:#000}
.ma-model .ma-time-scoped{display:block;flex:0 0 10%;width:10%;height:100%;background:var(--ma-yellow);border-left:2px solid #111;color:#000}
.ma-model .ma-time-key{display:grid;gap:15px;margin:0;padding:0;list-style:none}
.ma-model .ma-time-key>div,.ma-model .ma-time-key>li{position:relative;padding-left:24px;min-width:0}
.ma-model .ma-time-key>div:before,.ma-model .ma-time-key>li:before{content:"";display:block;position:absolute;left:0;top:4px;width:12px;height:12px;border:1px solid #111;background:var(--ma-cyan)}
.ma-model .ma-time-key>div:nth-child(2):before,.ma-model .ma-time-key>li:nth-child(2):before{background:var(--ma-yellow)}
.ma-model .ma-time-key dt,.ma-model .ma-time-key strong{display:block;font-size:13px;line-height:1.75;font-weight:800;margin:0 0 3px;color:#111}
.ma-model .ma-time-key dd,.ma-model .ma-time-key p,.ma-model .ma-time-key span{font-size:12px;line-height:1.8;margin:0;color:#333}
.ma-model .ma-copy{padding-block:2px}
.ma-model .ma-copy h3{font:700 26px/1.2 var(--display,Arial,sans-serif);letter-spacing:-.035em;margin:0 0 18px;color:#111}
.ma-model .ma-copy p{font-size:16px;line-height:1.85;color:#111;margin:0 0 17px;max-width:650px}
.ma-model a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px;overflow-wrap:anywhere}
.ma-model a:focus-visible{outline:3px solid #111;outline-offset:5px}
.ma-model .ma-next{display:inline-flex;align-items:center;justify-content:space-between;gap:20px;min-height:46px;max-width:100%;padding-block:10px;margin-top:3px;border-bottom:1px solid #111;font-size:14px;line-height:1.75;font-weight:800;text-decoration:none;color:#111}
.ma-model .ma-next :is(svg,.ui-icon){display:block;width:20px;height:20px;flex:none}
.ma-model .ma-scope{grid-column:1/-1;padding-top:19px;border-top:1px solid #b7b5ad;font-size:12px;line-height:1.85;color:#333;margin:0}
.ma-model .ma-scope p{font-size:12px;line-height:1.85;color:inherit;margin:0}
@media(max-width:850px){
  .ma-model{padding-block:47px}
  .ma-model .ma-inner{gap:25px 32px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ma-model .ma-time-figure{padding-inline:23px}
  .ma-model .ma-copy p{font-size:15px}
}
@media(max-width:650px){
  .ma-model{padding-block:39px}
  .ma-model .ma-inner{display:grid;grid-template-columns:minmax(0,1fr);row-gap:26px}
  .ma-model .ma-head,.ma-model .ma-scope{grid-column:1}
  .ma-model .ma-head h2{font-size:35px;line-height:1.1}
  .ma-model .ma-head>p:not(.eyebrow){font-size:16px;line-height:1.8}
  .ma-model .ma-time-figure{margin-right:6px;padding:24px 22px 23px}
  .ma-model .ma-time-figure>strong{font-size:83px}
  .ma-model .ma-time-figure>figcaption{font-size:15px;max-width:none}
  .ma-model .ma-copy{padding-top:5px}
  .ma-model .ma-copy h3{font-size:27px}
  .ma-model .ma-copy p{font-size:16px;line-height:1.85}
  .ma-model .ma-scope{padding-top:19px}
}
@media(max-width:360px){
  .ma-model .ma-head h2{font-size:31px}
  .ma-model .ma-time-figure{padding-inline:18px}
  .ma-model .ma-time-figure>strong{font-size:76px}
}