.buildpress-gjc-about-principles { --gjc-about-ink: var(--e-global-color-primary, #050505); --gjc-about-text: var(--e-global-color-text, #333333); --gjc-about-accent: var(--e-global-color-accent, #e3185c); --gjc-about-line: color-mix(in srgb, var(--gjc-about-ink) 14%, transparent); padding: 4.5rem 1.5rem 7rem; color: var(--gjc-about-ink); background: var(--e-global-color-900224d, #ffffff); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__inner { width: min(100%, 75rem); margin-inline: auto; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__head { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(19rem, 0.7fr); gap: clamp(2rem, 8vw, 7rem); align-items: start; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__eyebrow { display: inline-flex; gap: 0.45rem; align-items: center; margin: 0; color: var(--gjc-about-accent); font-family: var(--e-global-typography-accent-font-family, sans-serif); font-size: var(--e-global-typography-accent-font-size, 0.875rem); font-weight: 700; line-height: 1.2; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__context-icon { display: block; flex: 0 0 auto; width: 1.125rem; height: 1.125rem; overflow: visible; stroke: currentColor; stroke-width: 1.8; vector-effect: non-scaling-stroke; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__head h2 { max-width: 16ch; margin: 0; color: var(--gjc-about-ink); font-family: var(--e-global-typography-primary-font-family, sans-serif); font-size: 2.625rem; font-weight: var(--e-global-typography-primary-font-weight, 700); line-height: var(--e-global-typography-primary-line-height, 1.08); text-wrap: balance; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__head div > p { max-inline-size: 44ch; margin: 1rem 0 0; color: var(--gjc-about-text); font-family: var(--e-global-typography-text-font-family, sans-serif); font-size: var(--e-global-typography-text-font-size, 1rem); line-height: var(--e-global-typography-text-line-height, 1.6); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin-top: 3.25rem; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__values article { min-width: 0; padding: 1.25rem 0 0; border-top: 0.0625rem solid var(--gjc-about-line); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__value-meta, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating-meta { display: flex; align-items: center; justify-content: space-between; color: var(--gjc-about-accent); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__value-meta span, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating-meta span { font-family: var(--e-global-typography-accent-font-family, sans-serif); font-size: var(--e-global-typography-accent-font-size, 0.75rem); font-weight: 800; line-height: 1.2; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__value-meta svg, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating-meta svg { width: 1.5rem; height: 1.5rem; stroke: currentColor; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__values h3, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating h3 { margin: 1.25rem 0 0; color: var(--gjc-about-ink); font-family: var(--e-global-typography-primary-font-family, sans-serif); font-size: 1.1rem; font-weight: var(--e-global-typography-primary-font-weight, 700); line-height: var(--e-global-typography-primary-line-height, 1.2); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__values p, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating article > p { margin: 0.75rem 0 0; color: var(--gjc-about-text); font-family: var(--e-global-typography-text-font-family, sans-serif); font-size: var(--e-global-typography-text-font-size, 0.875rem); line-height: var(--e-global-typography-text-line-height, 1.6); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(19rem, 0.7fr); gap: clamp(2rem, 8vw, 7rem); align-items: center; margin-top: 5rem; padding-block: 2.5rem; border-block: 0.0625rem solid var(--gjc-about-line); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization figure { display: grid; place-items: center; min-height: 20rem; margin: 0; padding: 2rem; background: color-mix(in srgb, var(--e-global-color-a272205, #d5f0fc) 40%, var(--e-global-color-900224d, #ffffff)); border-radius: 0.5rem; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization img { display: block; width: 100%; height: auto; mix-blend-mode: multiply; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization-copy > p:first-child, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating header > p { margin: 0; color: var(--gjc-about-accent); font-family: var(--e-global-typography-accent-font-family, sans-serif); font-size: var(--e-global-typography-accent-font-size, 0.75rem); font-weight: 700; line-height: 1.2; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization h2, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating h2 { max-width: 15ch; margin: 0.875rem 0 0; color: var(--gjc-about-ink); font-family: var(--e-global-typography-primary-font-family, sans-serif); font-size: 2.325rem; font-weight: var(--e-global-typography-primary-font-weight, 700); line-height: var(--e-global-typography-primary-line-height, 1.1); text-wrap: balance; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization-copy > p:last-child { max-inline-size: 44ch; margin: 1.25rem 0 0; color: var(--gjc-about-text); font-family: var(--e-global-typography-text-font-family, sans-serif); font-size: var(--e-global-typography-text-font-size, 1rem); line-height: var(--e-global-typography-text-line-height, 1.6); }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating { margin-top: 5rem; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating > header { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(19rem, 0.7fr); gap: clamp(2rem, 8vw, 7rem); align-items: start; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating article { min-width: 0; padding: 1.25rem 0 0; border-top: 0.0625rem solid var(--gjc-about-line); }
@media (max-width: 767px) { .buildpress-gjc-about-principles { padding: 3.5rem 1rem 5rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__head, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating > header, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__values, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating > div { grid-template-columns: 1fr; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__head { gap: 0.75rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__values { gap: 1.5rem; margin-top: 2.5rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization, .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating { margin-top: 3.5rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization { padding-block: 1.5rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__organization figure { min-height: 0; padding: 1rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating > header { gap: 0.875rem; } .buildpress-gjc-about-principles .buildpress-gjc-about-principles__operating > div { gap: 1.5rem; margin-top: 1.5rem; } }