/* ========================================================================== 
   Alexander Vale — Premium Personal Brand
   Editorial midnight-navy, warm-ivory, muted-gold design system
   ========================================================================== */

@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&family=Manrope:wght@400;500;600;700&display=swap");

/* --------------------------------------------------------------------------
   01. Design tokens
   -------------------------------------------------------------------------- */

:root {
  --ink: #101722;
  --ink-soft: #263142;
  --navy-950: #07101d;
  --navy-900: #0b1626;
  --navy-850: #101d30;
  --navy-800: #162438;
  --ivory-50: #fbf8f2;
  --ivory-100: #f5f0e7;
  --ivory-150: #efe8dc;
  --ivory-200: #e6ddcf;
  --stone-300: #c9c1b6;
  --stone-400: #9d998f;
  --stone-500: #77766f;
  --gold-300: #d8c28f;
  --gold-400: #c5aa70;
  --gold-500: #a98a50;
  --burgundy-500: #7a3040;
  --burgundy-600: #602433;
  --white: #ffffff;
  --black: #05080d;

  --text: var(--ink);
  --text-muted: #59616c;
  --text-on-dark: #f4efe7;
  --text-on-dark-muted: #b9bdc3;
  --surface: var(--ivory-50);
  --surface-warm: var(--ivory-100);
  --surface-dark: var(--navy-900);
  --border: rgba(16, 23, 34, 0.15);
  --border-strong: rgba(16, 23, 34, 0.28);
  --border-dark: rgba(245, 240, 231, 0.18);
  --gold-line: rgba(169, 138, 80, 0.58);

  --font-display: "Cormorant Garamond", "Iowan Old Style", "Baskerville", Georgia, serif;
  --font-sans: "Manrope", "Avenir Next", "Segoe UI", Arial, sans-serif;

  --text-xs: 0.6875rem;
  --text-sm: 0.8125rem;
  --text-base: clamp(0.96rem, 0.2vw + 0.92rem, 1.08rem);
  --text-lg: clamp(1.08rem, 0.35vw + 1rem, 1.3rem);
  --text-xl: clamp(1.3rem, 0.7vw + 1.1rem, 1.75rem);
  --heading-sm: clamp(2rem, 2vw + 1.25rem, 3.4rem);
  --heading-md: clamp(2.8rem, 4.8vw, 5.5rem);
  --heading-lg: clamp(3.45rem, 7.2vw, 7.8rem);

  --space-1: 0.375rem;
  --space-2: 0.625rem;
  --space-3: 0.875rem;
  --space-4: 1.125rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.75rem;
  --space-8: 3.75rem;
  --space-9: 5rem;
  --space-10: 7rem;
  --section-space: clamp(5.5rem, 10vw, 10.5rem);
  --gutter: clamp(1.25rem, 4vw, 4.75rem);
  --container: 87.5rem;
  --container-narrow: 72rem;

  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.875rem;
  --radius-pill: 999px;

  --shadow-sm: 0 0.75rem 2.5rem rgba(7, 16, 29, 0.08);
  --shadow-md: 0 1.5rem 5rem rgba(7, 16, 29, 0.14);
  --shadow-dark: 0 2rem 6rem rgba(0, 0, 0, 0.28);

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 180ms;
  --duration: 420ms;
  --duration-slow: 760ms;
  --header-height: 5.25rem;
  --announcement-height: 2.25rem;
}

/* --------------------------------------------------------------------------
   02. Reset and document foundations
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-height) + 1.5rem);
  color-scheme: light;
  background: var(--navy-950);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  min-width: 20rem;
  margin: 0;
  overflow-x: hidden;
  overflow-x: clip;
  color: var(--text);
  background: var(--surface);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  font-weight: 400;
  line-height: 1.72;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.nav-open,
body.menu-open {
  overflow: hidden;
}

::selection {
  color: var(--ivory-50);
  background: var(--burgundy-500);
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

h1,
h2,
h3,
h4 {
  color: inherit;
  font-family: var(--font-display);
  font-weight: 500;
  line-height: 0.98;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

p {
  text-wrap: pretty;
}

ul,
ol {
  margin: 0;
  padding: 0;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

img {
  height: auto;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  margin: 0;
  color: inherit;
  font: inherit;
}

button,
select {
  cursor: pointer;
}

button {
  border: 0;
}

textarea {
  resize: vertical;
}

address {
  font-style: normal;
}

[hidden] {
  display: none !important;
}

[id] {
  scroll-margin-top: calc(var(--header-height) + 1.5rem);
}

:where(main, section, article, aside, header, footer, nav, div) {
  min-width: 0;
}

/* --------------------------------------------------------------------------
   03. Accessibility and shared utilities
   -------------------------------------------------------------------------- */

.skip-link,
.skip-to-content {
  position: fixed;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 9999;
  padding: 0.75rem 1rem;
  color: var(--navy-950);
  background: var(--gold-300);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
  font-weight: 700;
  transform: translateY(-160%);
  transition: transform var(--duration-fast) var(--ease);
}

.skip-link:focus,
.skip-to-content:focus {
  transform: translateY(0);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid var(--gold-400);
  outline-offset: 4px;
}

:where(.surface-dark, .section-dark, .site-footer, .final-cta) :focus-visible {
  outline-color: var(--gold-300);
}

.sr-only,
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.container,
.nav-shell,
.section-inner,
.footer-inner {
  width: min(100%, calc(var(--container) + (var(--gutter) * 2)));
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.container-narrow {
  width: min(100%, calc(var(--container-narrow) + (var(--gutter) * 2)));
  margin-inline: auto;
  padding-inline: var(--gutter);
}

.flow > * + * {
  margin-block-start: var(--flow-space, 1.25rem);
}

.eyebrow,
.section-kicker,
.kicker,
.overline {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--gold-500);
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.eyebrow::before,
.section-kicker::before,
.kicker::before,
.overline::before {
  width: 1.75rem;
  height: 1px;
  flex: 0 0 auto;
  background: currentColor;
  content: "";
}

.surface-dark .eyebrow,
.section-dark .eyebrow,
.final-cta .eyebrow {
  color: var(--gold-300);
}

.display-title,
.section-title {
  font-size: var(--heading-md);
}

.lede,
.section-lede {
  max-width: 42rem;
  color: var(--text-muted);
  font-size: var(--text-lg);
  line-height: 1.65;
}

.surface-dark .lede,
.section-dark .lede,
.surface-dark .section-lede,
.section-dark .section-lede {
  color: var(--text-on-dark-muted);
}

.muted {
  color: var(--text-muted);
}

.gold {
  color: var(--gold-500);
}

.rule {
  width: 100%;
  height: 1px;
  background: var(--border);
}

/* --------------------------------------------------------------------------
   04. Buttons and text links
   -------------------------------------------------------------------------- */

.button,
.btn,
button.button,
input[type="submit"] {
  position: relative;
  display: inline-flex;
  min-height: 3.375rem;
  align-items: center;
  justify-content: center;
  gap: 0.7rem;
  padding: 0.9rem 1.35rem;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.105em;
  text-align: center;
  text-transform: uppercase;
  transition:
    color var(--duration) var(--ease),
    background-color var(--duration) var(--ease),
    border-color var(--duration) var(--ease),
    transform var(--duration) var(--ease),
    box-shadow var(--duration) var(--ease);
}

.button::after,
.btn::after {
  width: 1.2rem;
  height: 1px;
  flex: 0 0 auto;
  background: currentColor;
  content: "";
  transform-origin: left;
  transition: transform var(--duration) var(--ease);
}

.button-primary,
.btn-primary,
input[type="submit"] {
  color: var(--ivory-50);
  background: var(--navy-900);
  border-color: var(--navy-900);
  box-shadow: 0 0.75rem 2rem rgba(7, 16, 29, 0.15);
}

.button-secondary,
.btn-secondary {
  color: var(--navy-900);
  background: transparent;
  border-color: var(--border-strong);
}

.button-gold,
.surface-dark .button-primary,
.section-dark .button-primary,
.final-cta .button-primary {
  color: var(--navy-950);
  background: var(--gold-300);
  border-color: var(--gold-300);
}

.surface-dark .button-secondary,
.section-dark .button-secondary,
.final-cta .button-secondary {
  color: var(--ivory-50);
  border-color: rgba(245, 240, 231, 0.42);
}

.text-link,
.arrow-link,
.read-more,
.case-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  padding-block: 0.25rem 0.45rem;
  color: var(--ink);
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  line-height: 1.4;
  text-transform: uppercase;
}

.text-link::before,
.arrow-link::before,
.read-more::before,
.case-link::before {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: var(--gold-500);
  content: "";
  transform: scaleX(0.3);
  transform-origin: left;
  transition: transform var(--duration) var(--ease);
}

.text-link::after,
.arrow-link::after,
.read-more::after,
.case-link::after {
  content: "↗";
  font-size: 0.9rem;
  transition: transform var(--duration) var(--ease);
}

/* --------------------------------------------------------------------------
   05. Announcement, sticky header, navigation
   -------------------------------------------------------------------------- */

.site-header,
.header {
  position: sticky;
  top: 0;
  z-index: 1000;
  color: var(--ivory-50);
  background: var(--navy-900);
  isolation: isolate;
  transition:
    background-color var(--duration) var(--ease),
    box-shadow var(--duration) var(--ease),
    transform var(--duration) var(--ease);
}

.site-header::after,
.header::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: rgba(216, 194, 143, 0.2);
  content: "";
  pointer-events: none;
}

.site-header.is-scrolled,
.site-header.scrolled,
.header.is-scrolled,
.header.scrolled {
  background: rgba(7, 16, 29, 0.96);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.announcement,
.announcement-bar {
  min-height: var(--announcement-height);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  padding: 0.5rem var(--gutter);
  color: rgba(255, 255, 255, 0.82);
  background: var(--burgundy-600);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.075em;
  line-height: 1.3;
  text-align: center;
}

.announcement a,
.announcement-bar a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: var(--white);
  font-weight: 700;
  white-space: nowrap;
}

.announcement a::after,
.announcement-bar a::after {
  content: "→";
  transition: transform var(--duration-fast) var(--ease);
}

.nav-shell,
.navbar {
  min-height: var(--header-height);
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.6vw, 2.75rem);
}

.wordmark,
.brand,
.site-logo {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.85rem;
  color: var(--ivory-50);
  font-family: var(--font-display);
  font-size: 1.45rem;
  font-weight: 600;
  letter-spacing: 0.055em;
  line-height: 1;
  white-space: nowrap;
}

.wordmark::before,
.brand-mark,
.monogram {
  width: 2.45rem;
  aspect-ratio: 1;
  display: inline-grid;
  place-items: center;
  color: var(--gold-300);
  border: 1px solid rgba(216, 194, 143, 0.62);
  border-radius: 50%;
  font-family: var(--font-display);
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  content: "AV";
}

.wordmark small,
.brand small {
  display: block;
  margin-top: 0.25rem;
  color: var(--gold-300);
  font-family: var(--font-sans);
  font-size: 0.48rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.primary-nav,
.main-nav {
  margin-left: auto;
}

.primary-nav ul,
.main-nav ul,
.nav-links {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 1.5vw, 1.65rem);
  list-style: none;
}

.primary-nav a:not(.button),
.main-nav a:not(.button),
.nav-links a:not(.button) {
  position: relative;
  display: block;
  padding-block: 0.75rem;
  color: rgba(245, 240, 231, 0.74);
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.095em;
  line-height: 1.2;
  text-transform: uppercase;
  transition: color var(--duration-fast) var(--ease);
}

.primary-nav a:not(.button)::after,
.main-nav a:not(.button)::after,
.nav-links a:not(.button)::after {
  position: absolute;
  right: 0;
  bottom: 0.45rem;
  left: 0;
  height: 1px;
  background: var(--gold-300);
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--duration) var(--ease);
}

.primary-nav a.is-active,
.primary-nav a.active,
.primary-nav a[aria-current="page"],
.main-nav a.is-active,
.nav-links a.is-active {
  color: var(--ivory-50);
}

.primary-nav a.is-active::after,
.primary-nav a.active::after,
.primary-nav a[aria-current="page"]::after,
.main-nav a.is-active::after,
.nav-links a.is-active::after {
  transform: scaleX(1);
  transform-origin: left;
}

