/* ==========================================================================
   MVMNT-X — shared styles
   Colors and type pulled directly from the Figma draft:
   https://www.figma.com/design/JVnNhyJjTZlRpF69jzYCIN
   ========================================================================== */

:root {
  --cream: #faf6ea;
  --ink: #252523;
  --teal: #01654b;
  --olive: #3d5021;
  --salmon: #f3bba1;
  --tan: #8f7d5a;
  --tan-input: #223320;

  --page-max: 1160px;
  --nav-h: 110px;

  --font: 'Montserrat', sans-serif;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font);
  background: var(--cream);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}

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

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

.page {
  max-width: var(--page-max);
  margin: 0 auto;
  background: var(--cream);
  position: relative;
  overflow: hidden;
}

.full-bleed {
  width: 100%;
}

/* ---------- Navbar ---------- */

.navbar {
  max-width: var(--page-max);
  margin: 0 auto;
  height: var(--nav-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(20px, 2.5vw, 44px);
  background: var(--cream);
  position: relative;
  z-index: 40;
}

.nav-logo {
  font-family: var(--font);
  font-weight: 800;
  font-size: clamp(28px, 3.6vw, 42px);
  color: var(--ink);
  letter-spacing: -0.01em;
  cursor: pointer;
}

.nav-right {
  display: flex;
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
}

.nav-links {
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 48px);
}

.nav-links a {
  font-weight: 300;
  font-size: 21px;
  color: var(--teal);
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.nav-links a:hover { opacity: 0.7; }

.nav-links a.active {
  color: var(--ink);
}

.nav-contact-btn {
  background: var(--ink);
  color: var(--cream);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.03em;
  border: none;
  border-radius: 6px;
  padding: 15px 22px;
  cursor: pointer;
  font-family: var(--font);
  white-space: nowrap;
  display: inline-block;
  text-align: center;
  text-decoration: none;
}

.nav-contact-btn:hover { opacity: 0.85; }

.nav-toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 10px;
  flex-direction: column;
  gap: 5px;
}

.nav-toggle span {
  display: block;
  width: 26px;
  height: 3px;
  border-radius: 20px;
  background: var(--olive);
}

/* ---------- Mobile drawer ---------- */

.nav-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: min(320px, 80vw);
  background: var(--cream);
  z-index: 100;
  box-shadow: -8px 0 24px rgba(0,0,0,0.15);
  transform: translateX(100%);
  transition: transform 0.28s ease;
  display: flex;
  flex-direction: column;
  padding: 20px 28px;
}

.nav-drawer.open { transform: translateX(0); }

.nav-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(61,80,33,0.3);
  margin-bottom: 24px;
}

.nav-drawer-logo {
  font-weight: 800;
  font-size: 22px;
  color: var(--ink);
}

.nav-drawer-close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--olive);
  font-size: 26px;
  line-height: 1;
  padding: 4px;
}

.nav-drawer a {
  font-weight: 300;
  font-size: 20px;
  color: var(--olive);
  padding: 16px 0;
}

.nav-drawer a.active { color: var(--ink); }

.nav-drawer .nav-contact-btn {
  margin-top: 12px;
  align-self: flex-start;
  padding: 14px 24px;
}

.nav-scrim {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.3);
  z-index: 90;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}

.nav-scrim.open {
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 900px) {
  .nav-right { display: none; }
  .nav-toggle { display: flex; }
}

/* ---------- Footer ---------- */

.site-footer {
  margin-top: 80px;
  padding: 40px clamp(20px, 4vw, 60px) 60px;
  text-align: center;
  font-size: 13px;
  color: var(--teal);
  opacity: 0.8;
}

/* ---------- Utility ---------- */

.eyebrow {
  font-weight: 500;
  font-size: clamp(28px, 3.4vw, 46px);
  color: var(--olive);
}

.section {
  padding: clamp(50px, 8vw, 110px) clamp(20px, 4vw, 60px);
}

