/* Canonical public shell and final design-system authority. */
:root {
  --site-header-height: 88px;
  --site-container: 1180px;
  --site-gutter: 24px;
  --site-section-compact: 56px;
  --site-section-standard: 80px;
  --site-section-feature: 104px;
  --site-copy: 70ch;
  --site-quote: 48ch;
}

.header { min-height: var(--site-header-height); }
.header__container {
  height: var(--site-header-height) !important;
  min-height: var(--site-header-height) !important;
  width: min(var(--site-container), calc(100% - (var(--site-gutter) * 2))) !important;
}
.header__title { font-size: 1.35rem !important; line-height: 1.1 !important; }
.header__subtitle { font-size: .75rem !important; line-height: 1.25 !important; }
.header__nav-list, .header__nav-item { align-items: center !important; }
.header__nav-link {
  align-items: center !important;
  display: inline-flex !important;
  font-size: .92rem !important;
  line-height: 1 !important;
  min-height: 44px !important;
}

.consulting-container,
.case-rebuild > section > .container,
.auteur-page main > section > .container {
  width: min(var(--site-container), calc(100% - (var(--site-gutter) * 2)));
  margin-inline: auto;
}

.consulting-section { padding-block: var(--site-section-standard); }
.consulting-section--compact { padding-block: var(--site-section-compact); }
.consulting-hero { padding-block: var(--site-section-feature); }

.consulting-display {
  font-size: clamp(3.5rem, 5vw, 5rem);
  line-height: 1;
  max-width: 16ch;
}
.consulting-intro { margin-bottom: clamp(32px, 4vw, 52px); }
.consulting-intro p,
.consulting-lede,
.case-rebuild__prose,
.case-rebuild__section-heading--split > p { max-width: var(--site-copy); }
.consulting-quote { max-width: 960px; margin-inline: auto; }
.consulting-quote p { max-width: var(--site-quote); }
.consulting-eyebrow,
.consulting-snapshot__label,
.consulting-day span,
.work-kicker,
.case-rebuild__eyebrow,
.case-rebuild__kicker,
.auteur-eyebrow,
.auteur-kicker { font-size: max(12px, .75rem) !important; }

.btn { font-size: .95rem !important; min-height: 48px !important; padding: .8rem 1.1rem !important; }
.btn, button, summary,
.header__nav-link,
.mobile-menu nav a { min-height: 44px; }

.consulting-cta { padding: clamp(32px, 5vw, 56px); }
.consulting-cta h2 { font-size: clamp(2rem, 3.6vw, 3.35rem); }
.consulting-faq { padding-bottom: 0; }
.consulting-faq details:last-child { margin-bottom: 0; }
.inquiry-section { padding-block: var(--site-section-standard); }

