/* Hero Section */
#hero h1 {
  font-size: 3rem;
}
.hero-description {
  color: var(--color-half);
  font-size: 1.25rem;
  line-height: 1.625;
  max-width: unset;
}
@media (min-width: 768px) {
  #hero h1 {
    font-size: 4.5rem;
  }
  .hero-description {
    font-size: 1.5rem;
  }
}
.hero-buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
@media (min-width: 640px) {
  .hero-buttons {
    flex-direction: row;
  }
}
.feature-grid {
  border-top: 1px solid var(--color-darkest);
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(1, 1fr);
  padding-top: 2rem;
}
.feature-item {
  align-items: center;
  display: flex;
  gap: 0.75rem;
}
.feature-item i {
  flex-shrink: 0;
}
.feature-item span {
  font-size: 1.125rem;
}

/* Trust Section */
#trust {
  background: var(--color-lighter);
  text-align: center;
}
.trust-label {
  color: var(--color-half);
  opacity: 0.7;
}
.logo-grid {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
  justify-content: center;
  opacity: 0.4;
}

/* Problem Grid */
.problem-grid {
  display: grid;
  gap: 3rem;
  grid-template-columns: repeat(1, 1fr);
}
.problem-item {
  border-left: 4px solid var(--color-darkest);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding-left: 2rem;
}
.problem-item h3 {
  font-size: 1.5rem;
}
.problem-item p {
  color: var(--color-half);
  font-size: 1.25rem;
  line-height: 1.625;
}

/* Platform Section */
#platform {
  background: var(--color-lighter);
  text-align: center;
}
#platform p {
  color: var(--color-half);
  font-size: 1.25rem;
  line-height: 1.625;
}
.platform-tagline {
  font-weight: 500;
}

/* Superworker Section */
#superworker .section-header {
  text-align: center;
}
#superworker .section-header p {
  color: var(--color-half);
  font-size: 1.25rem;
  line-height: 1.625;
  margin: 0 auto;
  max-width: 56rem;
}
.superworker-grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(1, 1fr);
  margin-bottom: 3rem;
}
.superworker-card {
  background: var(--color-lightest);
  border: 2px solid var(--color-darkest);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 2rem;
  transition: transform 0.15s;
}
.superworker-card:hover {
  transform: translateY(-4px);
}
.superworker-card i {
  font-size: 3rem;
}
.superworker-card h3 {
  font-size: 1.5rem;
}
.superworker-card p {
  font-size: 1.125rem;
  line-height: 1.625;
}
.card-solution {
  font-weight: 700;
}
#superworker-cta {
  text-align: center;
}

/* RIA Section */
#rias {
}
#rias h2 {
  font-size: 2.25rem;
  font-weight: 700;
  margin-bottom: 2rem;
}
@media (min-width: 768px) {
  #rias h2 {
    font-size: 3rem;
  }
}
.section-subtitle {
  color: var(--color-half);
  font-size: 1.25rem;
  margin-bottom: 4rem;
}
@media (min-width: 768px) {
  .section-subtitle {
    font-size: 1.5rem;
  }
}
.ria-grid {
  display: grid;
  gap: 4rem;
  grid-template-columns: repeat(1, 1fr);
  margin-bottom: 3rem;
}
@media (min-width: 768px) {
  .ria-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.column-header {
  align-items: center;
  display: flex;
  font-size: 1.5rem;
  font-weight: 700;
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}
.outcome-list,
.pain-list {
  font-size: 1.125rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.pain-list li {
  align-items: flex-start;
  display: flex;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.pain-list li span:first-child {
  font-weight: 700;
}
.outcome-list li {
  align-items: flex-start;
  display: flex;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.outcome-list svg {
  flex-shrink: 0;
  margin-top: 0.25rem;
}

/* Architecture Section */
#architecture {
}
#architecture h2 {
  font-size: 2.25rem;
  font-weight: 700;
  margin-bottom: 4rem;
}
@media (min-width: 768px) {
  #architecture h2 {
    font-size: 3rem;
  }
}
.arch-grid {
  display: grid;
  gap: 3rem;
  grid-template-columns: repeat(1, 1fr);
  margin-bottom: 3rem;
}
@media (min-width: 768px) {
  .arch-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.arch-item h3 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.arch-item p {
  color: var(--color-half);
  font-size: 1.125rem;
  line-height: 1.625;
}

/* Testimonials Section */
#testimonials {
  background: var(--color-lighter);
}
#testimonials h2 {
  text-align: center;
}
.testimonial-list {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
.testimonial {
  border-left: 4px solid var(--color-darkest);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-left: 2rem;
}
.testimonial p {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.625;
}
.testimonial cite {
  color: var(--color-half);
  font-style: normal;
  opacity: 0.7;
}
#testimonials-cta {
  text-align: center;
}

/* Centered Sections */
#platform .layer-inset,
#cta .layer-inset {
  gap: 2rem;
}

/* Platform Section */
#platform {
  background: var(--color-lighter);
  text-align: center;
}

/* CTA Section */
#cta {
  background: var(--color-darkest);
  text-align: center;
}
#cta h2,
#cta p {
  color: var(--color-lightest);
}
#cta h2 {
  font-size: 2rem;
}
#cta p {
  font-size: 1.25rem;
  line-height: 1.625;
  opacity: 0.9;
}
.cta-tagline {
  opacity: 0.8;
}
.cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-content: center;
}
@media (min-width: 640px) {
  .cta-buttons {
    flex-direction: row;
  }
}

/* Button Variants */
.button-light {
  background: var(--color-lightest);
  border-color: var(--color-lightest);
  color: var(--color-darkest);
}
.button-light:hover {
  opacity: 0.9;
}
.button-outline-light {
  background: transparent;
  border: 2px solid var(--color-lightest);
  color: var(--color-lightest);
}
.button-outline-light:hover {
  background: var(--color-lightest);
  color: var(--color-darkest);
}

/* Media Queries */
@media (min-width: 768px) {
  .feature-grid,
  .problem-grid,
  .superworker-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .feature-grid {
    grid-template-columns: repeat(4, 1fr);
  }
  #superworker .section-header p,
  .testimonial p,
  #cta p {
    font-size: 1.5rem;
  }
  #cta h2 {
    font-size: 4rem;
  }
}