.proposal-card {
  min-width: 0;
  margin-block: 1.15rem;
  padding: .85rem;
  border: 1px solid #caa36b75;
  background: linear-gradient(142deg, #2a251d, #171a16 78%);
  box-shadow: 0 8px 26px #080b086b;
}

.proposal-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem .85rem;
  margin-bottom: .7rem;
}

.proposal-heading {
  color: var(--paper);
  font: 400 clamp(1.12rem, 2.2vw, 1.35rem)/1.2 var(--serif);
}

.proposal-seals,
.proposal-fields,
.proposal-stages {
  margin: 0;
  padding: 0;
  list-style: none;
}

.proposal-seals {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

.proposal-seal {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  color: #ead4a9;
  font-size: .66rem;
  font-weight: 600;
  white-space: nowrap;
}

.proposal-seal::before {
  display: grid;
  width: 1.32rem;
  height: 1.32rem;
  place-items: center;
  border: 1px solid #cfb07c;
  border-radius: 50%;
  background: #5a332b;
  color: #f1dcb3;
  content: attr(data-number) / "";
  font: 700 .6rem/1 var(--serif);
  transform: rotate(-8deg);
}

.proposal-seal:nth-child(2)::before {
  background: #37433b;
  transform: rotate(8deg);
}

.proposal-mock {
  overflow: hidden;
  border: 1px solid #a28051;
  border-radius: .22rem;
  background: #efe2c9;
  color: #2a251c;
}

.proposal-browser {
  display: flex;
  align-items: baseline;
  gap: .7rem;
  padding: .36rem .68rem;
  border-bottom: 1px solid #bca37e;
  background: #e1cda9;
  font-size: .68rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.proposal-browser::before {
  width: .22rem;
  height: .22rem;
  flex: 0 0 .22rem;
  border-radius: 50%;
  margin-right: .5rem;
  background: #723f36;
  box-shadow: .33rem 0 #8e6238, .66rem 0 #585942;
  content: "";
}

.proposal-body {
  padding: .67rem .75rem .75rem;
}

.proposal-title {
  font: 700 1.12rem/1.14 var(--serif);
}

.proposal-detail {
  margin-top: .23rem;
  color: #50432e;
  font-size: .75rem;
  line-height: 1.4;
}

.proposal-label {
  margin-block: .65rem .32rem;
  color: #573b26;
  font-size: .6rem;
  font-weight: 750;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.proposal-schedule {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .35rem;
  margin: 0;
}

.proposal-schedule div,
.proposal-fields li,
.proposal-stages li {
  min-width: 0;
  padding: .29rem .35rem;
  border: 1px solid #bca37e;
  border-radius: .15rem;
  background: #f7edd8;
  font-size: .67rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.proposal-schedule div {
  text-align: center;
}

.proposal-schedule dt {
  color: #584a34;
}

.proposal-schedule dd {
  margin: .15rem 0 0;
  color: #4f3026;
  font-weight: 750;
}

.proposal-fields,
.proposal-stages {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
}

.proposal-fields li,
.proposal-stages li {
  display: flex;
  align-items: center;
  gap: .32rem;
}

.proposal-fields li::before,
.proposal-stages li::before {
  width: .33rem;
  height: .33rem;
  flex: 0 0 .33rem;
  border: 1px solid #825942;
  content: "";
}

.proposal-stages li::before {
  transform: rotate(45deg) scale(.8);
}

@media (max-width: 360px) {
  .proposal-card {
    padding: .55rem;
  }

  .proposal-body {
    padding-inline: .55rem;
  }
}