/* ==========================================================================
   @mvmnt-x/ui component layer (mvx- prefixed) — ported from the Claude
   Design prototype "MVMNT-X website polish". Additive: old classes above
   are kept as-is for contact.html, these are used by the 4 redesigned pages.
   ========================================================================== */

:root {
  --mvx-cream: var(--cream);
  --mvx-ink: var(--ink);
  --mvx-teal: var(--teal);
  --mvx-olive: var(--olive);
  --mvx-salmon: var(--salmon);
  --mvx-tan: var(--tan);
  --mvx-tan-input: var(--tan-input);
  --mvx-font: var(--font);
}

.mvx-reset, .mvx-reset * { box-sizing: border-box; }

/* ---------- Navbar ---------- */

.mvx-navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 110px;
  padding: 0 clamp(20px, 2.5vw, 44px);
  background: var(--mvx-cream);
  font-family: var(--mvx-font);
  position: relative;
}

.mvx-navbar__logo {
  font-family: var(--mvx-font);
  font-weight: 800;
  font-size: clamp(28px, 3.6vw, 42px);
  color: var(--mvx-ink);
  letter-spacing: -0.01em;
  text-decoration: none;
  cursor: pointer;
  border: none;
  background: none;
  padding: 0;
}

.mvx-navbar__right {
  display: flex;
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
}

.mvx-navbar__links {
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 48px);
}

.mvx-navbar__links a {
  font-family: var(--mvx-font);
  font-weight: 300;
  font-size: 21px;
  color: var(--mvx-teal);
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.mvx-navbar__links a:hover { opacity: 0.7; }
.mvx-navbar__links a[aria-current="page"] { color: var(--mvx-ink); }

.mvx-navbar__toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 10px;
  flex-direction: column;
  gap: 5px;
}

.mvx-navbar__toggle span {
  display: block;
  width: 26px;
  height: 3px;
  border-radius: 20px;
  background: var(--mvx-olive);
}

@media (max-width: 900px) {
  .mvx-navbar__right { display: none; }
  .mvx-navbar__toggle { display: flex; }
}

.mvx-drawer {
  position: fixed;
  top: 0;
  right: 0;
  height: 100%;
  width: min(320px, 80vw);
  background: var(--mvx-cream);
  z-index: 100;
  box-shadow: -8px 0 24px rgba(0,0,0,0.15);
  transform: translateX(100%);
  transition: transform 0.28s ease;
  display: flex;
  flex-direction: column;
  padding: 20px 28px;
  font-family: var(--mvx-font);
}

.mvx-drawer[data-open="true"] { transform: translateX(0); }

.mvx-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(61,80,33,0.3);
  margin-bottom: 24px;
}

.mvx-drawer__logo { font-weight: 800; font-size: 22px; color: var(--mvx-ink); }

.mvx-drawer__close {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--mvx-olive);
  font-size: 26px;
  line-height: 1;
  padding: 4px;
}

.mvx-drawer a {
  font-family: var(--mvx-font);
  font-weight: 300;
  font-size: 20px;
  color: var(--mvx-olive);
  text-decoration: none;
  padding: 16px 0;
}

.mvx-drawer a[aria-current="page"] { color: var(--mvx-ink); }

.mvx-scrim {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.3);
  z-index: 90;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.28s ease;
}

.mvx-scrim[data-open="true"] { opacity: 1; pointer-events: auto; }

/* ---------- Button ---------- */

.mvx-button {
  display: inline-block;
  font-family: var(--mvx-font);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.03em;
  border: none;
  border-radius: 6px;
  padding: 15px 22px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

.mvx-button--primary {
  background: var(--mvx-ink);
  color: var(--mvx-cream);
}

.mvx-button--primary:hover { opacity: 0.85; }

/* ---------- Hero banner ---------- */

.mvx-hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  font-family: var(--mvx-font);
}

.mvx-hero img { width: 100%; height: 100%; object-fit: cover; display: block; }

