/* ============================================================================
 * project.css (v204300) — one project, one look.
 * Brings the Community (oga.asia), About, Terms and Privacy sections in line
 * with the rest of the site (Temples, Tours, Guides…):
 *   page container 1180px · section titles 24px/600 · red 13px labels like the
 *   page-head identity label · white cards, 1px border, 12px corners · light
 *   panels (no dark blocks) · 6px buttons · theme FAQ and call-to-action band ·
 *   64px between sections. Loaded on every page after the other sheets.
 * ==========================================================================*/

/* Container — the same width as every page */
body .ogx-main.oga-container.ogx-page--community,
body .ogx-main.oga-container.ogi { max-width: calc(var(--ogx-container, 1180px) + 64px); margin-left: auto; margin-right: auto; }

/* Section rhythm */
.ogp, .ogi-about { gap: 64px !important; margin: 28px 0 0 !important; }
.ogp-sec, .ogi-block { margin: 0; }

/* Section titles = theme section titles */
.ogp .ogp-h, .ogi .ogi-h { font-size: 24px !important; font-weight: 600 !important; line-height: 1.25; letter-spacing: 0; color: var(--oga-ink) !important; margin: 0 0 16px !important; }
.ogp .ogp-h--sm, .ogi .ogi-h--sm { font-size: 20px !important; }
.ogp h3, .ogi h3 { font-weight: 600; }

/* Small labels = the red identity label above page titles */
.ogp-kicker, .ogi-kicker { font-size: 13px !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; color: var(--oga-flag) !important; margin-bottom: 6px !important; }

/* Lead panels (Community pitch, About intro) */
.ogp-pitch, .ogi-intro { border-radius: 12px !important; }
.ogp-pitch__title { font-size: clamp(26px, 3.2vw, 36px) !important; font-weight: 700 !important; color: var(--oga-ink) !important; letter-spacing: -.01em; }
.ogp-pitch__text { color: var(--oga-ink-muted); }

