.p-about-hero {
  display: grid;
  grid-template-columns: var(--space-28) minmax(var(--space-0), 1fr);
  column-gap: var(--space-20);
  align-items: stretch;
}
.p-about-hero::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  background: url("../images/about/about-welcome.svg") no-repeat left center/contain;
}

.p-about-hero__inner {
  display: grid;
  grid-template-columns: minmax(var(--space-0), 1fr);
  grid-column: 2;
  grid-row: 1;
  min-inline-size: var(--space-0);
}

.p-about-hero__visual {
  min-inline-size: var(--space-0);
  margin: var(--space-0) calc(var(--layout-page-gutter) * -1) var(--layout-section-padding-inner-large) var(--space-0);
  aspect-ratio: 16/9;
}

.p-about-hero__lead {
  min-inline-size: var(--space-0);
  margin: var(--space-0);
}
.p-about-hero__lead p {
  margin: var(--space-0);
}

.p-about-facility {
  display: grid;
}

.p-about-facility__intro,
.p-about-facility__name,
.p-about-facility__logo,
.p-about-facility__facts {
  min-inline-size: var(--space-0);
}

.p-about-facility__intro,
.p-about-facility__name,
.p-about-facility__logo {
  --section-padding-block-end: var(--layout-section-padding-heading-5);
}

.p-about-facility__intro {
  display: grid;
  gap: var(--layout-section-padding-inner-small);
}

.p-about-facility__title {
  margin-block-end: var(--component-heading-3-margin-block-end);
}

.p-about-facility__title--lucua {
  color: var(--semantic-brand-lucua);
}

.p-about-facility__title--lucua-1100 {
  color: var(--semantic-brand-lucua-1100);
}

.p-about-facility__title--lucua-south {
  color: var(--semantic-brand-lucua-south);
}

.p-about-facility__intro > p,
.p-about-facility__name > p {
  margin: var(--space-0);
}

.p-about-facility__name {
  display: grid;
}

.p-about-facility__logo {
  display: grid;
  gap: var(--layout-section-padding-inner-small);
}

.p-about-facility__subheading {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--letter-spacing-default);
  line-height: var(--line-height-narrow);
  padding-block-end: calc(var(--component-heading-4-margin-block-end) - var(--space-1));
  border-block-end: var(--space-1) solid var(--semantic-border-tertiary);
  margin: var(--space-0);
}

@media (max-width: 767px) {
  .p-about-facility__name > .p-about-facility__subheading,
  .p-about-facility__logo > .p-about-facility__subheading {
    border-block-end: none;
  }
}
.p-about-facilities__heading {
  display: none;
}