.mvx-hero__heading {
  position: absolute;
  left: clamp(20px, 4vw, 44px);
  bottom: clamp(24px, 6vw, 60px);
  right: 20px;
  margin: 0;
  font-weight: 500;
  font-size: clamp(28px, 5vw, 56px);
  color: #fff;
  text-shadow: 0 4px 4px rgba(0,0,0,0.7);
}

.mvx-hero__heading em {
  color: var(--mvx-salmon);
  font-style: normal;
}

/* ---------- Section heading ---------- */

.mvx-heading {
  font-family: var(--mvx-font);
  font-weight: 500;
  margin: 0;
}

.mvx-heading--olive { color: var(--mvx-olive); }
.mvx-heading--ink { color: var(--mvx-ink); }

.mvx-heading--sm { font-size: clamp(24px, 3vw, 32px); }
.mvx-heading--md { font-size: clamp(30px, 4vw, 50px); }
.mvx-heading--lg { font-size: clamp(36px, 6vw, 72px); }

.mvx-heading--center { text-align: center; }

/* ---------- Image/text row ---------- */

.mvx-image-text-row {
  display: flex;
  align-items: center;
  gap: clamp(24px, 4vw, 56px);
  flex-wrap: wrap;
  font-family: var(--mvx-font);
}

.mvx-image-text-row--reverse { flex-direction: row-reverse; }

.mvx-image-text-row__image {
  flex: 1 1 380px;
  max-width: 560px;
  border-radius: 12px;
  object-fit: cover;
  width: 100%;
}

.mvx-image-text-row__text {
  flex: 1 1 320px;
  text-align: center;
  margin: 0;
  line-height: 1.4;
}

.mvx-image-text-row__text--italic {
  font-style: italic;
  font-weight: 400;
  color: var(--mvx-teal);
  font-size: clamp(18px, 2vw, 23px);
}

.mvx-image-text-row__text--bold {
  font-weight: 500;
  color: var(--mvx-ink);
  font-size: clamp(24px, 3.4vw, 42px);
  line-height: 1.25;
}

/* ---------- Media card ---------- */

.mvx-media-card {
  text-align: center;
  font-family: var(--mvx-font);
}

.mvx-media-card__image, .mvx-media-card__placeholder {
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 10px;
  margin-bottom: 18px;
  object-fit: cover;
}

.mvx-media-card__placeholder {
  border: 2px dashed rgba(61,80,33,0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mvx-olive);
  opacity: 0.5;
  font-size: 14px;
}

.mvx-media-card__label {
  font-weight: 300;
  font-size: clamp(20px, 2.4vw, 32px);
  color: var(--mvx-ink);
  margin: 0;
}

/* ---------- Partner card ---------- */

.mvx-partner-card {
  background: #fff;
  border-radius: 8px;
  padding: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
}

.mvx-partner-card img { max-width: 100%; max-height: 180px; object-fit: contain; }

/* ---------- Contact form ---------- */

.mvx-contact-form {
  max-width: 920px;
  background: var(--mvx-tan);
  border-radius: 18px;
  padding: clamp(24px, 4vw, 44px) clamp(24px, 5vw, 56px);
  position: relative;
  color: #fff;
  font-family: var(--mvx-font);
}

.mvx-contact-form__based {
  position: absolute;
  top: clamp(16px, 3vw, 28px);
  right: clamp(24px, 5vw, 56px);
  font-style: italic;
  font-weight: 700;
  font-size: 14px;
}

.mvx-contact-form__top {
  display: flex;
  align-items: center;
  gap: clamp(24px, 4vw, 50px);
  flex-wrap: wrap;
  padding-bottom: clamp(20px, 3vw, 32px);
  margin-bottom: clamp(20px, 3vw, 32px);
  border-bottom: 1px solid rgba(255,255,255,0.25);
}

