/* ==========================================================================
   AVCO Design System - About Page
   ========================================================================== */

/* Hero Section */
body.avco-page .avco-about-hero {
  padding: var(--avco-space-16) var(--avco-space-15) 0;
  align-items: flex-end;
}

body.avco-page .avco-about-hero .avco-hero-mask {
  position: relative;
}


body.avco-page .avco-about-hero .avco-hero-image img {
  width: 100%;
}

/* Engineered Quote Section */
body.avco-page .avco-about-engineered {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: var(--avco-space-16);
}

body.avco-page .avco-about-engineered .avco-engineered-content {
  display: flex;
  gap: var(--avco-space-4);
  align-items: flex-start;
}

body.avco-page .avco-about-engineered .avco-quote {
  flex: 1;
}

body.avco-page .avco-about-engineered h2.avco-quote {
  font-family: var(--avco-font-heading);
  font-size: var(--avco-text-7xl);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.065rem;
  color: var(--avco-primary-950);
  margin: 0;
}

body.avco-page .avco-about-engineered .avco-description {
  flex: 1;
}

body.avco-page .avco-about-engineered p {
  font-size: var(--avco-text-base);
  font-weight: 400;
  line-height: 1.7;
  color: var(--avco-gray-600);
  margin: 0;
  white-space: pre-wrap;
}

/* Mission Section */
body.avco-page .avco-about-mission {
  display: flex;
  gap: var(--avco-space-16);
  align-items: center;
  padding: 0 var(--avco-space-15) var(--avco-space-16);
}

body.avco-page .avco-about-mission .avco-mission-image {
  width: 37.875rem; /* 606px */
  height: 45.0625rem; /* 721px */
  background-color: var(--avco-primary-200);
  overflow: hidden;
  flex-shrink: 0;
}

body.avco-page .avco-about-mission .avco-mission-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.avco-page .avco-about-mission .avco-mission-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-16);
  justify-content: center;
}

body.avco-page .avco-about-mission .avco-mission-item {
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-4);
}

body.avco-page .avco-about-mission h3.avco-mission-title,
body.avco-page .avco-about-mission h3.avco-terms-title {
  font-family: var(--avco-font-heading);
  font-size: var(--avco-text-6xl);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.1rem;
  color: var(--avco-primary-950);
  margin: 0;
}

body.avco-page .avco-about-mission p.avco-mission-text {
  font-size: var(--avco-text-base);
  font-weight: 400;
  line-height: 1.7;
  color: var(--avco-gray-600);
  margin: 0;
}

/* Terms (moved into Mission content) */
body.avco-page .avco-about-mission .avco-terms-content {
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-4);
}

body.avco-page .avco-about-mission p.avco-terms-text {
  font-size: var(--avco-text-base);
  font-weight: 400;
  line-height: 1.7;
  color: var(--avco-gray-600);
  margin: 0;
}

body.avco-page .avco-about-mission .avco-terms-link {
  font-size: var(--avco-text-base);
  font-weight: 400;
  color: var(--avco-secondary-700);
  white-space: nowrap;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: var(--avco-space-2);
}

body.avco-page .avco-about-mission .avco-terms-link:hover {
  color: var(--avco-secondary-600);
}

body.avco-page .avco-about-mission .avco-terms-link svg {
  width: 1.25rem;
  height: 1.25rem;
}

/* Story Section */
body.avco-page .avco-about-story {
  width: 100%;
  max-width: 90rem; /* 1440px */
  height: 66.75rem; /* 1068px */
  position: relative;
  overflow: hidden;
}

body.avco-page .avco-about-story .avco-story-bg {
  position: absolute;
  inset: 0;
}

body.avco-page .avco-about-story .avco-story-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.avco-page .avco-about-story .avco-story-gradient {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 70%;
  background: linear-gradient(to top, rgba(0,0,0,0.9) 60.654%, rgba(0,0,0,0.6), rgba(0,0,0,0));
}

body.avco-page .avco-about-story .avco-story-content {
  position: absolute;
  bottom: var(--avco-space-15);
  left: var(--avco-space-15);
  right: var(--avco-space-15);
  display: flex;
  gap: var(--avco-space-12);
}

body.avco-page .avco-about-story .avco-story-label {
  flex: 1;
  font-size: var(--avco-text-xl);
  font-weight: 400;
  color: var(--avco-white);
  line-height: 1.6;
}

