/* Management stories: original artwork, quiet controls, native research diagrams. */
.mv-root {
  --mv-wine: #6b190c;
  --mv-paper: #f1eae0;
  --mv-beige: #d6beaa;
  --mv-cream: #e4d8cc;
  --mv-brown: #3c2821;
  --mv-rule: color-mix(in srgb, currentColor 24%, transparent);
  color: inherit;
  width: 100%;
  min-width: 0;
  margin-block: clamp(30px, 4vw, 66px) 0;
}
.mv-root *, .mv-root *::before, .mv-root *::after { box-sizing: border-box; }
.mv-root [hidden] { display: none !important; }
.mv-root button { color: inherit; font: inherit; border-radius: 0; }
.mv-root button:focus-visible, .mv-root summary:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.mv-root h3, .mv-root h4, .mv-root p, .mv-root ol, .mv-root figure { margin: 0; }
.mv-root h3 { font: 400 clamp(27px, 3vw, 44px)/1.08 var(--portfolio-serif, Georgia, serif); letter-spacing: -.025em; text-wrap: balance; }
.mv-root h4 { font-size: 15px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; }
.mv-root p { color: inherit; font-size: 15px; line-height: 1.65; max-width: none; }
.mv-root .mv-eyebrow { display: block; font-size:12px; line-height: 1.5; letter-spacing: .11em; text-transform: uppercase; margin-bottom: 17px; }
.mv-root .mv-note { font-size: 12px; line-height: 1.7; opacity: .78; }
.mv-root .mv-figure { min-width: 0; width: 100%; }
.mv-root .mv-art { display: block; width: 100%; height: auto; padding: 0; border: 0; border-radius: 0; background: transparent; cursor: zoom-in; overflow: visible; }
.mv-root .mv-art::after { display: none; }
.mv-root .mv-art img { display: block; width: 100%; height: auto; max-width: 100%; max-height: none; object-fit: contain; object-position: center; background: transparent; border-radius: 0; transform: none; rotate: none; filter: none; transition: opacity .25s ease; }
.mv-root .mv-art:hover img { transform: none; opacity: .92; }
.mv-root .mv-figure figcaption { display: flex; justify-content: space-between; gap: 18px; font-size:12px; line-height: 1.65; color: inherit; opacity: .78; margin: 12px 0 0; }
.mv-root .mv-figure figcaption span { flex: 0 0 auto; font-size:12px; padding-top: 2px; }
.mv-root .mv-source { display: inline-flex; gap: 20px; justify-content: space-between; align-items: center; background: transparent; border: 0; border-bottom: 1px solid var(--mv-rule); min-height: 44px; padding: 12px 0; margin-top: 25px; text-align: left; font-size:12px; line-height: 1.5; cursor: pointer; }
.mv-root .mv-source:hover { border-bottom-color: currentColor; }
.mv-root .mv-details { border-top: 1px solid var(--mv-rule); border-bottom: 1px solid var(--mv-rule); margin-top: 36px; }
.mv-root .mv-details summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; list-style: none; cursor: pointer; min-height: 54px; padding: 15px 0; font-size: 12px; line-height: 1.5; }
.mv-root .mv-details summary::-webkit-details-marker { display: none; }
.mv-root .mv-details summary > span { font-size: 21px; line-height: 1; transition: rotate .2s; }
.mv-root .mv-details[open] summary > span { rotate: 45deg; }
.mv-root .mv-details-content { padding: 0 0 25px; max-width: 780px; }
.mv-root .mv-details-content p { font-size: 13px; line-height: 1.75; }
.mv-root .mv-switch-nav { display: flex; flex-wrap: wrap; gap: 0 28px; align-items: stretch; border-bottom: 1px solid var(--mv-rule); }
.mv-root .mv-select { display: flex; gap: 10px; align-items: baseline; text-align: left; min-height: 52px; padding: 15px 0; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: 13px; line-height: 1.45; background: transparent; opacity: .64; cursor: pointer; transition: opacity .2s, border-color .2s; }
.mv-root .mv-select:hover, .mv-root .mv-select[aria-pressed="true"] { opacity: 1; }
.mv-root .mv-select[aria-pressed="true"] { border-bottom-color: currentColor; }
.mv-root .mv-select-number { font-size:12px; opacity: .7; font-variant-numeric: tabular-nums; }
.mv-root .mv-switch-stage { padding-top: 32px; }
.mv-root .mv-panel { min-width: 0; }
.mv-root .mv-next { display: flex; align-items: center; justify-content: space-between; gap: 65px; margin: 25px 0 0 auto; padding: 12px 0; min-height: 44px; border: 0; border-bottom: 1px solid var(--mv-rule); background: transparent; cursor: pointer; font-size: 12px; }
.mv-root .mv-next:hover { border-bottom-color: currentColor; }
.mv-root .mv-next span { font-size: 22px; }