.mvx-contact-form__col { display: flex; flex-direction: column; gap: 8px; }
.mvx-contact-form__label { font-weight: 600; font-size: 15px; letter-spacing: 0.04em; }
.mvx-contact-form__sub { font-weight: 500; font-size: 15px; }
.mvx-contact-form__sub a { color: #fff; text-decoration: underline; }

.mvx-contact-form__linkedin {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 15px;
  color: #fff;
  text-decoration: underline;
}
.mvx-contact-form__linkedin img { width: 24px; height: 24px; border-radius: 4px; }

.mvx-contact-form__send { font-weight: 600; font-size: 18px; margin: 0 0 18px; }

.mvx-contact-form__row {
  display: flex;
  gap: clamp(14px, 2vw, 24px);
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.mvx-field { flex: 1 1 180px; display: flex; flex-direction: column; gap: 6px; }
.mvx-field--grow { flex: 1 1 220px; }
.mvx-field--full { flex: 1 1 100%; margin-bottom: 18px; }
.mvx-field label { font-style: italic; font-weight: 700; font-size: 13px; }

.mvx-field input, .mvx-field textarea {
  background: var(--mvx-tan-input);
  border: none;
  border-radius: 6px;
  padding: 12px 14px;
  color: #fff;
  font-family: var(--mvx-font);
  font-size: 14px;
}
.mvx-field textarea { resize: vertical; }
.mvx-field input::placeholder, .mvx-field textarea::placeholder { color: rgba(255,255,255,0.5); }
.mvx-field input:focus, .mvx-field textarea:focus { outline: 2px solid rgba(255,255,255,0.6); }

.mvx-contact-form__status {
  font-size: 14px;
  font-weight: 500;
  margin: 12px 0 0;
  min-height: 18px;
}

/* ---------- Footer ---------- */

.mvx-footer {
  padding: 40px clamp(20px, 4vw, 60px) 60px;
  text-align: center;
  font-family: var(--mvx-font);
  font-size: 13px;
  color: var(--mvx-teal);
  opacity: 0.8;
}

/* ==========================================================================
   Page layer — ported verbatim from the prototype's site.css
   ========================================================================== */

body{margin:0;background:var(--mvx-cream);font-family:var(--mvx-font)}
.mvx-page{display:flex;flex-direction:column;min-height:100vh}
.mvx-container{width:100%;max-width:1100px;margin:0 auto;padding:0 40px;box-sizing:border-box}
.mvx-section{padding:96px 0}
.mvx-section--tight{padding:64px 0}
.mvx-stack{display:flex;flex-direction:column;gap:88px}
.mvx-copy{font-size:20px;line-height:1.5}
.mvx-copy p{margin:0 0 20px}
.mvx-copy p:last-child{margin-bottom:0}
.mvx-media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;max-width:1000px;margin:0 auto}
.mvx-partner-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:960px;margin:0 auto}
.mvx-marquee{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mvx-marquee__track{display:flex;align-items:center;gap:96px;width:max-content;animation:mvx-marquee 24s linear infinite}
.mvx-marquee__logo{height:120px;width:auto;object-fit:contain;background:transparent;flex:none}
.mvx-marquee__logo--lg{height:180px}
.mvx-marquee__logo--1-35x{height:162px}
.mvx-tech-heading{position:relative;width:100%;text-align:center}
.mvx-tech-heading em{color:var(--mvx-salmon);font-style:normal}
.mvx-tw-char{opacity:0;transition:opacity .25s ease}
.mvx-tw-char.is-visible{opacity:1}
.mvx-hero-center .mvx-hero__heading{left:20px;right:20px;bottom:50%;transform:translateY(50%);text-align:center}
.mvx-marquee:hover .mvx-marquee__track{animation-play-state:paused}
@keyframes mvx-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mvx-contact-wrap{display:flex;justify-content:center}
.mvx-caption{text-align:center;color:var(--mvx-teal);font-size:14px;letter-spacing:.04em;text-transform:uppercase;margin-top:16px}
.mvx-chart-figure{margin:0;text-align:center}
.mvx-chart-figure img{width:100%;max-width:820px;border-radius:12px}
.mvx-chart-plot{position:relative;display:inline-block;width:100%;max-width:720px}
.mvx-caption__source{display:block;margin-top:6px;font-size:12px;letter-spacing:.02em;text-transform:none;color:var(--mvx-ink);opacity:.6}
.mvx-group{transition:opacity .25s ease}
.mvx-tip{position:absolute;transform:translate(-50%,calc(-100% - 14px));background:var(--mvx-ink);color:var(--mvx-cream);padding:12px 14px;display:flex;flex-direction:column;gap:3px;font-size:13px;line-height:1.35;text-align:left;white-space:nowrap;pointer-events:none;z-index:2}
.mvx-tip__title{font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:3px}
.mvx-tip__row b{font-weight:600}
.mvx-chart-figure svg{width:100%;max-width:720px;height:auto;background:var(--mvx-cream)}
.mvx-image-text-row{flex-wrap:nowrap !important}
.mvx-image-text-row__image,.mvx-media-card__image,.mvx-chart-figure img,.mvx-hero__image,.mvx-partner-card,.mvx-contact-form__linkedin img{border-radius:0 !important}
@media (max-width:900px){
.mvx-container{padding:0 24px}
.mvx-section{padding:64px 0}
.mvx-media-grid,.mvx-partner-grid{grid-template-columns:1fr}
.mvx-image-text-row{flex-wrap:wrap !important}
}
a{color:var(--mvx-teal)}
a:hover{color:var(--mvx-olive)}
.mvx-navbar__right{display:none !important}
.mvx-navbar__toggle{display:flex !important;position:fixed;top:24px;right:40px;z-index:1000}
.mvx-drawer[data-open="true"] ~ .mvx-navbar__toggle,.mvx-navbar:has(+ .mvx-drawer[data-open="true"]) .mvx-navbar__toggle{opacity:0;pointer-events:none}
.mvx-flip-card-wrap{text-align:center;font-family:var(--mvx-font)}
.mvx-flip-card{perspective:1200px;aspect-ratio:1/1;cursor:pointer;transition:transform .3s ease}
.mvx-flip-card:hover{transform:translateY(-10px)}
.mvx-flip-card:hover .mvx-flip-card__front{box-shadow:0 24px 40px rgba(0,0,0,.35)}
.mvx-flip-card__inner{position:relative;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,.2,.2,1);transform-style:preserve-3d}
.mvx-flip-card__inner.is-flipped{transform:rotateY(180deg)}
.mvx-flip-card__face{position:absolute;inset:0;backface-visibility:hidden;display:flex;flex-direction:column;overflow:hidden}
.mvx-flip-card__image{width:100%;height:100%;object-fit:cover;display:block}
.mvx-flip-card__back{transform:rotateY(180deg);background:var(--mvx-olive);color:var(--mvx-cream);align-items:center;justify-content:center;padding:28px;box-sizing:border-box;text-align:center;font-family:var(--mvx-font);font-size:16px;line-height:1.5}
.mvx-drawer__contact,.mvx-navbar__right .mvx-button--primary{color:#fff !important}
.mvx-drawer__logo{cursor:pointer}
.mvx-intro-section{position:relative;overflow:hidden;padding-top:96px;padding-bottom:230px}
.mvx-creeper{position:absolute;top:0;right:0;left:auto;width:52%;height:1560px;z-index:0;pointer-events:none;overflow:visible}
.mvx-vine{color:var(--mvx-olive)}
.mvx-vine--thin{color:var(--mvx-teal);opacity:.8}
.mvx-vine__stem{fill:none;stroke:currentColor;stroke-width:3.4;stroke-linecap:round;vector-effect:non-scaling-stroke}
.mvx-vine__stalk{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;vector-effect:non-scaling-stroke}
.mvx-vine__tendril{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.8}
.mvx-vine__leaf{fill:currentColor}
.mvx-reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.22,.7,.25,1),transform .9s cubic-bezier(.22,.7,.25,1)}
.mvx-reveal.is-in{opacity:1;transform:none}
.mvx-word{display:inline-block;opacity:0;transform:translateY(.5em);transition:opacity .6s ease,transform .6s cubic-bezier(.22,.7,.25,1)}
.mvx-word.is-in{opacity:1;transform:none}
.mvx-intro{display:grid;grid-template-columns:1.05fr .95fr;gap:72px;align-items:center;position:relative;z-index:1}
.mvx-intro__eyebrow{font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--mvx-olive);margin:0 0 26px}
.mvx-statement{font-size:clamp(26px,3.1vw,42px);line-height:1.24;color:var(--mvx-ink);margin:0;text-wrap:pretty;font-weight:500}
.mvx-statement em{font-style:italic;color:var(--mvx-teal)}
.mvx-collage{position:relative;height:520px}
.mvx-collage__img{position:absolute;object-fit:cover;will-change:transform;z-index:1}
.mvx-collage__img--a{width:74%;height:62%;top:0;right:0;object-position:22% center}
.mvx-collage__img--b{width:60%;height:50%;bottom:0;left:0;object-position:15% center}
.mvx-band{overflow:hidden;padding:8px 0}
.mvx-band__track{display:flex;gap:20px;width:max-content;animation:mvx-band 46s linear infinite}
.mvx-band:hover .mvx-band__track{animation-play-state:paused}
.mvx-band__track img{height:280px;width:auto;object-fit:cover;display:block;filter:saturate(.95)}
@keyframes mvx-band{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mvx-vision{position:relative;height:92vh;min-height:620px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.mvx-vision__bg{position:absolute;inset:-8%;background-size:cover;background-position:center;animation:mvx-kenburns 26s ease-in-out infinite alternate}
.mvx-vision::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(37,37,35,.62),rgba(37,37,35,.45))}
@keyframes mvx-kenburns{from{transform:scale(1)}to{transform:scale(1.12)}}
.mvx-vision__copy{position:relative;z-index:1;max-width:960px;padding:0 40px;text-align:center;color:#faf6ea;font-size:clamp(24px,2.9vw,40px);line-height:1.3;text-wrap:pretty}
.mvx-vision__copy strong{color:var(--mvx-salmon);font-weight:500}
.mvx-vision__label{display:block;font-size:13px;letter-spacing:.22em;text-transform:uppercase;color:var(--mvx-salmon);margin-bottom:28px}
.mvx-anim-row .mvx-image-text-row__image{clip-path:inset(0 0 100% 0);transform:scale(1.08);transition:clip-path 1.1s cubic-bezier(.22,.7,.25,1),transform 1.5s cubic-bezier(.22,.7,.25,1)}
.mvx-anim-row.is-in .mvx-image-text-row__image{clip-path:inset(0 0 0 0);transform:scale(1)}
.mvx-anim-row--rev .mvx-image-text-row__image{clip-path:inset(0 0 0 100%)}
.mvx-anim-row--rev.is-in .mvx-image-text-row__image{clip-path:inset(0 0 0 0)}
.mvx-anim-row .mvx-image-text-row__text{opacity:0;transform:translateY(18px);transition:opacity .8s ease .15s,transform .9s cubic-bezier(.22,.7,.25,1) .15s}
.mvx-anim-row.is-in .mvx-image-text-row__text{opacity:1;transform:none}
.mvx-chart-figure .mvx-grow{transform:scaleY(.02);transform-box:fill-box;transform-origin:bottom;transition:transform 1s cubic-bezier(.22,.7,.25,1)}
.mvx-chart-figure.is-in .mvx-grow{transform:scaleY(1)}
.mvx-chart-figure .mvx-fade{opacity:0;transition:opacity .7s ease}
.mvx-chart-figure.is-in .mvx-fade{opacity:1}
.mvx-chart-figure .mvx-grid{transform:scaleX(0);transform-box:fill-box;transform-origin:left;transition:transform .9s cubic-bezier(.22,.7,.25,1)}
.mvx-chart-figure.is-in .mvx-grid{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){.mvx-anim-row .mvx-image-text-row__image,.mvx-anim-row .mvx-image-text-row__text,.mvx-chart-figure .mvx-grow,.mvx-chart-figure .mvx-fade,.mvx-chart-figure .mvx-grid,.mvx-word,.mvx-reveal{opacity:1 !important;transform:none !important;clip-path:none !important}}
@media (max-width:900px){.mvx-intro{grid-template-columns:1fr;gap:40px}.mvx-collage{height:360px}.mvx-band__track img{height:190px}.mvx-creeper{width:100%}}

.mvx-page{--soil:0;--mvx-soil:#3a2a1c;background-color:color-mix(in oklab,var(--mvx-soil) calc(var(--soil)*100%),var(--mvx-cream));transition:background-color .25s linear}
.mvx-page.is-soil{color:#f0e6d2}
.mvx-page.is-soil .mvx-image-text-row__text--italic{color:#f4ecd9;transition:color .6s ease}
.mvx-page.is-soil .mvx-image-text-row__text--bold,.mvx-page.is-soil .mvx-statement{color:#f4ecd9;transition:color .6s ease}
.mvx-page.is-soil .mvx-caption{color:#d8c9a6;transition:color .6s ease}
.mvx-page.is-soil .mvx-caption__source{color:#e8dcc2}
.mvx-page.is-soil .mvx-footer,.mvx-page.is-soil footer,.mvx-page.is-soil footer *{color:#e2d6bd;transition:color .6s ease}
.mvx-image-text-row__text,.mvx-caption{transition:color .6s ease}
.mvx-navbar__toggle span{transition:background-color .6s ease}
.mvx-page.is-soil .mvx-navbar__toggle span{background-color:#faf6ea !important}
.mvx-para{display:block}.mvx-para+.mvx-para{margin-top:1em}
.mvx-punch{box-sizing:border-box;padding:0 clamp(24px,4vw,64px);margin:clamp(40px,7vw,88px) auto 0;font-family:var(--mvx-font);font-style:italic;font-weight:500;font-size:clamp(24px,3.4vw,46px);line-height:1.3;letter-spacing:-.01em;text-wrap:balance;text-align:center;width:100%;max-width:none;color:var(--mvx-teal);transition:color .6s ease}
.mvx-page.is-soil .mvx-punch{color:#cfe0c2}
.mvx-reveal{opacity:0;transform:translateY(20px);transition:opacity .9s ease,transform 1s cubic-bezier(.22,.7,.25,1)}
.mvx-reveal.is-in{opacity:1;transform:none}
.mvx-image-text-row.mvx-anim-row .mvx-image-text-row__text{align-self:center}
.mvx-row--lagoon{align-items:center}
.mvx-row--lagoon .mvx-image-text-row__image{width:min(58%,620px);max-width:none;flex:0 1 auto}
.mvx-row--lagoon .mvx-image-text-row__text{flex:1 1 0;min-width:300px;max-width:30ch;font-size:clamp(23px,2.5vw,34px);line-height:1.32}
@media (max-width:900px){.mvx-row--lagoon .mvx-image-text-row__image{width:100%}.mvx-row--lagoon .mvx-image-text-row__text{max-width:none;min-width:0}}
.mvx-row--lagoon .mvx-image-text-row__image{will-change:clip-path,transform}

/* ---------- Pending-asset placeholder (dashed box, matches the old
   .waste-col .placeholder pattern) used where a prototype image could not
   be fetched intact ---------- */

.mvx-pending {
  aspect-ratio: 4 / 3;
  border: 2px dashed rgba(61,80,33,0.3);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--mvx-olive);
  opacity: 0.6;
  font-size: 14px;
  font-family: var(--mvx-font);
  background: rgba(61,80,33,0.04);
  text-align: center;
  padding: 12px;
  box-sizing: border-box;
}