body.avco-page .avco-about-story p.avco-story-text {
  flex: 2;
  font-size: var(--avco-text-xl);
  font-weight: 400;
  color: var(--avco-white);
  line-height: 1.6;
  margin: 0;
}

/* Testimonials Section */
body.avco-page .avco-about-testimonials {
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-16);
  padding: var(--avco-space-16) 0 var(--avco-space-16) var(--avco-space-16);
  position: relative;
  overflow: hidden;
}

body.avco-page .avco-about-testimonials .avco-testimonials-header,
body.avco-page .avco-about-testimonials .avco-testimonials-action {
  padding-right: var(--avco-space-16);
}

body.avco-page .avco-about-testimonials .avco-testimonials-header {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 24.3125rem; /* 389px */
  justify-content: center;
  padding-right: 0;
}

body.avco-page .avco-about-testimonials .avco-testimonials-left {
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-4);
}

body.avco-page .avco-about-testimonials h2.avco-testimonials-title {
  font-family: var(--avco-font-heading);
  font-size: var(--avco-text-7xl);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.065rem;
  color: var(--avco-primary-950);
  margin: 0;
}

body.avco-page .avco-about-testimonials p.avco-testimonials-desc {
  font-size: var(--avco-text-base);
  font-weight: 400;
  line-height: 1.7;
  color: var(--avco-gray-600);
  margin: 0;
}

body.avco-page .avco-about-testimonials .avco-testimonials-main {
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-6);
  overflow: hidden;
}

body.avco-page .avco-about-testimonials .avco-testimonials-slider {
  overflow: hidden;
}

@media (min-width: 90.0625rem) { /* > 1440px: no peek, constrain slider */
  body.avco-page .avco-about-testimonials .avco-testimonials-slider {
    max-width: calc(19.6875rem * 4 + 1.25rem * 3); /* spacer + 3 cards + 3 gaps = 1320px */
  }
}

body.avco-page .avco-about-testimonials .avco-testimonials-track {
  display: flex;
  gap: 1.25rem; /* 20px */
  align-items: stretch;
  transition: transform 0.4s ease;
}

body.avco-page .avco-about-testimonials .avco-client-card {
  background-color: var(--avco-primary-50);
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-12);
  padding: var(--avco-space-6) var(--avco-space-8);
  width: 19.6875rem; /* 315px */
  flex-shrink: 0;
}

body.avco-page .avco-about-testimonials .avco-client-card-spacer {
  visibility: hidden;
  pointer-events: none;
}

body.avco-page .avco-about-testimonials .avco-client-card:not(.avco-client-card-spacer):hover {
  box-shadow: 0 0.25rem 1.25rem rgba(32, 39, 75, 0.1);
}

body.avco-page .avco-about-testimonials .avco-client-card-top {
  display: flex;
  flex-direction: column;
  gap: var(--avco-space-8);
  flex: 1;
}

body.avco-page .avco-about-testimonials .avco-quote-icon {
  width: 2.5rem;
  height: 2.5rem;
}

body.avco-page .avco-about-testimonials .avco-quote-icon svg {
  width: 100%;
  height: 100%;
}

body.avco-page .avco-about-testimonials p.avco-quote-text {
  font-size: var(--avco-text-base);
  font-weight: 400;
  line-height: 1.7;
  color: var(--avco-gray-600);
  margin: 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5; /* clamp long reviews to 5 lines with ellipsis */
  line-clamp: 5;
  overflow: hidden;
}

body.avco-page .avco-about-testimonials .avco-quote-toggle {
  display: none;
  align-self: flex-start;
  padding: 0;
  background: none;
  border: none;
  font-family: inherit;
  font-size: var(--avco-text-base);
  font-weight: 400;
  color: var(--avco-secondary-700);
  cursor: pointer;
}

body.avco-page .avco-about-testimonials .avco-quote-toggle:hover {
  color: var(--avco-secondary-600);
}

body.avco-page .avco-about-testimonials .avco-client-card.has-clamp .avco-quote-toggle {
  display: inline-flex;
}

body.avco-page .avco-about-testimonials .avco-client-card.expanded p.avco-quote-text {
  -webkit-line-clamp: unset;
  line-clamp: unset;
  display: block;
  overflow: visible;
}

body.avco-page .avco-about-testimonials .avco-client-name {
  display: flex;
  gap: var(--avco-space-3);
  align-items: center;
}

