/* Additions to the live map LP. All styles stay inside the two new sections. */
.lp-activity-examples { padding-top: var(--space-xxl); }
.lp-activity-heading { margin-bottom: var(--space-xl); }
.lp-activity-heading h2 { font-size: clamp(28px, 3.1vw, 40px); }
.lp-activity-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-lg); }
.lp-activity-grid article { min-width: 0; }
.lp-activity-grid img { aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--radius-lg); }
.lp-activity-grid h3 { font-size: 24px; margin-top: var(--space-md); }
.lp-activity-grid p { font-size: 15px; line-height: 1.8; margin-top: var(--space-sm); }
.lp-activity-examples .image-note { margin-top: var(--space-lg); }
.community-gateway-section { padding-block: var(--space-xxl); scroll-margin-top: 80px; }
.community-gateway { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.65fr) auto; align-items: center; gap: var(--space-md); min-height: 250px; padding: var(--space-xl); border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--cream); }
.community-gateway-copy { position: relative; z-index: 1; min-width: 0; }
.community-gateway .eyebrow { font-size: 12px; margin-bottom: var(--space-md); }
.community-gateway h2 { position: relative; width: max-content; max-width: 100%; font-size: clamp(24px, 2.3vw, 30px); line-height: 1.4; font-weight: 700; letter-spacing: -.04em; }
.community-gateway h2::after { content: ''; display: block; width: 88%; height: 4px; margin-top: var(--space-sm); background: var(--coral); border-radius: 50%; transform: rotate(-.6deg); }
.community-gateway-description { font-size: 15px; line-height: 1.7; color: var(--muted); margin-top: var(--space-lg); }
/* The approved collage art only; headline and CTA remain accessible HTML. */
.community-gateway-collage { min-width: 0; width: 100%; aspect-ratio: 1000 / 370; background-image: url('assets/community-gateway-collage.png'); background-size: 213.5% 198.918919%; background-position: 58.14978% 46.448087%; background-repeat: no-repeat; clip-path: polygon(4% 0,100% 0,100% 100%,0 100%,0 75%,4% 60%,4% 35%,0 20%); }
.community-gateway-button { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-md); min-height: 56px; padding: var(--space-md) var(--space-lg); background: var(--ink); color: var(--paper); border: 1px solid var(--ink); border-radius: 999px; font-size: 13px; line-height: 1.5; font-weight: 700; white-space: nowrap; }
.community-gateway-button > span { font-size: 22px; }
.community-gateway-button:hover { text-decoration: underline; text-underline-offset: 5px; }
.community-gateway-button:focus-visible { outline: 3px solid var(--ink); outline-offset: 5px; }
@media (max-width: 1100px) and (min-width: 901px) {
 .community-gateway { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) auto; gap: var(--space-sm); padding: var(--space-lg); }
 .community-gateway h2 { font-size: 24px; }
 .community-gateway-button { font-size: 12px; padding-inline: var(--space-md); }
}
@media (max-width: 900px) {
 .community-gateway { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 0 var(--space-lg); }
 .community-gateway-copy { grid-column: 1; grid-row: 1; }
 .community-gateway-collage { grid-column: 2; grid-row: 1 / 3; }
 .community-gateway-button { grid-column: 1; justify-self: start; margin-top: var(--space-lg); min-height: 48px; font-size: 13px; }
 .community-gateway h2 { font-size: 28px; }
}
@media (max-width: 680px) {
 .lp-activity-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
 .lp-activity-grid h3 { font-size: 24px; }
 .lp-activity-heading h2 { font-size: 28px; }
 .community-gateway-section { padding-inline: var(--space-lg); padding-block: var(--space-xl); }
 .community-gateway { grid-template-columns: minmax(0, 1fr); gap: 0; padding: var(--space-xl) var(--space-lg); }
 .community-gateway-copy, .community-gateway-collage, .community-gateway-button { grid-column: 1; grid-row: auto; }
 .community-gateway h2 { font-size: 28px; }
 .community-gateway-description { font-size: 14px; margin-top: var(--space-md); }
 .community-gateway-collage { margin: var(--space-lg) 0 var(--space-sm); }
 .community-gateway-button { justify-self: stretch; margin-top: var(--space-md); }
}
@media (max-width: 360px) { .community-gateway h2 { font-size: 24px; } }

/* Introduce the name immediately after the hero, before activity examples. */
.brand-story { padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
.brand-story .definition-name { margin-top: 0; grid-template-columns: minmax(0,1fr) minmax(0,1.65fr); }
.brand-story h2 { font-size: 24px; line-height: 1.6; font-weight: 700; letter-spacing: -.02em; }
@media (max-width:680px) { .brand-story .definition-name { grid-template-columns: minmax(0,1fr); gap: var(--space-md); } }

/* Activity examples lead to actual projects; store/LINE remain the hero action. */
.activity-project-link { margin-top: var(--space-lg); }
.activity-project-link svg { width: 18px; height: 18px; flex: none; }