/* Real co-creation work: one lead photograph and a staggered pair. */
.mv-root .mv-workshop-opening { display: grid; grid-template-columns: minmax(0,.28fr) minmax(0,1fr); gap: clamp(28px,5vw,80px); align-items: center; }
.mv-root .mv-workshop-rail p { font: 400 clamp(38px,5.2vw,78px)/.98 var(--portfolio-serif, Georgia, serif); letter-spacing: -.035em; margin: 28px 0; }
.mv-root .mv-workshop-rail .mv-note { display: block; max-width: 160px; }
.mv-root .mv-workshop-pair { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.78fr); align-items: start; gap: clamp(28px,6vw,95px); margin-top: clamp(36px,5vw,78px); padding-left: 8%; }
.mv-root .mv-workshop-pair > :last-child { margin-top: 18%; }
.mv-root .mv-workshop-close { font: 400 clamp(25px,3.2vw,43px)/1.2 var(--portfolio-serif, Georgia, serif); max-width: 670px; margin: 55px 0 0 auto; letter-spacing: -.025em; }

/* Frameworks keep the visual evidence beside a short reading of the work. */
.mv-root .mv-tabs { justify-content: space-between; gap: 10px 25px; }
.mv-root .mv-tabs > .mv-select { font: 400 clamp(20px,2.05vw,29px)/1.1 var(--portfolio-serif, Georgia, serif); padding: 18px 0 23px; }
.mv-root .mv-tabs > .mv-select .mv-select-number { font: 9px/1.4 sans-serif; }
.mv-root .mv-subnav { gap: 0 24px; border-bottom: 0; }
.mv-root .mv-subnav .mv-select { font-size:12px; min-height: 44px; padding-block: 11px; }
.mv-root .mv-subnav .mv-select-number { display: none; }
.mv-root .mv-diagnostic-panel { display: grid; grid-template-columns: minmax(0,.36fr) minmax(0,1fr); gap: clamp(28px,5vw,65px); align-items: center; }
.mv-root .mv-framework-intro p { font-size: 14px; line-height: 1.7; margin-top: 22px; }
.mv-root .mv-archetypes .mv-switch-nav { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 26px; margin-top: 12px; }
.mv-root .mv-archetypes .mv-select { font-size: 14px; padding-block: 22px; }
.mv-root .mv-archetype-detail { min-height: 180px; padding-block: 18px 8px; max-width: 760px; }
.mv-root .mv-archetype-detail h3 { font-size: clamp(36px,5vw,68px); }
.mv-root .mv-archetype-detail p { margin-top: 20px; max-width: 590px; }
.mv-root .mv-ogsm { margin-top: 15px; }
.mv-root .mv-chain { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); list-style: none; padding: 0; gap: 28px; }
.mv-root .mv-chain li { min-width: 0; position: relative; border-top: 1px solid var(--mv-rule); padding-top: 20px; }
.mv-root .mv-chain li:not(:last-child)::after { content: '→'; position: absolute; right: 0; top: 16px; font-size: 22px; }
.mv-root .mv-chain-number { display: block; font-size:12px; line-height: 1.5; opacity: .65; margin-bottom: 30px; }
.mv-root .mv-chain h4 { margin-bottom: 13px; }
.mv-root .mv-chain p { font-size: 14px; line-height: 1.6; max-width: 240px; }
.mv-root .mv-ogsm-chain { margin-top: 10px; }
.mv-root .mv-canvas { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); grid-template-areas: 'partners activities value support beneficiaries' 'partners resources value deployment beneficiaries' 'cost cost achievement achievement achievement'; border-top: 1px solid var(--mv-rule); border-left: 1px solid var(--mv-rule); }
.mv-root .mv-canvas-node { display: flex; flex-direction: column; gap: 18px; text-align: left; min-width: 0; min-height: 125px; padding: clamp(14px,1.7vw,25px); background: transparent; border: 0; border-right: 1px solid var(--mv-rule); border-bottom: 1px solid var(--mv-rule); cursor: pointer; transition: background .25s; }
.mv-root .mv-canvas-node > span { font-size:12px; line-height: 1.4; letter-spacing: .02em; }
.mv-root .mv-canvas-node strong { font: 400 clamp(18px,1.85vw,27px)/1.16 var(--portfolio-serif, Georgia, serif); letter-spacing: -.02em; }
.mv-root .mv-canvas-node:hover, .mv-root .mv-canvas-node[aria-pressed="true"] { background: color-mix(in srgb, currentColor 9%, transparent); }
.mv-root .mv-canvas-node[aria-pressed="true"] > span::after { content: ' ↗'; }
.mv-root .mv-canvas-partners { grid-area: partners; }
.mv-root .mv-canvas-activities { grid-area: activities; }
.mv-root .mv-canvas-resources { grid-area: resources; }
.mv-root .mv-canvas-value { grid-area: value; }
.mv-root .mv-canvas-support { grid-area: support; }
.mv-root .mv-canvas-deployment { grid-area: deployment; }
.mv-root .mv-canvas-beneficiaries { grid-area: beneficiaries; }
.mv-root .mv-canvas-cost { grid-area: cost; }
.mv-root .mv-canvas-achievement { grid-area: achievement; }
.mv-root .mv-canvas-detail { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: 32px; margin: 32px 0 0; min-height: 125px; align-items: start; }
.mv-root .mv-canvas-detail h3 { font-size: clamp(26px,3vw,37px); }
.mv-root .mv-canvas-detail p { font-size: 14px; line-height: 1.7; max-width: 690px; }
.mv-root .mv-canvas-detail ~ .mv-note { margin-top: 18px; }

