@font-face {
  font-family: Montserrat;
  src: url("/assets/montserrat.woff2?v=06b16db7a969") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: Montserrat;
  src: url("/assets/montserrat-italic.woff2?v=0eb22e3d769a") format("woff2");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
:root {
  --navy: #00224d;
  --blue: #0a4d90;
  --gold: #ebc781;
  --ink: var(--navy);
  --text: var(--navy);
  --muted: #385575;
  --paper: #fffefd;
  --white: #fff;
  --cream: #fcf4e6;
  --blue-tint: #edf3f9;
  --gold-dark: var(--blue);
  --line: #d2ddea;
  --error: #9e2828;
  --radius: 4px;
  --font: Montserrat, Arial, sans-serif;
  --display: var(--font);
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 96px;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--text);
  font: 400 16px/1.7 var(--font);
  -webkit-font-smoothing: antialiased;
}
img {
  display: block;
  max-width: 100%;
  height: auto;
}
figure,
blockquote {
  margin: 0;
}
h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}
h1,
h2,
h3 {
  color: var(--ink);
}
h1,
h2 {
  font-family: var(--display);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1.1;
  text-wrap: balance;
}
h1 {
  font-size: clamp(44px, 5.6vw, 80px);
}
h2 {
  font-size: clamp(34px, 3.5vw, 50px);
  margin-bottom: 24px;
}
h3 {
  font-size: 21px;
  line-height: 1.35;
  letter-spacing: -0.025em;
  font-weight: 650;
}
p {
  margin-bottom: 20px;
}
a {
  color: inherit;
  text-underline-offset: 5px;
  text-decoration-thickness: 1px;
}
a:hover {
  color: var(--gold-dark);
}
button,
input,
textarea,
select {
  font: inherit;
}
button,
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
}
button:disabled {
  cursor: wait;
  opacity: 0.65;
}
button:focus-visible,
a:focus-visible,
summary:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex="-1"]:focus-visible {
  outline: 3px solid var(--gold-dark);
  outline-offset: 5px;
}
main:focus {
  outline: none;
}
::selection {
  background: var(--gold);
  color: var(--ink);
}
.container {
  max-width: 1280px;
  padding-inline: 40px;
  margin-inline: auto;
}
.section {
  padding-block: 96px;
}
.eyebrow {
  font-size: 11px;
  line-height: 1.5;
  font-weight: 750;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold-dark);
  margin-bottom: 24px;
}
.section-intro {
  font-size: 18px;
  max-width: 65ch;
  line-height: 1.7;
}
.section-copy p {
  max-width: 46ch;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
  min-height: 54px;
  padding: 13px 24px;
  background: var(--ink);
  color: var(--white);
  text-decoration: none;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  font-weight: 650;
  font-size: 14px;
  line-height: 1.5;
  white-space: nowrap;
  transition:
    background 0.18s,
    transform 0.18s,
    border-color 0.18s;
}
.button:hover {
  background: var(--blue);
  color: var(--white);
  border-color: var(--blue);
  transform: translateY(-2px);
}
.button:active {
  transform: translateY(1px);
}
.button span {
  font-size: 20px;
  font-weight: 400;
}
.button-small {
  min-height: 44px;
  padding: 10px 17px;
  gap: 14px;
  font-size: 12px;
}
.button-outline {
  background: transparent;
  color: var(--ink);
}
.button-outline:hover {
  background: var(--blue-tint);
  color: var(--ink);
}
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-height: 44px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid var(--gold);
  color: var(--ink);
  transition: gap 0.18s;
}
.text-link:hover {
  gap: 24px;
}
.text-link span {
  font-size: 20px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 12px 20px;
  background: var(--ink);
  color: white;
  transform: translateY(-160%);
}
.skip-link:focus {
  transform: translateY(0);
}
.site-header {
  height: 80px;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
  position: relative;
  z-index: 10;
}
.header-inner {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 13px;
  text-decoration: none;
  flex-shrink: 0;
  color: var(--ink);
}
.brand img {
  width: 73px;
  height: 52px;
  object-fit: contain;
}
.brand > span {
  font-family: var(--display);
  font-size: 25px;
  line-height: 1.1;
  font-weight: 600;
  letter-spacing: -0.025em;
}
.brand small {
  display: block;
  font-family: var(--font);
  font-size: 8px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.025em;
  margin-top: 5px;
}
.site-header nav {
  display: flex;
  align-items: center;
  gap: 26px;
}
.site-header nav > a:not(.button) {
  font-size: 11px;
  font-weight: 650;
  text-decoration: none;
  position: relative;
  min-height: 44px;
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.site-header nav > a:not(.button)::after {
  content: "";
  position: absolute;
  bottom: 5px;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.18s;
}
.site-header nav > a:hover::after,
.site-header nav > a[aria-current]::after {
  transform: scaleX(1);
}
.menu-toggle {
  display: none;
  background: none;
  border: 0;
  min-height: 44px;
  padding: 8px;
  font-size: 14px;
  color: var(--ink);
}
.menu-lines {
  width: 20px;
  height: 12px;
  border-top: 1px solid;
  border-bottom: 1px solid;
  margin-left: 12px;
  display: inline-block;
}
.home-hero {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 60px;
  padding-block: 40px 48px;
  align-items: center;
}
.hero-copy {
  padding-block: 20px 28px;
}
.home-hero h1 {
  font-size: clamp(58px, 6.6vw, 90px);
  line-height: 1.03;
  letter-spacing: -0.055em;
  margin-bottom: 28px;
}
.home-hero h1 em {
  font-weight: 400;
  color: var(--gold-dark);
  line-height: 1.12;
  padding-bottom: 5px;
}
.hero-intro {
  font-size: 18px;
  line-height: 1.65;
  max-width: 46ch;
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 28px;
  align-items: center;
  margin-top: 32px;
}
.hero-photo {
  height: 580px;
  overflow: hidden;
  position: relative;
  border-top-left-radius: 210px;
  border-top-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  background: var(--cream);
}
.hero-photo picture,
.hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 54%;
}
.facts-strip {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--white);
}
.facts-inner {
  display: grid;
  grid-template-columns: 1.15fr 1fr 1fr 1fr;
  align-items: center;
  gap: 32px;
  padding-block: 28px;
}
.facts-inner > p {
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
  color: var(--muted);
}
.facts-inner > p strong {
  color: var(--ink);
  font-weight: 650;
}
.facts-inner > div {
  padding-left: 32px;
  border-left: 1px solid var(--line);
}
.facts-inner > div > strong {
  display: block;
  font-family: var(--display);
  font-size: 32px;
  letter-spacing: -0.04em;
  color: var(--ink);
  line-height: 1.2;
  font-weight: 500;
}
.facts-inner > div > span {
  display: block;
  font-size: 11px;
  margin-top: 6px;
  color: var(--muted);
}
.conversation-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 90px;
  align-items: center;
}
.conversation-example {
  background: var(--cream);
  padding: 35px 40px;
  border-radius: var(--radius);
}
.example-heading {
  display: flex;
  align-items: center;
  gap: 20px;
}
.example-heading .eyebrow {
  font-size: 9px;
  margin-bottom: 20px;
  white-space: nowrap;
}
.example-rule {
  width: 100%;
  height: 1px;
  background: var(--line);
  align-self: baseline;
  margin-top: 5px;
}
.conversation-example h3 {
  font: 500 34px/1.1 var(--display);
  letter-spacing: -0.035em;
  margin-bottom: 16px;
}
.example-context {
  font-size: 13px;
  line-height: 1.6;
}
.response {
  padding: 16px 0 16px 22px;
  border-left: 2px solid var(--line);
  margin-top: 20px;
}
.response > span {
  display: block;
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  margin-bottom: 8px;
  color: var(--muted);
}
.response blockquote {
  font: 500 21px/1.45 var(--display);
  color: var(--ink);
  letter-spacing: -0.015em;
}
.response-after {
  border-color: var(--gold-dark);
}
.response-after > span {
  color: var(--gold-dark);
}
.example-note {
  font-size: 11px;
  margin-top: 24px;
  margin-bottom: 0;
  line-height: 1.65;
}
.training-section {
  background: var(--blue-tint);
}
.training-options {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 24px;
  margin-top: 42px;
}
.training-option {
  padding: 38px 40px;
  position: relative;
  overflow: hidden;
  min-height: 385px;
  border-radius: var(--radius);
}
.training-option.corporate {
  background: var(--ink);
  color: #fff;
}
.training-option.individual {
  background: var(--white);
}
.service-number {
  display: block;
  font-size: 12px;
  margin-bottom: 26px;
}
.training-option h3 {
  font: 500 42px/1.07 var(--display);
  letter-spacing: -0.03em;
  margin-bottom: 24px;
}
.corporate h3 {
  color: var(--white);
}
.training-option p {
  font-size: 14px;
  max-width: 33ch;
  line-height: 1.75;
  position: relative;
  z-index: 1;
}
.corporate .text-link {
  color: var(--white);
}
.corporate .service-visual {
  position: absolute;
  right: -38px;
  top: 73px;
  transform: rotate(-16deg);
  opacity: 0.09;
  display: grid;
  gap: 8px;
}
.service-visual span {
  font-family: var(--display);
  font-size: 37px;
  white-space: nowrap;
  border-bottom: 1px solid;
  padding-block: 8px;
}
.individual-mark {
  position: absolute;
  right: 30px;
  top: 44px;
  font: italic 30px/1.1 var(--display);
  color: var(--gold);
  text-align: right;
}
.skills-section > .section-intro {
  margin-bottom: 44px;
}
.skills-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 34px 48px;
}
.skills-grid article {
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.skills-grid article h3 {
  font-size: 18px;
  margin-bottom: 10px;
}
.skills-grid article p {
  font-size: 14px;
  line-height: 1.8;
  margin: 0;
}
.process-section {
  background: var(--cream);
}
.process-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px;
  list-style: none;
  margin: 45px 0 32px;
  padding: 0;
}
.process-grid li {
  position: relative;
}
.step-number {
  display: inline-block;
  font: 400 27px/1.4 var(--display);
  color: var(--gold-dark);
  margin-bottom: 16px;
  border-bottom: 1px solid var(--gold);
  padding-bottom: 10px;
  min-width: 48px;
}
.process-grid h3 {
  font: 500 27px/1.2 var(--display);
  margin-bottom: 15px;
}
.process-grid p {
  font-size: 14px;
  line-height: 1.8;
  max-width: 32ch;
}
.process-foot {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  border-top: 1px solid var(--line);
  padding-top: 26px;
  align-items: center;
}
.process-foot p {
  font-size: 13px;
  margin: 0;
  max-width: 65ch;
}
.process-foot .text-link {
  flex-shrink: 0;
}
.founder-section {
  display: grid;
  grid-template-columns: 0.9fr 1.2fr;
  gap: 90px;
  align-items: center;
}
.portrait {
  border-radius: var(--radius);
  overflow: hidden;
  background: #dce6df;
}
.portrait img {
  width: 100%;
  height: auto;
  object-fit: cover;
}
.founder-section .portrait {
  max-height: 510px;
}
.founder-section .portrait img {
  height: 510px;
  object-position: 50% 44%;
}
.founder-copy p:not(.eyebrow) {
  font-size: 15px;
  line-height: 1.85;
  max-width: 50ch;
}
.founder-signature {
  margin: 26px 0;
}
.founder-signature strong {
  display: block;
  color: var(--ink);
  font-size: 14px;
}
.founder-signature span {
  font-size: 12px;
  color: var(--muted);
}
.closing-section {
  padding-block: 20px 90px;
  display: grid;
  grid-template-columns: 1fr 0.65fr;
  gap: 60px;
  align-items: center;
}
.closing-content {
  border-top: 2px solid var(--gold);
  padding-top: 40px;
}
.closing-content h2 {
  font-size: clamp(34px, 3.1vw, 44px);
}
.closing-content p {
  font-size: 15px;
  max-width: 54ch;
  margin-bottom: 26px;
}
.closing-word {
  font: italic 76px/1.2 var(--display);
  color: var(--gold);
  letter-spacing: -0.05em;
  text-align: center;
  transform: rotate(-9deg);
  padding-block: 10px;
}
.site-footer {
  background: var(--cream);
  border-top: 1px solid var(--line);
  padding-block: 55px 22px;
  font-size: 13px;
}
.footer-top {
  display: grid;
  grid-template-columns: 1.4fr 0.8fr 1.2fr;
  gap: 70px;
}
.footer-top h2 {
  font-family: var(--font);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0;
  margin: 0 0 20px;
  line-height: 1.5;
}
.footer-brand p {
  margin-top: 25px;
  font-size: 12px;
  line-height: 1.8;
}
.footer-top nav {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 3px;
}
.footer-top nav a {
  min-height: 36px;
  display: flex;
  align-items: center;
  text-decoration: none;
  font-size: 12px;
}
.footer-contact p {
  font-size: 12px;
  margin-top: 15px;
}
.email-link {
  font-weight: 650;
  color: var(--ink);
  text-decoration-color: var(--gold);
  display: inline-block;
  padding-block: 5px;
}
.footer-bottom {
  margin-top: 45px;
  padding-top: 22px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  position: relative;
  color: var(--muted);
  font-size: 10px;
}
.footer-bottom::before {
  content: "";
  position: absolute;
  top: 0;
  left: 40px;
  right: 40px;
  height: 1px;
  background: var(--line);
}
.footer-bottom nav {
  display: flex;
  gap: 25px;
}
.footer-bottom a {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
}
.page-hero {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 72px;
  padding-block: 72px 85px;
  align-items: center;
}
.page-hero h1 {
  font-size: clamp(44px, 4.9vw, 67px);
  margin-bottom: 25px;
}
.page-hero .hero-intro {
  font-size: 17px;
  margin-bottom: 28px;
}
.workbook {
  background: var(--cream);
  border-radius: var(--radius);
  padding: 42px;
  box-shadow: 12px 12px 0 var(--cream);
  border-top: 3px solid var(--gold);
  transform: rotate(2deg);
}
.workbook-label {
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 32px;
}
.workbook h2 {
  font-size: 36px;
}
.workbook p:not(.workbook-label) {
  font-size: 14px;
  line-height: 1.8;
}
.workbook-line {
  border-top: 1px solid var(--line);
  margin: 30px 0;
}
.workbook > span {
  font-size: 11px;
  color: var(--gold-dark);
}
.language-visual {
  position: relative;
  min-height: 350px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0;
  padding-top: 25px;
}
.language-visual > span {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--gold-dark);
  border-radius: 50%;
  width: 220px;
  height: 220px;
  flex-shrink: 0;
  text-align: center;
  font: 500 23px/1.3 var(--display);
  color: var(--ink);
  padding: 30px;
  background: #ebc78126;
}
.language-visual > span + span {
  margin-left: -45px;
  background: #0a4d9012;
  border-color: var(--blue);
  margin-top: 25px;
}
.language-visual p {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 14px;
  margin: 0;
}
.page-hero .portrait {
  max-width: 430px;
  margin-left: auto;
}
.editorial-section {
  border-top: 1px solid var(--line);
}
.editorial-heading h2 {
  max-width: 22ch;
}
.editorial-body {
  max-width: 75ch;
}
.editorial-body p {
  font-size: 16px;
  line-height: 1.85;
}
.editorial-section .skills-grid {
  margin-top: 35px;
}
.editorial-note {
  font-size: 13px;
  max-width: 70ch;
  border-left: 2px solid var(--gold);
  padding-left: 20px;
  margin-top: 30px;
}
.work-list {
  list-style: none;
  padding: 0;
  max-width: 850px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 40px;
  margin: 32px 0;
}
.work-list li {
  padding-left: 20px;
  position: relative;
  font-size: 15px;
  line-height: 1.8;
}
.work-list li::before {
  content: "→";
  position: absolute;
  left: 0;
  color: var(--gold-dark);
}
.process-four {
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}
.programme-timeline {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  list-style: none;
  padding: 0;
  margin-top: 44px;
}
.programme-timeline li {
  padding: 26px 22px 0 0;
  border-top: 2px solid var(--gold);
  position: relative;
}
.programme-timeline li + li {
  padding-left: 22px;
  border-left: 1px solid var(--line);
}
.timeline-time {
  font-size: 11px;
  font-weight: 750;
  color: var(--gold-dark);
  display: block;
  margin-bottom: 15px;
}
.programme-timeline h3 {
  font: 500 24px/1.2 var(--display);
  margin-bottom: 14px;
}
.programme-timeline p {
  font-size: 12px;
  line-height: 1.8;
}
.team-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 35px 0 0;
  gap: 40px;
  max-width: 900px;
}
.team-stats dt {
  font: 500 54px/1.1 var(--display);
  color: var(--ink);
}
.team-stats dd {
  margin: 14px 0 0;
  font-size: 14px;
}
.faq-section {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 65px;
}
.faq-section h2 {
  max-width: 10ch;
}
.faq-list details {
  border-bottom: 1px solid var(--line);
}
.faq-list details:first-child {
  border-top: 1px solid var(--line);
}
.faq-list summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 0;
  cursor: pointer;
  font-size: 15px;
  font-weight: 650;
  color: var(--ink);
}
.faq-list summary::-webkit-details-marker {
  display: none;
}
.faq-list summary span {
  font-size: 22px;
  line-height: 1;
  transition: transform 0.2s;
}
.faq-list details[open] summary span {
  transform: rotate(45deg);
}
.faq-list details > div {
  padding-bottom: 8px;
}
.faq-list p {
  font-size: 14px;
  line-height: 1.85;
}
.contact-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 95px;
  padding-top: 72px;
}
.contact-copy h1 {
  font-size: clamp(44px, 4.8vw, 66px);
}
.contact-introduction > .hero-intro {
  font-size: 17px;
}
.contact-introduction > p:not(.eyebrow) {
  font-size: 15px;
  max-width: 46ch;
}
.contact-introduction > .email-link {
  margin-top: 4px;
  font-size: 16px;
}
.contact-form-panel {
  padding: 35px 38px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.contact-form-panel h2 {
  font: 500 29px/1.2 var(--display);
  letter-spacing: -0.03em;
}
.form-note,
.privacy-note {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.8;
}
.field {
  margin-bottom: 22px;
}
.field label {
  display: block;
  font-size: 13px;
  font-weight: 650;
  color: var(--ink);
  margin-bottom: 8px;
  line-height: 1.6;
}
.field input:not([type="range"]),
.field textarea,
.field select {
  display: block;
  width: 100%;
  padding: 12px 13px;
  min-height: 48px;
  border: 1px solid var(--muted);
  background: var(--paper);
  color: var(--ink);
  border-radius: var(--radius);
  font-size: 14px;
  line-height: 1.65;
}
.field input[type="file"] {
  font-size: 12px;
}
.field textarea {
  resize: vertical;
  min-height: 110px;
}
.field .optional {
  font-weight: 400;
  font-size: 11px;
  color: var(--muted);
}
.field input[aria-invalid],
.field textarea[aria-invalid],
.field select[aria-invalid] {
  border-color: var(--error);
  border-width: 2px;
}
.field-hint {
  font-size: 11px;
  line-height: 1.7;
  color: var(--muted);
  margin: 8px 0 0;
}
.field-error {
  font-size: 12px;
  color: var(--error);
  margin: 8px 0 0;
}
.privacy-note {
  margin-top: 24px;
}
.privacy-note a {
  color: var(--ink);
}
.honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.error-summary {
  padding: 20px;
  border-left: 3px solid var(--error);
  background: #faeeee;
  color: #751b1b;
  margin-bottom: 25px;
  font-size: 13px;
}
.error-summary h3,
.error-summary h2 {
  font: 700 16px/1.5 var(--font);
  color: inherit;
  margin-bottom: 12px;
}
.error-summary ul {
  margin-bottom: 0;
  padding-left: 20px;
}
.next-steps {
  margin-top: 45px;
  border-top: 1px solid var(--line);
  padding-top: 30px;
}
.next-steps h2 {
  font: 500 26px/1.3 var(--display);
}
.next-steps ol {
  list-style: none;
  padding: 0;
  counter-reset: steps;
  display: grid;
  gap: 22px;
}
.next-steps li {
  padding-left: 38px;
  position: relative;
  counter-increment: steps;
}
.next-steps li::before {
  content: counter(steps);
  position: absolute;
  top: 0;
  left: 0;
  color: var(--gold-dark);
  font-family: var(--display);
  font-size: 24px;
  line-height: 1.4;
}
.next-steps strong {
  display: block;
  font-size: 13px;
  color: var(--ink);
  margin-bottom: 4px;
}
.next-steps span {
  display: block;
  font-size: 12px;
  line-height: 1.75;
}
.message-page {
  max-width: 900px;
  min-height: 540px;
}
.message-page .hero-intro {
  max-width: 55ch;
  margin-block: 25px 35px;
}
.legal-page {
  max-width: 950px;
}
.legal-page h1 {
  margin-bottom: 48px;
}
.prose {
  font-size: 17px;
  line-height: 1.9;
  color: var(--text);
}
.prose h2 {
  font-size: 35px;
  line-height: 1.2;
  margin-top: 45px;
}
.prose h3 {
  font-size: 23px;
  margin-top: 30px;
}
.prose p {
  margin-bottom: 24px;
}
.prose blockquote {
  border-left: 3px solid var(--gold);
  padding: 10px 24px;
  background: var(--cream);
  margin-block: 30px;
}
.prose img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius);
}
.prose pre {
  background: var(--blue-tint);
  padding: 20px;
  overflow: auto;
}
.prose table {
  display: block;
  max-width: 100%;
  overflow: auto;
  border-collapse: collapse;
}
.prose td,
.prose th {
  padding: 10px;
  border: 1px solid var(--line);
}
.prose a {
  color: var(--ink);
  text-decoration-color: var(--gold-dark);
}
.blog-header {
  padding-bottom: 50px;
}
.blog-header h1 {
  font-size: clamp(44px, 5vw, 72px);
}
.blog-content {
  padding-bottom: 100px;
}
.empty-blog {
  border-top: 1px solid var(--line);
  padding: 60px 0;
  max-width: 750px;
}
.empty-mark {
  font: 500 100px/0.8 var(--display);
  color: var(--gold-dark);
  display: block;
  margin-bottom: 22px;
}
.empty-blog h2 {
  font-size: 36px;
}
.empty-blog p {
  max-width: 55ch;
  font-size: 15px;
}
.category-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 45px;
}
.category-nav a,
.pagination a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 8px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  font-size: 12px;
  text-decoration: none;
}
.category-nav a[aria-current],
.pagination a[aria-current] {
  background: var(--ink);
  color: var(--white);
  border-color: var(--ink);
}
.article-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px 30px;
}
.article-image-link {
  display: block;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--cream);
  aspect-ratio: 1.6;
  text-decoration: none;
}
.article-image-link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.25s;
}
.article-card:hover .article-image-link img {
  transform: scale(1.025);
}
.article-card h2 {
  font-size: 28px;
  line-height: 1.2;
  margin-bottom: 15px;
}
.article-card h2 a {
  text-decoration: none;
}
.article-card > p:not(.article-category) {
  font-size: 13px;
  line-height: 1.8;
}
.article-category {
  font-size: 11px;
  font-weight: 650;
  color: var(--gold-dark);
  margin: 22px 0 14px;
}
.article-date {
  font-size: 11px !important;
  color: var(--muted);
}
.article-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--blue-tint);
  color: var(--ink);
  font: italic 34px/1.2 var(--display);
}
.pagination {
  display: flex;
  gap: 12px;
  margin-top: 50px;
  flex-wrap: wrap;
}
.article-page {
  max-width: 1100px;
  padding-block: 65px 90px;
}
.article-page > header {
  max-width: 850px;
  margin: 0 auto 45px;
}
.article-page h1 {
  font-size: clamp(42px, 5vw, 68px);
  margin-bottom: 28px;
}
.article-standfirst {
  font-size: 20px;
  line-height: 1.65;
}
.article-byline {
  display: flex;
  gap: 15px 24px;
  flex-wrap: wrap;
  font-size: 12px;
  padding-top: 16px;
  color: var(--muted);
}
.article-featured {
  margin-bottom: 55px;
}
.article-featured img {
  width: 100%;
  height: auto;
  aspect-ratio: 1.6;
  max-height: 600px;
  object-fit: cover;
  border-radius: var(--radius);
}
.article-featured figcaption {
  font-size: 12px;
  margin-top: 10px;
  color: var(--muted);
}
.article-body {
  max-width: 730px;
  margin-inline: auto;
}
.article-invitation {
  max-width: 730px;
  margin: 60px auto 0;
  padding: 35px;
  background: var(--cream);
  border-radius: var(--radius);
}
.article-invitation h2 {
  font-size: 32px;
}
.article-invitation p {
  font-size: 15px;
}
.preview-banner {
  background: var(--ink);
  color: white;
  text-align: center;
  padding: 12px 20px;
  font-size: 13px;
}
.preview-banner a {
  margin-left: 15px;
  color: var(--gold);
}
@media (min-width: 1500px) {
  .home-hero h1 {
    font-size: 92px;
  }
}
@media (max-width: 1199px) {
  .container {
    padding-inline: 32px;
  }
  .site-header nav {
    gap: 18px;
  }
  .site-header nav > a:not(.button) {
    font-size: 10px;
  }
  .brand > span {
    font-size: 23px;
  }
  .brand img {
    width: 62px;
    height: 45px;
  }
  .home-hero {
    gap: 40px;
  }
  .home-hero h1 {
    font-size: 78px;
  }
  .hero-photo {
    height: 540px;
  }
  .conversation-section,
  .founder-section,
  .contact-layout {
    gap: 55px;
  }
  .individual-mark {
    font-size: 24px;
    right: 20px;
  }
  .training-option {
    padding: 32px;
  }
  .footer-top {
    gap: 45px;
  }
  .footer-bottom::before {
    left: 32px;
    right: 32px;
  }
}
@media (max-width: 1099px) {
  .site-header {
    height: 80px;
  }
  .menu-toggle {
    display: flex;
    align-items: center;
  }
  .site-header nav {
    display: none;
    position: absolute;
    top: 79px;
    left: 0;
    right: 0;
    background: var(--paper);
    border-bottom: 1px solid var(--line);
    padding: 20px 32px 26px;
    box-shadow: 0 14px 20px #00224d0d;
  }
  .site-header nav.is-open {
    display: grid;
    gap: 7px;
  }
  .site-header nav > a:not(.button) {
    font-size: 15px;
    min-height: 46px;
  }
  .site-header nav > a::after {
    display: none;
  }
  .site-header nav > a[aria-current]:not(.button) {
    text-decoration: underline;
    text-decoration-color: var(--gold-dark);
  }
  .nav-consultation {
    justify-self: start;
    margin-top: 10px;
  }
  .home-hero h1 {
    font-size: 68px;
  }
  .hero-photo {
    height: 510px;
  }
  .home-hero .hero-actions {
    gap: 12px;
  }
  .facts-inner {
    gap: 20px;
  }
  .facts-inner > div {
    padding-left: 20px;
  }
  .facts-inner > div > span {
    font-size: 10px;
  }
  .page-hero {
    gap: 50px;
  }
  .workbook {
    padding: 30px;
  }
  .workbook h2 {
    font-size: 30px;
  }
  .language-visual > span {
    width: 180px;
    height: 180px;
    font-size: 21px;
  }
  .language-visual {
    min-height: 310px;
  }
  .process-four {
    grid-template-columns: repeat(2, 1fr);
  }
  .programme-timeline {
    grid-template-columns: 1fr;
  }
  .programme-timeline li,
  .programme-timeline li + li {
    padding: 20px 0 20px 150px;
    border-left: 0;
    border-top: 1px solid var(--line);
  }
  .timeline-time {
    position: absolute;
    left: 0;
    top: 24px;
  }
  .programme-timeline h3 {
    font-size: 24px;
  }
  .programme-timeline p {
    font-size: 14px;
    max-width: 65ch;
  }
  .skills-grid {
    gap: 30px;
  }
  .contact-form-panel {
    padding: 30px;
  }
  .footer-top {
    grid-template-columns: 1.1fr 0.8fr 1.2fr;
  }
}
@media (max-width: 767px) {
  html {
    scroll-padding-top: 24px;
  }
  .container {
    padding-inline: 24px;
  }
  .section {
    padding-block: 65px;
  }
  h1 {
    font-size: 46px;
  }
  h2 {
    font-size: 36px;
  }
  .eyebrow {
    font-size: 10px;
    margin-bottom: 20px;
  }
  .site-header {
    height: 76px;
  }
  .header-inner {
    gap: 20px;
  }
  .brand img {
    width: 61px;
    height: 45px;
  }
  .brand > span {
    font-size: 23px;
  }
  .brand small {
    font-size: 7px;
  }
  .site-header nav {
    top: 75px;
    padding-inline: 24px;
  }
  .home-hero {
    grid-template-columns: 1fr;
    gap: 32px;
    padding-block: 42px;
  }
  .hero-copy {
    padding: 0;
  }
  .home-hero h1 {
    font-size: clamp(52px, 10.5vw, 72px);
    margin-bottom: 24px;
    line-height: 1.04;
  }
  .home-hero h1 br:first-child {
    display: none;
  }
  .hero-intro {
    font-size: 16px;
    line-height: 1.8;
    max-width: 45ch;
  }
  .hero-actions {
    margin-top: 26px;
    gap: 16px 24px;
  }
  .home-hero .hero-actions {
    gap: 14px 22px;
  }
  .hero-photo {
    height: 380px;
    border-top-left-radius: 150px;
    max-width: 600px;
  }
  .hero-photo img {
    object-position: 50% 70%;
  }
  .facts-inner {
    grid-template-columns: 1fr 1fr;
    gap: 25px 20px;
    padding-block: 28px;
  }
  .facts-inner > p {
    font-size: 13px;
  }
  .facts-inner > div {
    padding-left: 20px;
  }
  .facts-inner > div > strong {
    font-size: 29px;
  }
  .facts-inner > div > span {
    font-size: 10px;
    max-width: 18ch;
  }
  .facts-inner > div:nth-child(3) {
    border-left: 0;
    padding-left: 0;
  }
  .conversation-section {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  .conversation-example {
    padding: 28px;
  }
  .conversation-example h3 {
    font-size: 31px;
  }
  .response blockquote {
    font-size: 21px;
  }
  .training-options {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 32px;
  }
  .training-option {
    padding: 32px;
    min-height: 340px;
  }
  .training-option h3 {
    font-size: 38px;
  }
  .training-option p {
    max-width: 37ch;
  }
  .individual-mark {
    font-size: 31px;
    right: 26px;
    top: 34px;
  }
  .skills-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px 22px;
  }
  .skills-grid article h3 {
    font-size: 16px;
  }
  .skills-grid article p {
    font-size: 13px;
    line-height: 1.8;
  }
  .skills-grid article {
    padding-top: 19px;
  }
  .process-grid {
    grid-template-columns: 1fr;
    gap: 22px;
    margin-top: 32px;
  }
  .process-grid li {
    padding-left: 64px;
  }
  .step-number {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 24px;
    min-width: 40px;
  }
  .process-grid h3 {
    font-size: 27px;
    margin-bottom: 10px;
  }
  .process-grid p {
    max-width: 55ch;
    font-size: 14px;
  }
  .process-foot {
    display: block;
    padding-top: 24px;
  }
  .process-foot .text-link {
    margin-top: 12px;
  }
  .founder-section {
    grid-template-columns: 1fr;
    gap: 35px;
  }
  .founder-section .portrait {
    max-width: 430px;
    height: 400px;
  }
  .founder-section .portrait img {
    height: 400px;
    object-position: 50% 35%;
  }
  .founder-copy p:not(.eyebrow) {
    font-size: 14px;
  }
  .closing-section {
    grid-template-columns: 1fr;
    gap: 0;
    padding-block: 0 65px;
  }
  .closing-word {
    display: none;
  }
  .closing-content {
    padding-top: 35px;
  }
  .closing-content h2 {
    font-size: 36px;
  }
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 35px 25px;
  }
  .footer-brand {
    grid-column: 1/-1;
  }
  .footer-brand p {
    margin-top: 17px;
  }
  .footer-contact .email-link {
    font-size: 12px;
    overflow-wrap: anywhere;
  }
  .footer-top h2 {
    margin-bottom: 14px;
  }
  .footer-top .text-link {
    font-size: 12px;
    gap: 8px;
  }
  .footer-bottom {
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-top: 30px;
    padding-top: 18px;
  }
  .footer-bottom > span:last-child {
    width: 100%;
  }
  .footer-bottom::before {
    left: 24px;
    right: 24px;
  }
  .page-hero {
    grid-template-columns: 1fr;
    gap: 35px;
    padding-block: 45px 60px;
  }
  .page-hero h1 {
    font-size: 46px;
  }
  .page-hero .hero-intro {
    font-size: 16px;
  }
  .page-hero .portrait {
    margin-left: 0;
    max-width: 450px;
    max-height: 440px;
  }
  .page-hero .portrait img {
    height: 440px;
    object-fit: cover;
    object-position: 50% 30%;
  }
  .workbook {
    padding: 30px;
    margin-right: 10px;
    transform: rotate(1deg);
  }
  .workbook h2 {
    font-size: 31px;
  }
  .language-visual {
    min-height: 300px;
    max-width: 450px;
    margin: auto;
  }
  .language-visual > span {
    width: 190px;
    height: 190px;
    font-size: 21px;
  }
  .editorial-heading h2 {
    max-width: none;
  }
  .editorial-body p {
    font-size: 15px;
    line-height: 1.85;
  }
  .work-list {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .work-list li {
    font-size: 14px;
  }
  .process-four {
    grid-template-columns: 1fr;
  }
  .programme-timeline {
    margin-top: 30px;
  }
  .programme-timeline li,
  .programme-timeline li + li {
    padding-left: 110px;
  }
  .programme-timeline h3 {
    font-size: 22px;
  }
  .timeline-time {
    font-size: 10px;
  }
  .programme-timeline p {
    font-size: 13px;
  }
  .team-stats {
    gap: 20px;
  }
  .team-stats dt {
    font-size: 40px;
  }
  .team-stats dd {
    font-size: 11px;
  }
  .faq-section {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .faq-section h2 {
    max-width: none;
  }
  .faq-list summary {
    font-size: 14px;
  }
  .contact-layout {
    grid-template-columns: 1fr;
    gap: 35px;
    padding-top: 45px;
  }
  .contact-copy h1 {
    font-size: 46px;
  }
  .contact-form-panel {
    padding: 28px 24px;
  }
  .contact-form-panel h2 {
    font-size: 27px;
  }
  .next-steps {
    margin-top: 30px;
  }
  .message-page {
    min-height: 450px;
  }
  .legal-page h1 {
    font-size: 44px;
  }
  .prose {
    font-size: 16px;
  }
  .prose h2 {
    font-size: 29px;
  }
  .blog-header {
    padding-bottom: 30px;
  }
  .blog-header h1 {
    font-size: 46px;
  }
  .blog-content {
    padding-bottom: 65px;
  }
  .empty-blog {
    padding-top: 45px;
  }
  .empty-blog h2 {
    font-size: 32px;
  }
  .article-grid {
    grid-template-columns: 1fr;
    gap: 38px;
  }
  .article-card h2 {
    font-size: 29px;
  }
  .article-page {
    padding-top: 40px;
  }
  .article-page h1 {
    font-size: 43px;
  }
  .article-standfirst {
    font-size: 18px;
  }
  .article-featured {
    margin-bottom: 35px;
  }
  .article-invitation {
    padding: 28px;
  }
  .preview-banner {
    font-size: 11px;
  }
  .preview-banner a {
    display: block;
    margin-left: 0;
  }
}
@media (max-width: 374px) {
  .container {
    padding-inline: 20px;
  }
  .home-hero h1 {
    font-size: 53px;
  }
  .home-hero .hero-actions {
    align-items: flex-start;
    flex-direction: column;
  }
  .hero-photo {
    height: 330px;
  }
  .language-visual > span {
    width: 160px;
    height: 160px;
    font-size: 19px;
  }
  .language-visual {
    min-height: 270px;
  }
  .skills-grid {
    grid-template-columns: 1fr;
  }
  .brand {
    gap: 8px;
  }
  .brand > span {
    font-size: 21px;
  }
  .brand img {
    width: 53px;
  }
  .contact-form-panel {
    padding: 24px 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
  .button:hover {
    transform: none;
  }
  .article-card:hover .article-image-link img {
    transform: none;
  }
}
@media print {
  .site-header,
  .site-footer,
  .hero-actions,
  .button,
  .closing-section,
  .preview-banner {
    display: none;
  }
  .container {
    max-width: none;
    padding: 0;
  }
  .section {
    padding-block: 25px;
  }
  body {
    background: white;
    font-size: 12pt;
  }
  .home-hero,
  .page-hero,
  .contact-layout {
    display: block;
  }
  .hero-photo {
    height: 200px;
  }
  .article-page {
    padding: 0;
  }
  .prose {
    font-size: 12pt;
  }
  a {
    text-decoration: underline;
  }
}
.focal-0-0 img {
  object-position: 0% 0%;
}
.focal-0-10 img {
  object-position: 0% 10%;
}
.focal-0-20 img {
  object-position: 0% 20%;
}
.focal-0-30 img {
  object-position: 0% 30%;
}
.focal-0-40 img {
  object-position: 0% 40%;
}
.focal-0-50 img {
  object-position: 0% 50%;
}
.focal-0-60 img {
  object-position: 0% 60%;
}
.focal-0-70 img {
  object-position: 0% 70%;
}
.focal-0-80 img {
  object-position: 0% 80%;
}
.focal-0-90 img {
  object-position: 0% 90%;
}
.focal-0-100 img {
  object-position: 0% 100%;
}
.focal-10-0 img {
  object-position: 10% 0%;
}
.focal-10-10 img {
  object-position: 10% 10%;
}
.focal-10-20 img {
  object-position: 10% 20%;
}
.focal-10-30 img {
  object-position: 10% 30%;
}
.focal-10-40 img {
  object-position: 10% 40%;
}
.focal-10-50 img {
  object-position: 10% 50%;
}
.focal-10-60 img {
  object-position: 10% 60%;
}
.focal-10-70 img {
  object-position: 10% 70%;
}
.focal-10-80 img {
  object-position: 10% 80%;
}
.focal-10-90 img {
  object-position: 10% 90%;
}
.focal-10-100 img {
  object-position: 10% 100%;
}
.focal-20-0 img {
  object-position: 20% 0%;
}
.focal-20-10 img {
  object-position: 20% 10%;
}
.focal-20-20 img {
  object-position: 20% 20%;
}
.focal-20-30 img {
  object-position: 20% 30%;
}
.focal-20-40 img {
  object-position: 20% 40%;
}
.focal-20-50 img {
  object-position: 20% 50%;
}
.focal-20-60 img {
  object-position: 20% 60%;
}
.focal-20-70 img {
  object-position: 20% 70%;
}
.focal-20-80 img {
  object-position: 20% 80%;
}
.focal-20-90 img {
  object-position: 20% 90%;
}
.focal-20-100 img {
  object-position: 20% 100%;
}
.focal-30-0 img {
  object-position: 30% 0%;
}
.focal-30-10 img {
  object-position: 30% 10%;
}
.focal-30-20 img {
  object-position: 30% 20%;
}
.focal-30-30 img {
  object-position: 30% 30%;
}
.focal-30-40 img {
  object-position: 30% 40%;
}
.focal-30-50 img {
  object-position: 30% 50%;
}
.focal-30-60 img {
  object-position: 30% 60%;
}
.focal-30-70 img {
  object-position: 30% 70%;
}
.focal-30-80 img {
  object-position: 30% 80%;
}
.focal-30-90 img {
  object-position: 30% 90%;
}
.focal-30-100 img {
  object-position: 30% 100%;
}
.focal-40-0 img {
  object-position: 40% 0%;
}
.focal-40-10 img {
  object-position: 40% 10%;
}
.focal-40-20 img {
  object-position: 40% 20%;
}
.focal-40-30 img {
  object-position: 40% 30%;
}
.focal-40-40 img {
  object-position: 40% 40%;
}
.focal-40-50 img {
  object-position: 40% 50%;
}
.focal-40-60 img {
  object-position: 40% 60%;
}
.focal-40-70 img {
  object-position: 40% 70%;
}
.focal-40-80 img {
  object-position: 40% 80%;
}
.focal-40-90 img {
  object-position: 40% 90%;
}
.focal-40-100 img {
  object-position: 40% 100%;
}
.focal-50-0 img {
  object-position: 50% 0%;
}
.focal-50-10 img {
  object-position: 50% 10%;
}
.focal-50-20 img {
  object-position: 50% 20%;
}
.focal-50-30 img {
  object-position: 50% 30%;
}
.focal-50-40 img {
  object-position: 50% 40%;
}
.focal-50-50 img {
  object-position: 50% 50%;
}
.focal-50-60 img {
  object-position: 50% 60%;
}
.focal-50-70 img {
  object-position: 50% 70%;
}
.focal-50-80 img {
  object-position: 50% 80%;
}
.focal-50-90 img {
  object-position: 50% 90%;
}
.focal-50-100 img {
  object-position: 50% 100%;
}
.focal-60-0 img {
  object-position: 60% 0%;
}
.focal-60-10 img {
  object-position: 60% 10%;
}
.focal-60-20 img {
  object-position: 60% 20%;
}
.focal-60-30 img {
  object-position: 60% 30%;
}
.focal-60-40 img {
  object-position: 60% 40%;
}
.focal-60-50 img {
  object-position: 60% 50%;
}
.focal-60-60 img {
  object-position: 60% 60%;
}
.focal-60-70 img {
  object-position: 60% 70%;
}
.focal-60-80 img {
  object-position: 60% 80%;
}
.focal-60-90 img {
  object-position: 60% 90%;
}
.focal-60-100 img {
  object-position: 60% 100%;
}
.focal-70-0 img {
  object-position: 70% 0%;
}
.focal-70-10 img {
  object-position: 70% 10%;
}
.focal-70-20 img {
  object-position: 70% 20%;
}
.focal-70-30 img {
  object-position: 70% 30%;
}
.focal-70-40 img {
  object-position: 70% 40%;
}
.focal-70-50 img {
  object-position: 70% 50%;
}
.focal-70-60 img {
  object-position: 70% 60%;
}
.focal-70-70 img {
  object-position: 70% 70%;
}
.focal-70-80 img {
  object-position: 70% 80%;
}
.focal-70-90 img {
  object-position: 70% 90%;
}
.focal-70-100 img {
  object-position: 70% 100%;
}
.focal-80-0 img {
  object-position: 80% 0%;
}
.focal-80-10 img {
  object-position: 80% 10%;
}
.focal-80-20 img {
  object-position: 80% 20%;
}
.focal-80-30 img {
  object-position: 80% 30%;
}
.focal-80-40 img {
  object-position: 80% 40%;
}
.focal-80-50 img {
  object-position: 80% 50%;
}
.focal-80-60 img {
  object-position: 80% 60%;
}
.focal-80-70 img {
  object-position: 80% 70%;
}
.focal-80-80 img {
  object-position: 80% 80%;
}
.focal-80-90 img {
  object-position: 80% 90%;
}
.focal-80-100 img {
  object-position: 80% 100%;
}
.focal-90-0 img {
  object-position: 90% 0%;
}
.focal-90-10 img {
  object-position: 90% 10%;
}
.focal-90-20 img {
  object-position: 90% 20%;
}
.focal-90-30 img {
  object-position: 90% 30%;
}
.focal-90-40 img {
  object-position: 90% 40%;
}
.focal-90-50 img {
  object-position: 90% 50%;
}
.focal-90-60 img {
  object-position: 90% 60%;
}
.focal-90-70 img {
  object-position: 90% 70%;
}
.focal-90-80 img {
  object-position: 90% 80%;
}
.focal-90-90 img {
  object-position: 90% 90%;
}
.focal-90-100 img {
  object-position: 90% 100%;
}
.focal-100-0 img {
  object-position: 100% 0%;
}
.focal-100-10 img {
  object-position: 100% 10%;
}
.focal-100-20 img {
  object-position: 100% 20%;
}
.focal-100-30 img {
  object-position: 100% 30%;
}
.focal-100-40 img {
  object-position: 100% 40%;
}
.focal-100-50 img {
  object-position: 100% 50%;
}
.focal-100-60 img {
  object-position: 100% 60%;
}
.focal-100-70 img {
  object-position: 100% 70%;
}
.focal-100-80 img {
  object-position: 100% 80%;
}
.focal-100-90 img {
  object-position: 100% 90%;
}
.focal-100-100 img {
  object-position: 100% 100%;
}

.home-hero > * {
  min-width: 0;
}
.page-hero > * {
  min-width: 0;
}
.hero-photo {
  max-width: 100%;
}
.hero-copy h1 {
  overflow-wrap: normal;
}

@media (max-width: 767px) {
  .contact-copy {
    display: contents;
  }
  .contact-introduction {
    grid-row: 1;
  }
  .contact-form-panel {
    grid-row: 2;
  }
  .contact-layout > .contact-copy > .next-steps {
    grid-row: 3;
    margin-top: 0;
  }
}

/* Approved PJC brand: Montserrat + navy, blue and gold. */
h1,
h2 {
  font-weight: 650;
  letter-spacing: -0.045em;
  line-height: 1.14;
}
.brand > span {
  font-weight: 750;
  font-size: 23px;
}
.home-hero h1 {
  font-size: clamp(52px, 5.25vw, 70px);
  font-weight: 700;
  line-height: 1.09;
  letter-spacing: -0.055em;
}
.home-hero h1 em {
  font-style: normal;
  font-weight: 750;
  color: var(--blue);
}
.button {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}
.button:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}
.button-outline {
  background: transparent;
  border-color: var(--blue);
  color: var(--blue);
}
.button-outline:hover {
  background: var(--blue);
  color: var(--white);
}
.corporate .text-link:hover {
  color: var(--gold);
}
.corporate a:focus-visible {
  outline-color: var(--gold);
}
.response-after {
  border-left-color: var(--gold);
}
.facts-inner > div > strong {
  font-weight: 650;
  font-size: 28px;
}
.training-option h3 {
  font-weight: 650;
  font-size: 36px;
  line-height: 1.16;
}
.conversation-example h3 {
  font-weight: 650;
  font-size: 29px;
  line-height: 1.2;
}
.response blockquote {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
}
.process-grid h3 {
  font-weight: 650;
  font-size: 23px;
  line-height: 1.3;
}
.closing-word {
  font-size: 58px;
  font-style: normal;
  font-weight: 750;
  color: var(--blue);
  transform: none;
}
.individual-mark {
  color: var(--blue);
  font-style: normal;
  font-weight: 650;
  opacity: 0.12;
}
.page-hero h1 {
  font-size: clamp(40px, 4.4vw, 60px);
}
.workbook h2 {
  font-size: 30px;
  line-height: 1.2;
}
.language-visual > span {
  font-size: 20px;
  line-height: 1.4;
  font-weight: 600;
}
@media (min-width: 1500px) {
  .home-hero h1 {
    font-size: 70px;
  }
}
@media (max-width: 1199px) {
  .home-hero h1 {
    font-size: 60px;
  }
  .brand > span {
    font-size: 21px;
  }
}
@media (max-width: 1099px) {
  .home-hero h1 {
    font-size: 52px;
  }
}
@media (max-width: 767px) {
  .home-hero h1 {
    font-size: clamp(40px, 9.8vw, 56px);
  }
  .page-hero h1,
  .contact-copy h1 {
    font-size: 38px;
    line-height: 1.17;
  }
  .brand > span {
    font-size: 21px;
  }
  h2 {
    font-size: 31px;
  }
  .training-option h3 {
    font-size: 32px;
  }
  .language-visual > span {
    font-size: 17px;
  }
  .closing-content h2 {
    font-size: 31px;
  }
  .hero-intro {
    font-size: 15px;
  }
  .article-page h1 {
    font-size: 36px;
  }
}

/* Let the supplied logo carry the identity without a duplicate wordmark. */
.brand img {
  width: 120px;
  height: 88px;
  object-fit: contain;
}
.site-header {
  height: 108px;
}
.footer-brand .brand img {
  width: 150px;
  height: 110px;
}
@media (max-width: 1099px) {
  .site-header nav {
    top: 107px;
  }
}
@media (max-width: 767px) {
  .site-header {
    height: 96px;
  }
  .site-header .brand img {
    width: 104px;
    height: 76px;
  }
  .site-header nav {
    top: 95px;
  }
}

/* Image-led heroes and consistent button calls to action. */
.hero-background {
  background-color: var(--navy);
  background-image:
    linear-gradient(
      90deg,
      rgba(0, 34, 77, 0.96) 0%,
      rgba(0, 34, 77, 0.9) 40%,
      rgba(0, 34, 77, 0.36) 100%
    ),
    var(--hero-image);
  background-size: cover;
  background-position: center;
  color: var(--white);
}
.hero-background h1,
.hero-background > .hero-intro,
.hero-background .hero-copy > .hero-intro,
.page-hero > div:first-child > .hero-intro {
  color: var(--white);
}
.hero-background .eyebrow {
  color: var(--gold);
}
.hero-background .button-outline {
  color: var(--white);
  border-color: var(--gold);
  background: transparent;
}
.hero-background .button-outline:hover {
  color: var(--navy);
  background: var(--gold);
}
.hero-background .button:focus-visible {
  outline-color: var(--white);
}
.home-hero {
  display: block;
  max-width: none;
  padding: 0;
  margin: 0;
}
.home-hero-inner {
  min-height: 650px;
  display: flex;
  align-items: center;
  padding-block: 80px;
}
.home-hero .hero-copy {
  max-width: 690px;
  padding-block: 0;
}
.home-hero h1 {
  font-size: clamp(48px, 5.25vw, 70px);
}
.home-hero h1 em {
  color: var(--gold);
}
.home-hero .hero-intro {
  max-width: 48ch;
}
.hero-background .hero-actions {
  gap: 18px;
}
.page-hero-background {
  margin: 0;
}
.page-hero-background .page-hero {
  padding-block: 72px;
}
.page-hero-background .workbook {
  box-shadow: 12px 12px 0 rgba(235, 199, 129, 0.22);
  color: var(--navy);
}
.page-hero-background .workbook h2 {
  color: var(--navy);
}
.hero-one-to-one-training,
.hero-contact {
  background-image:
    linear-gradient(90deg, rgba(0, 34, 77, 0.96), rgba(0, 34, 77, 0.74)),
    var(--hero-image);
  background-position: center 65%;
}
.hero-our-approach .language-visual {
  background: rgba(255, 255, 255, 0.97);
  border-radius: var(--radius);
  padding-inline: 20px;
  padding-top: 35px;
  min-height: 350px;
}
.hero-our-approach .language-visual p {
  bottom: 30px;
  color: var(--navy);
}
.hero-about {
  background-position: center 40%;
}
.contact-introduction.hero-background {
  padding: 35px;
  border-radius: var(--radius);
}
.contact-introduction.hero-background h1 {
  font-size: 44px;
  line-height: 1.17;
}
.contact-introduction.hero-background p {
  color: var(--white);
}
.contact-introduction.hero-background .email-link {
  color: var(--gold);
}
.blog-header.hero-background,
.message-page.hero-background {
  max-width: none;
  padding-inline: max(40px, calc((100vw - 1200px) / 2));
  padding-block: 80px;
}
.blog-header.hero-background h1,
.message-page.hero-background h1 {
  max-width: 19ch;
}
.blog-header.hero-background {
  margin-bottom: 60px;
}
.corporate .button-outline {
  background: transparent;
  color: var(--gold);
  border-color: var(--gold);
}
.corporate .button-outline:hover {
  background: var(--gold);
  color: var(--navy);
}
.process-foot .button {
  flex-shrink: 0;
}
.founder-copy > .button,
.editorial-section > .button {
  margin-top: 12px;
}
.button-outline {
  min-height: 54px;
}
@media (max-width: 1099px) {
  .home-hero-inner {
    min-height: 590px;
  }
  .home-hero .hero-copy {
    max-width: 620px;
  }
  .hero-our-approach .language-visual > span {
    width: 155px;
    height: 155px;
    font-size: 17px;
  }
  .hero-our-approach .language-visual {
    min-height: 310px;
  }
}
@media (max-width: 767px) {
  .hero-background {
    background-image:
      linear-gradient(90deg, rgba(0, 34, 77, 0.94), rgba(0, 34, 77, 0.8)),
      var(--hero-image);
    background-position: 65% center;
  }
  .home-hero-inner {
    min-height: 560px;
    padding-block: 55px;
  }
  .home-hero h1 {
    font-size: clamp(40px, 9.8vw, 56px);
  }
  .home-hero .hero-copy {
    max-width: 100%;
  }
  .home-hero .hero-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
  .page-hero-background .page-hero {
    padding-block: 50px;
  }
  .page-hero-background .page-hero-visual {
    margin-top: 10px;
  }
  .hero-one-to-one-training,
  .hero-contact {
    background-image:
      linear-gradient(90deg, rgba(0, 34, 77, 0.94), rgba(0, 34, 77, 0.8)),
      var(--hero-image);
  }
  .contact-introduction.hero-background {
    padding: 28px 24px;
  }
  .contact-introduction.hero-background h1 {
    font-size: 32px;
  }
  .blog-header.hero-background,
  .message-page.hero-background {
    padding-inline: 24px;
    padding-block: 55px;
  }
  .hero-our-approach .language-visual > span {
    width: 160px;
    height: 160px;
    font-size: 16px;
  }
  .process-foot .button {
    margin-top: 18px;
  }
  .training-option .button {
    font-size: 12px;
    padding-inline: 16px;
  }
  .footer-contact .button {
    font-size: 12px;
    padding-inline: 14px;
  }
}
@media (max-width: 374px) {
  .hero-our-approach .language-visual > span {
    width: 138px;
    height: 138px;
    font-size: 14px;
  }
  .home-hero-inner {
    padding-inline: 20px;
  }
  .hero-actions > .button {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }
}

/* Each content page has its own image, including at mobile breakpoints. */
.hero-background {
  --hero-image: url("/assets/meeting-hero.webp?v=07310008bb73");
}
.hero-corporate-training {
  --hero-image: url("/assets/hero-corporate.webp?v=720477d929d8");
}
.hero-one-to-one-training {
  --hero-image: url("/assets/workspace-1100.webp?v=192db2caf64e");
}
.hero-our-approach {
  --hero-image: url("/assets/hero-approach.webp?v=7f386cd33065");
}
.hero-about {
  --hero-image: url("/assets/hero-about.webp?v=3492623ea279");
}
.hero-contact {
  --hero-image: url("/assets/hero-contact.webp?v=a71569ed84c8");
}
.hero-insights {
  --hero-image: url("/assets/hero-insights.webp?v=6cf0d0c86354");
}

@media (max-width: 767px) {
  .blog-header.hero-background h1 {
    font-size: 34px;
    overflow-wrap: break-word;
  }
}

/* Illustrative meeting phrases, not testimonials. */
.meeting-quote {
  margin: 0;
  background: var(--cream);
  color: var(--navy);
  padding: 36px 40px 32px;
  border-radius: var(--radius);
  border-top: 3px solid var(--gold);
  box-shadow: 12px 12px 0 rgba(235, 199, 129, 0.2);
  transform: rotate(1.5deg);
  max-width: 100%;
  min-width: 0;
}
.meeting-quote-mark {
  display: block;
  font-family: var(--font);
  font-size: 76px;
  font-weight: 750;
  line-height: 0.85;
  color: var(--blue);
  height: 58px;
  margin-bottom: 18px;
}
.meeting-quote blockquote {
  margin: 0;
}
.meeting-quote blockquote p {
  font-family: var(--font);
  font-size: clamp(23px, 2.1vw, 29px);
  font-weight: 600;
  font-style: italic;
  letter-spacing: -0.025em;
  line-height: 1.55;
  color: var(--navy);
  margin: 0;
}
.meeting-quote figcaption {
  display: block;
  border-top: 1px solid var(--gold);
  padding-top: 20px;
  margin-top: 26px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.6;
  color: var(--blue);
}
.home-hero-inner {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 72px;
}
.home-hero-inner > .hero-copy {
  min-width: 0;
  max-width: 100%;
}
.blog-hero-inner {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 72px;
  align-items: center;
  max-width: 1200px;
  margin: auto;
}
.blog-hero-inner > div {
  min-width: 0;
}
.blog-header.hero-background h1 {
  font-size: clamp(40px, 4.5vw, 60px);
}
.blog-hero-inner .hero-intro {
  color: var(--white);
}
.page-hero-visual .meeting-quote {
  width: 100%;
}
@media (max-width: 1099px) {
  .home-hero-inner,
  .blog-hero-inner {
    gap: 40px;
  }
  .meeting-quote {
    padding: 30px;
  }
  .meeting-quote blockquote p {
    font-size: 23px;
  }
  .home-hero h1 {
    font-size: 52px;
  }
}
@media (max-width: 767px) {
  .home-hero-inner,
  .blog-hero-inner {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .home-hero h1 {
    font-size: clamp(40px, 9.8vw, 56px);
  }
  .meeting-quote {
    padding: 28px 24px;
    transform: rotate(1deg);
    box-shadow: 7px 7px 0 rgba(235, 199, 129, 0.2);
    margin-right: 7px;
    max-width: calc(100% - 7px);
  }
  .meeting-quote blockquote p {
    font-size: 23px;
    line-height: 1.55;
  }
  .meeting-quote-mark {
    font-size: 64px;
    height: 48px;
    margin-bottom: 14px;
  }
  .meeting-quote figcaption {
    font-size: 11px;
  }
  .blog-header.hero-background h1 {
    font-size: 34px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .meeting-quote {
    transform: none;
  }
}

/* One hero sizing system across the main pages. */
:root {
  --hero-height: 700px;
  --hero-padding: 56px;
}
.home-hero-inner,
.page-hero-background .page-hero,
.blog-hero-inner,
.contact-hero-inner {
  min-height: var(--hero-height);
  padding-block: var(--hero-padding);
  align-items: center;
}
.blog-header.hero-background {
  padding-block: 0;
}
.contact-hero-inner {
  display: flex;
}
.contact-hero-inner > .contact-introduction {
  max-width: 760px;
  width: 100%;
  padding: 0;
  background: none;
  border-radius: 0;
}
.contact-hero h1 {
  font-size: clamp(40px, 4.4vw, 60px);
  line-height: 1.14;
}
.contact-hero .hero-intro,
.contact-hero p {
  color: var(--white);
}
.contact-hero .eyebrow,
.contact-hero .email-link {
  color: var(--gold);
}
.contact-hero .contact-introduction > p:not(.eyebrow) {
  max-width: 58ch;
}
.contact-hero .email-link {
  font-size: 16px;
}
.contact-layout {
  padding-top: 72px;
}
@media (max-width: 1099px) and (min-width: 768px) {
  :root {
    --hero-padding: 48px;
  }
}
@media (max-width: 767px) {
  :root {
    --hero-height: 0px;
    --hero-padding: 48px;
  }
  .home-hero-inner,
  .page-hero-background .page-hero,
  .blog-hero-inner,
  .contact-hero-inner {
    min-height: 0;
    padding-block: var(--hero-padding);
  }
  .contact-hero h1 {
    font-size: 38px;
  }
  .contact-hero-inner > .contact-introduction {
    padding: 0;
  }
  .contact-layout {
    padding-top: 48px;
  }
  .contact-layout .contact-form-panel {
    grid-row: auto;
    order: 1;
  }
  .contact-layout > .contact-copy > .next-steps {
    grid-row: auto;
    order: 2;
  }
}

/* Full-width contrasting content bands. */
.section-tone-white {
  background: var(--white);
}
.section-tone-blue {
  background: var(--blue-tint);
}
.section-tone-gold {
  background: var(--cream);
}

/* Let the founder portrait sit directly on the page background. */
.portrait {
  background: transparent;
}
.founder-section .portrait,
.page-hero .portrait {
  overflow: visible;
}
.founder-section .portrait img,
.page-hero .portrait img {
  object-fit: contain;
  object-position: center bottom;
}

/* Align desktop navigation with the lettering in the logo. */
@media (min-width: 1100px) {
  .site-header nav {
    transform: translateY(12px);
  }
}

/* Three-bar mobile navigation control with a screen-reader label. */
.menu-toggle {
  width: 48px;
  height: 48px;
  justify-content: center;
}
.menu-lines {
  display: block;
  width: 26px;
  height: 20px;
  margin: 0;
  border: 0;
  background: linear-gradient(var(--navy), var(--navy)) center/100% 3px
    no-repeat;
  position: relative;
}
.menu-lines::before,
.menu-lines::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background: var(--navy);
  border-radius: 1px;
}
.menu-lines::before {
  top: 0;
}
.menu-lines::after {
  bottom: 0;
}

/* A reserved greeting line prevents movement as languages change. */
.greeting-line {
  display: block;
  min-height: 1.2em;
  margin-bottom: 0.16em;
  color: var(--gold);
  font-size: 0.72em;
  line-height: 1.2;
}
.typing-cursor {
  display: inline-block;
  width: 2px;
  height: 0.85em;
  margin-left: 6px;
  background: currentColor;
  vertical-align: -0.03em;
}
.greeting-accessible {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
@media (prefers-reduced-motion: reduce) {
  .typing-cursor {
    display: none;
  }
}

/* Brand description between the logo and navigation. */
.header-description {
  font-size: 11px;
  line-height: 1.5;
  font-weight: 600;
  color: var(--navy);
  max-width: 180px;
  margin: 0 auto 0 0;
}
@media (min-width: 1100px) {
  .header-description {
    transform: translateY(12px);
  }
}
@media (max-width: 1099px) {
  .header-description {
    max-width: none;
  }
  .menu-toggle {
    flex-shrink: 0;
  }
}
@media (max-width: 767px) {
  .header-inner {
    gap: 14px;
  }
  .header-description {
    font-size: 10px;
    max-width: 140px;
  }
}
@media (max-width: 374px) {
  .header-inner {
    gap: 10px;
  }
  .header-description {
    font-size: 9px;
  }
}

/* Quiet line icons reinforce the three facts without replacing their labels. */
.facts-inner > div {
  position: relative;
  padding-left: 78px;
  min-height: 58px;
}
.fact-icon {
  position: absolute;
  left: 28px;
  top: 6px;
  width: 32px;
  height: 32px;
  color: var(--blue);
}
@media (max-width: 1099px) {
  .facts-inner > div {
    padding-left: 62px;
  }
  .fact-icon {
    left: 20px;
    width: 28px;
    height: 28px;
  }
}
@media (max-width: 767px) {
  .facts-inner > div {
    padding-left: 44px;
    min-height: 58px;
  }
  .fact-icon {
    left: 0;
    top: 3px;
    width: 28px;
    height: 28px;
  }
}

/* Sticky-note treatment for the illustrative meeting phrases. */
.meeting-quote {
  position: relative;
  background: linear-gradient(180deg, #f4dc98 0%, #f8e7b1 18%, #fff0be 100%);
  border: 0;
  border-radius: 1px;
  padding-top: 44px;
  transform: rotate(-2deg);
  box-shadow:
    2px 7px 9px rgba(0, 20, 45, 0.22),
    9px 18px 24px rgba(0, 20, 45, 0.18);
}
.meeting-quote::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 24px;
  background: rgba(235, 199, 129, 0.3);
  border-bottom: 1px solid rgba(160, 122, 47, 0.07);
  pointer-events: none;
}
.meeting-quote figcaption {
  border-top-color: rgba(160, 122, 47, 0.25);
}
@media (max-width: 767px) {
  .meeting-quote {
    transform: rotate(-1deg);
    box-shadow:
      2px 6px 9px rgba(0, 20, 45, 0.2),
      5px 12px 18px rgba(0, 20, 45, 0.16);
    padding-top: 38px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .meeting-quote {
    transform: none;
  }
}

/* Circular founder portraits on Home and About Us. */
.founder-section .portrait,
.page-hero .portrait {
  width: 100%;
  max-width: 430px;
  height: auto;
  max-height: none;
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  background: var(--blue-tint);
}
.founder-section .portrait img,
.page-hero .portrait img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom;
}
@media (max-width: 767px) {
  .founder-section .portrait,
  .page-hero .portrait {
    max-width: 360px;
    height: auto;
    max-height: none;
  }
  .founder-section .portrait img,
  .page-hero .portrait img {
    height: 100%;
    object-position: center bottom;
  }
}

/* Match the animated greeting to the rest of the home heading. */
.greeting-line {
  font-size: 1em;
}

/* Single-line brand description with responsive header spacing. */
.header-description {
  font-size: 13px;
  max-width: none;
  white-space: nowrap;
  flex-shrink: 0;
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .header-inner {
    gap: 20px;
  }
  .header-description {
    font-size: 12px;
  }
  .site-header nav {
    gap: 18px;
  }
}
@media (max-width: 767px) {
  .header-inner {
    gap: 10px;
  }
  .header-description {
    font-size: 10.5px;
    max-width: none;
  }
  .site-header .brand img {
    width: 84px;
    height: 76px;
  }
  .menu-toggle {
    width: 40px;
    min-width: 40px;
    padding: 6px;
  }
}
@media (max-width: 374px) {
  .header-inner {
    gap: 8px;
  }
  .header-description {
    font-size: 10px;
  }
  .site-header .brand img {
    width: 70px;
  }
  .menu-toggle {
    width: 36px;
    min-width: 36px;
  }
}

.communication-diagram {
  margin: 0;
  min-width: 0;
  width: 100%;
  align-self: center;
}
.communication-diagram svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  font-family: var(--font);
}
.diagram-heading {
  font-size: 21px;
  font-weight: 750;
  letter-spacing: -0.5px;
}
.diagram-detail {
  font-size: 15px;
  font-weight: 550;
}
.diagram-centre {
  font-size: 20px;
  font-weight: 750;
  letter-spacing: -0.6px;
}
.diagram-caption {
  font-size: 14px;
  font-weight: 550;
}
.communication-diagram figcaption {
  text-align: center;
  font-size: 12px;
  line-height: 1.6;
  color: var(--white);
  margin: 22px auto 0;
  max-width: 38ch;
}
.diagram-circle-left {
  animation: diagram-left 1.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.diagram-circle-right {
  animation: diagram-right 1.6s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.diagram-overlap {
  animation: diagram-reveal 0.7s 1.1s both;
}
.diagram-labels {
  animation: diagram-reveal 0.7s 0.8s both;
}
.diagram-outcome {
  animation: diagram-reveal 0.8s 1.7s both;
}
@keyframes diagram-left {
  from {
    transform: translateX(-48px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes diagram-right {
  from {
    transform: translateX(48px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes diagram-reveal {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@media (max-width: 767px) {
  .communication-diagram {
    margin-top: 10px;
  }
  .communication-diagram figcaption {
    font-size: 11px;
    margin-top: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .communication-diagram svg * {
    animation: none !important;
  }
}

/* Give the hero diagram more width and breathing room. */
@media (min-width: 1100px) {
  .home-hero-inner {
    grid-template-columns: 1fr 1.12fr;
    gap: 48px;
  }
}

/* Original chart labels and matching SVG line icons. */
.diagram-heading {
  font-size: 29px;
}
.diagram-detail {
  font-size: 21px;
  font-weight: 550;
}
.diagram-centre {
  font-size: 28px;
  letter-spacing: -0.7px;
}
.diagram-caption {
  font-size: 21px;
}

/* Subtle photography behind the two home training cards. */
.training-option::before {
  content: "";
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  pointer-events: none;
  z-index: 0;
}
.training-option.corporate::before {
  background-image:
    linear-gradient(90deg, rgba(0, 34, 77, 0.94), rgba(0, 34, 77, 0.74)),
    url("/assets/hero-corporate.webp?v=720477d929d8");
}
.training-option.individual::before {
  background-image:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.96),
      rgba(255, 255, 255, 0.79)
    ),
    url("/assets/workspace-1100.webp?v=192db2caf64e");
}
.training-option > h3,
.training-option > .service-number,
.training-option > .button {
  position: relative;
  z-index: 1;
}
.training-option .service-visual,
.training-option .individual-mark {
  display: none;
}

/* Wider intersection and calmer central line lengths. */
.diagram-centre {
  font-size: 27px;
}
.diagram-caption {
  font-size: 19px;
}

/* Approach tilts opposite to the original training-page notes. */
.hero-our-approach .meeting-quote {
  transform: rotate(2deg);
}
@media (max-width: 767px) {
  .hero-our-approach .meeting-quote {
    transform: rotate(1deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-our-approach .meeting-quote {
    transform: none;
  }
}

/* Faded training photography behind the About team section. */
.trainer-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(237, 243, 249, 0.97),
      rgba(237, 243, 249, 0.88)
    ),
    url("/assets/hero-corporate.webp?v=720477d929d8");
  background-size: cover;
  background-position: center;
}

/* Decorative routes suggest international reach, not specific client locations. */
.international-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.95),
      rgba(255, 255, 255, 0.68)
    ),
    url("/assets/world-valencia.svg?v=d00cf1739b06");
  background-size:
    cover,
    auto 100%;
  background-position:
    center,
    right center;
  background-repeat: no-repeat;
}
@media (max-width: 767px) {
  .international-background {
    background-image:
      linear-gradient(rgba(255, 255, 255, 0.83), rgba(255, 255, 255, 0.88)),
      url("/assets/world-valencia.svg?v=d00cf1739b06");
    background-position: center;
  }
}

/* A separate photographic band for preparing personalised training. */
.preparation-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(237, 243, 249, 0.96),
      rgba(237, 243, 249, 0.84)
    ),
    url("/assets/workspace-1100.webp?v=192db2caf64e");
  background-size: cover;
  background-position: center;
}

/* Faded workplace imagery for individual challenges and progress. */
.familiar-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(237, 243, 249, 0.96),
      rgba(237, 243, 249, 0.86)
    ),
    url("/assets/meeting-hero.webp?v=07310008bb73");
  background-size: cover;
  background-position: center;
}
.progress-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(237, 243, 249, 0.96),
      rgba(237, 243, 249, 0.85)
    ),
    url("/assets/hero-approach.webp?v=7f386cd33065");
  background-size: cover;
  background-position: center;
}

/* Four topics in a single desktop row over subtle workplace imagery. */
.practical-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(237, 243, 249, 0.96),
      rgba(237, 243, 249, 0.86)
    ),
    url("/assets/hero-corporate.webp?v=720477d929d8");
  background-size: cover;
  background-position: center;
}
.practical-background .skills-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px;
}
@media (max-width: 1099px) {
  .practical-background .skills-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 599px) {
  .practical-background .skills-grid {
    grid-template-columns: 1fr;
  }
}

