@layer components.page-short-portrait {
  	[data-c-page-short-portrait] {
  		position: relative;
  		color: var(--color-dark-blue);
  		padding-top: 50px;
  		padding-bottom: 50px;

  		@media screen and (max-width: 767px) {
  			padding-top: 25px;
  			padding-bottom: 25px;
  		}

  		.title {
  			font-size: var(--font-size-base);
  			font-weight: var(--font-weight-extra-bold);
  			line-height: 110%;

  			@media screen and (max-width: 767px) {
  				font-size: var(--font-size-sm);
  				font-weight: var(--font-weight-normal);
  			}
  		}

  		.description {
  			font-size: var(--font-size-4xl);
  			font-weight: var(--font-weight-extra-bold);
  			line-height: 120%;
  			margin: 12px 0 50px 0;

  			@media screen and (max-width: 1399px) {
  				font-size: var(--font-size-3xl);
  			}

  			@media screen and (max-width: 991px) {
  				font-size: var(--font-size-2xl);
  				line-height: 130%;
  			}

  			@media screen and (max-width: 767px) {
  				font-size: var(--font-size-xl);
  				margin: 12px 0 30px 0;
  			}
  		}

  		.blob {
  			position: absolute;
  			top: -200px;
  			right: 0;
  			width: 220px;
  			height: auto;
				user-select: none;

  			@media screen and (max-width: 1399px) {
  				top: -260px;
  				width: 220px;
  			}

  			@media screen and (max-width: 992px) {
  				top: -190px;
  				width: 100px;
  			}
  		}
  	}
  }