.nav-cta {
  min-height: 2.9rem;
  flex: 0 0 auto;
  padding-inline: 1rem;
  color: var(--navy-950);
  background: var(--gold-300);
  border: 1px solid var(--gold-300);
  font-size: 0.62rem;
}

.nav-toggle,
.menu-toggle {
  width: 3rem;
  height: 3rem;
  display: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  padding: 0;
  color: var(--ivory-50);
  background: transparent;
  border: 1px solid rgba(245, 240, 231, 0.25);
  border-radius: 50%;
}

.nav-toggle span,
.menu-toggle span {
  position: relative;
  width: 1.15rem;
  height: 1px;
  display: block;
  background: currentColor;
  transition:
    background-color var(--duration-fast) var(--ease),
    transform var(--duration) var(--ease);
}

.nav-toggle span::before,
.nav-toggle span::after,
.menu-toggle span::before,
.menu-toggle span::after {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background: currentColor;
  content: "";
  transition: transform var(--duration) var(--ease);
}

.nav-toggle span::before,
.menu-toggle span::before {
  transform: translateY(-0.35rem);
}

.nav-toggle span::after,
.menu-toggle span::after {
  transform: translateY(0.35rem);
}

.nav-toggle[aria-expanded="true"] span,
.menu-toggle[aria-expanded="true"] span {
  background: transparent;
}

.nav-toggle[aria-expanded="true"] span::before,
.menu-toggle[aria-expanded="true"] span::before {
  transform: rotate(45deg);
}

.nav-toggle[aria-expanded="true"] span::after,
.menu-toggle[aria-expanded="true"] span::after {
  transform: rotate(-45deg);
}

/* --------------------------------------------------------------------------
   06. Hero and opening authority composition
   -------------------------------------------------------------------------- */

.hero {
  position: relative;
  overflow: hidden;
  color: var(--ivory-50);
  background:
    linear-gradient(90deg, rgba(7, 16, 29, 0.97) 0%, rgba(7, 16, 29, 0.94) 49%, rgba(7, 16, 29, 0.64) 100%),
    var(--navy-950);
  isolation: isolate;
}

.hero::before {
  position: absolute;
  top: 0;
  right: clamp(1rem, 8vw, 9rem);
  width: 1px;
  height: 100%;
  background: rgba(216, 194, 143, 0.16);
  content: "";
  pointer-events: none;
}

.hero::after {
  position: absolute;
  top: clamp(4rem, 9vw, 8rem);
  right: clamp(-8rem, -4vw, -3rem);
  width: clamp(16rem, 32vw, 35rem);
  aspect-ratio: 1;
  border: 1px solid rgba(216, 194, 143, 0.12);
  border-radius: 50%;
  content: "";
  pointer-events: none;
  z-index: -1;
}

.hero-grid,
.hero-inner {
  position: relative;
  width: min(100%, calc(var(--container) + (var(--gutter) * 2)));
  min-height: min(52rem, calc(100svh - var(--header-height)));
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(21rem, 0.92fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 8rem);
  margin-inline: auto;
  padding: clamp(5rem, 8vw, 8rem) var(--gutter) clamp(4.5rem, 7vw, 7rem);
}

.hero-copy,
.hero-content {
  position: relative;
  z-index: 2;
  max-width: 52rem;
}

.hero .eyebrow {
  margin-bottom: clamp(1.5rem, 2.8vw, 2.5rem);
}

.hero h1,
.hero-title {
  max-width: 12ch;
  color: var(--ivory-50);
  font-size: var(--heading-lg);
  line-height: 0.88;
  letter-spacing: -0.045em;
}

.hero h1 em,
.hero-title em {
  color: var(--gold-300);
  font-weight: 500;
}

.hero-summary,
.hero-lede,
.hero-copy > p {
  max-width: 42rem;
  margin-top: clamp(1.75rem, 3vw, 2.5rem);
  color: rgba(245, 240, 231, 0.72);
  font-size: var(--text-lg);
  line-height: 1.7;
}

.hero-actions,
.button-row,
.cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  margin-top: clamp(2rem, 4vw, 3.25rem);
}

.hero-media,
.hero-portrait,
.portrait-frame {
  position: relative;
  width: 100%;
  max-width: 34rem;
  justify-self: end;
  aspect-ratio: 0.77;
  overflow: visible;
}

.hero-media::before,
.hero-portrait::before,
.portrait-frame::before {
  position: absolute;
  top: -1.25rem;
  right: -1.25rem;
  width: 42%;
  height: 38%;
  border-top: 1px solid var(--gold-line);
  border-right: 1px solid var(--gold-line);
  content: "";
  z-index: 2;
}

.hero-media::after,
.hero-portrait::after,
.portrait-frame::after {
  position: absolute;
  right: -1.5rem;
  bottom: 15%;
  width: 4rem;
  height: 1px;
  background: var(--gold-400);
  content: "";
  z-index: 2;
}

.hero-media img,
.hero-portrait img,
.portrait-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 25%;
  filter: saturate(0.72) contrast(1.05);
  box-shadow: var(--shadow-dark);
  transition: filter var(--duration-slow) var(--ease), transform 1.2s var(--ease);
}

.hero-media .image-wrap,
.hero-portrait .image-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--navy-800);
}

.quote-card,
.hero-quote {
  position: absolute;
  right: clamp(-1rem, -2.5vw, -2.5rem);
  bottom: clamp(1rem, 4vw, 3.5rem);
  width: min(19rem, 62%);
  z-index: 4;
  padding: clamp(1.3rem, 2.2vw, 2rem);
  color: var(--ivory-50);
  background: rgba(11, 22, 38, 0.94);
  border: 1px solid rgba(216, 194, 143, 0.36);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(10px);
}

.quote-card::before,
.hero-quote::before {
  display: block;
  margin-bottom: 0.75rem;
  color: var(--gold-300);
  font-family: var(--font-display);
  font-size: 2.5rem;
  line-height: 0.5;
  content: "“";
}

.quote-card blockquote,
.quote-card p,
.hero-quote blockquote,
.hero-quote p {
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.2vw, 1.3rem);
  font-style: italic;
  line-height: 1.35;
}

.quote-card cite,
.hero-quote cite {
  display: block;
  margin-top: 0.85rem;
  color: var(--gold-300);
  font-family: var(--font-sans);
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.hero .stats-grid,
.hero-stats {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: clamp(1rem, 3vw, 2.5rem);
  border-top: 1px solid rgba(245, 240, 231, 0.18);
  border-bottom: 1px solid rgba(245, 240, 231, 0.18);
}

.hero .stat,
.hero .stat-item,
.hero-stats > * {
  padding: 1.5rem clamp(1rem, 2.4vw, 2rem);
  border-right: 1px solid rgba(245, 240, 231, 0.14);
}

.hero .stat:first-child,
.hero .stat-item:first-child,
.hero-stats > *:first-child {
  padding-left: 0;
}

.hero .stat:last-child,
.hero .stat-item:last-child,
.hero-stats > *:last-child {
  border-right: 0;
}

.hero .stat strong,
.hero .stat-value,
.hero-stats strong {
  display: block;
  color: var(--ivory-50);
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.7rem);
  font-weight: 500;
  line-height: 1;
}

.hero .stat span,
.hero .stat-label,
.hero-stats span {
  display: block;
  margin-top: 0.45rem;
  color: rgba(245, 240, 231, 0.55);
  font-size: 0.64rem;
  letter-spacing: 0.07em;
  line-height: 1.45;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   07. Logo strip and global sections
   -------------------------------------------------------------------------- */

.logo-strip,
.credibility-strip,
.trusted-strip {
  padding-block: clamp(2.75rem, 5vw, 4.5rem);
  color: var(--ink);
  background: var(--ivory-100);
  border-bottom: 1px solid var(--border);
}

.logo-strip-header,
.logo-strip > .container > p,
.trusted-strip > .container > p {
  max-width: 42rem;
  margin: 0 auto clamp(1.75rem, 3vw, 2.5rem);
  color: var(--text-muted);
  font-size: var(--text-sm);
  letter-spacing: 0.035em;
  line-height: 1.55;
  text-align: center;
}

.logo-list,
.logo-grid,
.media-logos {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: center;
  gap: 1px;
  list-style: none;
  background: var(--border);
  border: 1px solid var(--border);
}

.logo-list > *,
.logo-grid > *,
.media-logos > * {
  min-height: 5.5rem;
  display: grid;
  place-items: center;
  padding: 1rem;
  color: var(--ink-soft);
  background: var(--ivory-100);
  font-family: var(--font-display);
  font-size: clamp(0.95rem, 1.2vw, 1.25rem);
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.1;
  text-align: center;
}

.section,
section.section {
  position: relative;
  padding-block: var(--section-space);
}

.section-ivory,
.surface-warm {
  background: var(--ivory-100);
}

.section-stone {
  background: var(--ivory-150);
}

.section-dark,
.surface-dark {
  color: var(--text-on-dark);
  background: var(--navy-900);
}

.section-dark::before,
.surface-dark::before {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(216, 194, 143, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(216, 194, 143, 0.055) 1px, transparent 1px);
  background-size: 5rem 5rem;
  content: "";
  mask-image: linear-gradient(to bottom, black, transparent 84%);
  pointer-events: none;
}

.section-header,
.section-intro {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(20rem, 0.52fr);
  align-items: end;
  gap: clamp(2rem, 6vw, 7rem);
  margin-bottom: clamp(3rem, 6vw, 6rem);
}

.section-header .eyebrow,
.section-intro .eyebrow {
  margin-bottom: 1.5rem;
}

.section-header h2,
.section-intro h2 {
  max-width: 14ch;
  font-size: var(--heading-md);
}

.section-header > p,
.section-intro > p,
.section-header .section-lede,
.section-intro .section-lede {
  padding-bottom: 0.5rem;
}

.section-number {
  color: var(--gold-500);
  font-family: var(--font-sans);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.12em;
}

/* --------------------------------------------------------------------------
   08. Strategic point of view / principles
   -------------------------------------------------------------------------- */

.principles-grid,
.principles,
.point-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: var(--border);
  border: 1px solid var(--border);
}

.principle,
.principle-card,
.point-card {
  position: relative;
  min-height: 25rem;
  display: flex;
  flex-direction: column;
  padding: clamp(2rem, 3.2vw, 3.25rem);
  overflow: hidden;
  background: var(--ivory-50);
  transition: background-color var(--duration) var(--ease), color var(--duration) var(--ease);
}

.principle::after,
.principle-card::after,
.point-card::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 3px;
  background: var(--gold-500);
  content: "";
  transition: width var(--duration-slow) var(--ease);
}

.principle-number,
.principle .number,
.point-card .number {
  display: inline-flex;
  width: 2.75rem;
  height: 2.75rem;
  align-items: center;
  justify-content: center;
  color: var(--gold-500);
  border: 1px solid var(--gold-line);
  border-radius: 50%;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.principle h3,
.principle-card h3,
.point-card h3 {
  max-width: 11ch;
  margin-top: auto;
  padding-top: 4rem;
  font-size: clamp(2rem, 3vw, 3.25rem);
}

.principle p,
.principle-card p,
.point-card p {
  margin-top: 1.25rem;
  color: var(--text-muted);
  font-size: 0.93rem;
  line-height: 1.7;
}

.principle-insight,
.principle footer,
.point-insight {
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  color: var(--ink-soft);
  border-top: 1px solid var(--border);
  font-family: var(--font-display);
  font-size: 1.1rem;
  font-style: italic;
  line-height: 1.45;
}

/* --------------------------------------------------------------------------
   09. Premium offers / advisory services
   -------------------------------------------------------------------------- */

.offers-grid,
.services-grid,
.advisory-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  align-items: stretch;
}

.offer-card,
.service-card,
.advisory-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: clamp(2rem, 3.5vw, 3.25rem);
  background: var(--ivory-50);
  border: 1px solid var(--border);
  box-shadow: 0 0 0 rgba(7, 16, 29, 0);
  transition:
    border-color var(--duration) var(--ease),
    box-shadow var(--duration) var(--ease),
    transform var(--duration) var(--ease);
}