body.avco-page .avco-about-testimonials .avco-client-avatar {
  width: 3rem;
  height: 3rem;
  position: relative;
  border-radius: 50%;
  background-color: var(--avco-primary-100);
  overflow: hidden;
  flex-shrink: 0;
}

body.avco-page .avco-about-testimonials .avco-client-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

body.avco-page .avco-about-testimonials .avco-client-avatar img + span {
  display: none;
}

body.avco-page .avco-about-testimonials .avco-client-avatar span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: var(--avco-text-base);
  font-weight: 400;
  color: var(--avco-primary-950);
}

body.avco-page .avco-about-testimonials .avco-client-right {
  display: flex;
  flex-direction: column;
  width: 5.25rem;
}

body.avco-page .avco-about-testimonials .avco-client-name-text {
  font-size: var(--avco-text-base);
  font-weight: 600;
  line-height: 1.7;
  color: var(--avco-primary-900);
}

body.avco-page .avco-about-testimonials .avco-verified-row {
  display: flex;
  gap: var(--avco-space-2);
  align-items: center;
}

body.avco-page .avco-about-testimonials .avco-verified-row img {
  width: 1rem;
  height: 1rem;
}

body.avco-page .avco-about-testimonials .avco-verified {
  font-size: var(--avco-text-base);
  font-weight: 400;
  line-height: 1.7;
  color: var(--avco-gray-600);
  white-space: nowrap;
}

body.avco-page .avco-about-testimonials .avco-testimonials-action {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  width: 100%;
}

body.avco-page .avco-about-testimonials .avco-testimonials-action-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 61.5625rem; /* 985px */
}

body.avco-page .avco-about-testimonials .avco-testimonials-arrows {
  display: flex;
  gap: var(--avco-space-2);
  align-items: center;
}

body.avco-page .avco-about-testimonials .avco-testimonials-arrows button {
  width: 2rem;
  height: 2rem;
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity var(--avco-transition-fast);
}

body.avco-page .avco-about-testimonials .avco-testimonials-arrows button:hover {
  opacity: 0.7;
}

body.avco-page .avco-about-testimonials .avco-testimonials-arrows button svg {
  width: 100%;
  height: 100%;
}

body.avco-page .avco-about-testimonials .avco-testimonials-dots {
  display: flex;
  gap: var(--avco-space-2);
  align-items: flex-start;
}

body.avco-page .avco-about-testimonials .avco-dot {
  height: 0.375rem;
  cursor: pointer;
  transition: width var(--avco-transition-base), background-color var(--avco-transition-base);
}

body.avco-page .avco-about-testimonials .avco-dot.active {
  background-color: var(--avco-primary-600);
  width: 3rem;
}

body.avco-page .avco-about-testimonials .avco-dot.inactive {
  background-color: var(--avco-primary-100);
  width: 1.5rem;
}

body.avco-page .avco-about-testimonials .avco-products-watermark {
  position: absolute;
  top: 18%;
  left: 40rem;
  transform: translateY(-50%);
  width: 51rem;
  height: auto;
  pointer-events: none;
  user-select: none;
}

/* ==========================================================================
   Responsive Styles
   ========================================================================== */
@media (max-width: 1279px) {
  /* ── Tablet: Hero ─────────────────────────────── */
  body.avco-page .avco-about-hero {
    padding: var(--avco-space-8) var(--avco-space-8) 0; /* 32px 32px 0 */
  }

  /* ── Tablet: Engineered ───────────────────────── */
  body.avco-page .avco-about-engineered {
    padding: var(--avco-space-8); /* 32px */
  }

  /* ── Tablet: Mission ──────────────────────────── */
  body.avco-page .avco-about-mission {
    flex-direction: column;
    padding: 0 var(--avco-space-8) var(--avco-space-8);
  }

  body.avco-page .avco-about-mission .avco-mission-image {
    width: 100%;
  }

  body.avco-page .avco-about-testimonials{
    width: 100%;
    height: auto;
    flex: none;
    padding: var(--avco-space-8);
  }

  /* ── Tablet: Story ────────────────────────────── */
  body.avco-page .avco-about-story {
    height: auto;
    min-height: 47.5rem;
  }
}

