@charset "UTF-8";
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

body,
h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin-block-end: 0;
}

ul[role=list],
ol[role=list] {
  list-style: none;
}

body {
  min-height: 100vh;
  margin: 0;
  line-height: 1.5;
}

h1, h2, h3, h4,
button, input, label {
  line-height: 1.1;
}

h1, h2, h3, h4 {
  text-wrap: balance;
}

a:not([class]) {
  color: currentColor;
  text-decoration-skip-ink: auto;
}

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

input, button, textarea, select {
  font-family: inherit;
  font-size: inherit;
}

textarea:not([rows]) {
  min-height: 10em;
}

:target {
  scroll-margin-block: 5ex;
}

[hidden]:not([hidden=until-found]) {
  display: none !important;
}

:root {
  --color-background: hsl(240deg 20% 0% / 1);
  --color-body: hsl(240deg 20% 6% / 1);
  --color-text: hsl(240deg 16% 64% / 1);
  --color-text-dimmed: hsl(240deg 16% 36% / 1);
  --color-highlight: hsl(240deg 20% 96% / 1);
  --color-outline: #1818DC;
  --font-primary: 'Switzer-Variable';
  --letter-spacing: -0.01em;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.5rem;
  --display-xs: 1rem;
  --display-sm: 1.125rem;
  --display-md: 1.5rem;
  --display-lg: 2.5rem;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --leading-tight: 1.3;
  --leading-regular: 1.5;
  --article-paragraph-gap: 0.5rem;
  --layout-max-width: 690px;
  --padding-global: 12px;
  --padding-internal: 24px 48px;
  --padding-internal-mobile: 12px 12px;
  --padding-top: 48px;
  --padding-hero: 48px;
  --padding-hero-mobile: 48px 12px;
  --gap-sm: 6px;
  --gap-md: 12px;
  --gap-lg: 24px;
  --gap-xl: 48px;
  --corner-radius-md: 24px;
  --corner-radius-lg: 36px;
  --corner-radius-xl: 48px;
  --blur: 36px;
  --button-background: hsl(240deg 20% 94% / 1);
  --button-background-hover: hsl(240deg 20% 99% / 1);
  --button-background-active: hsl(240deg 20% 88% / 1);
  --button-color: hsl(240deg 20% 2% / 1);
  --button-secondary-background: hsl(240deg 20% 12% / 1);
  --button-secondary-background-hover: hsl(240deg 20% 17% / 1);
  --button-secondary-background-active: hsl(240deg 20% 10% / 1);
  --button-secondary-color: hsl(240deg 20% 96% / 1);
  --button-height-md: 42px;
  --button-height-lg: 56px;
  --button-duration: 160ms;
  --button-easing: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --button-press-scale: 0.97;
  --tag-internal-padding-horizontal: 10px;
  --tag-internal-padding-vertical: 3px;
  --tag-icon-size: 16px;
  --tab-background-active: hsl(240deg 20% 96% / 1);
  --tab-color-active: hsl(240deg 20% 2% / 1);
  --tab-duration: 400ms;
  --tab-easing: cubic-bezier(0.22, 1, 0.36, 1);
  --tab-height: 36px;
  --tab-padding: 0 12px;
  --metric-track: hsl(240deg 20% 18% / 1);
  --metric-fill: hsl(240deg 20% 96% / 1);
  --timeline-axis: 12px;
  --timeline-tooltip-bg: hsl(240deg 20% 94% / 1);
  --timeline-tooltip-text: hsl(240deg 20% 2% / 1);
  --timeline-line: hsl(240deg 20% 18% / 1);
  --timeline-dot: hsl(240deg 16% 64% / 1);
  --timeline-ring: hsl(240deg 20% 18% / 1);
  --timeline-dot-first: hsl(345deg 80% 55% / 1);
  --timeline-ring-first: hsl(345deg 80% 12% / 1);
  --timeline-date-padding: 6px 12px 6px 32px;
  --reveal-duration: 400ms;
  --reveal-stagger: 80ms;
  --reveal-distance: 12px;
  --contact-status-dot: hsla(142deg 100% 55% / 1);
  --contact-status-ring: hsl(142deg 100% 55% / 0.2);
}