.offer-card.featured,
.offer-card.is-featured,
.service-card.featured,
.advisory-card.featured {
  color: var(--ivory-50);
  background: var(--navy-900);
  border-color: var(--navy-900);
  transform: translateY(-1.5rem);
  box-shadow: var(--shadow-md);
}

.offer-label,
.service-label,
.offer-card > small,
.advisory-card > small {
  color: var(--gold-500);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  line-height: 1.4;
  text-transform: uppercase;
}

.offer-card.featured .offer-label,
.offer-card.featured > small,
.service-card.featured .service-label {
  color: var(--gold-300);
}

.offer-card h3,
.service-card h3,
.advisory-card h3 {
  max-width: 10ch;
  margin-top: 2rem;
  font-size: clamp(2rem, 3.1vw, 3.25rem);
}

.offer-audience,
.service-audience,
.offer-card > p,
.advisory-card > p {
  margin-top: 1.25rem;
  color: var(--text-muted);
  font-size: 0.93rem;
  line-height: 1.7;
}

.offer-card.featured p,
.service-card.featured p,
.advisory-card.featured p {
  color: var(--text-on-dark-muted);
}

.offer-card ul,
.service-card ul,
.advisory-card ul,
.feature-list {
  display: grid;
  gap: 0.75rem;
  margin: 2rem 0 2.5rem;
  list-style: none;
}

.offer-card li,
.service-card li,
.advisory-card li,
.feature-list li {
  position: relative;
  padding: 0.75rem 0 0.75rem 1.4rem;
  color: var(--ink-soft);
  border-bottom: 1px solid var(--border);
  font-size: 0.84rem;
  line-height: 1.5;
}

.offer-card li::before,
.service-card li::before,
.advisory-card li::before,
.feature-list li::before {
  position: absolute;
  top: 1.25rem;
  left: 0;
  width: 0.35rem;
  height: 0.35rem;
  background: var(--gold-500);
  border-radius: 50%;
  content: "";
}

.offer-card.featured li,
.service-card.featured li,
.advisory-card.featured li {
  color: rgba(245, 240, 231, 0.78);
  border-color: var(--border-dark);
}

.offer-meta,
.service-meta {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 1rem;
  margin-top: auto;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}

.featured .offer-meta,
.featured .service-meta {
  border-color: var(--border-dark);
}

.offer-format,
.service-format {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.offer-card .button,
.service-card .button,
.advisory-card .button {
  width: 100%;
  margin-top: auto;
}

/* --------------------------------------------------------------------------
   10. Results and case studies
   -------------------------------------------------------------------------- */

.case-filters,
.filter-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-bottom: clamp(2rem, 4vw, 3.25rem);
}

.case-filter,
.filter-button,
[data-case-filter] {
  min-height: 2.75rem;
  padding: 0.7rem 1rem;
  color: var(--text-muted);
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  line-height: 1;
  text-transform: uppercase;
  transition: color var(--duration-fast) var(--ease), background var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease);
}

.case-filter.is-active,
.case-filter.active,
.case-filter[aria-pressed="true"],
.filter-button.is-active,
[data-case-filter][aria-pressed="true"] {
  color: var(--ivory-50);
  background: var(--navy-900);
  border-color: var(--navy-900);
}

.case-grid,
.case-studies-grid,
.results-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.25rem, 3vw, 2.5rem);
}

.case-card,
.case-study-card,
.result-card {
  position: relative;
  overflow: hidden;
  background: var(--ivory-50);
  border: 1px solid var(--border);
  transition: opacity var(--duration) var(--ease), transform var(--duration) var(--ease), border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}

.case-card.is-hidden,
.case-study-card.is-hidden,
.result-card.is-hidden {
  display: none;
}

.case-card figure,
.case-image,
.case-study-card figure {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--navy-800);
}

.case-card figure::after,
.case-image::after,
.case-study-card figure::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(7, 16, 29, 0.48), transparent 50%);
  content: "";
  pointer-events: none;
}

.case-card img,
.case-image img,
.case-study-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.65) contrast(1.04);
  transition: transform 1s var(--ease), filter var(--duration-slow) var(--ease);
}

.case-content,
.case-card-body,
.case-study-content {
  padding: clamp(1.75rem, 3.3vw, 3rem);
}

.case-category,
.case-card .eyebrow,
.case-study-card .eyebrow {
  color: var(--burgundy-500);
}

.case-card h3,
.case-study-card h3,
.result-card h3 {
  margin-top: 1.25rem;
  font-size: clamp(2rem, 3.5vw, 3.3rem);
}

.case-summary,
.case-card-body > p,
.case-study-content > p {
  margin-top: 1rem;
  color: var(--text-muted);
  font-size: 0.94rem;
  line-height: 1.7;
}

.case-metric,
.result-metric {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  color: var(--gold-500);
  border-top: 1px solid var(--border);
}

.case-metric strong,
.result-metric strong {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 2.2vw, 2.25rem);
  font-weight: 500;
  line-height: 1;
}

.case-metric span,
.result-metric span {
  color: var(--text-muted);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.case-toggle,
.case-card [aria-expanded] {
  margin-top: 1.5rem;
}

.case-details {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows var(--duration-slow) var(--ease), opacity var(--duration) var(--ease);
}

.case-details > div,
.case-details-inner {
  overflow: hidden;
}

.case-card.is-expanded .case-details,
.case-details.is-open,
.case-details[aria-hidden="false"] {
  grid-template-rows: 1fr;
  opacity: 1;
}

.case-details-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}

.case-details h4 {
  font-family: var(--font-sans);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.case-details p,
.case-details li {
  margin-top: 0.45rem;
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   11. Speaking
   -------------------------------------------------------------------------- */

.speaking-grid,
.speaker-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(22rem, 0.96fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 8rem);
}

.speaking-media,
.speaker-media,
.stage-image {
  position: relative;
  min-height: 38rem;
  overflow: visible;
}

.speaking-media::before,
.speaker-media::before {
  position: absolute;
  top: -1.5rem;
  left: -1.5rem;
  width: 36%;
  height: 43%;
  border-top: 1px solid var(--gold-line);
  border-left: 1px solid var(--gold-line);
  content: "";
  z-index: 2;
}

.speaking-media img,
.speaker-media img,
.stage-image img {
  width: 100%;
  height: 100%;
  min-height: 38rem;
  object-fit: cover;
  filter: saturate(0.65) contrast(1.08);
  box-shadow: var(--shadow-md);
}

.speaking-badge,
.stage-badge {
  position: absolute;
  right: -1rem;
  bottom: 2rem;
  max-width: 13rem;
  padding: 1.4rem;
  color: var(--navy-950);
  background: var(--gold-300);
  box-shadow: var(--shadow-sm);
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.5;
  text-transform: uppercase;
}

.speaking-content h2,
.speaker-copy h2 {
  max-width: 11ch;
  margin-top: 1.5rem;
  font-size: var(--heading-md);
}

.speaking-content > p,
.speaker-copy > p {
  margin-top: 1.75rem;
  color: var(--text-on-dark-muted);
}

.topic-list,
.speaking-topics {
  display: grid;
  margin-top: clamp(2rem, 4vw, 3.25rem);
  list-style: none;
  border-top: 1px solid var(--border-dark);
}

.topic-list li,
.speaking-topics li,
.topic-item {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem 1fr auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem 0;
  color: rgba(245, 240, 231, 0.84);
  border-bottom: 1px solid var(--border-dark);
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 1.7vw, 1.55rem);
  line-height: 1.25;
}

.topic-list li::before,
.speaking-topics li::before,
.topic-item::before {
  color: var(--gold-300);
  font-family: var(--font-sans);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  content: counter(list-item, decimal-leading-zero);
}

.topic-list li::after,
.speaking-topics li::after,
.topic-item::after {
  color: var(--gold-300);
  content: "—";
  transition: transform var(--duration) var(--ease);
}

.speaking-formats,
.format-list,
.audience-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1.75rem;
  list-style: none;
}

.speaking-formats li,
.format-list li,
.audience-list li {
  padding: 0.55rem 0.75rem;
  color: rgba(245, 240, 231, 0.62);
  border: 1px solid var(--border-dark);
  border-radius: var(--radius-pill);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   12. Vale Strategic Clarity Framework
   -------------------------------------------------------------------------- */

.framework-shell,
.framework,
.process-shell {
  position: relative;
  padding: clamp(2rem, 5vw, 5rem);
  overflow: hidden;
  color: var(--ivory-50);
  background: var(--navy-900);
  border: 1px solid rgba(216, 194, 143, 0.25);
  box-shadow: var(--shadow-md);
}

.framework-shell::after,
.framework::after,
.process-shell::after {
  position: absolute;
  right: -9rem;
  bottom: -12rem;
  width: 27rem;
  aspect-ratio: 1;
  border: 1px solid rgba(216, 194, 143, 0.12);
  border-radius: 50%;
  content: "";
}

.framework-tabs,
.framework-stages,
.process-tabs {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: clamp(2.5rem, 5vw, 4rem);
  list-style: none;
}

.framework-tabs::before,
.framework-stages::before,
.process-tabs::before {
  position: absolute;
  top: 1.15rem;
  right: 9%;
  left: 9%;
  height: 1px;
  background: rgba(216, 194, 143, 0.24);
  content: "";
  z-index: -1;
}

.framework-tab,
.framework-stage,
.process-tab {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  padding: 0 0.5rem;
  color: rgba(245, 240, 231, 0.48);
  background: transparent;
  font-size: 0.63rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1.3;
  text-transform: uppercase;
  transition: color var(--duration) var(--ease);
}

.framework-tab::before,
.framework-stage::before,
.process-tab::before {
  width: 2.3rem;
  height: 2.3rem;
  display: grid;
  place-items: center;
  color: var(--gold-300);
  background: var(--navy-900);
  border: 1px solid rgba(216, 194, 143, 0.42);
  border-radius: 50%;
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 500;
  letter-spacing: 0;
  content: attr(data-number);
  transition: color var(--duration) var(--ease), background var(--duration) var(--ease), transform var(--duration) var(--ease);
}

.framework-tab.is-active,
.framework-tab.active,
.framework-tab[aria-selected="true"],
.framework-stage.is-active,
.process-tab[aria-selected="true"] {
  color: var(--ivory-50);
}

.framework-tab.is-active::before,
.framework-tab.active::before,
.framework-tab[aria-selected="true"]::before,
.framework-stage.is-active::before,
.process-tab[aria-selected="true"]::before {
  color: var(--navy-950);
  background: var(--gold-300);
  transform: scale(1.12);
}

.framework-panel,
.process-panel,
.framework-content {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) repeat(2, minmax(0, 0.5fr));
  gap: clamp(1.5rem, 4vw, 4rem);
  padding-top: clamp(2rem, 4vw, 3.5rem);
  border-top: 1px solid var(--border-dark);
  animation: panel-in var(--duration-slow) var(--ease) both;
}

.framework-panel h3,
.process-panel h3 {
  color: var(--ivory-50);
  font-size: clamp(2.5rem, 5vw, 5rem);
}

.framework-panel h4,
.process-panel h4,
.framework-detail-label {
  color: var(--gold-300);
  font-family: var(--font-sans);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: uppercase;
}

.framework-panel p,
.process-panel p {
  margin-top: 0.75rem;
  color: var(--text-on-dark-muted);
  font-size: 0.9rem;
  line-height: 1.7;
}

@keyframes panel-in {
  from { opacity: 0; transform: translateY(1rem); }
  to { opacity: 1; transform: translateY(0); }
}

/* --------------------------------------------------------------------------
   13. Authority statistics
   -------------------------------------------------------------------------- */

.authority-stats,
.stats-band,
.impact-stats {
  position: relative;
  color: var(--ivory-50);
  background: var(--burgundy-600);
  border-block: 1px solid rgba(216, 194, 143, 0.3);
}

.authority-stats .stats-grid,
.stats-band .stats-grid,
.impact-stats .stats-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.authority-stats .stat,
.authority-stats .stat-item,
.stats-band .stat,
.impact-stats .stat {
  min-height: 11rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  border-right: 1px solid rgba(245, 240, 231, 0.14);
  text-align: center;
}

