/* Local pages (single-location.php, templates/pages/local*.php): sections the reference doesn't have,
   built from the site's tokens so they sit naturally between the reference sections. */

/* Article: the full container width, in the blog post's text style. */
.local.section { padding-block: clamp(40px, 6vw, 80px) clamp(24px, 4vw, 48px); }
.local__prose { max-width: none; }
.local__prose > h2:first-child { margin-top: 0; }
.local__by {
  display: flex; align-items: center; gap: 12px; margin: 0 0 clamp(24px, 3vw, 36px);
  padding-bottom: 20px; border-bottom: 1px solid var(--line, rgba(0, 0, 0, .12));
  color: var(--text-muted, var(--ink-2)); font-size: .95rem;
}
.local__by a { color: var(--ink, #111); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }
.local__avatar, .local__by img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex: none; }

/* Industries: a wide, scannable cloud of chips. */
.lind__list { display: flex; flex-wrap: wrap; gap: 10px; margin: 28px 0 0; padding: 0; list-style: none; }
.lind__list li {
  padding: 8px 16px; border-radius: var(--radius-pill, 999px);
  background: var(--surface, #fff); border: 1px solid var(--line, rgba(0, 0, 0, .12));
  font-size: .95rem; font-weight: 500;
}

/* Areas served: a bold band that stands out on the page. */
.larea.section {
  position: relative; overflow: hidden;
  margin-inline: clamp(8px, 2vw, 24px); border-radius: var(--radius-xl, 28px);
  background:
    radial-gradient(60% 90% at 100% 0%, rgba(255, 158, 88, .45), transparent 60%),
    radial-gradient(50% 80% at 0% 100%, rgba(72, 196, 204, .35), transparent 60%),
    var(--night, #14121f);
  color: #fff;
}
.larea .eyebrow { color: var(--sun, #ffd27a); }
.larea h2 { color: #fff; }
.larea__head { max-width: 760px; }
.larea__text { color: rgba(255, 255, 255, .8); margin-top: 12px; }
.larea__list { display: flex; flex-wrap: wrap; gap: 12px; margin: 32px 0 0; padding: 0; list-style: none; }
.larea__list li {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 20px; border-radius: var(--radius-pill, 999px);
  background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .25);
  font-size: 1.05rem; font-weight: 600; backdrop-filter: blur(6px);
}
.larea__list svg { color: var(--sun, #ffd27a); flex: none; }

/* Map and directions to the US office. */
.lmap__grid { display: grid; gap: clamp(24px, 4vw, 56px); align-items: center; }
@media (min-width: 900px) { .lmap__grid { grid-template-columns: 5fr 7fr; } }
.lmap__text { color: var(--text-muted, var(--ink-2)); margin-top: 12px; }
.lmap__nap {
  display: grid; gap: 8px; margin-top: 24px; padding: 20px;
  font-style: normal; border-radius: var(--radius-l, 20px);
  background: var(--surface, #fff); border: 1px solid var(--line, rgba(0, 0, 0, .12));
}
.lmap__nap span { display: inline-flex; align-items: center; gap: 8px; }
.lmap__nap svg { color: var(--tangerine, currentColor); flex: none; }
.lmap__actions { margin-top: 24px; }
.lmap__map {
  aspect-ratio: 4 / 3; border-radius: var(--radius-xl, 28px); overflow: hidden;
  border: 1px solid var(--line, rgba(0, 0, 0, .12)); box-shadow: var(--shadow-m, none);
}
.lmap__map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* Service category page: location pages grouped by state. */
.lhub__groups { display: grid; gap: 28px; margin-top: 32px; }
@media (min-width: 900px) { .lhub__groups { grid-template-columns: repeat(2, 1fr); } }
.lhub__state { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 1.25rem; }
.lhub__state svg { color: var(--tangerine, currentColor); }
.lhub__list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.lhub__list a {
  display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: center;
  padding: 16px 18px; border-radius: var(--radius-l, 20px); text-decoration: none; color: inherit;
  background: var(--surface, #fff); border: 1px solid var(--line, rgba(0, 0, 0, .12));
  transition: transform .3s var(--ease-out, ease-out), box-shadow .3s;
}
.lhub__list a:hover { transform: translateY(-2px); box-shadow: var(--shadow-m, 0 8px 24px rgba(0, 0, 0, .08)); }
.lhub__title { font-weight: 700; }
.lhub__short { grid-column: 1; color: var(--text-muted, var(--ink-2)); font-size: .95rem; }
.lhub__list svg { grid-row: 1 / span 2; grid-column: 2; }
.lhub__empty { margin-top: 24px; font-size: 1.1rem; }
.lhub__empty a { font-weight: 600; text-decoration: underline; text-underline-offset: .2em; }

/* Author page: articles and local guides as a grid of link cards. */
.lhub__list--grid { margin-top: 28px; }
@media (min-width: 900px) { .lhub__list--grid { grid-template-columns: repeat(2, 1fr); } }