/*
 * Switzer Variable — font-weight: 100–900
 * Font family: Switzer | Designed by Jérémie Hornus
 * Source: https://www.fontshare.com/fonts/switzer
 * © 2026 Indian Type Foundry
 *
 * 100 Thin | 200 Extra Light | 300 Light | 400 Regular
 * 500 Medium | 600 Semi Bold | 700 Bold | 800 Extra Bold | 900 Black
 * All intermediate variable weights are supported.
 */
@font-face {
  font-family: "Switzer-Variable";
  src: url("../assets/fonts/Switzer-Variable.woff2") format("woff2"), url("../assets/fonts/Switzer-Variable.woff") format("woff"), url("../assets/fonts/Switzer-Variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: var(--font-primary), sans-serif;
  font-size: var(--text-md);
  font-weight: var(--font-weight-regular);
  line-height: var(--leading-regular);
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-size: var(--display-sm);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
  letter-spacing: var(--letter-spacing);
  color: var(--color-highlight);
}

h1 {
  font-size: var(--display-lg);
}

h2, h3 {
  font-size: var(--display-md);
}

p {
  margin: 0;
  text-wrap: pretty;
}
p strong {
  font-weight: var(--font-weight-medium);
  color: var(--color-highlight);
}

article {
  display: flex;
  flex-direction: column;
  gap: var(--article-paragraph-gap);
}

::selection {
  background: hsla(240, 80%, 60%, 0.6);
  text-shadow: none;
}

html {
  font-size: 16px;
}
@media (max-width: 500px) {
  html {
    font-size: 14px;
  }
}

body {
  min-height: 100vh;
  isolation: isolate;
  background-color: var(--color-background);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: url("../assets/images/background.horizontal.2.sm.jpg") center top no-repeat;
  background-size: 100%;
  transform: scale(var(--background-scale, 1.2));
  transform-origin: center top;
  filter: brightness(var(--background-brightness, 1));
  will-change: transform, filter;
  opacity: 0.8;
}
@media (min-width: 1440px) and (orientation: landscape) {
  body::before {
    background-image: url("../assets/images/background.horizontal.2.lg.jpg");
  }
}
@media (max-width: 500px) {
  body::before {
    display: none;
  }
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}
body {
  text-align: center;
  padding-block: var(--padding-top);
}
@media (max-width: 500px) {
  body {
    padding-block: 0;
  }
}

.page {
  max-width: var(--layout-max-width);
  margin-inline: auto;
  padding: var(--padding-global);
}
.page__inner {
  position: relative;
  overflow: hidden;
  background-color: var(--color-body);
  border-radius: calc(var(--corner-radius-lg) - var(--padding-global));
}
.page__inner::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.2;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.page__inner > section {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  gap: var(--gap-md);
  padding: var(--padding-internal);
  padding-bottom: var(--gap-lg);
}
.page .socials {
  flex-direction: row;
}
.page .bio .button {
  width: 100%;
  margin: 12px 0;
}
@media (max-width: 500px) {
  .page {
    padding: 0;
    background: none;
    border-radius: 0;
  }
  .page::before {
    display: none;
  }
  .page__inner {
    border-radius: 0;
  }
  .page__inner::before {
    display: none;
  }
  .page__inner > section {
    padding: var(--padding-internal-mobile);
    padding-bottom: var(--gap-lg);
  }
}

.hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  gap: var(--gap-lg);
  padding: var(--padding-hero);
  background-image: url("../assets/images/hero.lg.jpg");
  background-size: 100% 100%;
}
.hero__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  gap: var(--gap-sm);
}
.hero__content h1 {
  font-size: var(--display-md);
}
.hero__content h2 {
  font-size: var(--display-lg);
}
@media (max-width: 500px) {
  .hero {
    padding: var(--padding-hero-mobile);
  }
}

