/* Hallmark · macrostructure: Catalogue · genre: modern-minimal
 * theme: studied-DNA (source: landing-codex) · tone: direct, product-specific
 * nav: N11 shared menu · footer: Ft3 full-index category list
 * Hallmark · pre-emit critique: P5 H4 E4 S5 R4 V4
 * Native jump index; expanded Gmail reference; app-specific capabilities.
 * Shared nav/footer and existing walkthrough retained. No new animation. */
.gi-page { --gi-rule: var(--g-border); }
.gi-page :is(article, div)[id] { scroll-margin-top: 6rem; }
.gi-page p { text-wrap: pretty; }
.gi-page .gf-link { white-space: nowrap; }
.gi-label { margin: 0 0 1rem; font-family: var(--fp-font-outlier); font-size: 0.8125rem; line-height: 1.5; color: var(--g-text-2); }
.gi-hero { padding-block: 3rem 4rem; }
.gi-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: center; }
.gi-hero h1 { margin: 1rem 0 1.5rem; max-width: 18ch; font-size: var(--gf-display); line-height: 1.06; letter-spacing: -0.045em; font-weight: 650; }
.gi-lede { max-width: 54ch; margin: 0; color: var(--g-text-2); font-size: 1.125rem; line-height: 1.7; }
.gi-index { min-width: 0; padding: 1.5rem; background: var(--g-bg-raised); border: 1px solid var(--gi-rule); border-radius: var(--fp-radius-lg); }
.gi-index ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; }
.gi-index li { min-width: 0; }
.gi-index li a > span:first-child { white-space: nowrap; }
.gi-index li a { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; min-height: 3.25rem; padding-block: 0.75rem; border-top: 1px solid var(--gi-rule); font-size: 0.9375rem; line-height: 1.4; }
.gi-index a:hover { background: var(--g-card); }
.gi-index li a > span:last-child { color: var(--g-text-2); font-size: 0.75rem; }
.gi-index__more { display: flex; align-items: center; gap: 0.75rem; padding-top: 1rem; margin-top: 0.5rem; min-height: 2.75rem; border-top: 1px solid var(--gi-rule); font-size: 0.8125rem; line-height: 1.5; }
.gi-gmail, .gi-catalogue, .gi-voice, .gi-local { padding-block: var(--gf-space); }
.gi-gmail, .gi-catalogue--team { background: var(--g-bg-raised); }
.gi-section-heading { max-width: 47rem; margin-bottom: 3rem; }
.gi-section-heading h2, .gi-voice h2 { margin: 0 0 1.25rem; max-width: 26ch; font-size: var(--gf-heading); line-height: 1.14; letter-spacing: -0.035em; }
.gi-section-heading > p:last-child { margin: 0; max-width: 65ch; color: var(--g-text-2); }
.gi-gmail__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.gi-mail-example { background: var(--g-card); padding: 1.5rem; border: 1px solid var(--gi-rule); border-radius: var(--fp-radius-lg); }
.gi-example > span { display: block; margin-bottom: 0.75rem; font-family: var(--fp-font-outlier); font-size: 0.75rem; color: var(--g-text-2); }
.gi-example blockquote { margin: 0; padding: 0; border: 0; font-size: 0.9375rem; line-height: 1.7; color: var(--g-text); }
.gi-mail-example__draft { margin-top: 1.5rem; padding-block: 1.5rem 0.5rem; border-top: 1px solid var(--gi-rule); }
.gi-mail-example__draft h3 { margin: 0 0 1.5rem; font-size: 1.125rem; }
.gi-mail-example__draft p:not(.gi-label) { margin: 0 0 1rem; color: var(--g-text-2); font-size: 0.9375rem; }
.gi-capabilities { margin: 0; display: grid; gap: 1.5rem; }
.gi-capabilities > div { padding-top: 1.5rem; border-top: 1px solid var(--gi-rule); }
.gi-capabilities > div:first-child { padding-top: 0; border: 0; }
.gi-capabilities dt { margin-bottom: 0.5rem; font-size: 1.0625rem; font-weight: 600; }
.gi-capabilities dd { margin: 0; color: var(--g-text-2); font-size: 0.9375rem; }
.gi-gmail__connection { max-width: 74ch; margin: 2.5rem 0 0; color: var(--g-text-2); }
.gi-services { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; }
.gi-service { min-width: 0; padding-top: 1.5rem; border-top: 1px solid var(--gi-rule); }
.gi-service h3 { margin: 0 0 0.75rem; font-size: 1.375rem; line-height: 1.25; letter-spacing: -0.025em; }
.gi-service__heading { margin: 0 0 1rem; font-size: 1.0625rem; font-weight: 500; color: var(--g-text); }
.gi-service > p:not(.gi-boundary) { margin: 0 0 1rem; max-width: 64ch; color: var(--g-text-2); font-size: 0.9375rem; }
.gi-service ul { margin: 1rem 0 1.5rem; padding-left: 1.125rem; color: var(--g-text-2); font-size: 0.9375rem; }
.gi-service li { padding-left: 0.25rem; margin-top: 0.625rem; }
.gi-service .gi-example { padding: 1rem 1.25rem; background: var(--g-card); border-left: 2px solid var(--g-text-3); }
.gi-boundary { margin: 1.25rem 0 0; font-size: 0.8125rem; color: var(--g-text-2); line-height: 1.65; }
.gi-boundary strong { font-weight: 600; color: var(--g-text); }
.gi-service > .gf-link { margin-top: 0.75rem; font-size: 0.875rem; }
.gi-voice { border-bottom: 1px solid var(--gi-rule); }
.gi-voice__grid { display: grid; gap: 1.5rem; }
.gi-voice__grid > div:last-child p { margin: 0 0 1.25rem; max-width: 65ch; color: var(--g-text-2); }
.gi-voice__grid > div:last-child p:last-child { margin-bottom: 0; }
.gi-local__rows { margin: 0; }
.gi-local__rows > div { display: grid; gap: 0.75rem; border-top: 1px solid var(--gi-rule); padding-block: 1.5rem; }
.gi-local__rows dt { font-weight: 600; }
.gi-local__rows dt small { display: block; margin-top: 0.25rem; font-size: 0.75rem; font-weight: 400; color: var(--g-text-2); }
.gi-local__rows dd { margin: 0; max-width: 70ch; color: var(--g-text-2); font-size: 0.9375rem; }
.gi-browser { border-top: 1px solid var(--gi-rule); padding-top: 2rem; }
.gi-browser h3 { margin: 0 0 1rem; font-size: 1.25rem; }
.gi-browser p { max-width: 74ch; color: var(--g-text-2); }
.gi-connected-note { margin: 1.5rem 0 0; max-width: 74ch; color: var(--g-text-2); font-size: 0.9375rem; }
@media (min-width: 768px) {
  .gi-hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 2.5rem; }
  .gi-hero h1 { font-size: clamp(2.75rem, 4.3vw, 4.25rem); }
  .gi-gmail__grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 3rem; }
  .gi-services { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3.5rem 3rem; }
  .gi-services > :last-child:nth-child(odd) { grid-column: 1 / -1; max-width: 47rem; }
  .gi-voice__grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 3rem; }
  .gi-local__rows > div { grid-template-columns: minmax(0, 1fr) minmax(0, 2.5fr); gap: 3rem; }
}
@media (max-width: 374px) {
  .gi-index { padding: 1rem; }
  .gi-index ul { column-gap: 1rem; }
  .gi-index li a { font-size: 0.8125rem; }
}
@media (min-width: 375px) and (max-width: 1023px) {
  .gi-index { padding: 1rem; }
  .gi-index ul { column-gap: 1rem; }
  .gi-index li a { font-size: 0.875rem; }
}
@media (max-width: 1023px) {
  .gi-index li a > span:last-child { display: none; }
}
