/* Presa Child — Annie Kaszina site chrome (header + footer).
   References the design-system --ds-* tokens emitted site-wide in Mode A. */

/* Global box-sizing: the design-system reset is scoped to .fl-ds-page and never reaches the chrome or
   plain block content, so width:100% + padding overflowed the viewport on mobile. This is the one safe,
   universally-expected global reset. */
*, *::before, *::after { box-sizing: border-box; }

.site-header, .site-footer { font-family: var(--ds-font-body); line-height: var(--ds-line-body); }
.site-header a, .site-footer a { text-decoration: none; }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,0.82); backdrop-filter: saturate(1.2) blur(12px); border-bottom: 1px solid transparent; transition: border-color .25s ease, background-color .25s ease; }
.site-header.is-scrolled { background: rgba(255,255,255,0.94); border-bottom-color: var(--ds-color-line); }
.site-header__inner { width: 100%; max-width: var(--ds-container); margin-inline: auto; padding-inline: var(--ds-space-6); display: flex; align-items: center; justify-content: space-between; gap: var(--ds-space-5); min-height: 76px; }
.site-header__logo { display: flex; align-items: center; gap: 12px; }
.site-header__logo:hover { color: inherit; }
.site-header__avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; object-position: center top; box-shadow: 0 0 0 1px var(--ds-color-line); }
.site-header__name { font-family: var(--ds-font-display); font-weight: var(--ds-weight-med); font-size: 1.4rem; letter-spacing: 0.005em; color: var(--ds-color-ink); }
.site-nav { display: flex; align-items: center; gap: var(--ds-space-6); }
.site-nav ul { display: flex; align-items: center; gap: var(--ds-space-6); list-style: none; margin: 0; padding: 0; }
.site-nav a { color: var(--ds-color-ink-80); font-weight: var(--ds-weight-semi); font-size: var(--ds-text-sm); }
.site-nav a:hover { color: var(--ds-color-accent); }
.site-nav .current-menu-item > a, .site-nav a[aria-current="page"] { color: var(--ds-color-accent); }
.header-actions { display: flex; align-items: center; gap: var(--ds-space-4); }
.substack-link { display: inline-flex; align-items: center; gap: 8px; font-weight: var(--ds-weight-semi); font-size: var(--ds-text-sm); color: var(--ds-color-ink-80); }
.substack-link:hover { color: var(--ds-color-accent); }
.substack-link svg { width: 16px; height: 16px; flex: none; display: block; color: var(--ds-color-accent); }
.nav-toggle { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.nav-toggle span { display: block; width: 24px; height: 2px; background: var(--ds-color-ink); margin: 5px 0; transition: .2s ease; }

.site-footer { background: var(--ds-color-navy-deep); color: var(--ds-color-on-dark-70); padding-block: var(--ds-space-8) var(--ds-space-6); }
.site-footer__inner { width: 100%; max-width: var(--ds-container); margin-inline: auto; padding-inline: var(--ds-space-6); }
.site-footer a { color: var(--ds-color-on-dark-70); }
.site-footer a:hover { color: #fff; }
.footer-grid { display: grid; grid-template-columns: 1.7fr 1fr 1fr; gap: var(--ds-space-8); }
.footer-brand__mark { font-family: var(--ds-font-display); font-size: 1.5rem; color: #fff; margin-bottom: var(--ds-space-4); }
.footer-brand p { max-width: 34ch; font-size: var(--ds-text-sm); }
.footer-col h2 { color: #fff; font-family: var(--ds-font-body); font-size: var(--ds-text-sm); font-weight: var(--ds-weight-bold); line-height: 1.2; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: var(--ds-space-4); }
.footer-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ds-space-3); font-size: var(--ds-text-sm); }
.footer-legal { margin-top: var(--ds-space-8); padding-top: var(--ds-space-5); border-top: 1px solid rgba(247,241,245,0.14); display: flex; justify-content: space-between; gap: var(--ds-space-4); flex-wrap: wrap; font-size: var(--ds-text-xs); color: var(--ds-color-on-dark-45); }

@media (max-width: 1080px) {
  .site-nav { position: absolute; top: 76px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: #fff; border-top: 1px solid var(--ds-color-line); border-bottom: 1px solid var(--ds-color-line); padding: var(--ds-space-3) var(--ds-space-6) var(--ds-space-6); box-shadow: var(--ds-shadow-soft); display: none; }
  .site-nav.is-open { display: flex; }
  .site-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
  .site-nav a { display: block; padding: var(--ds-space-4) 0; border-bottom: 1px solid var(--ds-color-line); }
  .site-nav li:last-child a { border-bottom: 0; }
  .nav-toggle { display: block; }
  .header-actions .btn { display: none; }
}
@media (max-width: 980px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .footer-grid { grid-template-columns: 1fr; gap: var(--ds-space-6); }
}
@media (max-width: 560px) {
  .site-header__inner { padding-inline: var(--ds-space-4); gap: var(--ds-space-4); }
  .site-header__name { font-size: 1.2rem; }
  .substack-link__label { display: none; }
}

/* ===== Gravity Forms brand tint (interim; move with chrome to functions.php section 10 at production) =====
   Philosophy: lean on GF's own orbital stylesheet; massage only brand-critical bits with our tokens and
   do NOT reshape GF's native controls (keeps every field type working with no bespoke per-type CSS).
   GF prints an inline #gform_wrapper_N var block (ID specificity), so the remapped vars + button colour
   are forced with !important; everything else stays GF-native. */
body .gform_wrapper.gform-theme--orbital {
  --gf-form-gap-y: var(--ds-space-4, 16px) !important; /* tighten inter-field spacing (was GF orbital default) */
  --gf-color-primary: var(--ds-color-accent, #C6096A) !important;
  --gf-color-primary-rgb: 198, 9, 106 !important;
  --gf-color-primary-contrast: #ffffff !important;
  --gf-color-primary-darker: var(--ds-color-accent-deep, #A1064F) !important;
  --gf-color-primary-darkest: var(--ds-color-accent-deep, #A1064F) !important;
  --gf-ctrl-border-color-focus: var(--ds-color-accent, #C6096A) !important;
  --gf-ctrl-radius: 6px !important;
}
body .gform_wrapper.gform-theme--orbital .gform_footer .gform_button,
body .gform_wrapper.gform-theme--orbital .gform_footer input[type="submit"] {
  background-color: var(--ds-color-accent, #C6096A) !important;
  color: #fff !important;
}
body .gform_wrapper.gform-theme--orbital .gform_footer .gform_button:hover,
body .gform_wrapper.gform-theme--orbital .gform_footer input[type="submit"]:hover {
  background-color: var(--ds-color-accent-deep, #A1064F) !important;
}
/* Confirmation message: our surface panel instead of GF's bare text line. */
body .gform_confirmation_message {
  padding: var(--ds-space-5, 20px); border-radius: var(--ds-radius-lg, 16px);
  background: var(--ds-color-surface-2, #F6E7F0); color: var(--ds-color-ink, #1E2749); font-weight: 600;
}