.avatar {
  width: 72px;
  height: 72px;
  margin-inline: auto;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--corner-radius-xl);
  corner-shape: superellipse(1.5);
}
.avatar img {
  display: block;
  width: 100%;
  height: 100%;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-sm);
  height: var(--button-height-md);
  padding-inline: calc(var(--button-height-md) / 2);
  border: 0;
  border-radius: 9999px;
  background-color: var(--button-background);
  color: var(--button-color);
  font: inherit;
  font-weight: var(--font-weight-semibold);
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: background-color var(--button-duration) var(--button-easing), transform var(--button-duration) var(--button-easing);
}
.button:hover:not(:disabled) {
  background-color: var(--button-background-hover);
}
.button:active:not(:disabled) {
  background-color: var(--button-background-active);
  transform: scale(var(--button-press-scale));
}
.button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.button--large {
  height: var(--button-height-lg);
  font-size: var(--text-lg);
}
.button--secondary {
  position: relative;
  background-color: var(--button-secondary-background);
  color: var(--button-secondary-color);
}
.button--secondary::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.12;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.button--secondary:hover:not(:disabled) {
  background-color: var(--button-secondary-background-hover);
}
.button--secondary:active:not(:disabled) {
  background-color: var(--button-secondary-background-active);
}
.button--icon {
  position: relative;
  width: var(--button-height-md);
  padding: 0;
  border-radius: var(--corner-radius-lg);
  corner-shape: superellipse(1.5);
}
.button--icon.button--large {
  width: var(--button-height-lg);
}
.button--icon[data-icon]::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: center/45% no-repeat;
  opacity: 0.9;
  transition: opacity var(--button-duration) var(--button-easing);
}
.button--icon:hover:not(:disabled)::after {
  opacity: 1;
}
.button--icon[data-icon=linkedin]::after {
  background-image: url("../assets/images/linkedin.svg");
}
.button--icon[data-icon=signal]::after {
  background-image: url("../assets/images/signal.svg");
}
.button--icon[data-icon=whatsapp]::after {
  background-image: url("../assets/images/whatsapp.svg");
}
@media (prefers-reduced-motion: reduce) {
  .button {
    transition: none;
  }
  .button:active {
    transform: none;
  }
  .button--icon[data-icon]::after {
    transition: none;
  }
}

.tags {
  display: flex;
  align-items: center;
  justify-content: center;
  align-content: center;
  align-self: stretch;
  flex-wrap: wrap;
  gap: var(--gap-sm);
  margin: 1em 0;
  padding: var(--padding-global) 0;
  list-style: none;
}
@media (max-width: 500px) {
  .tags {
    padding: 0;
  }
}
.tags__item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-sm);
  padding: var(--tag-internal-padding-vertical) var(--tag-internal-padding-horizontal);
  border-radius: 9999px;
  background-color: var(--button-secondary-background);
  font-size: var(--text-sm);
  white-space: nowrap;
}
.tags__item::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.12;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.tags__item[data-icon] {
  padding-left: calc(var(--tag-internal-padding-horizontal) + var(--tag-icon-size) + var(--gap-sm));
}
.tags__item[data-icon]::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--tag-internal-padding-horizontal);
  width: var(--tag-icon-size);
  pointer-events: none;
  background: center/contain no-repeat;
}
.tags__item[data-icon=lightbulb]::after {
  background-image: url("../assets/images/lightbulb.svg");
}
.tags__item[data-icon=bullhorn]::after {
  background-image: url("../assets/images/bullhorn.svg");
}
.tags__item[data-icon=puzzle]::after {
  background-image: url("../assets/images/puzzle.svg");
}
.tags__item[data-icon=paintbrush]::after {
  background-image: url("../assets/images/paintbrush.svg");
}