/* Warm photographic backdrop for the homepage training process. */
.process-section {
  background-image:
    linear-gradient(
      90deg,
      rgba(252, 244, 230, 0.96),
      rgba(252, 244, 230, 0.86)
    ),
    url("/assets/hero-approach.webp?v=7f386cd33065");
  background-size: cover;
  background-position: center;
}

/* Keep navigation available while scrolling. */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
}
html {
  scroll-padding-top: 124px;
}
@media (max-width: 767px) {
  html {
    scroll-padding-top: 112px;
  }
}

/* Separate sticky notes for the before-and-after responses. */
.conversation-example .response {
  position: relative;
  padding: 30px 24px 24px;
  border: 0;
  border-radius: 1px;
  margin: 26px 5px;
  background: linear-gradient(180deg, #e0eaf4, #edf3f9 22%);
  box-shadow:
    2px 5px 8px rgba(0, 34, 77, 0.12),
    5px 10px 16px rgba(0, 34, 77, 0.08);
  transform: rotate(-1.5deg);
}
.conversation-example .response::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 17px;
  background: rgba(0, 34, 77, 0.035);
  pointer-events: none;
}
.conversation-example .response-after {
  background: linear-gradient(180deg, #f4dc98, #fff0be 22%);
  transform: rotate(1.5deg);
}
@media (max-width: 767px) {
  .conversation-example .response {
    padding: 27px 20px 22px;
    margin-inline: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .conversation-example .response {
    transform: none;
  }
}

/* Subtle photographic context for the example programme timeline. */
.programme-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.96),
      rgba(255, 255, 255, 0.88)
    ),
    url("/assets/hero-approach.webp?v=7f386cd33065");
  background-size: cover;
  background-position: center;
}