.authority-stats .stat:last-child,
.authority-stats .stat-item:last-child,
.stats-band .stat:last-child,
.impact-stats .stat:last-child {
  border-right: 0;
}

.counter,
.stat-number,
[data-counter] {
  display: block;
  color: var(--ivory-50);
  font-family: var(--font-display);
  font-size: clamp(2.6rem, 4.5vw, 4.75rem);
  font-weight: 500;
  line-height: 0.9;
}

.stat-label,
.authority-stats .stat span:last-child,
.stats-band .stat span:last-child {
  display: block;
  margin-top: 0.8rem;
  color: rgba(245, 240, 231, 0.66);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.09em;
  line-height: 1.5;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   14. Testimonials
   -------------------------------------------------------------------------- */

.testimonials-grid,
.testimonial-grid,
.quotes-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2.2vw, 1.75rem);
}

.testimonial,
.testimonial-card,
.quote-card-large {
  position: relative;
  min-height: 24rem;
  display: flex;
  flex-direction: column;
  padding: clamp(2rem, 3.5vw, 3rem);
  background: var(--ivory-50);
  border: 1px solid var(--border);
  transition: border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease), transform var(--duration) var(--ease);
}

.testimonial:nth-child(2),
.testimonial-card:nth-child(2) {
  transform: translateY(2.5rem);
}

.testimonial::before,
.testimonial-card::before,
.quote-card-large::before {
  color: var(--gold-400);
  font-family: var(--font-display);
  font-size: 4.5rem;
  line-height: 0.65;
  content: "“";
}

.testimonial blockquote,
.testimonial > p,
.testimonial-card blockquote,
.quote-card-large blockquote {
  margin-top: 1.5rem;
  color: var(--ink-soft);
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 1.8vw, 1.75rem);
  font-style: italic;
  line-height: 1.45;
}

.testimonial footer,
.testimonial-author,
.quote-author {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.9rem;
  margin-top: auto;
  padding-top: 2rem;
}

.testimonial-author img,
.quote-author img,
.testimonial footer img {
  width: 2.8rem;
  height: 2.8rem;
  object-fit: cover;
  border-radius: 50%;
  filter: grayscale(1);
}

.testimonial cite,
.testimonial-author strong,
.quote-author strong {
  display: block;
  color: var(--ink);
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;
}

.testimonial-role,
.testimonial footer span,
.quote-author span {
  display: block;
  margin-top: 0.2rem;
  color: var(--text-muted);
  font-size: 0.69rem;
  line-height: 1.45;
}

.testimonial-controls,
.slider-controls {
  display: flex;
  justify-content: flex-end;
  gap: 0.65rem;
  margin-top: 3rem;
}

.testimonial-controls button,
.slider-controls button {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  color: var(--navy-900);
  background: transparent;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
}

/* --------------------------------------------------------------------------
   15. Lead magnet and guide mockup
   -------------------------------------------------------------------------- */

.lead-magnet,
.guide-section {
  color: var(--ivory-50);
  background: var(--navy-900);
}

.lead-grid,
.guide-grid {
  display: grid;
  grid-template-columns: minmax(20rem, 0.8fr) minmax(0, 1.2fr);
  align-items: center;
  gap: clamp(3rem, 8vw, 9rem);
}

.guide-mockup,
.book-mockup {
  position: relative;
  width: min(100%, 28rem);
  justify-self: center;
  perspective: 80rem;
}

.guide-cover,
.book-cover,
.guide-mockup > div:first-child {
  position: relative;
  min-height: 34rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(2rem, 5vw, 3.5rem);
  overflow: hidden;
  color: var(--ivory-50);
  background: var(--burgundy-600);
  border: 1px solid rgba(216, 194, 143, 0.6);
  box-shadow: 1.5rem 2rem 4rem rgba(0, 0, 0, 0.32);
  transform: rotateY(-9deg) rotateX(2deg);
  transform-origin: left center;
}

.guide-cover::before,
.book-cover::before {
  position: absolute;
  inset: 1rem;
  border: 1px solid rgba(216, 194, 143, 0.34);
  content: "";
}

.guide-cover::after,
.book-cover::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1.2rem;
  width: 1px;
  background: rgba(216, 194, 143, 0.45);
  content: "";
}

.guide-cover small,
.book-cover small,
.guide-edition {
  position: relative;
  z-index: 1;
  color: var(--gold-300);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.guide-cover h3,
.book-cover h3,
.guide-title {
  position: relative;
  z-index: 1;
  max-width: 8ch;
  font-size: clamp(3rem, 5vw, 4.8rem);
  line-height: 0.9;
}

.guide-cover p,
.book-cover p,
.guide-author {
  position: relative;
  z-index: 1;
  color: rgba(245, 240, 231, 0.72);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.guide-copy h2,
.lead-content h2 {
  max-width: 11ch;
  margin-top: 1.5rem;
  font-size: var(--heading-md);
}

.guide-copy > p,
.lead-content > p {
  max-width: 40rem;
  margin-top: 1.5rem;
  color: var(--text-on-dark-muted);
}

.learning-list,
.guide-outcomes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 2rem;
  list-style: none;
}

.learning-list li,
.guide-outcomes li {
  position: relative;
  padding: 1.2rem 0 0 1rem;
  color: rgba(245, 240, 231, 0.78);
  border-top: 1px solid var(--border-dark);
  font-size: 0.76rem;
  line-height: 1.55;
}

.learning-list li::before,
.guide-outcomes li::before {
  position: absolute;
  top: 1.65rem;
  left: 0;
  width: 0.32rem;
  height: 0.32rem;
  background: var(--gold-300);
  border-radius: 50%;
  content: "";
}

/* --------------------------------------------------------------------------
   16. Shared forms and validation states
   -------------------------------------------------------------------------- */

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.lead-form,
.download-form,
.application-form,
.contact-form {
  margin-top: clamp(2rem, 4vw, 3.25rem);
}

.lead-form .form-grid,
.download-form .form-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.field,
.form-field {
  position: relative;
  display: grid;
  align-content: start;
  gap: 0.5rem;
}

.field-full,
.field.full,
.form-field-full {
  grid-column: 1 / -1;
}

.field label,
.form-field label {
  color: var(--ink-soft);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.3;
  text-transform: uppercase;
}

.surface-dark .field label,
.section-dark .field label,
.lead-magnet .field label,
.application-section .field label {
  color: rgba(245, 240, 231, 0.74);
}

.field input,
.field select,
.field textarea,
.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  min-height: 3.5rem;
  padding: 0.9rem 1rem;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  outline: 0;
  transition: border-color var(--duration-fast) var(--ease), background var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease);
}

.field textarea,
.form-field textarea {
  min-height: 9rem;
}

.field select,
.form-field select {
  padding-right: 2.5rem;
}

.surface-dark .field input,
.surface-dark .field select,
.surface-dark .field textarea,
.lead-magnet .field input,
.lead-magnet .field select,
.lead-magnet .field textarea,
.application-section .field input,
.application-section .field select,
.application-section .field textarea {
  color: var(--ivory-50);
  background: rgba(255, 255, 255, 0.055);
  border-color: rgba(245, 240, 231, 0.26);
}

.field input::placeholder,
.field textarea::placeholder {
  color: #767d85;
  opacity: 1;
}

.surface-dark .field input::placeholder,
.surface-dark .field textarea::placeholder,
.lead-magnet .field input::placeholder,
.application-section .field input::placeholder,
.application-section .field textarea::placeholder {
  color: rgba(245, 240, 231, 0.42);
}

.field input:focus,
.field select:focus,
.field textarea:focus,
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: var(--gold-500);
  box-shadow: 0 0 0 3px rgba(169, 138, 80, 0.15);
}

.field.is-invalid input,
.field.is-invalid select,
.field.is-invalid textarea,
.field.has-error input,
[aria-invalid="true"] {
  border-color: #a84b58;
}

.error,
.field-error,
.form-error {
  min-height: 1em;
  color: #b54858;
  font-size: 0.7rem;
  font-weight: 600;
  line-height: 1.4;
}

.surface-dark .error,
.section-dark .error,
.application-section .error,
.lead-magnet .error {
  color: #f0a6af;
}

.form-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-top: 0.5rem;
}

.form-actions .button {
  min-width: 13rem;
}

.privacy-note,
.form-note {
  color: var(--text-muted);
  font-size: 0.68rem;
  line-height: 1.5;
}

.surface-dark .privacy-note,
.section-dark .privacy-note,
.application-section .privacy-note,
.lead-magnet .privacy-note {
  color: rgba(245, 240, 231, 0.5);
}

.form-status,
.success-message {
  display: none;
  margin-top: 1.25rem;
  padding: 1.25rem 1.5rem;
  color: var(--ink);
  background: #edf1e8;
  border-left: 3px solid #6f835c;
  font-size: 0.84rem;
  line-height: 1.6;
}

.form-status.is-visible,
.form-status.is-success,
.form-status[aria-hidden="false"],
.success-message.is-visible {
  display: block;
  animation: status-in var(--duration) var(--ease) both;
}

.form-status.is-error {
  background: #f5e8e9;
  border-left-color: #9a4050;
}

@keyframes status-in {
  from { opacity: 0; transform: translateY(0.5rem); }
  to { opacity: 1; transform: translateY(0); }
}

/* --------------------------------------------------------------------------
   17. Insights / editorial cards
   -------------------------------------------------------------------------- */

.insights-grid,
.articles-grid,
.journal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2.5vw, 2rem);
}

.insight-card,
.article-card,
.journal-card {
  position: relative;
  min-height: 25rem;
  display: flex;
  flex-direction: column;
  padding: clamp(1.75rem, 3vw, 2.75rem);
  overflow: hidden;
  background: var(--ivory-50);
  border: 1px solid var(--border);
  transition: transform var(--duration) var(--ease), border-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease);
}

.insight-card:nth-child(1),
.article-card:nth-child(1),
.journal-card:nth-child(1) {
  grid-column: span 2;
  color: var(--ivory-50);
  background: var(--navy-900);
  border-color: var(--navy-900);
}

.insight-card:nth-child(4),
.article-card:nth-child(4) {
  background: var(--ivory-150);
}

.insight-meta,
.article-meta,
.journal-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem 1rem;
  color: var(--gold-500);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  line-height: 1.4;
  text-transform: uppercase;
}

.insight-card:nth-child(1) .insight-meta,
.article-card:nth-child(1) .article-meta,
.journal-card:nth-child(1) .journal-meta {
  color: var(--gold-300);
}

.insight-meta span + span::before,
.article-meta span + span::before,
.journal-meta span + span::before {
  margin-right: 1rem;
  color: var(--stone-400);
  content: "•";
}

.insight-card h3,
.article-card h3,
.journal-card h3 {
  max-width: 14ch;
  margin-top: 2rem;
  font-size: clamp(2rem, 3.1vw, 3.15rem);
  line-height: 1;
}

.insight-card:nth-child(1) h3,
.article-card:nth-child(1) h3,
.journal-card:nth-child(1) h3 {
  max-width: 15ch;
  font-size: clamp(2.7rem, 5vw, 5rem);
}

.insight-card > p,
.article-card > p,
.journal-card > p {
  margin-top: 1.25rem;
  color: var(--text-muted);
  font-size: 0.88rem;
  line-height: 1.7;
}

.insight-card:nth-child(1) > p,
.article-card:nth-child(1) > p,
.journal-card:nth-child(1) > p {
  max-width: 42rem;
  color: var(--text-on-dark-muted);
}

.insight-card .text-link,
.article-card .text-link,
.journal-card .text-link {
  align-self: flex-start;
  margin-top: auto;
  padding-top: 2rem;
}

.insight-card:nth-child(1) .text-link,
.article-card:nth-child(1) .text-link,
.journal-card:nth-child(1) .text-link {
  color: var(--ivory-50);
}

/* --------------------------------------------------------------------------
   18. Executive biography
   -------------------------------------------------------------------------- */

.bio-grid,
.about-grid,
.biography-grid {
  display: grid;
  grid-template-columns: minmax(20rem, 0.82fr) minmax(0, 1.18fr);
  align-items: start;
  gap: clamp(3rem, 8vw, 9rem);
}