.tabs {
  width: calc(100% + 24px);
  min-width: 0;
  margin-inline: -12px;
  padding: 0 0 var(--gap-md);
}
.tabs__list {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2px;
  width: fit-content;
  max-width: 100%;
  min-width: 0;
  margin: var(--gap-lg) auto;
  padding: 4px 12px;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.tabs__list::-webkit-scrollbar {
  display: none;
}
@media (max-width: 500px) {
  .tabs__list {
    width: 100%;
    margin-block: var(--gap-md);
  }
}
.tabs__indicator {
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 0;
  z-index: 0;
  width: var(--indicator-width, 0px);
  transform: translateX(var(--indicator-x, 0px));
  border-radius: 999px;
  background-color: var(--tab-background-active);
  opacity: 0;
  pointer-events: none;
  transition: transform var(--tab-duration) var(--tab-easing), width var(--tab-duration) var(--tab-easing), opacity 400ms ease;
}
.tabs__list.is-ready .tabs__indicator {
  opacity: 1;
}
.tabs__tab {
  position: relative;
  z-index: 1;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: var(--gap-sm);
  height: var(--tab-height);
  padding: var(--tab-padding);
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--color-text);
  font: inherit;
  font-weight: var(--font-weight-medium);
  white-space: nowrap;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color var(--tab-duration) ease;
}
.tabs__tab.is-highlighted {
  color: var(--tab-color-active);
}
.tabs__content {
  margin-inline: 12px;
  padding-top: var(--gap-md);
}
.tabs__panel {
  border-radius: var(--corner-radius-md);
}
.tabs__panel article h3 {
  margin-bottom: var(--gap-md);
  font-size: var(--display-sm);
}
.tabs__panel article img {
  display: block;
}
@media (max-width: 500px) {
  .tabs__panel article h3 {
    margin-bottom: var(--gap-sm);
  }
}
.tabs__panel[hidden] {
  display: none;
}
.tabs__panel:not([hidden]) {
  animation: tab-reveal 400ms ease both;
}
.tabs__image {
  position: relative;
  overflow: hidden;
  margin: 0 0 var(--gap-lg);
  padding: 0;
  border-radius: var(--corner-radius-md);
}
.tabs__image::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.12;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
@media (max-width: 500px) {
  .tabs__image {
    margin-bottom: var(--gap-md);
  }
}
@media (prefers-reduced-motion: reduce) {
  .tabs__indicator, .tabs__tab {
    transition: none;
  }
  .tabs__panel:not([hidden]) {
    animation: none;
  }
}

@keyframes tab-reveal {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--gap-xl);
}
.metrics__heading {
  margin: var(--gap-md) 0 var(--gap-lg);
  font-size: var(--display-xs);
}
.metrics__list {
  display: grid;
  gap: var(--gap-lg);
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 500px) {
  .metrics {
    grid-template-columns: 1fr;
    gap: var(--gap-lg);
    width: 100%;
    padding-inline: var(--gap-md);
  }
}

.metric__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--gap-md);
  margin-bottom: 10px;
  font-size: var(--text-sm);
}
.metric__header span:last-child {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  transition: opacity 120ms ease-out, transform 120ms ease-out;
}
.metric.is-pending .metric__header span:last-child {
  opacity: 0;
  transform: translateY(4px);
}
.metric progress {
  display: block;
  appearance: none;
  width: 100%;
  height: 4px;
  overflow: hidden;
  border: 0;
  border-radius: 999px;
  background-color: var(--metric-track);
  color: var(--metric-fill);
}
.metric progress::-webkit-progress-bar {
  background-color: var(--metric-track);
  border-radius: inherit;
}
.metric progress::-webkit-progress-value {
  background-color: var(--metric-fill);
  border-radius: inherit;
}
.metric progress::-moz-progress-bar {
  background-color: var(--metric-fill);
  border-radius: inherit;
}

