.page-about { display: block; }
.about-hero {
  position: relative;
  height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
@media (max-width: 768px) {
  .about-hero { height: 500px; }
}
.about-hero__background { position: absolute; inset: 0; z-index: 1; }
.about-hero__background::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.5) 100%);
  z-index: 2;
}
.about-hero__background img { width: 100%; height: 100%; object-fit: cover; }
.about-hero__content {
  position: relative;
  z-index: 3;
  text-align: center;
  color: var(--color-white);
  max-width: 800px;
  padding: 0 var(--space-lg);
}
.about-hero__subtitle {
  font-size: var(--font-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin: 0 0 var(--space-md);
  opacity: 0.9;
}
.about-hero__title { font-size: var(--font-5xl); font-weight: var(--font-weight-bold); line-height: var(--line-height-tight); margin: 0 0 var(--space-lg); }
@media (max-width: 768px) {
  .about-hero__title { font-size: var(--font-4xl); }
}
.about-hero__description { font-size: var(--font-lg); line-height: var(--line-height-relaxed); margin: 0; opacity: 0.95; }
.about-mission { background: var(--color-white); }
.about-mission__wrap { max-width: 900px; margin: 0 auto; text-align: center; }
.about-mission__title { font-size: var(--font-3xl); font-weight: var(--font-weight-bold); color: var(--color-gray-dark); margin: 0 0 var(--space-xl); }
@media (max-width: 768px) {
  .about-mission__title { font-size: var(--font-2xl); }
}
.about-mission__description { font-size: var(--font-lg); line-height: var(--line-height-relaxed); color: var(--color-gray); }
.about-features__wrap { display: flex; flex-direction: column; gap: var(--space-5xl); }
.about-features__item { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4xl); align-items: center; }
@media (max-width: 1024px) {
  .about-features__item { grid-template-columns: 1fr; gap: var(--space-2xl); }
}
.about-features__item--reverse .about-features__item-image { order: 2; }
@media (max-width: 1024px) {
  .about-features__item--reverse .about-features__item-image { order: 1; }
}
.about-features__item--reverse .about-features__item-content { order: 1; }
@media (max-width: 1024px) {
  .about-features__item--reverse .about-features__item-content { order: 2; }
}
.about-features__item-image { position: relative; overflow: hidden; border-radius: var(--radius-lg); aspect-ratio: 3/2; }
.about-features__item-image img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.about-features__item-image:hover img { transform: scale(1.05); }
.about-features__item-content { padding: var(--space-xl); }
@media (max-width: 1024px) {
  .about-features__item-content { padding: 0; }
}
.about-features__item-title { font-size: var(--font-2xl); font-weight: var(--font-weight-bold); color: var(--color-gray-dark); margin: 0 0 var(--space-lg); }
@media (max-width: 768px) {
  .about-features__item-title { font-size: var(--font-xl); }
}
.about-features__item-description { font-size: var(--font-base); line-height: var(--line-height-relaxed); color: var(--color-gray); }
.about-features__item-description p { margin-bottom: var(--space-md); }
.about-features__item-description p:last-child { margin-bottom: 0; }
.about-story { background: var(--color-gray-light); }
.about-story__wrap { max-width: 900px; margin: 0 auto; text-align: center; }
.about-story__title { font-size: var(--font-3xl); font-weight: var(--font-weight-bold); color: var(--color-gray-dark); margin: 0 0 var(--space-2xl); }
@media (max-width: 768px) {
  .about-story__title { font-size: var(--font-2xl); }
}
.about-story__content { font-size: var(--font-base); line-height: var(--line-height-relaxed); color: var(--color-gray); }
.about-story__content p { margin-bottom: var(--space-lg); }
.about-story__content p:last-child { margin-bottom: 0; }
.about-story__content strong { color: var(--color-gray-dark); font-weight: var(--font-weight-semibold); }
.about-gallery__title {
  font-size: var(--font-3xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-gray-dark);
  text-align: center;
  margin: 0 0 var(--space-3xl);
}
@media (max-width: 768px) {
  .about-gallery__title { font-size: var(--font-2xl); }
}
.about-gallery__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-lg); }
@media (max-width: 1024px) {
  .about-gallery__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .about-gallery__grid { grid-template-columns: 1fr; }
}
.about-gallery__item {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
  aspect-ratio: 4/5;
  background: var(--color-gray-light);
}
.about-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.about-gallery__item:hover img { transform: scale(1.1); }
.about-content__wrap {
  max-width: 800px;
  margin: 0 auto;
  font-size: var(--font-base);
  line-height: var(--line-height-relaxed);
  color: var(--color-gray);
}
.about-content__wrap h2,
.about-content__wrap h3,
.about-content__wrap h4 { color: var(--color-gray-dark); font-weight: var(--font-weight-bold); margin-top: var(--space-2xl); margin-bottom: var(--space-lg); }
.about-content__wrap h2 { font-size: var(--font-2xl); }
.about-content__wrap h3 { font-size: var(--font-xl); }
.about-content__wrap h4 { font-size: var(--font-lg); }
.about-content__wrap p { margin-bottom: var(--space-lg); }
.about-content__wrap ul,
.about-content__wrap ol { margin-bottom: var(--space-lg); padding-left: var(--space-2xl); }
.about-content__wrap ul li,
.about-content__wrap ol li { margin-bottom: var(--space-sm); }
.about-content__wrap a { color: var(--color-primary); text-decoration: underline; transition: color var(--transition-fast); }
.about-content__wrap a:hover { color: var(--color-primary-hover); }
.about-content__wrap img { max-width: 100%; height: auto; border-radius: var(--radius-md); margin: var(--space-xl) 0; }