.bio-media,
.about-media,
.biography-media {
  position: sticky;
  top: calc(var(--header-height) + 2rem);
}

.bio-media figure,
.about-media figure,
.biography-media figure {
  position: relative;
  aspect-ratio: 0.78;
  overflow: hidden;
  background: var(--navy-800);
}

.bio-media figure::after,
.about-media figure::after,
.biography-media figure::after {
  position: absolute;
  inset: 1rem;
  border: 1px solid rgba(216, 194, 143, 0.36);
  content: "";
}

.bio-media img,
.about-media img,
.biography-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.68) contrast(1.04);
}

.bio-caption,
.about-caption {
  margin-top: 1rem;
  color: var(--text-muted);
  font-size: 0.65rem;
  letter-spacing: 0.07em;
  line-height: 1.5;
  text-transform: uppercase;
}

.bio-content h2,
.about-content h2,
.biography-content h2 {
  max-width: 11ch;
  margin-top: 1.5rem;
  font-size: var(--heading-md);
}

.bio-intro,
.about-intro {
  max-width: 38rem;
  margin-top: 2rem;
  color: var(--ink-soft);
  font-family: var(--font-display);
  font-size: clamp(1.45rem, 2.2vw, 2rem);
  line-height: 1.45;
}

.bio-copy,
.about-copy {
  columns: 2 17rem;
  column-gap: 3rem;
  margin-top: 2rem;
  color: var(--text-muted);
}

.bio-copy p + p,
.about-copy p + p {
  margin-top: 1rem;
}

.philosophy-quote,
.bio-quote {
  margin-top: 2.5rem;
  padding: 2rem 0 2rem 2rem;
  color: var(--burgundy-600);
  border-left: 2px solid var(--gold-500);
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 3rem);
  font-style: italic;
  line-height: 1.25;
}

.milestones,
.milestone-list,
.career-list {
  display: grid;
  margin-top: 3rem;
  list-style: none;
  border-top: 1px solid var(--border);
}

.milestones li,
.milestone-list li,
.career-list li {
  display: grid;
  grid-template-columns: 6rem 1fr;
  gap: 1.25rem;
  padding: 1.1rem 0;
  border-bottom: 1px solid var(--border);
}

.milestones time,
.milestone-list time,
.career-list time {
  color: var(--gold-500);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.milestones span,
.milestone-list span,
.career-list span {
  color: var(--ink-soft);
  font-size: 0.86rem;
}

.expertise-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 2rem;
  list-style: none;
}

.expertise-list li {
  padding: 0.6rem 0.8rem;
  color: var(--ink-soft);
  background: var(--ivory-150);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   19. Application section
   -------------------------------------------------------------------------- */

.application-section,
.contact-section,
#contact {
  position: relative;
  color: var(--ivory-50);
  background: var(--navy-950);
}

.application-grid,
.contact-grid {
  display: grid;
  grid-template-columns: minmax(18rem, 0.62fr) minmax(0, 1.38fr);
  align-items: start;
  gap: clamp(3rem, 8vw, 9rem);
}

.application-intro,
.contact-intro {
  position: sticky;
  top: calc(var(--header-height) + 2rem);
}

.application-intro h2,
.contact-intro h2 {
  max-width: 10ch;
  margin-top: 1.5rem;
  font-size: var(--heading-md);
}

.application-intro > p,
.contact-intro > p {
  margin-top: 1.5rem;
  color: var(--text-on-dark-muted);
}

.application-meta,
.contact-meta {
  display: grid;
  gap: 0.75rem;
  margin-top: 2.25rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border-dark);
}

.application-meta p,
.contact-meta p {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: var(--text-on-dark-muted);
  font-size: 0.72rem;
}

.application-meta strong,
.contact-meta strong {
  color: var(--ivory-50);
  font-weight: 600;
}

.application-form,
.contact-form {
  margin-top: 0;
  padding: clamp(2rem, 4vw, 4rem);
  background: var(--navy-850);
  border: 1px solid rgba(216, 194, 143, 0.24);
  box-shadow: var(--shadow-dark);
}

/* --------------------------------------------------------------------------
   20. Final CTA
   -------------------------------------------------------------------------- */

.final-cta,
.closing-cta {
  position: relative;
  padding-block: clamp(6rem, 12vw, 11rem);
  overflow: hidden;
  color: var(--ivory-50);
  background: var(--burgundy-600);
  text-align: center;
  isolation: isolate;
}

.final-cta::before,
.closing-cta::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(70vw, 62rem);
  aspect-ratio: 1;
  border: 1px solid rgba(216, 194, 143, 0.22);
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
  z-index: -1;
}

.final-cta::after,
.closing-cta::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(50vw, 40rem);
  aspect-ratio: 1;
  border: 1px solid rgba(216, 194, 143, 0.14);
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
  z-index: -1;
}

.final-cta .eyebrow,
.closing-cta .eyebrow {
  justify-content: center;
}

.final-cta h2,
.closing-cta h2 {
  max-width: 13ch;
  margin: 1.5rem auto 0;
  font-size: clamp(3.4rem, 7vw, 7.25rem);
  line-height: 0.9;
}

.final-cta p,
.closing-cta p {
  max-width: 38rem;
  margin: 1.75rem auto 0;
  color: rgba(245, 240, 231, 0.72);
}

.final-cta .button-row,
.closing-cta .button-row {
  justify-content: center;
}

/* --------------------------------------------------------------------------
   21. Footer and back to top
   -------------------------------------------------------------------------- */

.site-footer,
.footer {
  position: relative;
  padding-top: clamp(4.5rem, 8vw, 8rem);
  color: rgba(245, 240, 231, 0.67);
  background: var(--navy-950);
  border-top: 1px solid rgba(216, 194, 143, 0.25);
}

.footer-grid {
  display: grid;
  grid-template-columns: minmax(15rem, 1.5fr) repeat(4, minmax(8rem, 0.65fr));
  gap: clamp(2rem, 5vw, 5rem);
  padding-bottom: clamp(3rem, 6vw, 6rem);
}

.footer-brand .wordmark {
  font-size: 1.7rem;
}

.footer-brand > p {
  max-width: 22rem;
  margin-top: 1.5rem;
  color: rgba(245, 240, 231, 0.55);
  font-size: 0.82rem;
  line-height: 1.7;
}

.footer-column h3,
.footer-nav h3 {
  margin-bottom: 1.25rem;
  color: var(--gold-300);
  font-family: var(--font-sans);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.footer-column ul,
.footer-nav ul,
.social-links {
  display: grid;
  gap: 0.7rem;
  list-style: none;
}

.footer-column a,
.footer-nav a,
.social-links a {
  position: relative;
  display: inline-block;
  width: fit-content;
  color: rgba(245, 240, 231, 0.62);
  font-size: 0.75rem;
  line-height: 1.5;
  transition: color var(--duration-fast) var(--ease);
}

.footer-bottom,
.footer-legal {
  min-height: 5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  padding-block: 1.25rem;
  border-top: 1px solid rgba(245, 240, 231, 0.12);
  font-size: 0.64rem;
  letter-spacing: 0.055em;
  line-height: 1.5;
}

.legal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.25rem;
  list-style: none;
}

.back-to-top,
#back-to-top {
  position: fixed;
  right: clamp(1rem, 2.5vw, 2rem);
  bottom: clamp(1rem, 2.5vw, 2rem);
  width: 3.25rem;
  height: 3.25rem;
  display: grid;
  place-items: center;
  z-index: 800;
  color: var(--navy-950);
  background: var(--gold-300);
  border: 1px solid var(--gold-300);
  border-radius: 50%;
  box-shadow: var(--shadow-md);
  font-size: 1rem;
  opacity: 0;
  pointer-events: none;
  transform: translateY(1rem);
  transition: opacity var(--duration) var(--ease), transform var(--duration) var(--ease), background var(--duration-fast) var(--ease);
}

.back-to-top.is-visible,
.back-to-top.visible,
#back-to-top.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

/* --------------------------------------------------------------------------
   22. Reveal, line and image effects
   -------------------------------------------------------------------------- */

.reveal,
[data-reveal] {
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity var(--duration-slow) var(--ease), transform var(--duration-slow) var(--ease);
}

.reveal.is-visible,
.reveal.in-view,
[data-reveal].is-visible,
[data-reveal].in-view {
  opacity: 1;
  transform: none;
}

.reveal[data-delay="1"] { transition-delay: 90ms; }
.reveal[data-delay="2"] { transition-delay: 180ms; }
.reveal[data-delay="3"] { transition-delay: 270ms; }
.reveal[data-delay="4"] { transition-delay: 360ms; }

.line-reveal,
[data-line-reveal] {
  position: relative;
}

.line-reveal::after,
[data-line-reveal]::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: var(--gold-line);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1.1s var(--ease);
}

.line-reveal.is-visible::after,
[data-line-reveal].is-visible::after {
  transform: scaleX(1);
}

.image-reveal,
.image-mask {
  position: relative;
  overflow: hidden;
}

.image-reveal::after,
.image-mask::after {
  position: absolute;
  inset: 0;
  background: var(--navy-900);
  content: "";
  transform-origin: right;
  transition: transform 1.15s var(--ease);
  z-index: 4;
}

.image-reveal.is-visible::after,
.image-mask.is-visible::after {
  transform: scaleX(0);
}

/* --------------------------------------------------------------------------
   23. Refined hover states
   -------------------------------------------------------------------------- */

@media (hover: hover) {
  .button:hover,
  .btn:hover,
  input[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 1rem 2.5rem rgba(7, 16, 29, 0.18);
  }

  .button:hover::after,
  .btn:hover::after {
    transform: scaleX(1.35);
  }

  .button-primary:hover,
  .btn-primary:hover,
  input[type="submit"]:hover {
    background: var(--burgundy-600);
    border-color: var(--burgundy-600);
  }

  .button-secondary:hover,
  .btn-secondary:hover {
    color: var(--ivory-50);
    background: var(--navy-900);
    border-color: var(--navy-900);
  }

  .surface-dark .button-secondary:hover,
  .section-dark .button-secondary:hover,
  .final-cta .button-secondary:hover {
    color: var(--navy-950);
    background: var(--ivory-50);
    border-color: var(--ivory-50);
  }

  .text-link:hover::before,
  .arrow-link:hover::before,
  .read-more:hover::before,
  .case-link:hover::before {
    transform: scaleX(1);
  }

  .text-link:hover::after,
  .arrow-link:hover::after,
  .read-more:hover::after,
  .case-link:hover::after {
    transform: translate(0.2rem, -0.2rem);
  }

  .announcement a:hover::after { transform: translateX(0.2rem); }
  .primary-nav a:not(.button):hover,
  .main-nav a:not(.button):hover { color: var(--ivory-50); }
  .primary-nav a:not(.button):hover::after,
  .main-nav a:not(.button):hover::after { transform: scaleX(1); transform-origin: left; }
  .nav-cta:hover { color: var(--navy-950); background: var(--ivory-50); border-color: var(--ivory-50); }

  .hero-media:hover img,
  .hero-portrait:hover img { filter: saturate(0.9) contrast(1.04); transform: scale(1.018); }
  .principle:hover::after,
  .principle-card:hover::after,
  .point-card:hover::after { width: 100%; }
  .principle:hover,
  .principle-card:hover,
  .point-card:hover { background: var(--ivory-100); }

  .offer-card:hover,
  .service-card:hover,
  .advisory-card:hover { border-color: var(--gold-line); box-shadow: var(--shadow-sm); transform: translateY(-0.5rem); }
  .offer-card.featured:hover,
  .service-card.featured:hover { transform: translateY(-2rem); }
  .case-card:hover,
  .case-study-card:hover { border-color: var(--gold-line); box-shadow: var(--shadow-sm); }
  .case-card:hover img,
  .case-study-card:hover img { filter: saturate(0.85); transform: scale(1.035); }
  .topic-list li:hover::after,
  .speaking-topics li:hover::after { transform: translateX(0.4rem); }
  .framework-tab:hover,
  .framework-stage:hover { color: var(--ivory-50); }
  .testimonial:hover,
  .testimonial-card:hover { border-color: var(--gold-line); box-shadow: var(--shadow-sm); transform: translateY(-0.35rem); }
  .testimonial:nth-child(2):hover,
  .testimonial-card:nth-child(2):hover { transform: translateY(2.15rem); }
  .insight-card:hover,
  .article-card:hover,
  .journal-card:hover { border-color: var(--gold-line); box-shadow: var(--shadow-sm); transform: translateY(-0.4rem); }
  .footer-column a:hover,
  .footer-nav a:hover,
  .social-links a:hover { color: var(--gold-300); }
  .back-to-top:hover { background: var(--ivory-50); }
}