@media (max-width: 767px) {
  /* ── Hero Section ─────────────────────────────── */
  body.avco-page .avco-about-hero {
    padding: var(--avco-space-8) var(--avco-space-4); /* 32px 16px */
  }

  body.avco-page .avco-about-hero .avco-hero-image {
    width: 100%;
    height: auto;
  }

  body.avco-page .avco-about-hero .avco-hero-image img {
    height: 14.625rem; /* 234px */
    object-fit: cover;
  }

  /* ── Engineered Quote Section ─────────────────── */
  body.avco-page .avco-about-engineered {
    padding: 0 var(--avco-space-4) var(--avco-space-8); /* 0 16px 32px */
  }

  body.avco-page .avco-about-engineered .avco-engineered-content {
    flex-direction: column;
    gap: var(--avco-space-4); /* 16px */
  }

  body.avco-page .avco-about-engineered h2.avco-quote {
    font-size: var(--avco-text-6xl); /* 40px */
    line-height: 1.3;
    letter-spacing: -0.1rem; /* -1.6px */
  }

  /* ── Mission Section ──────────────────────────── */
  body.avco-page .avco-about-mission {
    flex-direction: column;
    gap: var(--avco-space-4); /* 16px */
    padding: 0 var(--avco-space-4); /* 0 16px */
  }

  body.avco-page .avco-about-mission .avco-mission-image {
    width: 100%;
    height: 25.5rem; /* 408px */
  }

  body.avco-page .avco-about-mission .avco-mission-content {
    gap: var(--avco-space-6); /* 24px */
  }

  body.avco-page .avco-about-mission h3.avco-mission-title,
  body.avco-page .avco-about-mission h3.avco-terms-title {
    font-size: var(--avco-text-4xl); /* 32px */
    letter-spacing: -0.0625rem; /* -1px */
  }

  /* ── Story Section ────────────────────────────── */
  body.avco-page .avco-about-story {
    height: 47.5rem; /* 760px */
  }

  body.avco-page .avco-about-story .avco-story-gradient {
    height: 35.4375rem; /* 567px */
    top: 12.0625rem; /* 193px */
    bottom: auto;
    width: 100%;
    left: 0;
  }

  body.avco-page .avco-about-story .avco-story-content {
    flex-direction: column;
    gap: var(--avco-space-12); /* 48px */
    bottom: 3.125rem; /* 50px */
    left: var(--avco-space-4); /* 16px */
    right: var(--avco-space-4);
    width: auto;
  }

  body.avco-page .avco-about-story .avco-story-label {
    width: 100%;
  }

  body.avco-page .avco-about-story p.avco-story-text {
    width: 100%;
    font-size: var(--avco-text-lg); /* 20px */
    line-height: 1.5;
  }

  /* ── Testimonials Section ─────────────────────── */
  body.avco-page .avco-about-testimonials .avco-testimonials-main {
    width: 100%;
    height: auto;
    flex: none;
  }

  body.avco-page .avco-about-testimonials {
    padding: var(--avco-space-8) 0 var(--avco-space-8) var(--avco-space-4); /* 32px 0 32px 16px */
    gap: var(--avco-space-6); /* 24px */
  }

  body.avco-page .avco-about-testimonials .avco-testimonials-header,
  body.avco-page .avco-about-testimonials .avco-testimonials-action {
    padding-right: var(--avco-space-4);
  }

  body.avco-page .avco-about-testimonials .avco-testimonials-header {
    width: 100%;
  }

  body.avco-page .avco-about-testimonials h2.avco-testimonials-title {
    font-size: var(--avco-text-6xl); /* 40px */
    letter-spacing: -0.1rem;
    line-height: 1.3;
  }

  body.avco-page .avco-about-testimonials .avco-client-card-spacer {
    display: none;
  }

  body.avco-page .avco-about-testimonials .avco-client-card {
    width: 19.6875rem; /* 315px */
    padding: var(--avco-space-6) var(--avco-space-4); /* 24px 16px */
    gap: var(--avco-space-8); /* 32px */
  }

  body.avco-page .avco-about-testimonials .avco-client-card-top {
    gap: var(--avco-space-4); /* 16px */
  }

  body.avco-page .avco-about-testimonials .avco-testimonials-action-inner {
    width: 100%;
  }

  body.avco-page .avco-about-testimonials .avco-products-watermark {
    width: 21.4375rem; /* 343px */
    height: 5.5rem; /* 88px */
    top: 4rem; /* 64px */
    left: auto;
    right: 0;
    transform: none;
    z-index: -1;
  }
}