/*
  GK STUDIO — Global Typography Normalization
  Compensates for Squarespace platform CSS not loading in the static mirror.
  Font: Poppins (locally cached at /fonts.googleapis.com/poppins.css)
*/

/* ─── Base ─────────────────────────────────────── */
html, body {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important;
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: #1a1a1a !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* ─── Headings — family + weight only, no size (inline styles win) ─── */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
}

h1 {
  font-weight: 300 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.05 !important;
}

h2 {
  font-weight: 300 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.1 !important;
}

h3 {
  font-weight: 400 !important;
  letter-spacing: 0em !important;
  line-height: 1.35 !important;
}

h4 {
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
}

/* ─── Body copy ─────────────────────────────────── */
p, li, blockquote {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 300 !important;
  line-height: 1.75 !important;
  letter-spacing: 0em !important;
}

/* ─── Squarespace-specific large body text class ─── */
.sqsrte-large {
  font-size: 15px !important;
  line-height: 1.8 !important;
  font-weight: 300 !important;
  letter-spacing: 0em !important;
}

/* ─── Strong / em ─────────────────────────────── */
strong, b {
  font-weight: 600 !important;
}

em, i {
  font-style: italic !important;
}

/* ─── Links ─────────────────────────────────────── */
a {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
}

/* ─── Nav (shared across sub-pages) ────────────── */
.header-nav-item a,
.nav-wrapper a {
  font-weight: 500 !important;
  letter-spacing: 0.08em !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
}

/* ─── Section overview intros (top of each page) ── */
.sqs-html-content .sqsrte-large:first-child {
  font-size: 16px !important;
  line-height: 1.8 !important;
  font-weight: 300 !important;
}

/* ─── Image captions ─────────────────────────────── */
figcaption, .image-caption, .image-caption p {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.5 !important;
  opacity: 0.65 !important;
}

/* ─── Gallery / slideshow meta text ──────────────── */
.sqs-gallery-meta-container,
.slide-title, .slide-description {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0.04em !important;
}

/* ─── Buttons ─────────────────────────────────────── */
.sqs-block-button-element,
button, [role="button"] {
  font-family: 'Poppins', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 500 !important;
  letter-spacing: 0.06em !important;
}

/* ─── Universal bright-inverse background fix ──────── */
/* SQS bright-inverse sections without a background image/video show a dark
   gray slab because the platform CSS sets a dark background-color on the
   section element. We force transparent so the white page body shows through.
   Sections that DO have a background image/video are fine: the dark overlay
   comes from .section-background + ::after, not the element background-color. */
section.page-section.bright-inverse {
  background-color: transparent !important;
}
section.page-section.bright-inverse .section-background {
  background-color: transparent !important;
}
section.page-section.bright-inverse h1,
section.page-section.bright-inverse h2,
section.page-section.bright-inverse h3,
section.page-section.bright-inverse h4,
section.page-section.bright-inverse p,
section.page-section.bright-inverse li,
section.page-section.bright-inverse figcaption,
section.page-section.bright-inverse .sqsrte-large {
  color: #111 !important;
}