/**
 * Location page styles.
 */

.ewby-location-hero {
  padding: var(--space-4xl) var(--container-padding) var(--space-3xl);
}

.ewby-location-hero__inner {
  max-width: 720px;
}

.ewby-location-hero__heading {
  font-size: var(--text-5xl);
  margin: var(--space-sm) 0 var(--space-lg);
}

.ewby-location-hero__subheading {
  font-size: var(--text-2xl);
  color: var(--color-text-body);
  line-height: 1.55;
  margin: 0 0 var(--space-xl);
  max-width: 560px;
}

.ewby-location-hero__actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

/* Intro */
.ewby-location-intro {
  padding: 0 var(--container-padding) var(--space-3xl);
}

.ewby-location-intro__content {
  max-width: 720px;
  font-size: var(--text-md);
  line-height: 1.7;
  color: var(--color-text-body);
}

.ewby-location-intro__content p {
  margin-bottom: 1.25em;
}

/* Services grid */
.ewby-location-services {
  padding: 0 var(--container-padding) var(--space-3xl);
}

.ewby-location-services__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-md);
  margin-top: var(--space-xl);
}

.ewby-location-services__grid .ewby-card h3 {
  font-size: var(--text-lg);
  margin: 0 0 8px;
}

.ewby-location-services__grid .ewby-card p {
  font-size: var(--text-base);
  color: var(--color-text-muted);
  margin: 0 0 12px;
  line-height: 1.5;
}

.ewby-location-services__link {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--color-primary);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

/* FAQ uses the shared component styles in components.css */

/* CTA */
.ewby-location-cta {
  margin: 0 var(--container-padding) var(--space-xl);
}

.ewby-location-cta__inner {
  background: linear-gradient(
    120deg,
    var(--color-primary-dark),
    var(--color-primary)
  );
  border-radius: var(--radius-xl);
  padding: 56px;
  text-align: center;
}

.ewby-location-cta__inner h2 {
  color: var(--color-white);
  font-size: var(--text-4xl);
  margin: 0 0 12px;
}

.ewby-location-cta__inner p {
  color: rgb(214, 226, 255);
  font-size: var(--text-lg);
  margin: 0 0 28px;
}

.ewby-location-cta__actions {
  display: inline-flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: center;
}

/* Responsive */
@media (max-width: 768px) {
  .ewby-location-services__grid {
    grid-template-columns: 1fr;
  }

  .ewby-location-cta__inner {
    padding: 40px 24px;
  }
}

/* ===== All service areas ===== */
.ewby-location-areas {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 22px var(--container-padding) 64px;
}

.ewby-location-areas__heading {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: var(--text-4xl);
  text-transform: uppercase;
  letter-spacing: -0.02em;
  color: var(--color-text);
  margin: 12px 0 10px;
}

.ewby-location-areas__text {
  color: var(--color-text-muted);
  font-size: var(--text-md);
  max-width: 480px;
  margin: 0 0 24px;
}

.ewby-location-areas__pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.ewby-location-areas__pill {
  display: inline-block;
  padding: 11px 20px;
  border: 1.5px solid var(--color-border-light);
  border-radius: 999px;
  color: var(--color-text-body);
  font-size: var(--text-base);
  font-weight: 600;
  text-decoration: none;
  transition:
    border-color 0.2s ease,
    color 0.2s ease,
    transform 0.2s ease;
}

a.ewby-location-areas__pill:hover {
  border-color: rgba(47, 123, 255, 0.6);
  color: var(--color-text);
  transform: translateY(-2px);
}

.ewby-location-areas__pill--current {
  background: rgba(47, 123, 255, 0.16);
  border-color: rgba(47, 123, 255, 0.55);
  color: var(--color-text);
}
