/* Phase 08 — SEO landing pages (token-aware; follows active Appearance theme) */
.seo-hero {
  padding: 4.5rem 0 2rem;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(197, 160, 89, 0.16), transparent 50%),
    linear-gradient(180deg, var(--surface-primary, #071525) 0%, var(--surface-card, #0f2138) 100%);
  color: var(--text-primary, #f7f1e6);
}
.seo-eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
  color: var(--accent-primary, #c5a059);
  margin-bottom: 0.5rem;
}
.seo-title {
  font-size: clamp(1.75rem, 4vw, 2.75rem);
  font-weight: 700;
  margin: 0 0 0.75rem;
  line-height: 1.2;
  color: var(--text-primary, #f7f1e6);
  font-family: var(--font-display, inherit);
}
.seo-lead {
  max-width: 40rem;
  color: var(--text-secondary, rgba(247, 241, 230, 0.78));
  font-size: 1.05rem;
  margin-bottom: 1.25rem;
}
.seo-price { color: var(--accent-primary, #c5a059); font-size: 1.1rem; margin-bottom: 1rem; }
.seo-cta-row { display: flex; flex-wrap: wrap; gap: 0.75rem; }

.seo-breadcrumbs ol {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  padding: 0;
  margin: 0 0 1.25rem;
  font-size: 0.85rem;
  color: var(--text-muted, rgba(247, 241, 230, 0.55));
}
.seo-breadcrumbs li:not(:last-child)::after {
  content: "/";
  margin-left: 0.35rem;
  opacity: 0.5;
}
.seo-breadcrumbs a { color: var(--text-secondary, rgba(247, 241, 230, 0.75)); text-decoration: none; }
.seo-breadcrumbs a:hover { color: var(--accent-primary, #c5a059); }

.seo-section {
  padding: 2.5rem 0;
  background: var(--surface-secondary, #f4ede0);
  color: var(--text-on-light, #0b1c33);
  border-top: 1px solid var(--border-on-light, rgba(11, 28, 51, 0.08));
}
.seo-section h2 {
  font-size: 1.35rem;
  margin-bottom: 1rem;
  color: var(--text-heading-on-light, var(--text-on-light, #071525));
  font-family: var(--font-display, inherit);
}
.seo-link-grid {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.75rem;
}
.seo-link-grid a {
  display: block;
  padding: 0.85rem 1rem;
  background: var(--surface-card-on-light, #fffcfa);
  border: 1px solid var(--border-on-light, rgba(11, 28, 51, 0.1));
  color: var(--text-on-light, #0b1c33);
  text-decoration: none;
  border-radius: var(--radius-small, 10px);
  box-shadow: var(--shadow-card, 0 12px 36px rgba(7, 21, 37, 0.09));
  transition: border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.seo-link-grid a:hover {
  border-color: var(--border-on-light-strong, rgba(197, 160, 89, 0.35));
  color: var(--brand-primary, #1b3a6b);
  box-shadow: var(--shadow-card-hover, 0 22px 48px rgba(7, 21, 37, 0.16));
}
.seo-city-grid a strong { display: block; }
.seo-city-grid a span { font-size: 0.8rem; color: var(--text-muted-on-light, #5a6575); }

.seo-route-list {
  list-style: none;
  padding: 0;
  margin: 0;
  columns: 1;
}
@media (min-width: 768px) {
  .seo-route-list { columns: 2; }
}
.seo-route-list li {
  break-inside: avoid;
  margin-bottom: 0.5rem;
}
.seo-route-list a {
  color: var(--text-on-light, #0b1c33);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.seo-route-list a:hover {
  color: var(--brand-primary, #1b3a6b);
  border-bottom-color: var(--accent-primary, #c5a059);
}

.seo-widget-card {
  background: var(--surface-card-on-light, #fffcfa);
  border: 1px solid var(--border-on-light-strong, rgba(197, 160, 89, 0.35));
  padding: 1.75rem;
  border-radius: var(--radius-medium, 14px);
  text-align: center;
  box-shadow: var(--shadow-card, 0 12px 36px rgba(7, 21, 37, 0.09));
  color: var(--text-on-light, #0b1c33);
}
.seo-widget-sub { color: var(--text-muted-on-light, #5a6575); margin-bottom: 1rem; }
.seo-fleet-chips {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  padding: 0;
  margin: 0 0 1.25rem;
}
.seo-fleet-chips li {
  padding: 0.35rem 0.75rem;
  background: var(--surface-secondary, #f4ede0);
  border: 1px solid var(--border-on-light, rgba(11, 28, 51, 0.1));
  border-radius: var(--radius-small, 10px);
  font-size: 0.85rem;
  color: var(--text-on-light, #0b1c33);
}

.seo-faq-list { max-width: 44rem; }
.seo-faq-item {
  border-bottom: 1px solid var(--border-on-light, rgba(11, 28, 51, 0.1));
  padding: 0.75rem 0;
}
.seo-faq-item summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--text-heading-on-light, #071525);
}
.seo-faq-item p {
  margin: 0.5rem 0 0;
  color: var(--text-secondary-on-light, #3a4556);
}