.timeline {
  position: relative;
  display: grid;
  gap: var(--gap-lg);
  margin: 0;
  padding: var(--gap-lg) 0;
  list-style: none;
}
.timeline::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--timeline-axis) - 1px);
  width: 2px;
  background-color: var(--timeline-line);
  pointer-events: none;
  background: linear-gradient(to bottom, hsl(240, 20%, 6%) 0, var(--timeline-line) 24px, var(--timeline-line) calc(100% - 24px), hsl(240, 20%, 6%) 100%);
}
.timeline__item {
  position: relative;
  min-width: 0;
  padding-left: var(--gap-xl);
  text-align: left;
}
.timeline__item::before {
  content: "";
  position: absolute;
  top: 2px;
  left: calc(var(--timeline-axis) - 8px);
  z-index: 1;
  width: 16px;
  height: 16px;
  border: 6px solid var(--timeline-ring);
  border-radius: 50%;
  background-color: var(--timeline-dot);
}
.timeline__item:first-child::before {
  top: 8px;
  left: calc(var(--timeline-axis) - 2px);
  z-index: 2;
  width: 4px;
  height: 4px;
  border: 0;
  background-color: var(--timeline-dot-first);
}
.timeline__item:first-child::after {
  content: "";
  position: absolute;
  top: 2px;
  left: calc(var(--timeline-axis) - 8px);
  z-index: 1;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 6px solid var(--timeline-ring-first);
  border-radius: 50%;
  pointer-events: none;
  transform-origin: center;
  animation: timeline-pulse 2.4s linear infinite;
}
@media (max-width: 500px) {
  .timeline__item {
    padding-left: calc(var(--gap-lg) + var(--gap-md));
  }
}
.timeline__role {
  margin: 0;
  font-size: var(--display-sm);
}
.timeline__company {
  margin: var(--gap-sm) 0;
  font-size: var(--text-sm);
  font-weight: var(--font-weight-medium);
}
.timeline__summary {
  font-size: var(--text-sm);
  overflow-wrap: break-word;
}
.timeline__more {
  display: inline;
  padding: 0;
  border: 0;
  background: none;
  color: var(--color-highlight);
  font: inherit;
  font-weight: var(--font-weight-medium);
  text-decoration: none;
  border-radius: 2px;
  cursor: pointer;
}
.timeline__more[hidden] {
  display: none;
}
.timeline__more:hover {
  opacity: 0.7;
}
.timeline__date-wrap {
  position: relative;
  display: inline-flex;
  margin-top: var(--gap-md);
}
.timeline__date {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--timeline-date-padding);
  border: 0;
  border-radius: 9999px;
  background-color: var(--button-secondary-background);
  color: var(--color-text);
  font-size: var(--text-sm);
  white-space: nowrap;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color 160ms ease, transform 160ms ease;
}
.timeline__date:hover, .timeline__date[aria-expanded=true] {
  background-color: var(--button-secondary-background-hover);
}
.timeline__date:active {
  transform: scale(0.97);
}
.timeline__date::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.12;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.timeline__date::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: var(--tag-internal-padding-horizontal);
  width: var(--tag-icon-size);
  pointer-events: none;
  background: url("../assets/images/calendar.svg") center/contain no-repeat;
}
.timeline__tooltip {
  position: absolute;
  bottom: calc(100% + 12px);
  left: 50%;
  z-index: 10;
  width: max-content;
  max-width: calc(100vw - 24px);
  padding: 8px 12px;
  border-radius: 8px;
  background-color: var(--timeline-tooltip-bg);
  color: var(--timeline-tooltip-text);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.4;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate(-50%, 4px);
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms;
}
.timeline__tooltip::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  border: 6px solid transparent;
  border-top-color: var(--timeline-tooltip-bg);
  transform: translateX(-50%);
}
.timeline__date-wrap.is-open .timeline__tooltip {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
@media (prefers-reduced-motion: reduce) {
  .timeline__date, .timeline__tooltip {
    transition: none;
  }
}

@keyframes timeline-pulse {
  0% {
    transform: scale(0.25);
    opacity: 1;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
  80%, 100% {
    transform: scale(1.8);
    opacity: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .timeline__item:first-child::after {
    animation: none;
    transform: scale(1);
    opacity: 1;
  }
}
.testimonials {
  width: 100%;
}
.testimonials__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--gap-lg);
  width: 100%;
  margin: var(--gap-md) 0 0;
  padding: 0;
  list-style: none;
}
.testimonials__item {
  min-width: 0;
}
.testimonials__actions {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: var(--gap-lg);
}
@media (max-width: 500px) {
  .testimonials__grid {
    grid-template-columns: 1fr;
  }
}

.testimonial {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--gap-lg);
  height: 100%;
  margin: 0;
  padding: var(--gap-lg);
  border-radius: var(--corner-radius-md);
  background-color: var(--button-secondary-background);
  text-align: left;
}
.testimonial::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.12;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.testimonial__quote {
  flex: 1;
  margin: 0;
  color: var(--color-highlight);
  font-size: var(--text-md);
  font-weight: var(--font-weight-regular);
  line-height: var(--leading-regular);
}
.testimonial__quote p {
  margin: 0;
}
.testimonial__author {
  display: flex;
  align-items: center;
  gap: var(--gap-md);
  min-width: 0;
  margin-top: auto;
}
.testimonial__avatar {
  display: block;
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: var(--corner-radius-xl);
  corner-shape: superellipse(1.5);
  object-fit: cover;
}
.testimonial__identity {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.testimonial__name {
  color: var(--color-highlight);
  font-size: var(--text-md);
  font-weight: var(--font-weight-semibold);
  line-height: var(--leading-tight);
}
.testimonial__position {
  color: var(--color-text);
  font-size: var(--text-sm);
  line-height: var(--leading-tight);
}

.contact__booking {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--gap-md);
  max-width: 100%;
  margin-block: var(--gap-md);
}
.contact__button {
  width: fit-content;
  max-width: 100%;
  height: auto;
  gap: var(--gap-md);
  padding: 8px 20px 8px 8px;
}
.contact__avatar {
  display: block;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}