/* --------------------------------------------------------------------------
   24. Responsive — large laptop (1200px)
   -------------------------------------------------------------------------- */

@media (max-width: 75rem) {
  :root {
    --gutter: clamp(1.5rem, 3.5vw, 3rem);
    --section-space: clamp(5rem, 9vw, 8rem);
  }

  .primary-nav ul,
  .main-nav ul,
  .nav-links { gap: 0.9rem; }
  .primary-nav a:not(.button),
  .main-nav a:not(.button) { font-size: 0.61rem; }
  .nav-cta { padding-inline: 0.8rem; }
  .hero-grid,
  .hero-inner { gap: 3.5rem; }
  .quote-card,
  .hero-quote { right: -0.5rem; }
  .offers-grid,
  .services-grid,
  .advisory-grid { gap: 0.85rem; }
  .footer-grid { grid-template-columns: 1.5fr repeat(4, 0.7fr); gap: 2.5rem; }
}

/* --------------------------------------------------------------------------
   25. Responsive — navigation/tablet landscape (1024px)
   -------------------------------------------------------------------------- */

@media (max-width: 64rem) {
  :root { --header-height: 4.75rem; }

  .nav-toggle,
  .menu-toggle { display: inline-flex; }

  .nav-shell,
  .navbar { position: relative; }

  .primary-nav,
  .main-nav {
    position: fixed;
    top: calc(var(--announcement-height) + var(--header-height));
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    display: grid;
    align-content: start;
    margin: 0;
    padding: clamp(2rem, 7vw, 4.5rem) var(--gutter);
    overflow-y: auto;
    color: var(--ivory-50);
    background: rgba(7, 16, 29, 0.99);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-1rem);
    visibility: hidden;
    transition: opacity var(--duration) var(--ease), transform var(--duration) var(--ease), visibility 0s linear var(--duration);
  }

  .site-header.is-scrolled .primary-nav,
  .header.is-scrolled .main-nav { top: var(--header-height); }

  .primary-nav.is-open,
  .primary-nav.open,
  .primary-nav[data-open="true"],
  .main-nav.is-open,
  body.nav-open .primary-nav,
  body.menu-open .main-nav {
    z-index: 3;
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
    transition-delay: 0s;
  }

  .primary-nav ul,
  .main-nav ul,
  .nav-links {
    width: min(100%, 42rem);
    display: grid;
    align-items: stretch;
    gap: 0;
    margin-inline: auto;
  }

  .primary-nav li,
  .main-nav li,
  .nav-links li { border-bottom: 1px solid var(--border-dark); }

  .primary-nav a:not(.button),
  .main-nav a:not(.button),
  .nav-links a:not(.button) {
    padding: 1rem 0;
    color: var(--ivory-50);
    font-family: var(--font-display);
    font-size: clamp(1.55rem, 4vw, 2.25rem);
    font-weight: 500;
    letter-spacing: -0.015em;
    text-transform: none;
  }

  .primary-nav a:not(.button)::after,
  .main-nav a:not(.button)::after { display: none; }
  .nav-shell > .nav-cta,
  .navbar > .nav-cta { margin-left: auto; }

  .hero-grid,
  .hero-inner {
    min-height: auto;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.68fr);
    gap: 2.5rem;
    padding-top: 5.5rem;
  }

  .hero h1,
  .hero-title { font-size: clamp(3.7rem, 7.8vw, 6rem); }
  .hero .stats-grid,
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
  .hero .stat:nth-child(2),
  .hero .stat-item:nth-child(2),
  .hero-stats > *:nth-child(2) { border-right: 0; }
  .hero .stat:nth-child(-n + 2),
  .hero .stat-item:nth-child(-n + 2),
  .hero-stats > *:nth-child(-n + 2) { border-bottom: 1px solid var(--border-dark); }

  .logo-list,
  .logo-grid,
  .media-logos { grid-template-columns: repeat(3, 1fr); }
  .section-header,
  .section-intro { grid-template-columns: 1fr 0.7fr; gap: 3rem; }
  .principle,
  .principle-card,
  .point-card { min-height: 22rem; padding: 2rem; }
  .principle h3,
  .principle-card h3 { font-size: 2.25rem; }

  .offers-grid,
  .services-grid,
  .advisory-grid { grid-template-columns: 1fr; gap: 1rem; }
  .offer-card.featured,
  .offer-card.is-featured,
  .service-card.featured,
  .advisory-card.featured { transform: none; }
  .offer-card,
  .service-card,
  .advisory-card { min-height: auto; }

  .speaking-grid,
  .speaker-grid { gap: 3.5rem; }
  .speaking-media,
  .speaker-media,
  .stage-image,
  .speaking-media img,
  .speaker-media img,
  .stage-image img { min-height: 32rem; }

  .testimonials-grid,
  .testimonial-grid,
  .quotes-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonial:nth-child(2),
  .testimonial-card:nth-child(2) { transform: none; }
  .lead-grid,
  .guide-grid { gap: 4rem; }
  .guide-cover,
  .book-cover,
  .guide-mockup > div:first-child { min-height: 29rem; }
  .bio-grid,
  .about-grid,
  .biography-grid { gap: 4rem; }
  .application-grid,
  .contact-grid { gap: 4rem; }
  .footer-grid { grid-template-columns: 1.4fr repeat(2, 1fr); }
  .footer-brand { grid-row: span 2; }
}

/* --------------------------------------------------------------------------
   26. Responsive — tablet/phone (768px)
   -------------------------------------------------------------------------- */

@media (max-width: 48rem) {
  :root {
    --gutter: 1.25rem;
    --section-space: 5.25rem;
  }

  .announcement,
  .announcement-bar { align-items: flex-start; flex-wrap: wrap; gap: 0.25rem 0.5rem; }
  .nav-shell > .nav-cta,
  .navbar > .nav-cta { display: none; }

  .hero-grid,
  .hero-inner {
    grid-template-columns: 1fr;
    gap: 3.5rem;
    padding-top: 4.5rem;
  }

  .hero h1,
  .hero-title { max-width: 10ch; font-size: clamp(3.6rem, 16vw, 6.25rem); }
  .hero-summary,
  .hero-lede,
  .hero-copy > p { font-size: 1rem; }
  .hero-media,
  .hero-portrait,
  .portrait-frame { max-width: 32rem; justify-self: center; }
  .hero .stats-grid,
  .hero-stats { grid-column: 1; }
  .quote-card,
  .hero-quote { right: -0.25rem; bottom: 1.5rem; }

  .section-header,
  .section-intro { grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 3.25rem; }
  .section-header > p,
  .section-intro > p { max-width: 36rem; padding: 0; }

  .principles-grid,
  .principles,
  .point-grid { grid-template-columns: 1fr; }
  .principle,
  .principle-card,
  .point-card { min-height: auto; }
  .principle h3,
  .principle-card h3,
  .point-card h3 { margin-top: 3rem; padding-top: 0; }

  .case-grid,
  .case-studies-grid,
  .results-grid { grid-template-columns: 1fr; }
  .case-details-grid { grid-template-columns: 1fr; }

  .speaking-grid,
  .speaker-grid { grid-template-columns: 1fr; }
  .speaking-media,
  .speaker-media,
  .stage-image { order: 2; }
  .speaking-badge,
  .stage-badge { right: 1rem; }

  .framework-tabs,
  .framework-stages,
  .process-tabs {
    grid-template-columns: 1fr;
    gap: 0.5rem;
    margin-bottom: 2rem;
  }

  .framework-tabs::before,
  .framework-stages::before,
  .process-tabs::before { top: 1rem; bottom: 1rem; left: 1.15rem; right: auto; width: 1px; height: auto; }
  .framework-tab,
  .framework-stage,
  .process-tab { flex-direction: row; padding: 0.35rem 0; text-align: left; }
  .framework-tab::before,
  .framework-stage::before,
  .process-tab::before { flex: 0 0 auto; }
  .framework-panel,
  .process-panel,
  .framework-content { grid-template-columns: 1fr; gap: 1.5rem; }

  .authority-stats .stats-grid,
  .stats-band .stats-grid,
  .impact-stats .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .authority-stats .stat,
  .authority-stats .stat-item,
  .stats-band .stat,
  .impact-stats .stat { min-height: 9rem; border-bottom: 1px solid rgba(245, 240, 231, 0.14); }
  .authority-stats .stat:nth-child(2n),
  .authority-stats .stat-item:nth-child(2n),
  .stats-band .stat:nth-child(2n),
  .impact-stats .stat:nth-child(2n) { border-right: 0; }
  .authority-stats .stat:last-child,
  .authority-stats .stat-item:last-child,
  .stats-band .stat:last-child,
  .impact-stats .stat:last-child { grid-column: 1 / -1; }

  .testimonials-grid,
  .testimonial-grid,
  .quotes-grid { grid-template-columns: 1fr; }
  .testimonial,
  .testimonial-card,
  .quote-card-large { min-height: 20rem; }

  .lead-grid,
  .guide-grid { grid-template-columns: 1fr; }
  .guide-mockup,
  .book-mockup { max-width: 23rem; }
  .learning-list,
  .guide-outcomes { grid-template-columns: 1fr; }
  .lead-form .form-grid,
  .download-form .form-grid { grid-template-columns: 1fr; }

  .insights-grid,
  .articles-grid,
  .journal-grid { grid-template-columns: 1fr; }
  .insight-card:nth-child(1),
  .article-card:nth-child(1),
  .journal-card:nth-child(1) { grid-column: auto; }

  .bio-grid,
  .about-grid,
  .biography-grid { grid-template-columns: 1fr; }
  .bio-media,
  .about-media,
  .biography-media { position: relative; top: auto; max-width: 30rem; }
  .bio-copy,
  .about-copy { columns: 1; }

  .application-grid,
  .contact-grid { grid-template-columns: 1fr; }
  .application-intro,
  .contact-intro { position: relative; top: auto; }
  .application-form,
  .contact-form { padding: 1.5rem; }
  .form-grid { grid-template-columns: 1fr; }
  .field-full,
  .field.full,
  .form-field-full { grid-column: auto; }

  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-brand { grid-column: 1 / -1; grid-row: auto; }
  .footer-bottom,
  .footer-legal { align-items: flex-start; flex-direction: column; }
}

/* --------------------------------------------------------------------------
   27. Responsive — compact mobile (520px)
   -------------------------------------------------------------------------- */

