body:has(.g17-about) { background: var(--g17-bg); color: var(--g17-text); }
:root {
	--g17-bg: #050608;
	--g17-panel: #101217;
	--g17-panel-2: #181b22;
	--g17-text: #f7f8fa;
	--g17-muted: #a9afb9;
	--g17-line: #2a2e37;
	--g17-blue: #78bfff;
	--g17-heading: #c5e4ff;
	--g17-accent: var(--g17-blue);
	--g17-action: #286ca8;
	--g17-accent-dark: #1d5080;
	--g17-focus: var(--g17-blue);
	--g17-header-height: 132px;
	--g17-drawer-width: 440px;
	--g17-display: "Orbitron", "Yu Gothic", "Meiryo", "Microsoft YaHei", sans-serif;
	--g17-body: "Rajdhani", "Yu Gothic", "Meiryo", "Microsoft YaHei", sans-serif;
}

body {
	--theme-font-family: var(--g17-body);
	--theme-headings-font-family: var(--g17-display);
	--theme-button-font-family: var(--g17-display);
	font-family: var(--g17-body);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--g17-display);
	font-weight: 600;
}

button, input, select, textarea, .button, .wp-element-button {
	font-family: var(--g17-body);
}

/* Public information pages share the storefront palette. */
.g17-about { max-width: 1100px; margin: 0 auto; padding: clamp(32px, 6vw, 88px) 0; }
.g17-about h1, .g17-about h2, .g17-about h3 { color: var(--g17-heading); line-height: 1.45; }
.g17-about h1 { max-width: 24ch; font-size: clamp(28px, 4vw, 48px); margin-bottom: 24px; }
.g17-about > p { max-width: 72ch; color: var(--g17-muted); font-size: 20px; }
.g17-about__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 48px 0; }
.g17-about__grid section { background: var(--g17-panel); border: 1px solid var(--g17-line); padding: 28px; }
.g17-about__grid h3 { font-size: 20px; }
.g17-about__grid p { color: var(--g17-muted); }
.g17-about a { color: var(--g17-blue); text-underline-offset: 5px; overflow-wrap: anywhere; }
.g17-about__links { display: flex; flex-wrap: wrap; gap: 16px 28px; }
@media (max-width: 767px) { .g17-about__grid { grid-template-columns: 1fr; margin: 32px 0; } }
