.vtmn-card{
  font-family:'Roboto', 'system-ui', '-apple-system', sans-serif;
  font-weight:400;
  max-inline-size:100%;
  min-inline-size:-moz-min-content;
  min-inline-size:min-content;
  border-radius:8px;
  box-shadow:0 0.375rem 0.375rem 0 hsla(200, 100%, 24.5%, 0.1);
  position:relative;
  display:flex;
  flex-direction:column;
  block-size:-moz-fit-content;
  block-size:fit-content;
  background-color:hsl(0, 0%, 100%);
}

.vtmn-card_content{
  margin:1rem;
  display:flex;
  flex-direction:column;
  color:hsl(200, 100%, 4.7%);
}

.vtmn-card_content
  > *:not(.vtmn-card_content--title,
.vtmn-card_content--body){
  -webkit-margin-before:0.75rem;
          margin-block-start:0.75rem;
}

.vtmn-card_content--title{
  all:unset;
  font-size:1.25rem;
  font-weight:700;
}

@media screen and (min-width: 1800px){

  .vtmn-card_content--title{
  font-size:1.25rem;
  }
}

@media screen and (min-width: 1200px) and (max-width: 1799px){

  .vtmn-card_content--title{
  font-size:1.25rem;
  }
}

@media screen and (min-width: 900px) and (max-width: 1199px){

  .vtmn-card_content--title{
  font-size:1.25rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 899px){

  .vtmn-card_content--title{
  font-size:1.25rem;
  }
}

.vtmn-card_content--body{
  font-size:0.875rem;
}

.vtmn-card_variant--top-image{
  display:flex;
  flex-direction:column;
  block-size:-moz-fit-content;
  block-size:fit-content;
  background-color:hsl(0, 0%, 100%);
}

.vtmn-card > .vtmn-card_image{
  inline-size:auto;
  block-size:100%;
  margin:1rem;
  position:relative;
}

.vtmn-card_variant--top-image > .vtmn-card_image{
  inline-size:auto;
  block-size:100%;
  margin:1rem;
  position:relative;
}

.vtmn-card_image img{
  max-width:100%;
  height:auto;
  display:block;
  vertical-align:middle;
}

.vtmn-card > .vtmn-card_image--full,
.vtmn-card_variant--top-image > .vtmn-card_image--full{
  inline-size:-moz-fit-content;
  inline-size:fit-content;
  block-size:100%;
  margin:0;
}

.vtmn-card > .vtmn-card_image--full > img{
  border-radius:8px 8px 0 0;
}

.vtmn-card_variant--top-image > .vtmn-card_image--full > img{
  border-radius:8px 8px 0 0;
}

.vtmn-card img,
.vtmn-card_variant--top-image img{
  inline-size:100%;
  aspect-ratio:1 / 1;
}

.vtmn-card_variant--top-image .vtmn-tag{
  position:absolute;
  inset-block-start:1rem;
  inset-inline-start:1rem;
}

.vtmn-card_variant--full-image .vtmn-tag{
  position:absolute;
  inset-block-start:1rem;
  inset-inline-start:1rem;
}

.vtmn-card_image--full > img{
  aspect-ratio:auto;
}

.vtmn-card_variant--side-image{
  display:flex;
  block-size:-moz-min-content;
  block-size:min-content;
  flex-direction:row;
  background-color:hsl(0, 0%, 100%);
}

.vtmn-card_variant--side-image > .vtmn-card_content{
  -webkit-margin-start:0;
          margin-inline-start:0;
  inline-size:67%;
}

.vtmn-card_variant--side-image > .vtmn-card_image{
  inline-size:33%;
  block-size:-moz-max-content;
  block-size:max-content;
  margin:1rem;
}

.vtmn-card_variant--side-image img{
  block-size:100%;
}

.vtmn-card_variant--side-image .vtmn-btn{
  inline-size:-moz-fit-content;
  inline-size:fit-content;
}

.vtmn-card_variant--full-image > .vtmn-card_image{
  inline-size:100%;
  block-size:100%;
  margin:0;
}

.vtmn-card_variant--full-image img{
  block-size:100%;
  border-radius:8px;
}

.vtmn-card_variant--full-image > .vtmn-card_content{
  position:absolute;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  margin:0;
  inset-block-start:0;
  inset-inline-start:0;
  inset-inline-end:0;
  inset-block-end:0;
  padding:1rem;
  block-size:auto;
  border-radius:8px;
  color:hsl(0, 0%, 100%);
}

.vtmn-card_variant--full-image
  > .vtmn-card_content:not(.vtmn-card_content--opaque){
  background:linear-gradient(
    180deg,
    hsla(200, 100%, 4.7%, 0),
    hsl(200, 100%, 4.7%)
  );
}

.vtmn-card_variant--full-image > .vtmn-card_content.vtmn-card_content--opaque{
  background-color:hsl(
    200
      100%
      4.7% / 60%
  );
}