/* About Page Specific Styles */

/* Mission Section */
.mission {
  background-color: var(--bg-secondary);
}

/* Team Section */
.team-arch {
  aspect-ratio: 5/6;
  border-radius: var(--border-radius-arch);
  border: 1px solid #111;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  position: relative;
  transition: transform 0.3s;
}

.hover-lift:hover {
  transform: translateY(-5px);
}

.team-arch img {
  width: 90%;
  height: auto;
  object-fit: cover;
  object-position: bottom;
  filter: grayscale(100%);
  transition: filter 0.3s;
}

.team-arch:hover img {
  filter: grayscale(0%);
}

.bg-light-orange { background-color: #FCE1C3; }
.bg-light-pink { background-color: #F6C1C9; }
/* Reusing bg-pink, bg-yellow for team from global/index styling where possible, or definining here */

.top-tag {
  left: 50%;
  transform: translateX(-50%) translateY(-150%);
  z-index: 10;
  border: 1px solid #111;
  white-space: nowrap;
}

.badge-light-orange { background-color: var(--bg-secondary); color: var(--text-primary); }
.badge-pink { background-color: var(--accent-pink); color: var(--text-primary); }
.badge-yellow { background-color: var(--accent-yellow); color: var(--text-primary); }
.badge-light-blue { background-color: var(--accent-light-blue); color: var(--text-primary); }

.border-top {
  border-top: 1px solid #ddd;
}

/* Timeline Section */
.select-arrow {
  position: relative;
}
.select-arrow::after {
  content: "↗";
  position: absolute;
  top: 0;
  right: -30px;
  font-size: 2rem;
  font-family: sans-serif;
  color: #111;
  transform: rotate(45deg);
}

.timeline-wrapper {
  min-height: 250px;
}

.timeline-path {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 0;
}

.timeline-points {
  padding: 0 5%;
}

.point-item {
  width: 150px;
  background-color: var(--bg-primary);
  padding: 10px;
  border-radius: 8px;
  /* Add subtle background or outline if needed to cut out line behind text */
}

/* Specific margins mapping the wavy shape */
.mt-\[-40px\] { margin-top: -40px; }
.mt-\[120px\] { margin-top: 120px; }
.mt-\[-20px\] { margin-top: -20px; }

/* Decorative Stamps placeholders */
.team-stamp {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  position: absolute;
  z-index: 20;
}
.bg-orange-stamp {
  background-color: var(--accent-orange);
  /* Should have a wavy text or SVG inside */
}
.left-edge {
  left: -20px;
  top: 40%;
}
.right-edge {
  right: -20px;
  top: 20%;
}

@media (max-width: 900px) {
  .timeline-path { display: none; }
  .timeline-points {
    flex-direction: column;
    gap: 2rem;
    align-items: center;
  }
  .point-item {
    margin-top: 0 !important;
    width: 100%;
    max-width: 300px;
  }
  .team .grid-cols-2 {
    grid-template-columns: 1fr;
  }
}

/* Founder Info */
.founder-info {
  padding: 1rem 0;
}

.founder-info .text-md {
  line-height: 1.7;
  color: var(--text-muted);
}