/* About Us Page Styles – TravellReadyShop */
.about-hero {
  margin-top: var(--space-12);
  margin-bottom: var(--space-12);
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: var(--space-10);
  align-items: center;
}
.about-hero__content {
  text-align: left;
}
.about-hero__content h1 {
  margin-bottom: var(--space-4);
}
.about-hero__desc {
  font-size: var(--font-size-lg);
  color: var(--color-gray-700);
  margin: 0;
}
.about-hero__image {
  width: 100%;
  height: auto;
  max-width: 400px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-xl);
  object-fit: cover;
  justify-self: end;
}
@media (max-width: 900px) {
  .about-hero {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .about-hero__content {
    text-align: center;
  }
  .about-hero__desc {
    margin-left: auto;
    margin-right: auto;
    max-width: 44ch;
  }
  .about-hero__image {
    justify-self: center;
    max-width: 300px;
  }
}
.about-timeline {
  margin-bottom: var(--space-12);
}
.about-timeline__list {
  padding-left: 0;
  margin-top: var(--space-4);
  list-style: none;
  border-left: 3px solid var(--color-primary);
  position: relative;
}
.about-timeline__list li {
  margin-left: 0;
  padding: var(--space-4) 0 var(--space-4) var(--space-8);
  position: relative;
}
.about-timeline__list time {
  font-weight: 600;
  color: var(--color-primary);
  margin-right: var(--space-2);
  font-size: var(--font-size-lg);
  position: absolute;
  left: -50px;
  top: 24px;
}
.about-timeline__list li::before {
  content: "";
  position: absolute;
  left: -11px;
  top: 28px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--color-primary);
  opacity: 0.17;
}
@media (max-width:700px) {
  .about-timeline__list{
    border-left: 2px solid var(--color-primary);
  }
  .about-timeline__list li { padding-left: var(--space-5); }
  .about-timeline__list time { left: -35px; top: 13px; font-size: var(--font-size-base); }
  .about-timeline__list li::before { left: -13px; top: 18px; width: 13px; height: 13px; }
}
.about-vision {
  margin-bottom: var(--space-12);
  text-align: center;
}
.about-vision__quote {
  margin-left: auto;
  margin-right: auto;
  font-size: var(--font-size-lg);
  color: var(--color-gray-700);
  background: var(--color-gray-50);
  border-radius: var(--radius-md);
  padding: var(--space-6) var(--space-8);
  max-width: 48ch;
  box-shadow: var(--shadow-xs);
}
.about-vision__quote footer {
  font-size: var(--font-size-sm);
  color: var(--color-gray-600);
  margin-top: var(--space-4);
}
.about-offer {
  margin-bottom: var(--space-12);
}
.about-offer__features {
  margin-top: var(--space-6);
  gap: var(--space-8);
}
.about-offer__feature h3 {
  margin-bottom: var(--space-2);
}
@media (max-width:900px){
  .about-offer__features { grid-template-columns: 1fr; }
}
.about-impact {
  margin-bottom: var(--space-12);
}
.about-impact__testimonials { gap: var(--space-8); }
.about-impact__testimonial blockquote {
  font-size: var(--font-size-lg);
  color: var(--color-text);
  font-style: italic;
}
.about-impact__testimonial figcaption {
  font-size: var(--font-size-sm);
  color: var(--color-primary);
  margin-top: var(--space-3);
}
@media (max-width:700px) {
  .about-impact__testimonials { grid-template-columns: 1fr; }
}
.about-team {
  margin-bottom: var(--space-12);
}
.about-team__members {
  gap: var(--space-8);
  margin-top: var(--space-6);
}
.about-team__member {
  text-align: center;
  background: var(--color-surface);
}
.about-team__member-photo {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: var(--space-3);
  box-shadow: var(--shadow-xs);
  margin-left: auto;
  margin-right: auto;
}
.about-team__member h3 {
  margin-top: 0;
  margin-bottom: var(--space-1);
}
.about-team__member p {
  margin-bottom: var(--space-1);
}
@media (max-width:900px) {
  .about-team__members { grid-template-columns: 1fr; }
}
.about-partnerships {
  margin-bottom: var(--space-12);
}
.about-partnerships__list {
  display: flex;
  gap: var(--space-8);
  margin-top: var(--space-4);
  align-items: center;
  justify-content: flex-start;
  list-style: none;
}
.about-partnerships__list li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--space-2);
  min-width: 140px;
}
.about-partnerships__list img {
  margin-bottom: var(--space-1);
  scale: 1;
  transition: scale 0.18s;
}
.about-partnerships__list img:hover {
  scale: 1.07;
}
@media (max-width:700px) {
  .about-partnerships__list { gap: var(--space-6); flex-direction: column; align-items: stretch; }
  .about-partnerships__list li { align-items: flex-start; }
}
.about-metrics {
  margin-bottom: var(--space-12);
}
.about-metrics__stats {
  gap: var(--space-8);
  margin-top: var(--space-6);
}
.about-metrics__stat {
  text-align: center;
  background: var(--color-gray-50);
  padding-top: var(--space-8);
  padding-bottom: var(--space-8);
}
.about-metrics__value {
  font-size: var(--font-size-2xl);
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: var(--space-2);
}
.about-metrics__label {
  color: var(--color-gray-700);
  font-size: var(--font-size-base);
}
@media (max-width:900px) {
  .about-metrics__stats { grid-template-columns: 1fr; }
}
.about-awards {
  margin-bottom: var(--space-12);
}
.about-awards__list{
  margin: var(--space-6) 0 0 0;
  padding: 0;
  list-style: none;
}
.about-awards__list li{
  padding: var(--space-3) 0;
  border-bottom: 1px solid var(--color-gray-100);
  font-size: var(--font-size-lg);
  color: var(--color-primary-hover);
}
.about-awards__list strong{ color: var(--color-primary); }

@media (max-width:600px){
  .about-hero { margin-top: var(--space-8); margin-bottom: var(--space-8); }
  .container { padding-left: var(--space-1); padding-right: var(--space-1); }
  .about-timeline, .about-vision, .about-offer, .about-impact, .about-team, .about-partnerships, .about-metrics, .about-awards { margin-bottom: var(--space-8); }
}