@media (max-width: 32.5rem) {
  :root {
    --heading-md: clamp(2.55rem, 13vw, 4.2rem);
  }

  body { min-width: 0; }
  .announcement,
  .announcement-bar { font-size: 0.61rem; letter-spacing: 0.045em; }
  .wordmark,
  .brand,
  .site-logo { font-size: 1.12rem; gap: 0.65rem; }
  .wordmark::before,
  .brand-mark,
  .monogram { width: 2.15rem; }
  .nav-toggle,
  .menu-toggle { width: 2.75rem; height: 2.75rem; }

  .hero-grid,
  .hero-inner { padding-top: 3.75rem; padding-bottom: 3.5rem; }
  .hero h1,
  .hero-title { font-size: clamp(3.2rem, 16.5vw, 5rem); }
  .hero-actions,
  .button-row,
  .cta-group { display: grid; grid-template-columns: 1fr; }
  .hero-actions .button,
  .button-row .button,
  .cta-group .button { width: 100%; }
  .hero-media,
  .hero-portrait,
  .portrait-frame { aspect-ratio: 0.79; }
  .quote-card,
  .hero-quote { position: relative; right: auto; bottom: auto; width: calc(100% - 1.5rem); margin: -5rem 0 0 1.5rem; }
  .hero .stats-grid,
  .hero-stats { grid-template-columns: 1fr 1fr; }
  .hero .stat,
  .hero .stat-item,
  .hero-stats > * { padding: 1.25rem 0.75rem; }
  .hero .stat:nth-child(odd),
  .hero .stat-item:nth-child(odd),
  .hero-stats > *:nth-child(odd) { padding-left: 0; }

  .logo-list,
  .logo-grid,
  .media-logos { grid-template-columns: repeat(2, 1fr); }
  .logo-list > *,
  .logo-grid > *,
  .media-logos > * { min-height: 4.5rem; font-size: 0.94rem; }

  .offer-card,
  .service-card,
  .advisory-card,
  .framework-shell,
  .framework,
  .process-shell { padding: 1.5rem; }
  .case-content,
  .case-card-body,
  .case-study-content { padding: 1.5rem; }
  .case-filters,
  .filter-list { flex-wrap: nowrap; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); overflow-x: auto; scrollbar-width: none; }
  .case-filters::-webkit-scrollbar,
  .filter-list::-webkit-scrollbar { display: none; }
  .case-filter,
  .filter-button,
  [data-case-filter] { flex: 0 0 auto; }

  .speaking-media,
  .speaker-media,
  .stage-image,
  .speaking-media img,
  .speaker-media img,
  .stage-image img { min-height: 25rem; }
  .topic-list li,
  .speaking-topics li,
  .topic-item { grid-template-columns: 1.75rem 1fr auto; gap: 0.6rem; font-size: 1.05rem; }

  .authority-stats .stat,
  .authority-stats .stat-item,
  .stats-band .stat,
  .impact-stats .stat { padding: 1.25rem 0.75rem; }
  .counter,
  .stat-number,
  [data-counter] { font-size: 2.7rem; }

  .guide-cover,
  .book-cover,
  .guide-mockup > div:first-child { min-height: 27rem; transform: rotateY(-5deg); }
  .insight-card,
  .article-card,
  .journal-card { min-height: 22rem; padding: 1.5rem; }
  .milestones li,
  .milestone-list li,
  .career-list li { grid-template-columns: 4.5rem 1fr; gap: 0.75rem; }
  .application-form,
  .contact-form { margin-inline: -0.25rem; padding: 1.25rem; }

  .final-cta::before,
  .closing-cta::before { width: 120vw; }
  .final-cta::after,
  .closing-cta::after { width: 85vw; }
  .final-cta h2,
  .closing-cta h2 { font-size: clamp(3rem, 15vw, 4.6rem); }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
  .legal-links { display: grid; }
  .back-to-top,
  #back-to-top { width: 2.85rem; height: 2.85rem; }
}

/* --------------------------------------------------------------------------
   28. Responsive — 375px tuning
   -------------------------------------------------------------------------- */

@media (max-width: 23.4375rem) {
  :root { --gutter: 1rem; }
  .announcement,
  .announcement-bar { padding-inline: 0.75rem; }
  .wordmark small,
  .brand small { display: none; }
  .hero h1,
  .hero-title { font-size: clamp(3rem, 16vw, 3.75rem); }
  .button,
  .btn,
  input[type="submit"] { padding-inline: 1rem; font-size: 0.66rem; }
  .hero .stat strong,
  .hero .stat-value,
  .hero-stats strong { font-size: 1.75rem; }
  .hero .stat span,
  .hero .stat-label,
  .hero-stats span { font-size: 0.56rem; }
  .principle,
  .principle-card,
  .point-card,
  .offer-card,
  .service-card,
  .advisory-card { padding: 1.35rem; }
  .framework-shell,
  .framework,
  .process-shell { padding-inline: 1.15rem; }
  .testimonial,
  .testimonial-card,
  .quote-card-large { padding: 1.5rem; }
  .form-actions .button { min-width: 0; width: 100%; }
}

/* --------------------------------------------------------------------------
   29. Reduced motion and print
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }

  .reveal,
  [data-reveal] { opacity: 1; transform: none; }
  .image-reveal::after,
  .image-mask::after { display: none; }
  .guide-cover,
  .book-cover,
  .guide-mockup > div:first-child { transform: none; }
}

@media print {
  @page { margin: 1.5cm; }

  *,
  *::before,
  *::after {
    color: #000 !important;
    background: #fff !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  html,
  body { font-size: 10pt; }
  body { overflow: visible; }
  .announcement,
  .nav-toggle,
  .menu-toggle,
  .primary-nav,
  .main-nav,
  .back-to-top,
  #back-to-top,
  .hero-actions,
  .button-row,
  form,
  .final-cta,
  .closing-cta { display: none !important; }
  .site-header,
  .header { position: static; border-bottom: 1px solid #000; }
  .nav-shell,
  .navbar { min-height: 3rem; }
  .hero-grid,
  .hero-inner,
  .section,
  section.section { min-height: 0; padding-block: 1.5rem; }
  .hero-grid,
  .hero-inner,
  .section-header,
  .section-intro,
  .principles-grid,
  .offers-grid,
  .case-grid,
  .speaking-grid,
  .framework-panel,
  .testimonials-grid,
  .lead-grid,
  .insights-grid,
  .bio-grid,
  .application-grid,
  .footer-grid { display: block; }
  .hero-media,
  .speaking-media,
  .guide-mockup,
  .bio-media { display: none; }
  .principle,
  .offer-card,
  .case-card,
  .testimonial,
  .insight-card { min-height: 0; margin-bottom: 1rem; border: 1px solid #999; break-inside: avoid; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; }
  .wordmark::before { content: "AV"; }
}

/* ========================================================================== 
   30. Page-specific composition and markup compatibility
   Keeps the authored long-form page aligned with the reusable design system.
   ========================================================================== */

main > section:not(.hero):not(.credibility):not(.final-cta) {
  padding-block: var(--section-space);
}

.section-ivory { background: var(--ivory-50); }
.section-stone { background: var(--ivory-100); }
.section-burgundy { background: var(--burgundy-600); }

.announcement-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.85rem;
}

.announcement-inner p { margin: 0; }
.announcement-inner p span {
  margin-right: 0.5rem;
  color: var(--gold-300);
  font-size: 0.58rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.header-inner { display: flex; align-items: center; }
.header-inner .primary-nav {
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2vw, 1.75rem);
}
.header-inner .primary-nav .nav-cta { min-height: 2.9rem; }

.brand-name { display: inline-block; }
.button-small { min-height: 2.85rem; padding: 0.75rem 1rem; font-size: 0.62rem; }
.button-dark { color: var(--ivory-50); background: var(--navy-900); border-color: var(--navy-900); }
.button-outline { color: var(--navy-900); background: transparent; border-color: var(--border-strong); }
.button-ghost { color: var(--ivory-50); background: transparent; border-color: rgba(245, 240, 231, 0.45); }
.offer-card.featured .button-dark { color: var(--navy-950); background: var(--gold-300); border-color: var(--gold-300); }
.text-link-light { color: var(--ivory-50); }

.hero-visual {
  position: relative;
  width: 100%;
  max-width: 34rem;
  justify-self: end;
}

.hero-visual .portrait-frame { max-width: none; }
.hero-visual figcaption {
  position: absolute;
  right: -1.25rem;
  bottom: 2rem;
  width: min(21rem, 72%);
  z-index: 4;
  padding: clamp(1.25rem, 2vw, 2rem);
  color: var(--ivory-50);
  background: rgba(11, 22, 38, 0.94);
  border: 1px solid rgba(216, 194, 143, 0.38);
  box-shadow: var(--shadow-md);
  backdrop-filter: blur(10px);
}