/* Cards: white, 1px border, 12px corners — no coloured top bars */
.ogp-aud__card, .ogi-card, .ogp-net, .ogi-two > div, .ogp-step, .ogi-help, .ogi-fact, .ogi-toc__box, .ogi-summary {
	border-radius: 12px !important; border: 1px solid var(--oga-border) !important; box-shadow: none;
}
.ogp-aud__card, .ogi-card { border-top-width: 1px !important; }
.ogp-step { background: #fff !important; }
.ogp-feats { border-radius: 12px !important; }
.ogp-aud__title, .ogi-card h3 { font-size: 20px !important; }

/* Light panels instead of dark blocks */
.ogp-promise, .ogi-values { background: var(--oga-mist) !important; color: var(--oga-ink) !important; border: 1px solid var(--oga-border); border-radius: 12px !important; }
.ogp-promise .ogp-h, .ogi-values h3 { color: var(--oga-ink) !important; }
.ogp-ticks--light li, .ogi-values span { color: var(--oga-ink-muted) !important; }
.ogi-values b { color: var(--oga-ink); }
.ogp-ticks--light svg { color: var(--oga-flag) !important; }

/* Buttons = theme buttons */
.ogp-btn, .ogi-btn { border-radius: 6px !important; font-weight: 600 !important; min-height: 46px; padding: 0 22px !important; font-size: 16px !important; }

/* FAQ + call-to-action band inside these pages use the theme components; keep their spacing even */
.ogp .oga-faq__list, .ogi .oga-faq__list { gap: 8px; }
.ogp .oga-cta-band, .ogi .oga-cta-band { margin: 0 !important; }
.oga-cta-band .oga-btn { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.oga-cta-band__fine a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.oga-cta-band h2 { color: #fff !important; }

/* Where next sits the same distance below every page */
nav.ogx-next.oga-container { margin-top: 56px !important; padding-top: 0 !important; border-top: 0 !important; }

/* Roadmap dots + network tiles follow the card style */
.ogp-node { border-radius: 10px !important; }

@media (max-width: 640px) {
	.ogp, .ogi-about { gap: 44px !important; }
	.ogp .ogp-h, .ogi .ogi-h { font-size: 22px !important; }
	.ogp-pitch__title { font-size: 26px !important; }
	.oga-cta-band { padding: 28px 20px !important; }
	.oga-cta-band .oga-btn { width: 100%; justify-content: center; }
	nav.ogx-next.oga-container { margin-top: 40px !important; }
}

/* Theme CTA band inside Community / About: keep its centred text and white links */
.ogp .oga-cta-band, .ogi .oga-cta-band { text-align: center; }
.ogp .oga-cta-band p, .ogi .oga-cta-band p { max-width: 680px; margin: 0 auto 16px !important; color: rgba(255,255,255,.9); }
.ogp .oga-cta-band .oga-cta-band__tagline, .ogi .oga-cta-band .oga-cta-band__tagline { color: rgba(255,255,255,.88); margin-bottom: 10px !important; }
.ogp .oga-cta-band h2, .ogi .oga-cta-band h2 { margin: 0 0 10px !important; font-size: clamp(22px, 2.6vw, 26px); font-weight: 600; }
.ogp .oga-cta-band .oga-cta-band__fine, .ogi .oga-cta-band .oga-cta-band__fine { margin: 16px auto 0 !important; font-size: 14px; color: rgba(255,255,255,.8); }
.oga-cta-band .oga-cta-band__fine a { color: #fff !important; font-weight: 600; }
.oga-cta-band .oga-btn { color: var(--oga-navy) !important; }
/* Numbered values keep white numbers on red */
.ogi-values li::before { color: #fff !important; }

/* ── v204400: one-row headline hooks ──────────────────────────────────────
   About   "Local knowledge. Personal service. Digital growth."
   Community "Real places. Real experiences. Local knowledge."
   One line on tablets and desktops (sized to fit the column); balanced
   wrapping on phones so the words stay readable. */
body.ogx-pagekey--about .ogx-pagehead .oga-archive__head-copy,
body.ogx-pagekey--community .ogx-pagehead .oga-archive__head-copy { max-width: none !important; }
body.ogx-pagekey--about .ogx-pagehead .oga-archive__lede,
body.ogx-pagekey--community .ogx-pagehead .oga-archive__lede { max-width: 72ch; }
body.ogx-pagekey--about .ogx-pagehead__title,
body.ogx-pagekey--community .ogx-pagehead__title { max-width: none !important; text-wrap: balance; letter-spacing: -.015em; }
@media (min-width: 768px) {
	body.ogx-pagekey--about main .ogx-pagehead .ogx-pagehead__title,
	body.ogx-pagekey--community main.ogx-page--community > .ogx-pagehead .ogx-pagehead__title,
	body.ogx-pagekey--community .ogx-pagehead__title { white-space: nowrap; font-size: clamp(22px, 3.05vw, 40px) !important; line-height: 1.15; }
}
@media (max-width: 767px) {
	body.ogx-pagekey--about main .ogx-pagehead .ogx-pagehead__title,
	body.ogx-pagekey--community main.ogx-page--community > .ogx-pagehead .ogx-pagehead__title,
	body.ogx-pagekey--about .ogx-pagehead__title,
	body.ogx-pagekey--community .ogx-pagehead__title { font-size: 30px !important; line-height: 1.15; }
}

/* ── v204400: About › Our brands + Our network ─────────────────────────── */
.ogi-brands { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.ogi-brand { display: flex; flex-direction: column; padding: 24px; border: 1px solid var(--oga-border); border-radius: 12px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.ogi-brand:hover { border-color: var(--oga-navy); box-shadow: var(--oga-shadow); }
.ogi-brand__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.ogi-brand__icon { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: var(--oga-navy); color: #fff; }
.ogi-brand:nth-child(2) .ogi-brand__icon { background: var(--oga-flag); }
.ogi-brand:nth-child(3) .ogi-brand__icon { background: var(--oga-night); }
.ogi-brand__tag { font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: var(--oga-mist); border: 1px solid var(--oga-border); color: var(--oga-ink-muted); }
.ogi .ogi-brand__name { font-size: 22px !important; font-weight: 700 !important; line-height: 1.2; margin: 0 0 6px !important; color: var(--oga-ink); overflow-wrap: anywhere; }
.ogi-brand__full { font-size: 14.5px; line-height: 1.45; color: var(--oga-ink); font-weight: 500; margin: 0 0 6px !important; }
.ogi-brand__text { font-size: 14.5px; line-height: 1.5; color: var(--oga-ink-muted); margin: 0 !important; }
.ogi-brand__link { margin-top: auto; padding-top: 18px; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-family: var(--ogx-font-mono); font-size: 14px; color: var(--oga-navy); text-decoration: none; overflow-wrap: anywhere; }
.ogi-brand__link:hover { color: var(--oga-flag); }

.ogi-net { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ogi-net a { display: flex; align-items: center; gap: 12px; height: 100%; box-sizing: border-box; padding: 14px 16px; border: 1px solid var(--oga-border); border-radius: 12px; background: var(--oga-mist); color: var(--oga-ink); text-decoration: none; }
.ogi-net a:hover { border-color: var(--oga-navy); background: #fff; }
.ogi-net__icon { width: 36px; height: 36px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 1px solid var(--oga-border); color: var(--oga-navy); }
.ogi-net b { display: block; font-family: var(--ogx-font-mono); font-size: 14px; color: var(--oga-navy); overflow-wrap: anywhere; }
.ogi-net small { display: block; font-size: 13.5px; color: var(--oga-ink-muted); }
.ogi-net a > span:last-child { min-width: 0; }

@media (max-width: 1023px) {
	.ogi-brands { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ogi-brands .ogi-brand:last-child { grid-column: 1 / -1; }
	.ogi-net { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.ogi-brands { grid-template-columns: 1fr; }
	.ogi-brands .ogi-brand:last-child { grid-column: auto; }
}
@media (prefers-reduced-motion: reduce) { .ogi-brand { transition: none; } }

/* v204600: Terms / Privacy — no date / reading-time row; the document starts right under the page head */
.ogi .ogi-doc { margin-top: 28px; }