/* Sensory materials, qualitative cues, then the documented workshop outputs. */
.mv-root .mv-sensory-layout { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1fr); gap: clamp(36px,7vw,100px); align-items: center; }
.mv-root .mv-stimulus-figure { max-width: 445px; }
.mv-root .mv-cue-tabs { column-gap: 19px; }
.mv-root .mv-cue-tabs .mv-select { font-size: 12px; }
.mv-root .mv-cue-tabs .mv-select-number { display: none; }
.mv-root .mv-cue-panel { min-height: 220px; }
.mv-root .mv-cue-panel h3 { max-width: 450px; }
.mv-root .mv-cue-meaning { margin-top: 23px; max-width: 450px; }
.mv-root .mv-cue-emotion { display: flex; flex-wrap: wrap; gap: 10px 20px; font-size: 13px; margin-top: 26px; }
.mv-root .mv-cue-emotion span { font-size:12px; text-transform: uppercase; letter-spacing: .08em; opacity: .7; padding-top: 2px; }
.mv-root .mv-sensory-layout .mv-source + .mv-note { margin-top: 16px; }
.mv-root .mv-sensory-evidence { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.36fr); gap: clamp(30px,5vw,75px); align-items: center; margin-top: clamp(50px,7vw,100px); }
.mv-root .mv-sensory-evidence > div > .mv-note { margin-top: 24px; }
.mv-root .mv-sensory-bridge { grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: clamp(45px,6vw,85px); }
.mv-root .mv-sensory-bridge p { max-width: 300px; }