.contact__arrow {
  display: block;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}
.contact__availability {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--gap-md);
  margin: 0;
  color: var(--color-text);
  font-size: var(--text-sm);
}
.contact__status {
  position: relative;
  display: inline-block;
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--contact-status-dot);
}
.contact__status::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  border: 6px solid var(--contact-status-ring);
  border-radius: 50%;
  translate: -50% -50%;
  pointer-events: none;
  animation: timeline-pulse 2.4s linear infinite;
}
.contact__closing a {
  color: var(--color-highlight);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
}
.contact__closing a:hover {
  text-decoration: none;
}
.contact__reveal {
  display: inline-block;
  padding: 0;
  border: 0;
  border-radius: 2px;
  background: none;
  color: var(--button-background);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
  cursor: pointer;
  transition: color var(--button-duration) var(--button-easing), transform var(--button-duration) var(--button-easing);
}
.contact__reveal:hover {
  color: var(--button-background-hover);
  text-decoration: none;
}
.contact__reveal:active {
  color: var(--button-background-active);
  transform: scale(var(--button-press-scale));
}
@media (prefers-reduced-motion: reduce) {
  .contact__reveal {
    transition: none;
  }
  .contact__reveal:active {
    transform: none;
  }
}
@media (max-width: 500px) {
  .contact__button {
    min-height: 56px;
    gap: var(--gap-sm);
    padding: 8px 14px 8px 8px;
    font-size: var(--text-md);
  }
  .contact__avatar {
    width: 40px;
    height: 40px;
  }
  .contact__arrow {
    width: 18px;
    height: 18px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .contact__status::after {
    animation: none;
    transform: scale(1);
    opacity: 1;
  }
}

.footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-md);
  width: 100%;
  max-width: var(--layout-max-width);
  margin: var(--gap-lg) auto 0;
  padding: var(--gap-lg) var(--gap-md);
  color: var(--color-text-dimmed);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-medium);
}
.footer__copyright {
  font-size: inherit;
}
.footer__top {
  display: inline-flex;
  align-items: center;
  gap: var(--gap-sm);
  color: inherit;
  text-decoration: none;
  border-radius: 2px;
  transition: color var(--button-duration, 160ms) var(--button-easing, ease), transform var(--button-duration, 160ms) var(--button-easing, ease);
}
.footer__top:hover {
  color: var(--color-highlight);
}
.footer__top:active {
  transform: scale(var(--button-press-scale, 0.97));
}
@media (max-width: 500px) {
  .footer {
    flex-direction: column;
    gap: var(--gap-sm);
    text-align: center;
  }
}
@media (prefers-reduced-motion: reduce) {
  .footer__top {
    transition: none;
  }
  .footer__top:active {
    transform: none;
  }
}

.glass {
  position: relative;
  background: rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  border-radius: var(--corner-radius-lg);
}
.glass::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.25;
  pointer-events: none;
  border: 1px solid transparent;
  border-radius: inherit;
  corner-shape: inherit;
  background: linear-gradient(180deg, #f3f3f7 0%, #52527a 100%) border-box;
  -webkit-mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  mask: linear-gradient(#fff, #fff) padding-box, linear-gradient(#fff, #fff);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

[data-reveal].has-reveal .reveal-item {
  opacity: 0;
  transform: translateY(var(--reveal-distance));
}
[data-reveal].has-reveal.is-visible .reveal-item {
  animation: reveal-up var(--reveal-duration) ease both;
  animation-delay: calc(var(--reveal-index, 0) * var(--reveal-stagger));
}

@keyframes reveal-up {
  from {
    opacity: 0;
    transform: translateY(var(--reveal-distance));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal].has-reveal .reveal-item {
    opacity: 1;
    transform: none;
    animation: none;
  }
}
:focus-visible {
  outline: 2px solid var(--color-outline);
  outline-offset: 2px;
}