/* Optivo credit matches the FastFix Doors footer. */
.optivo-credit {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  vertical-align: middle;
}
.optivo-credit img {
  width: 16px;
  height: 16px;
}

/* Related corporate programme details share one section. */
.paired-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 64px;
}
.paired-columns h2 {
  font-size: clamp(28px, 2.7vw, 36px);
  max-width: 24ch;
}
.paired-columns > div + div {
  border-left: 1px solid var(--line);
  padding-left: 48px;
}
@media (max-width: 767px) {
  .paired-columns {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .paired-columns > div + div {
    border-left: 0;
    border-top: 1px solid var(--line);
    padding: 32px 0 0;
  }
}

/* Match Home to the shared page-hero heading scale. */
.home-hero h1 {
  font-size: clamp(40px, 4.4vw, 60px);
}
@media (max-width: 767px) {
  .home-hero h1 {
    font-size: 38px;
    line-height: 1.17;
  }
}

/* Keep every mobile fact icon clear of its number or label. */
@media (max-width: 767px) {
  .facts-inner > div,
  .facts-inner > div:nth-child(n) {
    padding-left: 40px;
    border-left: 0;
    min-width: 0;
  }
  .facts-inner > div .fact-icon {
    left: 0;
    top: 4px;
    width: 26px;
    height: 26px;
  }
  .facts-inner > div > strong {
    font-size: 25px;
  }
  .facts-inner > div > span {
    font-size: 10px;
    line-height: 1.6;
  }
  .facts-inner {
    column-gap: 20px;
  }
}

/* Commercial-use handwriting font, self-hosted under the SIL OFL. */
@font-face {
  font-family: Caveat;
  src: url("/assets/caveat-latin.woff2?v=2a3a6464dadc") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
.meeting-quote blockquote p,
.conversation-example .response blockquote {
  font-family: Caveat, cursive;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.25;
  font-size: 32px;
}
@media (max-width: 767px) {
  .meeting-quote blockquote p,
  .conversation-example .response blockquote {
    font-size: 29px;
  }
}

/* Soft photographic background for frequently asked questions. */
.faq-background {
  background-image:
    linear-gradient(
      90deg,
      rgba(252, 244, 230, 0.96),
      rgba(252, 244, 230, 0.89)
    ),
    url("/assets/workspace-1100.webp?v=192db2caf64e");
  background-size: cover;
  background-position: center;
}

/* Opposing sticky-note angles across Training and Approach. */
.hero-corporate-training .meeting-quote,
.hero-one-to-one-training .meeting-quote {
  transform: rotate(2deg);
}
.hero-our-approach .meeting-quote {
  transform: rotate(-2deg);
}
@media (max-width: 767px) {
  .hero-corporate-training .meeting-quote,
  .hero-one-to-one-training .meeting-quote {
    transform: rotate(1deg);
  }
  .hero-our-approach .meeting-quote {
    transform: rotate(-1deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-corporate-training .meeting-quote,
  .hero-one-to-one-training .meeting-quote,
  .hero-our-approach .meeting-quote {
    transform: none;
  }
}

/* Accessibility and responsive audit refinements. */
.greeting-control {
  display: block;
  background: transparent;
  border: 1px solid var(--gold);
  color: var(--white);
  border-radius: 4px;
  min-height: 44px;
  padding: 8px 14px;
  font-size: 13px;
  margin: -10px 0 20px;
}
.greeting-control[hidden] {
  display: none;
}
.greeting-control:focus-visible {
  outline-color: white;
}
.greeting-line {
  width: max-content;
  max-width: 100%;
  unicode-bidi: isolate;
}
.greeting-line[dir="rtl"] .typing-cursor {
  margin: 0 6px 0 0;
}
.diagram-mobile {
  display: none;
}
:where(a, button, summary, input, select, textarea) {
  scroll-margin-top: 130px;
}
.skip-link {
  z-index: 200;
}
.site-footer nav a,
.footer-bottom a {
  min-height: 44px;
}
.footer-bottom {
  font-size: 12px;
}
input,
select,
textarea {
  font-size: 16px;
}
.button {
  white-space: normal;
  text-align: center;
  touch-action: manipulation;
}
@media (max-width: 1099px) {
  .site-header nav {
    max-height: calc(100dvh - 108px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .site-header nav a {
    min-height: 48px;
  }
}
@media (max-width: 767px) {
  .header-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0 12px;
    padding-block: 8px;
  }
  .site-header {
    height: auto;
    min-height: 108px;
  }
  .site-header .brand img {
    width: 104px;
    height: 64px;
  }
  .menu-toggle {
    grid-column: 2;
    grid-row: 1;
    width: 48px;
    min-width: 48px;
    height: 48px;
  }
  .header-description {
    grid-column: 1/-1;
    grid-row: 2;
    font-size: 12px;
    white-space: normal;
    margin: 0;
    max-width: none;
  }
  .site-header nav {
    top: 100%;
    max-height: calc(100dvh - 108px);
  }
  html {
    scroll-padding-top: 128px;
  }
  .communication-diagram > svg {
    display: none;
  }
  .diagram-mobile {
    display: grid;
    gap: 16px;
  }
  .diagram-mobile > div {
    background: var(--blue-tint);
    padding: 24px;
    border-radius: 4px;
    color: var(--navy);
  }
  .diagram-mobile > div:nth-child(2) {
    background: var(--cream);
  }
  .diagram-mobile > .diagram-mobile-outcome {
    background: var(--gold);
  }
  .diagram-mobile h2 {
    font-size: 23px;
    letter-spacing: -0.02em;
    margin-bottom: 16px;
    line-height: 1.3;
  }
  .diagram-mobile ul {
    padding-left: 20px;
    margin: 0;
    font-size: 16px;
    line-height: 1.7;
  }
  .diagram-mobile li + li {
    margin-top: 6px;
  }
  .diagram-mobile p {
    font-size: 16px;
    margin: 0;
    line-height: 1.7;
  }
  .facts-inner > div > span {
    font-size: 12px;
  }
  .site-footer .footer-contact .email-link {
    font-size: 14px;
  }
  .skills-grid article p,
  .programme-timeline p,
  .founder-copy p:not(.eyebrow) {
    font-size: 15px;
  }
  .skills-grid {
    grid-template-columns: 1fr;
  }
}
@media (min-width: 1920px) {
  .container {
    max-width: 1600px;
  }
  .hero-intro,
  .page-hero .hero-intro {
    font-size: 20px;
  }
  .editorial-body p,
  .section-copy p {
    font-size: 18px;
  }
  .site-header nav > a:not(.button) {
    font-size: 14px;
  }
  .header-description {
    font-size: 15px;
  }
  .button {
    font-size: 16px;
    min-height: 56px;
  }
}
@media (any-pointer: coarse) {
  .site-header nav > a:not(.button) {
    min-height: 48px;
  }
  .faq-list summary {
    min-height: 48px;
  }
  .footer-top nav a {
    min-height: 48px;
  }
}

/* Smaller hero sources for mobile bandwidth. */
@media (max-width: 767px) {
  .home-hero {
    --hero-image: url("/assets/meeting-hero-mobile.webp?v=3c840c641fd6");
  }
  .hero-corporate-training {
    --hero-image: url("/assets/hero-corporate-mobile.webp?v=71b8971425b5");
  }
  .hero-one-to-one-training {
    --hero-image: url("/assets/workspace-1100-mobile.webp?v=8edca52de0d0");
  }
  .hero-our-approach {
    --hero-image: url("/assets/hero-approach-mobile.webp?v=e34a33f10ac2");
  }
  .hero-about {
    --hero-image: url("/assets/hero-about-mobile.webp?v=0561fc4fca80");
  }
  .hero-contact {
    --hero-image: url("/assets/hero-contact-mobile.webp?v=f46395a09e08");
  }
  .hero-insights {
    --hero-image: url("/assets/hero-insights-mobile.webp?v=d86ba4363a72");
  }
}

/* Centre the expanded navigation on mobile and tablet. */
@media (max-width: 1099px) {
  .site-header nav.is-open { justify-items: center; text-align: center; }
  .site-header nav > a:not(.button) { justify-content: center; width: 100%; }
  .site-header nav .nav-consultation { justify-self: center; }
}

/* Tablets need a full-width chart rather than two cramped hero columns. */
@media (min-width: 768px) and (max-width: 1099px) {
  .home-hero-inner { grid-template-columns: 1fr; gap: 40px; padding-block: 48px; }
  .home-hero-inner > .hero-copy { max-width: 720px; }
  .home-hero h1 { font-size: 48px; }
  .home-hero h1 br { display: none; }
  .home-hero .hero-intro { max-width: 58ch; }
  .home-hero .hero-actions { flex-direction: row; align-items: center; }
  .home-hero .communication-diagram { max-width: 760px; margin-inline: auto; }
  .home-hero { background-image: linear-gradient(90deg, rgba(0,34,77,.95), rgba(0,34,77,.78)), var(--hero-image); }
}

/* Notes arrive after the surrounding content without changing their tilt. */
.note-reveal {
  opacity: 0;
  transition: opacity 900ms ease 450ms;
}
.note-reveal.note-visible { opacity: 1; }
.note-reveal-second { transition-delay: 1100ms; }
@media (prefers-reduced-motion: reduce) {
  .note-reveal { opacity: 1; transition: none; }
}

/* Client-approved diagram: two approaches and their business outcomes. */
.communication-diagram .diagram-introduction{max-width:none;margin:0 0 18px;text-align:center;color:var(--white)}
.diagram-introduction h2{color:var(--white);font-size:22px;line-height:1.3;letter-spacing:-.02em;margin-bottom:8px}
.diagram-introduction p{font-size:13px;line-height:1.6;margin:0}
@media(max-width:767px){.diagram-introduction h2{font-size:24px}.diagram-introduction p{font-size:16px}.diagram-mobile-outcome ul{margin:0}}

/* The Approach process image belongs to its full-width blue band. */
.process-background {
  background-color: var(--blue-tint);
  background-image: linear-gradient(90deg, rgba(237,243,249,.94), rgba(237,243,249,.84)), url('/assets/hero-approach.webp?v=7f386cd33065');
  background-size: cover;
  background-position: center;
}
.process-background > .process-section { background: transparent; }

/* Conversation icons replace directional list bullets. */
.work-list li { padding-left: 34px; }
.work-list li::before {
  content: "";
  width: 22px;
  height: 22px;
  top: 3px;
  background: var(--blue);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 11.5a8.5 8.5 0 0 1-8.5 8.5 9 9 0 0 1-4-.9L3 21l1.9-5.5a9 9 0 0 1-.9-4A8.5 8.5 0 0 1 12.5 3h.5a8.5 8.5 0 0 1 8 8v.5Z' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 11.5a8.5 8.5 0 0 1-8.5 8.5 9 9 0 0 1-4-.9L3 21l1.9-5.5a9 9 0 0 1-.9-4A8.5 8.5 0 0 1 12.5 3h.5a8.5 8.5 0 0 1 8 8v.5Z' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Match the diagram's gold outline on both founder portraits. */
.founder-section .portrait,
.page-hero .portrait {
  border: 3px solid var(--gold);
}

/* Compact review link: no external widget or tracking requests. */
.header-brand-copy{margin-right:auto;min-width:0}
.header-brand-copy .header-description{transform:none}
.header-reviews{display:inline-flex;align-items:center;gap:8px;min-height:32px;font-size:11px;line-height:1.4;text-decoration:none;color:var(--navy)}
.review-stars{color:#a17120;letter-spacing:1px;font-size:14px}.review-label{margin-left:4px}
@media(max-width:767px){.header-brand-copy{grid-column:1/-1;grid-row:2;margin:0}.header-reviews{min-height:28px;font-size:11px}.site-header nav{max-height:calc(100dvh - 136px)}html{scroll-padding-top:156px}:where(a,button,summary,input,select,textarea){scroll-margin-top:156px}}

/* Laurel-framed review badge beside the brand description. */
.header-brand-copy{display:flex;align-items:center;gap:18px}
.header-brand-copy .header-description{white-space:normal;max-width:185px;font-size:12px}
.header-reviews{gap:3px;min-height:64px;flex-shrink:0}
.review-laurel{width:19px;height:58px;color:#a17120}.review-laurel-right{transform:scaleX(-1)}
.review-badge-content{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.2}
.review-stars{font-size:12px;letter-spacing:0}.review-rating{font-size:14px;font-weight:750}.review-label{font-size:9px;margin:0;white-space:nowrap}
@media(min-width:1100px) and (max-width:1279px){.header-inner{gap:16px}.header-brand-copy{gap:8px}.header-brand-copy .header-description{max-width:155px;font-size:11px}.site-header nav{gap:14px}}
@media(max-width:767px){.header-brand-copy{justify-content:space-between;gap:12px}.header-brand-copy .header-description{font-size:12px;max-width:190px}.header-reviews{min-height:58px}.site-header nav{max-height:calc(100dvh - 156px)}html{scroll-padding-top:176px}:where(a,button,summary,input,select,textarea){scroll-margin-top:176px}}
@media (max-width: 767px) {
  .header-brand-copy .header-description { flex-shrink: 1; min-width: 0; }
  .header-brand-copy { min-width: 0; width: 100%; }
}

/* Share the logo lettering's horizontal centre line on desktop. */
@media (min-width: 1100px) {
  .header-brand-copy { transform: translateY(12px); gap: 14px; }
  .header-brand-copy .header-description { white-space: nowrap; max-width: none; font-size: 12px; }
  .site-header nav { transform: translateY(12px); }
  .header-inner { gap: 20px; }
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .header-inner { padding-inline: 24px; gap: 12px; }
  .header-brand-copy { gap: 8px; }
  .header-brand-copy .header-description { font-size: 10.5px; }
  .site-header nav { gap: 12px; }
  .site-header nav > a:not(.button) { font-size: 10px; }
}
@media (min-width: 768px) and (max-width: 1099px) {
  .header-brand-copy { transform: translateY(12px); }
  .header-brand-copy .header-description { white-space: nowrap; max-width: none; }
  .menu-toggle { transform: translateY(12px); }
}
@media (max-width: 767px) {
  .header-brand-copy .header-description { white-space: nowrap; max-width: none; font-size: 11px; }
  .header-brand-copy { gap: 8px; }
  .review-laurel { width: 14px; height: 48px; }
  .review-stars { font-size: 10px; }
  .review-label { font-size: 8px; }
  .header-reviews { gap: 1px; }
}

/* Keep the responsive header in one horizontal row. */
@media (max-width: 1099px) {
  .header-inner { display: flex; align-items: center; gap: 12px; padding-block: 8px; }
  .site-header { height: 96px; min-height: 96px; }
  .header-brand-copy { display: flex; width: auto; flex: 1; justify-content: space-between; transform: translateY(6px); gap: 10px; }
  .header-brand-copy .header-description { white-space: normal; font-size: 12px; max-width: 190px; }
  .menu-toggle { order: 3; transform: translateY(6px); }
  .site-header nav { top: 100%; max-height: calc(100dvh - 96px); }
  .site-header .brand img { width: 92px; height: 72px; }
  html { scroll-padding-top: 112px; }
}
@media (max-width: 599px) {
  .header-inner { padding-inline: 14px; gap: 8px; }
  .site-header .brand img { width: 62px; height: 64px; }
  .header-brand-copy { gap: 6px; }
  .header-brand-copy .header-description { font-size: 10px; max-width: 125px; }
  .header-reviews { min-height: 48px; }
  .review-laurel { width: 10px; height: 42px; }
  .review-stars { font-size: 9px; }
  .review-rating { font-size: 12px; }
  .review-label { font-size: 7px; }
  .menu-toggle { width: 40px; min-width: 40px; height: 48px; padding: 6px; }
  .menu-lines { width: 24px; }
}

/* Extend only the consultation button to the outer desktop margin. */
@media (min-width: 1280px) and (max-width: 1919px) {
  .site-header .nav-consultation {
    transform: translateX(calc((100vw - 1280px) / 2));
  }
}
@media (min-width: 1920px) {
  .site-header .nav-consultation {
    transform: translateX(calc((100vw - 1600px) / 2));
  }
}

/* Consultation copy and form share the hero background. */
.contact-hero-inner{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.contact-hero .contact-form-panel{background:var(--white);color:var(--navy)}
.contact-hero .contact-form-panel p,.contact-hero .contact-form-panel label{color:var(--navy)}
.contact-hero .contact-form-panel .field-hint,.contact-hero .contact-form-panel .optional{color:var(--muted)}
.contact-hero .contact-form-panel .field-error{color:var(--error)}
.contact-hero .contact-form-panel a:focus-visible,.contact-hero .contact-form-panel .button:focus-visible{outline-color:var(--blue)}
@media(max-width:1099px){.contact-hero-inner{gap:32px}.contact-hero h1{font-size:42px}}
@media(max-width:767px){.contact-hero-inner{grid-template-columns:1fr;gap:32px}.contact-hero h1{font-size:38px}.contact-hero .contact-form-panel{padding:28px 24px}}

/* Keep the home conversation example compact without crowding the notes. */
.conversation-section {
  padding-block: 64px;
  gap: 64px;
}
.conversation-section .conversation-example {
  padding: 16px 12px;
}
.conversation-section .conversation-example h3 {
  font-size: clamp(22px, 2.05vw, 28px);
  margin-bottom: 12px;
}
.conversation-section .example-heading .eyebrow {
  margin-bottom: 14px;
}
.conversation-section .conversation-example .response {
  padding: 24px 22px 20px;
  margin-block: 18px;
}
.conversation-section .response blockquote {
  font-size: 29px;
  line-height: 1.2;
}
.conversation-section .example-note {
  margin-top: 16px;
}
@media (max-width: 767px) {
  .conversation-section {
    padding-block: 44px;
    gap: 28px;
  }
  .conversation-section .conversation-example {
    padding: 8px 0;
  }
  .conversation-section .conversation-example h3 {
    font-size: 24px;
  }
  .conversation-section .response blockquote {
    font-size: 28px;
  }
}

/* Pair short enquiry fields to keep the contact hero manageable. */
.contact-hero .enquiry-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 18px;
}
.contact-hero .enquiry-form .field {
  margin-bottom: 0;
  min-width: 0;
}
.contact-hero .enquiry-form .field-full,
.contact-hero .enquiry-form .privacy-note,
.contact-hero .enquiry-form .submit-status {
  grid-column: 1 / -1;
}
.contact-hero .enquiry-form .privacy-note {
  margin: 0;
}
.contact-hero .enquiry-form > .button {
  grid-column: 1 / -1;
  justify-self: start;
}
.contact-hero .enquiry-form textarea {
  min-height: 110px;
}
@media (max-width: 599px) {
  .contact-hero .enquiry-form {
    grid-template-columns: 1fr;
  }
}

/* Give the enquiry dropdown indicator breathing room from its border. */
.contact-hero .enquiry-form select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='m1 1 7 7 7-7' fill='none' stroke='%2300224d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px 10px;
  padding-right: 42px;
}
@media (forced-colors: active) {
  .contact-hero .enquiry-form select {
    appearance: auto;
    background-image: none;
  }
}

/* The open enquiry menu shares the form's typography and colour palette. */
.form-dropdown {
  position: relative;
}
.form-dropdown select[hidden],
.form-dropdown-options[hidden] {
  display: none;
}
.form-dropdown-trigger {
  width: 100%;
  min-height: 48px;
  padding: 12px 42px 12px 13px;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--paper);
  color: var(--navy);
  font: inherit;
  font-size: 14px;
  line-height: 1.65;
  text-align: left;
  cursor: pointer;
}
.form-dropdown-trigger::after {
  content: '';
  position: absolute;
  right: 16px;
  top: 20px;
  width: 9px;
  height: 9px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
}
.form-dropdown-trigger[aria-invalid='true'] {
  border: 2px solid var(--error);
}
.form-dropdown-options {
  position: absolute;
  z-index: 20;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  margin: 0;
  padding: 6px;
  list-style: none;
  border: 1px solid var(--muted);
  border-radius: var(--radius);
  background: var(--white);
  color: var(--navy);
  box-shadow: 0 8px 20px rgba(0, 34, 77, .12);
}
.form-dropdown-options [role='option'] {
  padding: 11px 12px;
  min-height: 44px;
  font-size: 14px;
  line-height: 1.5;
  border-radius: var(--radius);
  cursor: pointer;
}
.form-dropdown-options [role='option']:hover,
.form-dropdown-options .is-active {
  background: var(--blue-tint);
}
.form-dropdown-options [aria-selected='true'] {
  font-weight: 650;
  box-shadow: inset 3px 0 var(--gold);
}

/* Keep the brand description together at every header breakpoint. */
.header-brand-copy .header-description {
  white-space: nowrap;
  max-width: none;
  flex-shrink: 0;
}
@media (max-width: 399px) {
  .header-inner { padding-inline: 10px; gap: 6px; }
  .site-header .brand img { width: 48px; }
  .header-brand-copy { gap: 4px; }
  .header-brand-copy .header-description { font-size: 8px; }
  .review-laurel { width: 7px; }
  .review-stars { font-size: 8px; }
  .review-label { font-size: 6px; }
}

/* Centre the review award between the description and the first nav link. */
@media (min-width: 1100px) {
  .header-brand-copy {
    flex: 1;
    margin-right: 0;
    gap: 0;
  }
  .header-brand-copy .header-reviews {
    margin-inline: auto;
    transform: translateX(10px);
  }
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .header-brand-copy .header-reviews {
    transform: translateX(6px);
  }
}
@media (min-width: 1100px) {
  .header-brand-copy .header-description {
    margin-right: 0;
  }
}

/* Team figures use the same restrained line icons as the home facts. */
.team-stats dt {
  display: flex;
  align-items: center;
  gap: 16px;
}
.team-stat-icon {
  width: 38px;
  height: 38px;
  flex-shrink: 0;
  color: var(--blue);
}
@media (max-width: 767px) {
  .team-stats dt { gap: 12px; }
  .team-stat-icon { width: 30px; height: 30px; }
}

/* Keep the message guidance legible inside the empty text area. */
.contact-hero .enquiry-form textarea::placeholder {
  color: var(--muted);
  opacity: 1;
  font-size: 12px;
  line-height: 1.6;
}

/* Share spare desktop space equally across the three major header gaps. */
@media (min-width: 1100px) {
  .header-inner {
    max-width: none;
    padding-inline: 40px;
    gap: 26px;
  }
  .header-brand-copy,
  .site-header nav {
    display: contents;
  }
  .header-brand-copy .header-description {
    margin: 0;
    transform: translateY(12px);
  }
  .header-brand-copy .header-reviews {
    margin: 0 0 0 auto;
    transform: translateY(12px);
  }
  .site-header nav > a {
    transform: translateY(12px);
  }
  .site-header nav > a:first-child,
  .site-header nav > .nav-consultation {
    margin-left: auto;
    transform: translateY(12px);
  }
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .header-inner {
    padding-inline: 24px;
    gap: 12px;
  }
}

/* Keep the FAQ photograph faded against a neutral white section. */
.faq-background {
  background-color: var(--white);
  background-image:
    linear-gradient(90deg, rgba(255, 255, 255, .96), rgba(255, 255, 255, .89)),
    url("/assets/workspace-1100.webp?v=192db2caf64e");
}
.faq-background > .container {
  background-color: transparent;
}

/* Editorial people photographs complement the copy without becoming backdrops. */
.section-with-photo {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(32px, 4vw, 72px);
}
.section-photo-copy { min-width: 0; }
.section-photo {
  margin: 0;
  width: 100%;
}
.section-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 4px;
}
.section-with-photo .work-list,
.section-with-photo .skills-grid {
  grid-template-columns: 1fr;
  gap: 16px;
}
.section-with-photo .skills-grid article {
  padding-top: 16px;
}
@media (max-width: 767px) {
  .section-with-photo {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* Reverse the preparation section to vary the editorial rhythm. */
@media (min-width: 768px) {
  .preparation-background .section-with-photo {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  }
  .preparation-background .section-photo {
    grid-column: 1;
    grid-row: 1;
  }
  .preparation-background .section-photo-copy {
    grid-column: 2;
    grid-row: 1;
  }
}

/* Match the editorial photo frames to the diagram's gold outlines. */
.section-photo img {
  border: 3px solid var(--gold);
}

/* Give each familiar situation its own space across the full content width. */
.familiar-background .work-list {
  max-width: none;
  width: 100%;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 32px;
}
.familiar-background .work-list li {
  padding-left: 0;
}
.familiar-background .work-list li::before {
  content: none;
}
.situation-icon {
  display: block;
  width: 36px;
  height: 36px;
  margin-bottom: 16px;
  color: var(--blue);
}
.familiar-background .editorial-note {
  max-width: none;
}
@media (max-width: 1099px) {
  .familiar-background .work-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 32px;
  }
}
@media (max-width: 599px) {
  .familiar-background .work-list {
    grid-template-columns: 1fr;
  }
}

/* Progress review pairs its photograph on the left with the copy on the right. */
@media (min-width: 768px) {
  .progress-background .section-with-photo {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  }
  .progress-background .section-photo {
    grid-column: 1;
    grid-row: 1;
  }
  .progress-background .section-photo-copy {
    grid-column: 2;
    grid-row: 1;
  }
}

/* Explicit section positions override the default photo arrangement. */
@media (min-width: 768px) {
  .section-with-photo.photo-left {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  }
  .section-with-photo.photo-left .section-photo { grid-column: 1; grid-row: 1; }
  .section-with-photo.photo-left .section-photo-copy { grid-column: 2; grid-row: 1; }
  .section-with-photo.photo-right {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  }
  .section-with-photo.photo-right .section-photo { grid-column: 2; grid-row: 1; }
  .section-with-photo.photo-right .section-photo-copy { grid-column: 1; grid-row: 1; }
}

/* Keep each half of the conversation heading together on larger screens. */
.conversation-practice-heading span { display: block; }
@media (min-width: 768px) {
  .editorial-heading .conversation-practice-heading {
    max-width: none;
    font-size: clamp(25px, 2.3vw, 40px);
  }
  .conversation-practice-heading span { white-space: nowrap; }
}

/* Reverse the Approach hero note's tilt. */
.hero-our-approach .meeting-quote {
  transform: rotate(2deg);
}
@media (max-width: 767px) {
  .hero-our-approach .meeting-quote {
    transform: rotate(1deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-our-approach .meeting-quote {
    transform: none;
  }
}

/* Align desktop header ends with the shared site content container. */
@media (min-width: 1100px) {
  .header-inner {
    max-width: 1280px;
    padding-inline: 40px;
    margin-inline: auto;
  }
}
@media (min-width: 1920px) {
  .header-inner {
    max-width: 1600px;
  }
}

/* Distribute footer groups across the same width as the page content. */
@media (min-width: 1000px) {
  .footer-top {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 48px;
  }
  .footer-top > :nth-child(2) {
    justify-self: center;
  }
  .footer-contact {
    justify-self: end;
  }
}

/* Centre the FAQ introduction over two balanced question columns. */
.faq-section {
  display: block;
}
.faq-section > h2 {
  max-width: none;
  text-align: center;
  margin-bottom: 36px;
}
.faq-section .faq-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 48px;
  align-items: start;
}
.faq-section .faq-list details {
  border-top: 1px solid var(--line);
}
@media (max-width: 767px) {
  .faq-section .faq-list {
    grid-template-columns: 1fr;
  }
  .faq-section > h2 {
    margin-bottom: 24px;
  }
}

/* Slightly larger navigation and consultation labels. */
.site-header .nav-consultation,
.footer-contact .button,
a.button[href='/contact/'] {
  font-size: 16px;
}
@media (min-width: 1100px) and (max-width: 1279px) {
  .site-header .nav-consultation { font-size: 14px; }
}

/* A workplace icon gives the first fact the same visual treatment as its neighbours. */
.facts-inner > .working-world-fact {
  display: flex;
  align-items: center;
  gap: 14px;
}
.working-world-icon {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  color: var(--blue);
}

/* Soft depth beneath the hero sticky notes. */
.page-hero-visual .meeting-quote,
.home-hero .meeting-quote,
.blog-hero-inner .meeting-quote {
  box-shadow:
    0 6px 12px rgba(0, 15, 35, .18),
    8px 18px 30px rgba(0, 15, 35, .24);
}

/* Buttons follow the brightness of their surrounding section. */
#main .button,
.site-header .button,
.site-footer .button {
  background: transparent;
  border-color: var(--gold);
  color: var(--navy);
}
#main .button:hover,
.site-header .button:hover,
.site-footer .button:hover {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}
#main .hero-background .button,
#main .training-option.corporate .button {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}
#main .hero-background .button:hover,
#main .training-option.corporate .button:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}
/* The white contact panel remains a light section within its dark hero. */
#main .contact-form-panel .button {
  background: transparent;
  border-color: var(--gold);
  color: var(--navy);
}
#main .contact-form-panel .button:hover {
  background: var(--gold);
  color: var(--navy);
}

/* Light sections use solid navy buttons; dark sections retain gold. */
#main .button,
.site-header .button,
.site-footer .button,
#main .contact-form-panel .button {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--white);
}
#main .button:hover,
.site-header .button:hover,
.site-footer .button:hover,
#main .contact-form-panel .button:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}
#main .hero-background .button,
#main .training-option.corporate .button {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}
#main .hero-background .button:hover,
#main .training-option.corporate .button:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}
/* This form is a white panel, despite being nested inside the contact hero. */
#main .hero-background .contact-form-panel .button {
  background: var(--navy);
  border-color: var(--navy);
  color: var(--white);
}
#main .hero-background .contact-form-panel .button:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}

/* Navy footer with high-contrast type and the dark-section gold CTA. */
.site-footer {
  background: var(--navy);
  color: var(--white);
  border-top-color: rgba(255, 255, 255, .18);
}
.site-footer .footer-brand .brand img {
  filter: brightness(0) invert(1);
}
.site-footer h2 {
  color: var(--gold);
}
.site-footer p,
.site-footer nav a,
.site-footer .email-link,
.site-footer .footer-bottom,
.site-footer .footer-bottom a,
.site-footer .footer-bottom strong {
  color: var(--white);
}
.site-footer a:hover {
  color: var(--gold);
}
.site-footer .footer-bottom::before {
  background: rgba(255, 255, 255, .22);
}
.site-footer .button {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}
.site-footer .button:hover {
  background: var(--white);
  border-color: var(--white);
  color: var(--navy);
}
.site-footer a:focus-visible {
  outline-color: var(--gold);
}

/* FAQ sections use a plain white background. */
.faq-background {
  background-image: none;
  background-color: var(--white);
}

/* Small, one-time arrivals for the two areas in editorial sections. */
.section-area-reveal {
  opacity: 0;
  translate: 0 16px;
  transition:
    opacity 600ms ease var(--section-reveal-delay, 0ms),
    translate 600ms cubic-bezier(.22, 1, .36, 1) var(--section-reveal-delay, 0ms);
}
.section-area-reveal.section-area-visible,
.section-area-reveal:focus-within {
  opacity: 1;
  translate: 0 0;
}
@media (prefers-reduced-motion: reduce) {
  .section-area-reveal {
    opacity: 1;
    translate: none;
    transition: none;
  }
}
@media print {
  .section-area-reveal {
    opacity: 1;
    translate: none;
  }
}

/* Consultation CTAs use a conversation icon in the button's current colour. */
a.button[href='/contact/']::before {
  content: '';
  display: inline-block;
  flex: 0 0 19px;
  width: 19px;
  height: 19px;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 11a9 9 0 0 1-9 9H7l-5 2 1-6a9 9 0 1 1 18-5Z' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7 11h.01M12 11h.01M17 11h.01' stroke='black' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
a.button[href='/contact/'] {
  gap: 10px;
}

/* The header consultation CTA remains a prominent gold action. */
.site-header .nav-consultation {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}
.site-header .nav-consultation:hover {
  background: var(--blue);
  border-color: var(--blue);
  color: var(--white);
}

/* Paper detail stays subtle so the handwritten message remains the focus. */
.page-hero-visual .meeting-quote,
.home-hero .meeting-quote,
.blog-hero-inner .meeting-quote {
  background-color: #fff0be;
  background-image:
    radial-gradient(rgba(110, 85, 30, .035) .55px, transparent .8px),
    linear-gradient(165deg, #f7e4aa 0%, #fff0be 45%, #ffedb6 100%);
  background-size: 4px 4px, 100% 100%;
  border-radius: 1px 1px 13px 1px;
  padding-top: 38px;
  box-shadow:
    0 2px 3px rgba(0, 15, 35, .16),
    3px 10px 14px -5px rgba(0, 15, 35, .22),
    10px 22px 28px -10px rgba(0, 15, 35, .25);
}
.meeting-quote::before {
  height: 18px;
  background: linear-gradient(180deg, rgba(184, 148, 66, .09), rgba(184, 148, 66, .025));
  border-bottom: 0;
}
.meeting-quote::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 28px;
  height: 28px;
  border-bottom-right-radius: 12px;
  background: linear-gradient(135deg, transparent 45%, rgba(176, 137, 51, .1) 58%, #fff6d8 88%);
  box-shadow: 3px 5px 6px -5px rgba(0, 15, 35, .45);
  pointer-events: none;
}
.meeting-quote figcaption {
  border: 0;
  padding-top: 0;
  margin-top: 22px;
  font-family: Caveat, cursive;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--navy);
  opacity: .82;
}
@media (max-width: 767px) {
  .page-hero-visual .meeting-quote,
  .home-hero .meeting-quote,
  .blog-hero-inner .meeting-quote {
    padding-top: 30px;
  }
  .meeting-quote figcaption { font-size: 20px; }
}

/* Consultation buttons indicate an online video conversation. */
a.button[href='/contact/']::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='5' width='14' height='14' rx='2' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='m16 9 6-3v12l-6-3Z' fill='none' stroke='black' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* About-page overview and values use the full shared content width. */
.trainer-background .editorial-heading h2,
.trainer-background .editorial-body,
.trainer-background .team-stats {
  max-width: none;
  width: 100%;
}
.trainer-background .team-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 48px;
}
.hero-about ~ .section-tone-gold .skills-grid {
  max-width: none;
  width: 100%;
}
@media (max-width: 767px) {
  .trainer-background .team-stats {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* Four equal footer groups, separated by restrained gold dotted rules. */
.footer-top {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
}
.footer-top > div {
  min-width: 0;
  padding-inline: 24px;
  justify-self: stretch;
}
.footer-top > div:first-child { padding-left: 0; }
.footer-top > div:last-child { padding-right: 0; }
.footer-top > div + div { border-left: 1px dotted var(--gold); }
.footer-top > :nth-child(2),
.footer-top .footer-contact { justify-self: stretch; }
.footer-contact .button { padding-inline: 16px; }
@media (max-width: 999px) {
  .footer-top { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 32px; }
  .footer-top > div:nth-child(odd) { padding-left: 0; border-left: 0; }
  .footer-top > div:nth-child(even) { padding-right: 0; }
}
@media (max-width: 599px) {
  .footer-top { grid-template-columns: 1fr; gap: 24px; }
  .footer-top > div { padding: 0; border-left: 0; }
  .footer-top > div + div {
    border-left: 0;
    border-top: 1px dotted var(--gold);
    padding-top: 24px;
  }
}

/* Fold alternating top corners back to reveal the adhesive underside. */
.meeting-quote::after {
  top: 0;
  bottom: auto;
  right: 0;
  left: auto;
  width: 32px;
  height: 32px;
  border-radius: 0;
  background: linear-gradient(45deg, #d7b968 0%, #f1d98f 47%, #fff7dd 49%, #f8e7b1 52%, #e8cb7e 100%);
  clip-path: polygon(0 0, 100% 100%, 0 100%);
  box-shadow: -2px 3px 4px rgba(91, 65, 17, .22);
  transform: rotate(180deg);
  transform-origin: center;
}
.hero-corporate-training .meeting-quote::after,
.hero-our-approach .meeting-quote::after {
  left: 0;
  right: auto;
  transform: rotate(90deg);
}
@media (max-width: 767px) {
  .meeting-quote::after { width: 26px; height: 26px; }
}

/* Square hero notes retain comfortable space for the handwritten message. */
.page-hero-visual .meeting-quote,
.home-hero .meeting-quote,
.blog-hero-inner .meeting-quote {
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  max-width: 460px;
  margin-inline: auto;
  padding: 38px 34px;
}
@media (max-width: 767px) {
  .page-hero-visual .meeting-quote,
  .home-hero .meeting-quote,
  .blog-hero-inner .meeting-quote {
    padding: 28px;
  }
}

/* Keep the privacy explanation alongside the form's submit action. */
.enquiry-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 22px;
}
.enquiry-actions > .button { flex-shrink: 0; }
.contact-hero .enquiry-actions .privacy-note { margin: 0; }
@media (max-width: 599px) {
  .enquiry-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
}

/* The About hero portrait arrives gently, like the home diagram. */
.hero-about .page-hero-visual .portrait {
  animation: portrait-reveal 1600ms ease 250ms both;
}
@keyframes portrait-reveal {
  from { opacity: 0; translate: 0 12px; }
  to { opacity: 1; translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-about .page-hero-visual .portrait {
    animation: none;
  }
}

/* Fine paper fibres and blue ballpoint ink for the handwritten notes. */
.page-hero-visual .meeting-quote,
.home-hero .meeting-quote,
.blog-hero-inner .meeting-quote {
  background-image:
    repeating-linear-gradient(8deg, rgba(125, 97, 33, .025) 0 1px, transparent 1px 4px),
    radial-gradient(rgba(125, 97, 33, .075) .55px, transparent .85px),
    linear-gradient(165deg, #f7e4aa 0%, #fff0be 45%, #ffedb6 100%);
  background-size: 100% 100%, 3px 3px, 100% 100%;
}
.meeting-quote blockquote p,
.conversation-example .response blockquote {
  color: #173f85;
  font-size: 34px;
  font-weight: 500;
}
.meeting-quote figcaption {
  color: #173f85;
}
.conversation-example .response {
  background-image:
    radial-gradient(rgba(70, 88, 112, .06) .5px, transparent .85px),
    linear-gradient(180deg, #e0eaf4, #edf3f9 22%);
  background-size: 3px 3px, 100% 100%;
}
.conversation-example .response-after {
  background-image:
    radial-gradient(rgba(125, 97, 33, .075) .55px, transparent .85px),
    linear-gradient(180deg, #f4dc98, #fff0be 22%);
}
.conversation-section .response blockquote { font-size: 31px; }
@media (max-width: 767px) {
  .meeting-quote blockquote p { font-size: 31px; }
  .conversation-section .response blockquote { font-size: 30px; }
}

/* Independent stacks prevent an open answer from shifting the other column. */
.faq-column { min-width: 0; }
@media (max-width: 767px) {
  .faq-section .faq-list {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .faq-column { display: contents; }
  .faq-column details { order: var(--faq-order); }
}

/* Slightly larger folds make the paper underside easier to see. */
.meeting-quote::after {
  width: 44px;
  height: 44px;
}
@media (max-width: 767px) {
  .meeting-quote::after {
    width: 34px;
    height: 34px;
  }
}

/* Centre the contents of the three footer navigation/contact groups. */
.footer-top > div:not(:first-child) {
  text-align: center;
}
.footer-training nav,
.footer-pjc nav {
  align-items: center;
}
.footer-contact .button {
  margin-inline: auto;
}

/* A lightweight, accessible counterpart to the client's progress infographic. */
.progress-graphic {
  border: 3px solid var(--gold);
  border-radius: 4px;
  padding: 30px 18px 36px;
  background: linear-gradient(172deg, #fff 70%, #edf3f9 70.3%, #fcf4e6 100%);
}
.progress-graphic > figcaption {
  font-size: clamp(23px, 2vw, 30px);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 26px;
  color: var(--navy);
}
.progress-graphic > figcaption span { color: #9b7026; }
.progress-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.progress-steps li { min-width: 0; text-align: center; }
.progress-step-symbol {
  position: relative;
  background: var(--navy);
  color: white;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  margin: 0 auto 22px;
  display: grid;
  place-items: center;
}
.progress-steps li:nth-child(2) .progress-step-symbol,
.progress-steps li:nth-child(5) .progress-step-symbol { background: #587b95; }
.progress-steps li:nth-child(3) .progress-step-symbol { background: #b58938; }
.progress-step-symbol svg { width: 32px; height: 32px; }
.progress-step-symbol > span {
  position: absolute;
  bottom: -13px;
  background: #b58938;
  border: 2px solid white;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  font-size: 12px;
  display: grid;
  place-items: center;
}
.progress-step-text h3 { font-size: 12px; line-height: 1.35; margin: 0 0 12px; }
.progress-step-text p { font-size: 11px; line-height: 1.5; margin: 0; color: var(--muted); }
@media (max-width: 1099px) {
  .progress-steps { grid-template-columns: 1fr; gap: 20px; }
  .progress-steps li { display: flex; align-items: center; gap: 20px; text-align: left; }
  .progress-step-symbol { flex-shrink: 0; margin: 0 0 8px; }
  .progress-step-text h3 { font-size: 15px; margin-bottom: 4px; }
  .progress-step-text p { font-size: 13px; }
}

/* Text-based Minto diagram stays crisp, small and translatable. */
.pyramid-graphic {
  background: var(--white);
  border: 3px solid var(--gold);
  border-radius: 4px;
  padding: 28px 20px;
}
.pyramid-graphic figcaption { font-size: 30px; font-weight: 700; line-height: 1.2; }
.pyramid-graphic figcaption span { color: #9b7026; }
.pyramid-intro { font-size: 13px; color: var(--muted); margin: 10px 0 24px; line-height: 1.5; }
.pyramid-levels { list-style: none; margin: 0; padding: 0; }
.pyramid-levels li { display: grid; grid-template-columns: 1fr 1.2fr; align-items: center; gap: 14px; margin-top: 8px; }
.pyramid-level { color: white; padding: 24px 12px 18px; text-align: center; display: flex; align-items: center; flex-direction: column; gap: 8px; }
.pyramid-main { background: var(--navy); clip-path: polygon(50% 0,100% 100%,0 100%); padding-top: 62px; }
.pyramid-reasons { background: #587b95; clip-path: polygon(17% 0,83% 0,100% 100%,0 100%); }
.pyramid-evidence { background: #ac843c; border-radius: 0 0 10px 10px; }
.pyramid-level svg { width: 28px; height: 28px; }
.pyramid-level strong { font-size: 11px; line-height: 1.4; }
.pyramid-level span { font-size: 11px; }
.pyramid-explanation { background: var(--blue-tint); padding: 14px; border-radius: 8px; }
.pyramid-levels li:last-child .pyramid-explanation { background: var(--cream); }
.pyramid-explanation h3 { font-size: 14px; line-height: 1.4; margin: 0 0 6px; }
.pyramid-explanation p { font-size: 12px; line-height: 1.6; margin: 0; }
@media(max-width: 1099px) {
  .pyramid-levels li { grid-template-columns: 1fr; }
  .pyramid-level { clip-path: none; border-radius: 4px; padding: 18px; }
}

/* Keep the supplied portrait diagram fully visible. */
.section-infographic img { aspect-ratio: auto; object-fit: contain; }

/* Compact SCARF rows replace the tall raster diagram with accessible text. */
.scarf-graphic {
  background: var(--white);
  border: 3px solid var(--gold);
  border-radius: 4px;
  padding: 24px;
}
.scarf-graphic > figcaption {
  font-size: 25px;
  line-height: 1.25;
  font-weight: 700;
  color: var(--navy);
}
.scarf-graphic > figcaption span { color: #9b7026; }
.scarf-intro { margin: 10px 0 18px; font-size: 13px; line-height: 1.5; color: var(--muted); }
.scarf-items { margin: 0; display: grid; gap: 8px; }
.scarf-items > div {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: #f5f5f2;
  border-radius: 5px;
}
.scarf-items dt { display: flex; align-items: center; gap: 10px; font-weight: 650; font-size: 14px; }
.scarf-letter {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: white;
  background: var(--navy);
  border: 1px solid var(--gold);
  font-size: 20px;
}
.scarf-items > div:nth-child(2) .scarf-letter,
.scarf-items > div:nth-child(5) .scarf-letter { background: #587b95; }
.scarf-items > div:nth-child(3) .scarf-letter { background: #ac843c; }
.scarf-items svg { width: 25px; height: 25px; flex-shrink: 0; color: var(--blue); }
.scarf-items dd { margin: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
.scarf-footnote { font-size: 11px; line-height: 1.5; color: var(--muted); margin: 16px 0 0; }
@media (min-width: 768px) and (max-width: 1099px), (max-width: 399px) {
  .scarf-graphic { padding: 18px; }
  .scarf-items > div { grid-template-columns: 1fr; gap: 6px; }
  .scarf-items dd { padding-left: 42px; }
}

/* Balance the SCARF section and share the progress graphic's paper backdrop. */
.section-with-photo.section-balanced {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.scarf-graphic {
  background: linear-gradient(172deg, #fff 70%, #edf3f9 70.3%, #fcf4e6 100%);
}
@media (max-width: 767px) {
  .section-with-photo.section-balanced { grid-template-columns: 1fr; }
}

/* One shared silhouette keeps all three levels in a continuous pyramid. */
.pyramid-composition {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 16px;
}
.minto-pyramid { display: block; width: 100%; height: auto; }
.minto-explanations { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.minto-explanations li { background: var(--blue-tint); padding: 12px; border-radius: 6px; }
.minto-explanations li:last-child { background: var(--cream); }
.minto-explanations h3 { font-size: 13px; line-height: 1.4; margin: 0 0 5px; }
.minto-explanations p { font-size: 11px; line-height: 1.5; margin: 0; }
@media (max-width: 1099px) {
  .pyramid-composition { grid-template-columns: 1fr; }
  .minto-pyramid { max-width: 360px; margin-inline: auto; }
  .minto-explanations h3 { font-size: 15px; }
  .minto-explanations p { font-size: 13px; }
}

/* Owner-supplied Google review: lightweight text with no external widget. */
.google-review-section { background: var(--blue-tint); }
.google-review-inner {
  display: grid;
  grid-template-columns: minmax(200px, .8fr) minmax(0, 2.2fr);
  align-items: center;
  gap: 48px;
  padding-block: 40px;
}
.google-review-introduction .eyebrow { margin-bottom: 8px; color: var(--blue); }
.google-review-stars {
  display: block;
  color: #9b7026;
  font-size: 24px;
  letter-spacing: 3px;
  line-height: 1.3;
  margin-bottom: 18px;
}
.google-review-introduction .button { font-size: 12px; padding: 10px 16px; min-height: 44px; }
.google-review-quotation { margin: 0; padding-left: 28px; border-left: 2px solid var(--gold); }
.google-review-quotation blockquote { margin: 0; }
.google-review-quotation blockquote p { font-size: 17px; line-height: 1.8; margin: 0; }
.google-review-quotation figcaption { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 12px; line-height: 1.6; }
.google-review-quotation figcaption span { color: var(--muted); }
@media (max-width: 767px) {
  .google-review-inner { grid-template-columns: 1fr; gap: 24px; padding-block: 32px; }
  .google-review-quotation { padding-left: 18px; }
  .google-review-quotation blockquote p { font-size: 15px; }
}

/* Laurel branches frame the review introduction as an understated award. */
.google-review-introduction {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.client-review-award-content { text-align: center; }
.client-review-laurel {
  width: 32px;
  height: 142px;
  flex-shrink: 0;
  color: #a17120;
}
.client-review-laurel-right { transform: scaleX(-1); }
.google-review-introduction .google-review-stars { letter-spacing: 1px; }
.google-review-inner { grid-template-columns: minmax(260px, .9fr) minmax(0, 2.1fr); }
@media(max-width: 767px) {
  .google-review-inner { grid-template-columns: 1fr; }
}

/* Shared provider identification and corporate enquiry context. */
.fundae-provider { display: inline-flex; align-items: center; gap: 9px; color: var(--gold); font-size: 12px; font-weight: 600; line-height: 1.6; }
.fundae-provider > svg { width: 21px; height: 21px; flex: 0 0 21px; }
.site-footer .footer-fundae { margin-top: 22px; }
.service-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 22px; }
.service-hero-actions .fundae-provider { max-width: 235px; }

/* Give the shared desktop header the full viewport, including wider screens. */
@media (min-width: 1100px) {
  .site-header .header-inner {
    width: 100%;
    max-width: none;
    padding-inline: clamp(20px, 2vw, 40px);
    gap: clamp(12px, 1.4vw, 26px);
  }
}

.insights-heading-phrase { white-space: nowrap; }

.article-closing-cta {
  margin-top: 40px;
  text-align: center;
}

/* Subtle frosted glass keeps scrolled content soft and the navigation clear. */
.site-header {
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
@supports not ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
  .site-header { background: rgba(255, 255, 255, .98); }
}

/* Slightly larger desktop navigation, scaled to the available header width. */
@media (min-width: 1100px) {
  .site-header nav > a:not(.button) { font-size: clamp(11px, .95vw, 16px); }
  .header-brand-copy .header-description { font-size: clamp(11px, 1.05vw, 17px); }
}

/* The enquiry form shares the notes' softly textured yellow paper. */
.contact-hero .contact-form-panel {
  position: relative;
  background-color: #fff0be;
  background-image:
    radial-gradient(rgba(110, 85, 30, .035) .55px, transparent .8px),
    repeating-linear-gradient(2deg, rgba(140, 105, 35, .018) 0, rgba(140, 105, 35, .018) 1px, transparent 1px, transparent 4px),
    linear-gradient(165deg, #f7e4aa 0%, #fff0be 45%, #ffedb6 100%);
  background-size: 4px 4px, 100% 100%, 100% 100%;
  border: 0;
  border-radius: 1px 1px 13px 1px;
  box-shadow: 0 3px 5px rgba(0, 15, 35, .14), 8px 18px 30px -10px rgba(0, 15, 35, .3);
}
.contact-hero .contact-form-panel::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 18px;
  background: linear-gradient(rgba(184, 148, 66, .09), transparent);
  pointer-events: none;
}
.contact-hero .contact-form-panel::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 36px;
  height: 36px;
  background: linear-gradient(45deg, #d7b968, #f1d98f 47%, #fff7dd 49%, #f8e7b1 52%, #e8cb7e);
  clip-path: polygon(0 0, 100% 0, 100% 100%);
  pointer-events: none;
}

/* Balance the phone header around a larger logo and a two-line description. */
@media (max-width: 599px) {
  .site-header .header-inner { display: grid; grid-template-columns: clamp(62px, 18vw, 82px) minmax(0, 1fr) auto 40px; gap: clamp(6px, 2vw, 12px); }
  .header-brand-copy { display: contents; }
  .site-header .brand img { width: 100%; height: 72px; }
  .header-brand-copy .header-description { min-width: 0; max-width: none; white-space: normal; flex-shrink: 1; font-size: clamp(10px, 2.95vw, 14px); line-height: 1.5; text-align: center; transform: translateY(6px); }
  .header-description-english, .header-description-detail { display: block; white-space: nowrap; }
  .header-reviews { justify-self: center; transform: translateY(6px); }
  .site-header .menu-toggle { grid-column: 4; justify-self: end; }
}
@media (max-width: 599px) {
  .site-header .header-inner > .brand { grid-column: 1; grid-row: 1; }
  .header-brand-copy .header-description { grid-column: 2; grid-row: 1; order: 0; }
  .header-brand-copy .header-reviews { grid-column: 3; grid-row: 1; order: 0; }
  .site-header .menu-toggle { grid-row: 1; }
}

@media (max-width: 767px) {
  .home-hero .hero-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100%;
  }
  .home-hero .hero-actions .button {
    width: 100%;
    min-width: 0;
    padding-inline: 10px;
    text-align: center;
  }
}

@media (max-width: 767px) {
  .footer-agency-credit { display: block; margin-top: 8px; }
  .footer-credit-separator { display: none; }
}

@media (max-width: 767px) {
  .site-footer .footer-bottom { text-align: center; align-items: center; }
  .site-footer .footer-bottom > span { width: 100%; text-align: center; }
  .site-footer .footer-bottom nav { width: 100%; justify-content: center; }
}

@media (max-width: 767px) {
  .site-footer .footer-brand { text-align: center; }
  .site-footer .footer-brand .brand { margin-inline: auto; }
  .site-footer .footer-brand .fundae-provider { justify-content: center; }
}
@media (max-width: 767px) {
  .site-footer .footer-brand .brand { justify-content: center; }
}

.enquiry-success-dialog { border: 1px solid var(--gold); border-radius: 8px; padding: 36px; width: min(520px, calc(100% - 40px)); max-height: calc(100dvh - 48px); overflow: auto; color: var(--navy); background: var(--white); box-shadow: 0 20px 70px #00224d40; }
.enquiry-success-dialog::backdrop { background: rgba(0, 34, 77, .55); backdrop-filter: blur(3px); }
.enquiry-success-dialog h2 { font-size: 28px; line-height: 1.3; margin: 0 0 16px; }
.enquiry-success-dialog p { margin-bottom: 24px; }
.enquiry-success-dialog form { margin: 0; }

/* Tablets retain the desktop's four equal footer columns. */
@media (min-width: 768px) and (max-width: 1099px) {
  .site-footer .footer-top { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
  .site-footer .footer-top > div { grid-column: auto; padding-inline: 12px; border-left: 1px dotted var(--gold); border-top: 0; }
  .site-footer .footer-top > div:first-child { padding-left: 0; border-left: 0; }
  .site-footer .footer-top > div:last-child { padding-right: 0; }
  .site-footer .footer-brand .brand img { max-width: 100%; height: auto; }
  .site-footer .footer-contact .button { max-width: 100%; padding-inline: 10px; font-size: 12px; white-space: normal; text-align: center; }
  .site-footer .footer-contact .email-link { overflow-wrap: anywhere; }
}

.cookie-settings { font: inherit; color: inherit; background: none; border: 0; padding: 0; text-decoration: underline; text-underline-offset: 5px; cursor: pointer; }
.cookie-banner { position: fixed; z-index: 1000; bottom: 16px; left: 16px; right: 16px; margin: auto; max-width: 1100px; padding: 22px 26px; background: #fff; color: #06254a; border: 1px solid #ccd7e1; border-radius: 8px; box-shadow: 0 6px 35px #00172c33; display: flex; align-items: center; gap: 28px; }
.cookie-banner[hidden], .cookie-settings[hidden] { display: none; }
.cookie-banner p { font-size: 14px; line-height: 1.6; margin: 6px 0 0; }
.cookie-actions { display: flex; gap: 12px; flex-shrink: 0; }
.cookie-actions .button { min-height: 44px; font-size: 14px; padding: 12px 16px; background: #06254a; color: #fff; }
@media (max-width: 767px) { .cookie-banner { padding: 18px; gap: 14px; flex-direction: column; align-items: stretch; max-height: 80vh; overflow: auto; } .cookie-actions .button { flex: 1; } .cookie-actions { flex-wrap: wrap; } }

/* FAQ sequence remains consistent when the desktop columns stack. */
.faq-order-0 { --faq-order: 0; }
.faq-order-1 { --faq-order: 1; }
.faq-order-2 { --faq-order: 2; }
.faq-order-3 { --faq-order: 3; }
.faq-order-4 { --faq-order: 4; }
.faq-order-5 { --faq-order: 5; }
.faq-order-6 { --faq-order: 6; }

@media (max-width: 767px) { .contact-hero .enquiry-form input, .contact-hero .enquiry-form textarea, .contact-hero .form-dropdown-trigger { font-size: 16px; } }

.typing-cursor[hidden] { display: none; }