.hero-visual figcaption > span {
  color: var(--gold-300);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.hero-visual figcaption blockquote {
  margin-top: 0.8rem;
  font-family: var(--font-display);
  font-size: clamp(1.05rem, 1.5vw, 1.35rem);
  font-style: italic;
  line-height: 1.4;
}

.hero-index {
  position: absolute;
  top: -1.35rem;
  left: -1.5rem;
  color: var(--gold-300);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.15em;
}

.hero-stats dt {
  color: var(--ivory-50);
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3vw, 2.7rem);
  line-height: 1;
}
.hero-stats dd {
  margin-top: 0.45rem;
  color: rgba(245, 240, 231, 0.55);
  font-size: 0.64rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.credibility {
  padding-block: clamp(2.75rem, 5vw, 4.5rem);
  background: var(--ivory-100);
  border-bottom: 1px solid var(--border);
}
.credibility .section-kicker {
  display: block;
  max-width: 43rem;
  margin: 0 auto 2rem;
  color: var(--text-muted);
  font-size: var(--text-sm);
  letter-spacing: 0.035em;
  line-height: 1.6;
  text-align: center;
  text-transform: none;
}
.credibility .section-kicker::before { display: none; }
.credibility .logo-strip {
  padding: 0;
  background: var(--border);
  border: 1px solid var(--border);
}
.credibility .logo-strip span { display: grid; gap: 0.15rem; place-items: center; }
.credibility .logo-strip small {
  color: var(--text-muted);
  font-family: var(--font-sans);
  font-size: 0.48rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.section-heading.centered {
  width: min(100%, 52rem);
  display: block;
  margin-inline: auto;
  text-align: center;
}
.section-heading.centered .eyebrow { justify-content: center; }
.section-heading.centered h2 { max-width: 14ch; margin-inline: auto; }
.section-heading.centered > p:last-child { max-width: 42rem; margin: 1.5rem auto 0; }

.editorial-image {
  position: relative;
  margin-top: clamp(3rem, 7vw, 7rem);
  overflow: hidden;
  background: var(--navy-800);
}
.editorial-image img {
  width: 100%;
  height: clamp(22rem, 44vw, 40rem);
  object-fit: cover;
  filter: saturate(0.65) contrast(1.04);
}
.editorial-image figcaption {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  padding: 0.75rem 1rem;
  color: var(--ivory-50);
  background: rgba(7, 16, 29, 0.84);
  font-size: 0.6rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.offer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--gold-500);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.offer-top > span {
  width: 2.5rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
}
.offer-card.featured .offer-top { color: var(--gold-300); }
.offer-for strong { color: var(--ink); }
.offer-card.featured .offer-for strong { color: var(--ivory-50); }
.offer-format { margin-bottom: 1.4rem; color: var(--text-muted); }
.offer-format span { display: block; margin-bottom: 0.35rem; color: var(--gold-500); font-size: 0.58rem; }
.offer-card.featured .offer-format { color: var(--text-on-dark-muted); }

.case-studies .section-heading > p { color: var(--text-on-dark-muted); }
.case-studies .case-filter { color: rgba(245, 240, 231, 0.68); border-color: rgba(245, 240, 231, 0.24); }
.case-studies .case-filter:is(.is-active, [aria-pressed="true"]) {
  color: var(--navy-950);
  background: var(--gold-300);
  border-color: var(--gold-300);
}
.case-list .case-card { display: grid; align-content: start; }
.case-list .case-summary { margin: 0; padding: clamp(1.75rem, 3vw, 2.75rem) clamp(1.75rem, 3vw, 2.75rem) 0; }
.case-type {
  color: var(--burgundy-500);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.case-list .case-metric { margin-inline: clamp(1.75rem, 3vw, 2.75rem); }
.case-list .case-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 1.5rem clamp(1.75rem, 3vw, 2.75rem) clamp(1.75rem, 3vw, 2.75rem);
  padding: 0.9rem 0;
  color: var(--ink);
  background: transparent;
  border-block: 1px solid var(--border);
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: left;
  text-transform: uppercase;
}
.case-list .case-toggle span { color: var(--gold-500); font-size: 1.2rem; }
.case-list .case-details.is-open {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: 1fr;
  gap: 1.25rem;
  margin: 0 clamp(1.75rem, 3vw, 2.75rem) clamp(1.75rem, 3vw, 2.75rem);
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}
.case-card.is-filtered-out { opacity: 0; transform: translateY(0.75rem); }
.case-card.is-filter-visible { animation: panel-in var(--duration) var(--ease) both; animation-delay: var(--filter-delay, 0ms); }

.speaking-details {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 2rem;
  margin: 2.5rem 0;
}
.speaking-content > p {
  color: var(--text-muted);
}
.speaking-details h3 {
  margin-bottom: 1rem;
  color: var(--gold-500);
  font-family: var(--font-sans);
  font-size: 0.62rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.speaking-details .speaking-topics {
  counter-reset: speaking-topic;
  border-top-color: var(--border);
}
.speaking-details .speaking-topics li {
  counter-increment: speaking-topic;
  color: var(--navy-900);
  border-bottom-color: var(--border);
  font-weight: 500;
}
.speaking-details .speaking-topics li::before {
  color: var(--gold-500);
  content: counter(speaking-topic, decimal-leading-zero);
}
.speaking-details .speaking-topics li::after {
  color: var(--gold-500);
}
.speaking-details > div:last-child p { color: var(--text-muted); font-size: 0.84rem; line-height: 1.7; }

section.framework {
  padding: var(--section-space) 0;
  overflow: visible;
  color: var(--ink);
  background: var(--ivory-100);
  border: 0;
  box-shadow: none;
}
section.framework::after { display: none; }
.framework-tab > span { display: none; }
.framework-tab::before { content: attr(data-stage); font-size: 0; }
.framework-tab:nth-child(1)::before { content: "01"; font-size: 0.95rem; }
.framework-tab:nth-child(2)::before { content: "02"; font-size: 0.95rem; }
.framework-tab:nth-child(3)::before { content: "03"; font-size: 0.95rem; }
.framework-tab:nth-child(4)::before { content: "04"; font-size: 0.95rem; }
.framework-tab:nth-child(5)::before { content: "05"; font-size: 0.95rem; }
.framework-panel > .panel-number { color: var(--gold-300); font-size: 0.62rem; letter-spacing: 0.13em; text-transform: uppercase; }
.framework-panel > dl {
  grid-column: 2 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.framework-panel > dl > div { padding-top: 1rem; border-top: 1px solid var(--border-dark); }
.framework-panel dt { color: var(--gold-300); font-size: 0.59rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.framework-panel dd { margin-top: 0.5rem; color: var(--text-on-dark-muted); font-size: 0.83rem; line-height: 1.6; }

.results-intro {
  display: grid;
  grid-template-columns: 0.55fr 1fr;
  align-items: end;
  gap: 3rem;
  margin-bottom: 3rem;
}
.results-intro h2 { max-width: 13ch; color: var(--ivory-50); font-size: var(--heading-md); }
.authority-stats .stats-grid > div {
  min-height: 11rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.25rem, 2.4vw, 2.25rem);
  border-right: 1px solid rgba(245, 240, 231, 0.14);
  text-align: center;
}
.authority-stats .stats-grid > div:last-child { border-right: 0; }
.authority-stats .stats-grid dd {
  margin-top: 0.8rem;
  color: rgba(245, 240, 231, 0.66);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.09em;
  line-height: 1.5;
  text-transform: uppercase;
}

.testimonial-featured { grid-column: span 2; color: var(--ivory-50); background: var(--navy-900); border-color: var(--navy-900); }
.testimonial-featured blockquote { color: var(--ivory-50); font-size: clamp(1.7rem, 2.4vw, 2.55rem); }
.testimonial-card figcaption { display: grid; gap: 0.3rem; margin-top: auto; padding-top: 2rem; }
.testimonial-card figcaption strong { color: var(--ink); font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; }
.testimonial-card figcaption span { color: var(--text-muted); font-size: 0.7rem; }
.testimonial-card figcaption small { margin-top: 0.7rem; color: var(--gold-500); font-size: 0.65rem; line-height: 1.5; }
.testimonial-featured figcaption strong { color: var(--ivory-50); }
.testimonial-featured figcaption span { color: var(--text-on-dark-muted); }

.report-grid { position: relative; z-index: 1; }
.book-shadow {
  position: absolute;
  right: -1.5rem;
  bottom: -1.5rem;
  width: 90%;
  height: 92%;
  z-index: -1;
  background: rgba(197, 170, 112, 0.12);
  border: 1px solid rgba(216, 194, 143, 0.2);
  transform: rotate(4deg);
}
.book-cover > span { position: relative; z-index: 1; color: var(--gold-300); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; }
.book-cover > strong {
  position: relative;
  z-index: 1;
  max-width: 8ch;
  font-family: var(--font-display);
  font-size: clamp(3rem, 5vw, 4.8rem);
  font-weight: 500;
  line-height: 0.9;
}
.report-copy h2 { max-width: 11ch; margin-top: 1.5rem; color: var(--ivory-50); font-size: var(--heading-md); }
.report-copy > .lead { max-width: 42rem; margin-top: 1.5rem; color: var(--text-on-dark-muted); font-size: var(--text-lg); line-height: 1.65; }
.lead-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.9rem; }
.lead-form .form-field label { color: var(--gold-300); }
.lead-form .button { grid-column: 1 / -1; width: fit-content; }
.lead-form .form-note,
.lead-form .form-status { grid-column: 1 / -1; }

.insight-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
  padding-top: 2rem;
  color: var(--text-muted);
  font-size: 0.65rem;
}
.insight-card footer a { color: var(--ink); font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; }
.insight-card:first-child footer,
.insight-card:first-child footer a { color: var(--text-on-dark-muted); }
.insight-card.quote-card { position: relative; right: auto; bottom: auto; width: auto; z-index: auto; }
.insight-card.quote-card::before { margin-bottom: 1rem; }

.bio-media {
  position: sticky;
  top: calc(var(--header-height) + 2rem);
  aspect-ratio: 0.79;
  overflow: visible;
}
.bio-media > img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.68) contrast(1.04); }
.bio-media > blockquote {
  position: absolute;
  right: -1.5rem;
  bottom: 2rem;
  width: min(19rem, 70%);
  padding: 1.5rem;
  color: var(--ivory-50);
  background: var(--burgundy-600);
  border: 1px solid var(--gold-line);
  font-family: var(--font-display);
  font-size: 1.35rem;
  font-style: italic;
  line-height: 1.35;
}
.about-copy { columns: auto; margin-top: 0; }
.about-copy h2 { max-width: 12ch; margin-top: 1.5rem; font-size: var(--heading-md); }
.about-copy > .lead { margin-top: 2rem; color: var(--ink-soft); font-family: var(--font-display); font-size: clamp(1.35rem, 2vw, 1.85rem); line-height: 1.45; }
.about-copy > p:not(.eyebrow):not(.lead) { max-width: 43rem; margin-top: 1.25rem; color: var(--text-muted); line-height: 1.75; }
.expertise { margin-top: 2.5rem; }
.expertise h3 { color: var(--gold-500); font-family: var(--font-sans); font-size: 0.62rem; letter-spacing: 0.13em; text-transform: uppercase; }
.expertise ul { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; list-style: none; }
.expertise li { padding: 0.6rem 0.8rem; background: var(--ivory-150); border: 1px solid var(--border); border-radius: var(--radius-pill); font-size: 0.64rem; font-weight: 700; letter-spacing: 0.05em; }
.milestones li p { color: var(--text-muted); font-size: 0.82rem; line-height: 1.6; }

.contact-note { margin-top: 2.25rem; padding: 1.5rem; border: 1px solid var(--border-dark); }
.contact-note > span { color: var(--gold-300); font-size: 0.61rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.contact-note ol { display: grid; gap: 0.75rem; margin: 1rem 0 0; padding-left: 1.2rem; color: var(--text-on-dark-muted); font-size: 0.78rem; line-height: 1.55; }
.application-section .form-field label { color: rgba(245, 240, 231, 0.74); }
.application-section .form-field input,
.application-section .form-field select,
.application-section .form-field textarea { color: var(--ivory-50); background: rgba(255, 255, 255, 0.055); border-color: rgba(245, 240, 231, 0.26); }
.application-section .form-field select option { color: var(--ink); background: var(--ivory-50); }
.field-hint { color: rgba(245, 240, 231, 0.5); font-size: 0.68rem; }
.form-field.is-invalid input,
.form-field.is-invalid select,
.form-field.is-invalid textarea,
.form-field [aria-invalid="true"] { border-color: #d87885; }
.checkbox-field { display: flex; align-items: flex-start; gap: 0.75rem; margin-top: 1.25rem; color: var(--text-on-dark-muted); font-size: 0.74rem; line-height: 1.55; }
.checkbox-field input { width: 1rem; height: 1rem; flex: 0 0 auto; margin-top: 0.15rem; accent-color: var(--gold-300); }
.application-form > .button { margin-top: 1.5rem; color: var(--navy-950); background: var(--gold-300); border-color: var(--gold-300); }

.final-cta-inner { position: relative; z-index: 1; }

.footer-main {
  display: grid;
  grid-template-columns: minmax(15rem, 1.1fr) minmax(0, 2.2fr);
  gap: clamp(3rem, 7vw, 8rem);
  padding-bottom: clamp(3rem, 6vw, 6rem);
}
.footer-brand .brand { color: var(--ivory-50); }
.footer-brand > a:last-child { display: inline-block; margin-top: 1rem; color: var(--gold-300); font-size: 0.75rem; }
.footer-nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; }
.footer-nav > div { display: grid; align-content: start; gap: 0.7rem; }
.footer-nav h2 { margin-bottom: 0.55rem; color: var(--gold-300); font-family: var(--font-sans); font-size: 0.6rem; letter-spacing: 0.14em; text-transform: uppercase; }
.footer-legal > div { display: flex; flex-wrap: wrap; gap: 1rem; }
.legal-notes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  padding: 1.5rem var(--gutter) 2.5rem;
  color: rgba(245, 240, 231, 0.42);
  border-top: 1px solid rgba(245, 240, 231, 0.08);
  font-size: 0.62rem;
  line-height: 1.55;
}
.legal-notes strong { color: rgba(245, 240, 231, 0.68); }
.legal-notes a { color: var(--gold-300); }

@media (max-width: 64rem) {
  .header-inner .primary-nav { display: grid; }
  .header-inner .primary-nav .nav-cta { width: min(100%, 42rem); margin: 1.25rem auto 0; }
  .hero-visual figcaption { right: -0.35rem; }
  .testimonial-featured { grid-column: 1 / -1; }
  .footer-main { grid-template-columns: 1fr; }
}

@media (max-width: 48rem) {
  .announcement-inner { flex-wrap: wrap; gap: 0.25rem 0.6rem; }
  .announcement-inner p { width: 100%; }
  .header-inner .primary-nav { top: calc(var(--announcement-height) + var(--header-height)); }
  .hero-visual { max-width: 30rem; justify-self: center; }
  .hero-index { left: 0; }
  .section-heading.centered { text-align: left; }
  .section-heading.centered .eyebrow { justify-content: flex-start; }
  .section-heading.centered h2,
  .section-heading.centered > p:last-child { margin-inline: 0; }
  .case-list .case-details.is-open { grid-template-columns: 1fr; }
  .speaking-details { grid-template-columns: 1fr; }
  .results-intro { grid-template-columns: 1fr; gap: 1.25rem; }
  .authority-stats .stats-grid > div { min-height: 9rem; border-bottom: 1px solid rgba(245, 240, 231, 0.14); }
  .authority-stats .stats-grid > div:nth-child(2n) { border-right: 0; }
  .authority-stats .stats-grid > div:last-child { grid-column: 1 / -1; }
  .testimonial-featured { grid-column: auto; }
  .lead-form { grid-template-columns: 1fr; }
  .lead-form .button { width: 100%; }
  .bio-media { position: relative; top: auto; max-width: 30rem; }
  .bio-media > blockquote { right: -0.25rem; }
  .footer-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .legal-notes { grid-template-columns: 1fr; }
}

@media (max-width: 32.5rem) {
  .brand-name { font-size: 1rem; }
  .hero-visual figcaption { position: relative; right: auto; bottom: auto; width: calc(100% - 1.25rem); margin: -4rem 0 0 1.25rem; }
  .editorial-image figcaption { position: static; }
  .book-shadow { right: 0; }
  .case-list .case-summary { padding: 1.5rem 1.5rem 0; }
  .case-list .case-metric,
  .case-list .case-toggle,
  .case-list .case-details.is-open { margin-inline: 1.5rem; }
  .framework-panel { grid-template-columns: 1fr; }
  .framework-panel > dl { grid-column: auto; grid-template-columns: 1fr; }
  .footer-nav { grid-template-columns: 1fr; }
}