.p-about-facility__logo-figure {
  display: grid;
  justify-items: center;
  gap: var(--layout-section-padding-inner-small);
  margin: var(--space-0);
}
.p-about-facility__logo-figure::before {
  content: "";
  inline-size: calc(var(--space-128) + var(--space-16));
  block-size: calc(var(--space-64) + var(--space-8));
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.p-about-facility__logo-figure--lucua::before {
  background-image: url("../images/about/about-logo-lucua.svg");
}

.p-about-facility__logo-figure--lucua-1100::before {
  background-image: url("../images/about/about-logo-lucua-1100.svg");
}

.p-about-facility__logo-figure--lucua-south::before {
  background-image: url("../images/about/about-logo-lucua-south.svg");
}

.p-about-facility__logo-figure figcaption {
  justify-self: stretch;
}

.p-about-facilities {
  --section-padding-block-end: var(--space-64);
}

.p-about-facilities__footer {
  margin-block-start: var(--space-0);
}

.p-about-facilities__footer .c-button {
  inline-size: var(--ratio-full);
  max-inline-size: var(--layout-desktop-column-width);
}

.p-about-guide {
  margin-inline: calc(var(--layout-page-gutter) * -1);
  padding-block-start: var(--space-64);
  padding-inline: var(--layout-page-gutter);
  background: var(--semantic-background-section);
}

.p-about-guide__inner {
  display: grid;
  gap: var(--layout-section-padding-inner-large);
  max-inline-size: var(--layout-content-narrow-width);
  margin-inline: auto;
}

.p-about-guide__header > p,
.p-about-guide__closing {
  margin: var(--space-0);
}

.p-about-guide__list {
  display: grid;
  gap: var(--space-32);
  padding: var(--space-0);
  margin: var(--space-0);
  list-style: none;
}

.p-about-guide__item {
  display: grid;
  grid-template-columns: var(--space-40) minmax(var(--space-0), 1fr);
  gap: var(--space-0) var(--space-16);
  align-items: start;
}
.p-about-guide__item::before {
  content: "";
  grid-row: 1/-1;
  inline-size: var(--space-40);
  block-size: var(--space-40);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.p-about-guide__item p {
  grid-column: 2;
  margin: var(--space-0);
}

.p-about-guide__item--movie::before {
  background-image: url("../images/about/about-icon-movie.svg");
}

.p-about-guide__item--smoke::before {
  background-image: url("../images/about/about-icon-smoke.svg");
}

.p-about-guide__item--trash::before {
  background-image: url("../images/about/about-icon-trash.svg");
}

.p-about-guide__item--food-and-drink::before {
  background-image: url("../images/about/about-icon-food-and-drink.svg");
}

.p-about-guide__item--electric-suitcase::before {
  background-image: url("../images/about/about-icon-electric-suitcase.svg");
}

.p-about-guide__item--dog::before {
  background-image: url("../images/about/about-icon-dog.svg");
}

.p-about-guide__item--escalator::before {
  background-image: url("../images/about/about-icon-escalator.svg");
}

.p-about-guide__item--elevator::before {
  background-image: url("../images/about/about-icon-elevator.svg");
}

.p-about-nonresidents {
  padding-block-start: var(--space-64);
}

.p-about-nonresidents__body,
.p-about-nonresidents__group {
  display: grid;
}

.p-about-nonresidents__body {
  gap: var(--layout-section-padding-inner-small);
}

.p-about-nonresidents__group {
  gap: var(--space-16);
}

.p-about-nonresidents__group > p {
  margin: var(--space-0);
}

@media (max-width: 767px) {
  .p-about-facility__title {
    padding-block-end: var(--space-16);
    border-block-end: var(--space-2) solid currentcolor;
    margin-block-end: var(--space-0);
  }
  .p-about-facility--lucua-south .p-about-facility__name > p {
    min-block-size: calc(var(--space-128) + var(--space-64));
  }
}
@media (min-width: 768px) {
  .p-about-hero {
    grid-template-columns: repeat(12, minmax(var(--space-0), 1fr));
    column-gap: var(--layout-grid-gutter);
  }
  .p-about-hero__inner {
    grid-column: 2/-1;
    padding-block-end: var(--space-80);
  }
  .p-about-hero__visual {
    margin-inline-end: var(--space-0);
  }
  .p-about-hero__lead {
    padding-inline-end: var(--space-0);
  }
  .p-about-facilities {
    --section-padding-block-end: var(--layout-section-padding-heading-2);
    display: grid;
    grid-template-columns: repeat(3, minmax(var(--space-0), 1fr));
    column-gap: var(--layout-grid-gutter);
  }
  .p-about-facility {
    display: contents;
  }
  .p-about-facility--lucua .p-about-facility__intro,
  .p-about-facility--lucua .p-about-facility__name > p,
  .p-about-facility--lucua .p-about-facility__logo-figure,
  .p-about-facility--lucua .p-about-facility__facts > .c-table {
    grid-column: 1;
  }
  .p-about-facility--lucua-1100 .p-about-facility__intro,
  .p-about-facility--lucua-1100 .p-about-facility__name > p,
  .p-about-facility--lucua-1100 .p-about-facility__logo-figure,
  .p-about-facility--lucua-1100 .p-about-facility__facts > .c-table {
    grid-column: 2;
  }
  .p-about-facility--lucua-south .p-about-facility__intro,
  .p-about-facility--lucua-south .p-about-facility__name > p,
  .p-about-facility--lucua-south .p-about-facility__logo-figure,
  .p-about-facility--lucua-south .p-about-facility__facts > .c-table {
    grid-column: 3;
  }
  .p-about-facility__intro {
    --section-padding-block-end: var(--layout-section-padding-heading-4);
    grid-row: 1;
    gap: var(--space-0);
  }
  .p-about-facility__name,
  .p-about-facility__logo,
  .p-about-facility__facts {
    display: contents;
  }
  .p-about-facilities__heading {
    font-size: var(--font-size-20);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--letter-spacing-default);
    line-height: var(--line-height-narrow);
    display: block;
    grid-column: 1/-1;
    padding-block-end: calc(var(--component-heading-4-margin-block-end) - var(--space-1));
    border-block-end: var(--space-1) solid var(--semantic-border-tertiary);
    margin: var(--space-0) var(--space-0) var(--space-16);
  }
  .p-about-facility__subheading {
    display: none;
  }
  .p-about-facilities__heading--name {
    grid-row: 2;
  }
  .p-about-facilities__heading--logo {
    grid-row: 4;
  }
  .p-about-facilities__heading--facts {
    grid-row: 6;
  }
  .p-about-facility__name > p {
    grid-row: 3;
    padding-block-end: var(--layout-section-padding-heading-4);
  }
  .p-about-facility__logo-figure {
    grid-row: 5;
    padding-block: var(--layout-section-padding-inner-small) var(--layout-section-padding-heading-4);
  }
  .p-about-facility__facts > .c-table {
    grid-row: 7;
  }
  .p-about-facility__logo-figure::before {
    inline-size: calc(var(--space-128) + var(--space-48));
    block-size: var(--space-80);
  }
  .p-about-facilities__footer {
    display: grid;
    justify-items: center;
    grid-column: 1/-1;
    grid-row: 8;
    margin-block-start: var(--layout-section-padding-heading-3);
  }
  .p-about-guide {
    padding-block-start: var(--space-80);
  }
  .p-about-guide__item {
    grid-template-columns: var(--space-48) minmax(var(--space-0), 1fr);
  }
  .p-about-guide__item::before {
    inline-size: var(--space-48);
    block-size: var(--space-48);
  }
  .p-about-guide__item > p {
    align-self: center;
  }
  .p-about-nonresidents {
    padding-block-start: var(--space-80);
  }
}