/* Proposed café rituals: one full concept view at a time. */
.mv-root .mv-ritual-nav { justify-content: space-between; }
.mv-root .mv-ritual-nav .mv-select { font: 400 clamp(22px,2.5vw,34px)/1.1 var(--portfolio-serif, Georgia, serif); padding: 15px 0 23px; }
.mv-root .mv-ritual-nav .mv-select-number { font: 9px/1.4 sans-serif; }
.mv-root .mv-ritual-stage { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.33fr); gap: clamp(30px,5vw,70px); align-items: center; }
.mv-root .mv-ritual-step { display: flex; align-items: baseline; gap: 10px; font: 400 55px/1 var(--portfolio-serif, Georgia, serif); margin-bottom: 35px; }
.mv-root .mv-ritual-step > span { font: 10px/1.4 sans-serif; opacity: .55; }
.mv-root .mv-ritual-copy h3 { font-size: clamp(28px,3vw,44px); }
.mv-root .mv-ritual-copy p { font-size: 14px; line-height: 1.7; margin-top: 22px; }
.mv-root.mv-rituals > .mv-note { margin-top: 32px; }

/* Starbucks: distinct question/process artworks and one format viewer. */
.mv-root .mv-starbucks-question { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.3fr); align-items: center; gap: clamp(30px,5vw,75px); }
.mv-root .mv-starbucks-question h3 { font-size: clamp(30px,4vw,57px); }
.mv-root .mv-starbucks-journey { margin: clamp(45px,6vw,90px) 0 0 auto; max-width: 88%; }
.mv-root .mv-starbucks-journey > .mv-note { margin-top: 15px; }
.mv-root .mv-print-heading { display: flex; gap: 35px; justify-content: space-between; align-items: baseline; margin-bottom: 20px; }
.mv-root .mv-print-heading .mv-eyebrow { flex: 0 0 auto; }
.mv-root .mv-print-viewer .mv-switch-stage { padding-top: 24px; }
.mv-root .mv-print-viewer .mv-art img { max-height: 900px; }
.mv-root .mv-print-portrait { max-width: 580px; margin-inline: auto; }