.consulting-footer {
  border-top: 1px solid rgba(85, 216, 239, .14);
  background: #07101f;
}
.consulting-footer__inner {
  align-items: center;
  display: grid;
  gap: 1.25rem 2rem;
  grid-template-columns: auto 1fr;
  min-height: 132px;
  padding-block: 1.5rem;
}
.consulting-footer__brand { color: #93a4bb; font-size: .86rem; }
.consulting-footer__nav,
.consulting-footer__utility { display: flex; flex-wrap: wrap; gap: .7rem 1.15rem; justify-content: flex-end; }
.consulting-footer__utility { grid-column: 1 / -1; padding-top: 1rem; border-top: 1px solid rgba(166,236,246,.09); }
.consulting-footer a { color: #c8d3df; font-size: .88rem; text-decoration: none; }
.consulting-footer a:hover, .consulting-footer a:focus-visible { color: #55d8ef; }

.perspective-avatar--monogram {
  background: linear-gradient(145deg, rgba(0,127,153,.22), rgba(164,138,229,.18));
  border-color: rgba(85,216,239,.38);
  box-shadow: inset 0 0 0 3px rgba(7,16,31,.35);
  letter-spacing: .05em;
}

.consulting-browser__screen small { font-size: 12px !important; }

/* Vivid Resume: express founder judgment as a gated decision sequence. */
section[aria-labelledby="judgment-title"] .consulting-grid { counter-reset: decision-gate; }
section[aria-labelledby="judgment-title"] .consulting-card {
  border-top: 3px solid var(--consulting-accent, #55d8ef);
  counter-increment: decision-gate;
  position: relative;
}
section[aria-labelledby="judgment-title"] .consulting-card::before {
  align-items: center;
  background: #07101f;
  border: 1px solid rgba(85,216,239,.4);
  border-radius: 999px;
  color: #55d8ef;
  content: '0' counter(decision-gate);
  display: flex;
  font: 700 12px/1 "JetBrains Mono", monospace;
  height: 32px;
  justify-content: center;
  position: absolute;
  right: 20px;
  top: -18px;
  width: 32px;
}

.consulting-shell section[aria-labelledby="privacy-title"] .consulting-container { max-width: 900px !important; }
.consulting-shell section[aria-labelledby="privacy-title"] .consulting-card > h2:not(:first-child) {
  border-top: 1px solid rgba(166,236,246,.13);
  margin-top: 2rem;
  padding-top: 2rem;
}

@media (max-width: 960px) {
  :root { --site-section-feature: 80px; }
  .consulting-display { max-width: 18ch; }
  .about-portrait { margin-inline: 0; max-width: 520px; }
}

@media (max-width: 840px) {
  :root { --site-header-height: 76px; }
  .header { min-height: var(--site-header-height); }
  .header__title { font-size: 1.22rem !important; }
  .header__subtitle { font-size: .75rem !important; letter-spacing: .08em !important; }
}

@media (max-width: 640px) {
  :root {
    --site-gutter: 16px;
    --site-section-compact: 40px;
    --site-section-standard: 56px;
    --site-section-feature: 64px;
  }
  .consulting-section { padding-block: var(--site-section-standard); }
  .consulting-hero { min-height: 0; padding-block: var(--site-section-feature); }
  .consulting-hero__grid { gap: 2rem; }
  .consulting-display { font-size: clamp(2.25rem, 10vw, 2.75rem); line-height: 1.02; max-width: none; }
  .consulting-lede { font-size: 1rem; line-height: 1.58; }
  .consulting-actions { margin-top: 1.5rem; }
  .consulting-actions .btn { min-height: 48px; }
  .consulting-actions .btn--ghost { background: transparent; border-color: transparent; box-shadow: none; }
  .consulting-snapshot { margin-top: 1rem; }
  .about-profile { gap: 2rem; }
  .about-portrait { max-height: 420px; width: 100%; }
  .about-portrait img { height: 360px; object-fit: cover; object-position: center 22%; }
  .inquiry-section { padding-block: 48px 56px; }
  .inquiry-layout { gap: 2.5rem; }
  .inquiry-form { padding: 24px 20px; }
  .inquiry-grid { gap: 1rem; }
  .inquiry-field textarea { min-height: 150px; }
  .consulting-faq { overflow: visible; padding-bottom: 0; }
  .consulting-card { padding: 24px; }
  .consulting-cta { padding: 32px 20px; }
  .consulting-footer__inner {
    align-items: center;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding-block: 32px;
    text-align: center;
  }
  .consulting-footer__nav, .consulting-footer__utility { justify-content: center; }
  .consulting-footer__nav, .consulting-footer__utility { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .consulting-footer *, .header * { scroll-behavior: auto !important; }
}

/* --------------------------------------------------------------------------
   Canonical site header

   The newer consulting pages and the legacy case-study bundle both define the
   header. Keep this final block authoritative so the navigation cannot change
   size, alignment, breakpoint, or colour from one route to another.
   -------------------------------------------------------------------------- */
html body .header {
  position: sticky !important;
  inset: 0 0 auto !important;
  z-index: 1000 !important;
  width: 100% !important;
  min-height: var(--site-header-height) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(85, 216, 239, .1) !important;
  background: rgba(7, 16, 31, .96) !important;
  box-shadow: none !important;
  color: #e1e8ef !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

html body .header__container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 32px !important;
  width: min(var(--site-container), calc(100% - (var(--site-gutter) * 2))) !important;
  max-width: none !important;
  height: var(--site-header-height) !important;
  min-height: var(--site-header-height) !important;
  margin-inline: auto !important;
  padding: 0 !important;
}

html body .header__logo {
  position: static !important;
  display: grid !important;
  flex: 0 0 auto !important;
  gap: 2.4px !important;
  grid-template-rows: 23.76px 15px !important;
  height: 41.16px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  text-decoration: none !important;
}

html body .header__title {
  display: block !important;
  margin: 0 !important;
  background: linear-gradient(90deg, #28caeb, #a48ae5) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  color: #55d8ef !important;
  font-family: "Paytone One", sans-serif !important;
  font-size: 21.6px !important;
  font-weight: 400 !important;
  letter-spacing: .01em !important;
  line-height: 1.1 !important;
  height: 23.76px !important;
  -webkit-text-fill-color: transparent !important;
}

html body .header__subtitle {
  display: block !important;
  margin: 0 !important;
  color: #b9c6d7 !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  letter-spacing: 1.32px !important;
  line-height: 15px !important;
  height: 15px !important;
  text-transform: uppercase !important;
}

html body .header__nav {
  display: block !important;
  min-width: 0 !important;
  margin-left: auto !important;
}

html body .header__nav-list {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: clamp(7.2px, 2vw, 25.6px) !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

html body .header__nav-item {
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body .header__nav-link {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 10.4px 13.6px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #c8d3df !important;
  font-family: "DM Sans", system-ui, sans-serif !important;
  font-size: 14.72px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

html body .header__nav-link:hover,
html body .header__nav-link:focus-visible,
html body .header__nav-link.active,
html body .header__nav-link[aria-current="page"] {
  background: #102a3d !important;
  color: #55d8ef !important;
}

html body .header__nav-link--accent::after {
  content: none !important;
}

html body .mobile-menu-toggle {
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 54px !important;
  flex-direction: column !important;
  gap: 0 !important;
  width: 54px !important;
  min-width: 54px !important;
  max-width: 54px !important;
  height: 54px !important;
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 15px !important;
  border: 1px solid rgba(166, 236, 246, .16) !important;
  border-radius: 8px !important;
  background: #111a2b !important;
  box-shadow: none !important;
  color: #fff !important;
}

html body .mobile-menu-toggle span {
  display: block !important;
  flex: 0 0 auto !important;
  width: 23px !important;
  height: 2px !important;
  margin: 2.5px 0 !important;
  border-radius: 2px !important;
  background: currentColor !important;
}

html body .mobile-menu,
html body .mobile-menu-backdrop {
  display: none !important;
}

@media (max-width: 840px) {
  html body .header__container {
    gap: 16px !important;
  }

  html body .header__title {
    font-size: 19.52px !important;
    height: 21.472px !important;
  }

  html body .header__subtitle {
    font-size: 12px !important;
    letter-spacing: .96px !important;
  }

  html body .header__logo {
    grid-template-rows: 21.472px 15px !important;
    height: 38.872px !important;
  }

  html body .header__nav {
    display: none !important;
  }

  html body .mobile-menu-toggle {
    display: flex !important;
  }

  html body .mobile-menu {
    position: fixed !important;
    inset: 0 0 0 auto !important;
    z-index: 1100 !important;
    display: block !important;
    width: min(86vw, 380px) !important;
    max-width: 380px !important;
    height: 100dvh !important;
    margin: 0 !important;
    padding: 88px 24px 32px !important;
    overflow-y: auto !important;
    visibility: hidden !important;
    transform: translateX(105%) !important;
    border: 0 !important;
    background: #0d1828 !important;
    box-shadow: -24px 0 60px rgba(0, 0, 0, .35) !important;
    transition: transform .24s ease, visibility .24s !important;
  }

  html body .mobile-menu.active {
    right: 0 !important;
    visibility: visible !important;
    transform: translateX(0) !important;
  }

  html body .mobile-menu nav {
    display: grid !important;
    gap: 0 !important;
    margin: 0 !important;
  }

  html body .mobile-menu nav a:not(.btn) {
    display: flex !important;
    align-items: center !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 14.4px 12px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(166, 236, 246, .12) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #e1e8ef !important;
    font-family: "DM Sans", system-ui, sans-serif !important;
    font-size: 16.8px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    text-decoration: none !important;
    transform: none !important;
  }

  html body .mobile-menu nav a:not(.btn):hover,
  html body .mobile-menu nav a:not(.btn).active,
  html body .mobile-menu nav a:not(.btn)[aria-current="page"] {
    background: rgba(85, 216, 239, .07) !important;
    color: #55d8ef !important;
  }

  html body .mobile-menu nav a:not(.btn)::before {
    content: none !important;
  }

  html body .mobile-menu-close {
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
    display: grid !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    place-items: center !important;
    border: 1px solid rgba(166, 236, 246, .16) !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 32px !important;
    line-height: 1 !important;
  }

  html body .mobile-menu-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1050 !important;
    display: block !important;
    visibility: hidden !important;
    opacity: 0 !important;
    background: rgba(3, 8, 16, .7) !important;
    transition: opacity .2s, visibility .2s !important;
  }

  html body .mobile-menu-backdrop.active {
    visibility: visible !important;
    opacity: 1 !important;
  }
}