@media (max-width: 980px) {
  .mv-root .mv-diagnostic-panel { grid-template-columns: minmax(0,.42fr) minmax(0,1fr); gap: 30px; }
  .mv-root .mv-canvas { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-areas: 'partners activities resources' 'value value beneficiaries' 'support deployment beneficiaries' 'cost achievement achievement'; }
  .mv-root .mv-archetypes .mv-switch-nav { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 30px; }
  .mv-root .mv-chain { gap: 20px; }
  .mv-root .mv-sensory-layout { gap: 35px; }
  .mv-root .mv-ritual-stage { grid-template-columns: minmax(0,1fr) minmax(0,.43fr); gap: 30px; }
  .mv-root .mv-starbucks-question { grid-template-columns: minmax(0,1fr) minmax(0,.35fr); gap: 30px; }
}
@media (max-width: 650px) {
  .mv-root { margin-top: 28px; }
  .mv-root .mv-figure figcaption { font-size:12px; gap: 12px; }
  .mv-root .mv-figure figcaption span { font-size:12px; }
  .mv-root .mv-workshop-opening, .mv-root .mv-workshop-pair { display: block; }
  .mv-root .mv-workshop-rail { display: grid; grid-template-columns: 1fr 1fr; column-gap: 25px; align-items: end; margin-bottom: 28px; }
  .mv-root .mv-workshop-rail > .mv-eyebrow { grid-column: 1 / -1; }
  .mv-root .mv-workshop-rail p { font-size: 48px; margin: 4px 0 0; }
  .mv-root .mv-workshop-rail .mv-note { padding-bottom: 4px; }
  .mv-root .mv-workshop-pair { margin-top: 32px; padding-left: 0; }
  .mv-root .mv-workshop-pair > :last-child { width: 84%; margin: 35px 0 0 auto; }
  .mv-root .mv-workshop-close { margin-top: 35px; font-size: 28px; max-width: 320px; }
  .mv-root .mv-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 18px; }
  .mv-root .mv-tabs > .mv-select { font-size: 21px; padding: 15px 0; }
  .mv-root .mv-subnav { gap: 0 18px; }
  .mv-root .mv-switch-stage { padding-top: 26px; }
  .mv-root .mv-diagnostic-panel { display: flex; flex-direction: column; gap: 25px; align-items: stretch; }
  .mv-root .mv-diagnostic-panel > .mv-figure { order: -1; }
  .mv-root .mv-framework-intro h3 { max-width: 370px; }
  .mv-root .mv-framework-intro p { margin-top: 15px; }
  .mv-root .mv-archetypes .mv-switch-nav { gap: 0 22px; }
  .mv-root .mv-archetypes .mv-select { padding-block: 18px; font-size: 12px; }
  .mv-root .mv-archetype-detail { min-height: 190px; }
  .mv-root .mv-archetype-detail h3 { font-size: 37px; }
  .mv-root .mv-chain { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px 20px; }
  .mv-root .mv-chain-number { margin-bottom: 20px; }
  .mv-root .mv-chain h4 { font-size: 14px; }
  .mv-root .mv-chain p { font-size: 13px; }
  .mv-root .mv-canvas { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: 'value value' 'partners activities' 'resources beneficiaries' 'support deployment' 'cost achievement'; }
  .mv-root .mv-canvas-node { min-height: 125px; padding: 15px; }
  .mv-root .mv-canvas-value { min-height: 105px; }
  .mv-root .mv-canvas-node strong { font-size: 23px; }
  .mv-root .mv-canvas-detail { display: block; min-height: 185px; margin-top: 26px; }
  .mv-root .mv-canvas-detail p { margin-top: 17px; }
  .mv-root .mv-sensory-layout { display: block; }
  .mv-root .mv-stimulus-figure { width: 78%; max-width: 360px; margin: 0 auto 35px; }
  .mv-root .mv-cue-tabs { gap: 0 18px; }
  .mv-root .mv-cue-panel { min-height: 220px; }
  .mv-root .mv-sensory-evidence { display: block; margin-top: 45px; }
  .mv-root .mv-sensory-evidence > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.75fr); gap: 24px; align-items: center; margin-top: 35px; }
  .mv-root .mv-sensory-evidence > div > .mv-note { margin-top: 0; font-size:12px; }
  .mv-root .mv-sensory-bridge { grid-template-columns: 1fr; gap: 22px; margin-top: 40px; }
  .mv-root .mv-sensory-bridge li { padding-left: 33px; }
  .mv-root .mv-sensory-bridge .mv-chain-number { position: absolute; left: 0; }
  .mv-root .mv-sensory-bridge li:not(:last-child)::after { content: '↓'; top: 17px; }
  .mv-root .mv-sensory-bridge p { max-width: 86%; }
  .mv-root .mv-ritual-nav { gap: 0 19px; }
  .mv-root .mv-ritual-nav .mv-select { font-size: 23px; padding-block: 15px; }
  .mv-root .mv-ritual-nav .mv-select-number { display: none; }
  .mv-root .mv-ritual-stage { display: block; }
  .mv-root .mv-ritual-copy { position: relative; padding: 30px 0 0 56px; }
  .mv-root .mv-ritual-step { position: absolute; top: 30px; left: 0; font-size: 38px; }
  .mv-root .mv-ritual-step > span { display: none; }
  .mv-root .mv-ritual-copy .mv-eyebrow { font-size:12px; margin-bottom: 14px; }
  .mv-root .mv-ritual-copy h3 { font-size: 33px; }
  .mv-root .mv-ritual-copy p { margin-top: 16px; }
  .mv-root .mv-starbucks-question { display: flex; flex-direction: column; gap: 24px; align-items: start; }
  .mv-root .mv-starbucks-question h3 { font-size: 35px; }
  .mv-root .mv-starbucks-question .mv-eyebrow { margin-bottom: 10px; }
  .mv-root .mv-starbucks-journey { max-width: 100%; margin-top: 35px; }
  .mv-root .mv-print-heading { display: block; }
  .mv-root .mv-print-heading h3 { font-size: 32px; }
  .mv-root .mv-print-heading .mv-eyebrow { margin-bottom: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .mv-root *, .mv-root *::before, .mv-root *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}