/* ─────────────────────────────────────────────────────────────────────────
   Museum Voices — couche éditoriale mobile

   Cette feuille est chargée uniquement par la SPA Museum Voices (index.html).
   Elle traduit les principes du livrable Stitch : papier chaud, surfaces sans
   ombres, typographie éditoriale et navigation basse utilisable au pouce.
   Culture For Causes ne la charge pas.
   ───────────────────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
  body.mv-mobile-editorial {
    --paper: #fcf9f8;
    --paper-2: #f0eded;
    --ink: #1c1b1b;
    --ink-2: #3e3938;
    --ink-3: #57423c;
    --ink-4: #8b716a;
    --rule: #dec0b7;
    --accent-text: #a13a17;
    background: var(--paper);
  }

  html.dark body.mv-mobile-editorial {
    color-scheme: dark;
    --paper: #171717;
    --paper-2: #292827;
    --ink: #f4f3ef;
    --ink-2: #e3ddd9;
    --ink-3: #d4c1ba;
    --ink-4: #ab9690;
    --rule: #4a3c38;
    --accent-text: #ffb59f;
  }

  body.mv-mobile-editorial,
  body.mv-mobile-editorial input,
  body.mv-mobile-editorial select,
  body.mv-mobile-editorial textarea,
  body.mv-mobile-editorial button {
    font-family: var(--f-body);
  }

  /* ── App bar ─────────────────────────────────────────────────────────── */
  body.mv-mobile-editorial #hp-announcement-banner {
    padding: 8px 52px 8px 16px !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }

  body.mv-mobile-editorial [data-navc4c="1"] {
    border-bottom: 1px solid var(--rule);
  }
  body.mv-mobile-editorial [data-navc4c="1"] .navc4c-inner {
    min-height: 56px;
    grid-template-columns: minmax(0, 1fr) 44px;
    padding: 0 12px;
  }
  body.mv-mobile-editorial .navc4c-brand {
    gap: 10px;
    color: var(--accent-text);
  }
  body.mv-mobile-editorial .navc4c-brand::before {
    content: '‹';
    font-family: var(--f-display);
    font-size: 33px;
    font-weight: 300;
    line-height: 1;
    margin-top: -3px;
  }
  body.mv-mobile-editorial .navc4c-brand img { display: none; }
  body.mv-mobile-editorial .navc4c-brand span {
    display: block;
    overflow: visible;
    color: var(--accent-text);
    font-family: var(--f-display);
    font-size: 25px;
    font-weight: 400;
    letter-spacing: -.025em;
    text-transform: none;
  }
  body.mv-mobile-editorial #navc4c-section-btn {
    border: 0;
    color: var(--accent-text);
  }
  body.mv-mobile-editorial #navc4c-section-btn .navc4c-hamburger-icon {
    width: 22px;
    height: 22px;
    color: var(--accent-text);
  }
  body.mv-mobile-editorial [data-navc4c="2"] { display: none; }

  /* Le menu est dans le header sticky (z-index: 50), tandis que la barre
     inférieure est à 900. Son propre z-index reste prisonnier du header :
     les derniers liens passent donc sous la barre et ne sont plus touchables. */
  body.mv-mobile-editorial:has(#navc4c-section-menu.open, #lang-menu.open) [data-navc4c="1"] {
    z-index: 950;
  }
  body.mv-mobile-editorial .navc4c-mobile-backdrop.open { z-index: 940; }
  body.mv-mobile-editorial #lang-menu.open { z-index: 950; }
  body.mv-mobile-editorial #navc4c-section-menu {
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
  }

  body.mv-mobile-editorial #mobile-menu:not(.hidden) {
    background: var(--paper) !important;
    border-bottom: 1px solid var(--rule) !important;
  }
  body.mv-mobile-editorial #mobile-menu button,
  body.mv-mobile-editorial #mobile-menu a {
    min-height: 44px;
  }

  /* L'unique hamburger mobile ouvre la feuille de navigation commune au
     réseau. Ces liens évitent de rendre les Tarifs, le Compte et le Profil
     invisibles derrière le hamburger d'app, volontairement absent de cette
     charte à une seule barre. */
  body.mv-mobile-editorial #mv-mobile-member-links {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 10px;
    padding-top: 14px;
    border-top: 1px solid var(--rule);
  }
  body.mv-mobile-editorial #mv-mobile-member-links p {
    margin: 0;
    padding: 0 14px 5px;
    color: var(--ink-4);
    font-family: var(--f-mono);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  body.mv-mobile-editorial #navc4c-section-menu #mv-mobile-member-links a {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 10px 14px;
    color: var(--ink);
    font-family: var(--f-display);
    font-size: 19px;
    letter-spacing: -.01em;
    text-decoration: none;
  }
  body.mv-mobile-editorial #navc4c-section-menu #mv-mobile-member-links a:hover {
    background: var(--paper-2);
  }

  /* ── Accueil ─────────────────────────────────────────────────────────── */
  body.mv-mobile-editorial #page-accueil > main > section:first-child {
    padding: 28px 16px 20px !important;
  }
  body.mv-mobile-editorial #page-accueil > main > section:first-child h1 {
    max-width: 11ch !important;
    font-size: clamp(36px, 10vw, 45px) !important;
    font-weight: 300 !important;
    line-height: 1.02 !important;
    letter-spacing: -.035em !important;
  }
  body.mv-mobile-editorial #parallax-hero {
    padding: 0 16px !important;
  }
  body.mv-mobile-editorial .stitch-hero {
    min-height: 320px;
    border: 1px solid var(--rule);
    border-radius: 12px;
    box-shadow: none;
  }
  body.mv-mobile-editorial #intro-text,
  body.mv-mobile-editorial #pillars,
  body.mv-mobile-editorial #membres-actifs,
  body.mv-mobile-editorial #duo-phare,
  body.mv-mobile-editorial #seo-content,
  body.mv-mobile-editorial #pourquoi-payant,
  body.mv-mobile-editorial #landing-footer-cta,
  body.mv-mobile-editorial footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  body.mv-mobile-editorial #intro-text { padding-top: 28px !important; }
  body.mv-mobile-editorial #page-accueil {
    padding-bottom: calc(94px + env(safe-area-inset-bottom));
  }
  body.mv-mobile-editorial .pillar-card,
  body.mv-mobile-editorial .duo-panel,
  body.mv-mobile-editorial #landing-strip > *,
  body.mv-mobile-editorial .card {
    border-radius: 12px !important;
    box-shadow: none !important;
  }
  body.mv-mobile-editorial .pillar-card {
    border-color: var(--rule) !important;
    background: var(--paper-2) !important;
  }
  body.mv-mobile-editorial #stats-bar {
    padding: 24px 16px !important;
    background: var(--paper-2) !important;
    border-color: var(--rule) !important;
  }

  /* ── Espace de travail ───────────────────────────────────────────────── */
  body.mv-mobile-editorial #page-collaborer > .collab-intro {
    padding: 20px 16px 4px !important;
  }
  body.mv-mobile-editorial #page-collaborer > .flex > aside { display: none; }
  body.mv-mobile-editorial #page-collaborer > .flex > main {
    padding: 24px 16px calc(120px + env(safe-area-inset-bottom)) !important;
    background: var(--paper) !important;
    overflow: visible !important;
  }
  body.mv-mobile-editorial #page-collaborer h1 {
    font-size: 34px !important;
    font-weight: 400 !important;
    line-height: 1.13 !important;
    letter-spacing: -.025em !important;
  }
  /* Financements : le compteur et l'aide sur les badges restent lisibles au zoom normal. */
  body.mv-mobile-editorial #fin-meta-line > p:first-child { font-size: 28px !important; line-height: 1.3 !important; }
  body.mv-mobile-editorial #fin-meta-line > p:first-child > span:not(#fin-count) {
    font-size: 17px !important; line-height: 1.4 !important;
  }
  body.mv-mobile-editorial #fin-sources-toggle {
    display: inline-flex !important; align-items: center !important;
    min-height: 40px !important; font-size: 14px !important; line-height: 1.4 !important;
    letter-spacing: 0 !important;
  }
  body.mv-mobile-editorial #fin-sources-line {
    font-size: 14px !important; line-height: 1.55 !important; letter-spacing: 0 !important;
  }
  body.mv-mobile-editorial #fin-sub-tabs {
    display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0 !important; border: 1px solid var(--rule) !important;
    background: var(--paper-2) !important; margin-bottom: 18px !important;
  }
  body.mv-mobile-editorial #fin-sub-tabs .fin-sub-tab {
    width: 100%; min-width: 0; min-height: 48px;
    padding: 10px 4px !important;
    border: 0 !important; background: transparent !important;
    color: var(--ink-2) !important;
    font-family: var(--f-body) !important; font-size: 14px !important;
    font-weight: 600 !important; letter-spacing: -.02em !important;
    line-height: 1.2 !important; text-transform: none !important;
    white-space: nowrap !important;
  }
  body.mv-mobile-editorial #fin-sub-tabs .fin-sub-tab + .fin-sub-tab {
    border-left: 1px solid var(--rule) !important;
  }
  body.mv-mobile-editorial #fin-sub-tabs .fin-sub-tab.on {
    background: var(--ink) !important; color: var(--paper) !important;
  }
  body.mv-mobile-editorial #fin-badges-help summary {
    min-height: 48px; font-size: 15px;
  }
  body.mv-mobile-editorial #fin-legende {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 4px !important; margin-top: 0 !important;
  }
  body.mv-mobile-editorial #fin-legende dt:not(:first-child) { margin-top: 12px; }
  body.mv-mobile-editorial #fin-legende dt > span {
    display: inline-block; padding: 5px 8px !important;
    font-size: 12px !important; line-height: 1.4 !important; letter-spacing: .02em !important;
  }
  body.mv-mobile-editorial #fin-legende dd {
    font-size: 15px !important; line-height: 1.5 !important; color: var(--ink-3) !important;
  }
  body.mv-mobile-editorial .panel-head,
  body.mv-mobile-editorial #panel-membres > header {
    margin-bottom: 22px !important;
  }
  body.mv-mobile-editorial #panel-membres > div[style*="padding:20px"],
  body.mv-mobile-editorial #studio-create-form,
  body.mv-mobile-editorial #own-traces,
  body.mv-mobile-editorial .match-seed-card {
    padding: 14px !important;
    background: var(--paper-2) !important;
    border-color: var(--rule) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  body.mv-mobile-editorial #members-search,
  body.mv-mobile-editorial #members-filter-country,
  body.mv-mobile-editorial #members-filter-tag,
  body.mv-mobile-editorial #studio-create-form input,
  body.mv-mobile-editorial #studio-create-form textarea,
  body.mv-mobile-editorial #studio-create-form select {
    min-height: 44px;
    border-radius: 0 !important;
    background: var(--paper) !important;
    border-color: var(--rule) !important;
  }
  body.mv-mobile-editorial .member-card-group,
  body.mv-mobile-editorial #financements-container .fin-card,
  body.mv-mobile-editorial .match-card,
  body.mv-mobile-editorial .p-card {
    border-color: var(--rule) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    transform: none !important;
  }
  body.mv-mobile-editorial .member-card-group,
  body.mv-mobile-editorial #financements-container .fin-card,
  body.mv-mobile-editorial .match-card {
    background: var(--paper-2) !important;
  }
  body.mv-mobile-editorial .member-card-group {
    padding: 16px !important;
    gap: 12px !important;
  }
  body.mv-mobile-editorial .member-card-group [style*="color:#1b1c19"] {
    color: var(--ink) !important;
    font-size: 23px !important;
    font-weight: 400 !important;
  }
  body.mv-mobile-editorial .member-card-group [style*="color:#00694c"] {
    color: #58cda1 !important;
  }
  body.mv-mobile-editorial #financements-container .fin-card {
    padding: 0 !important;
    border: 2px solid var(--ink) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: 4px 4px 0 var(--ink) !important;
  }
  body.mv-mobile-editorial #financements-container .fin-card h3 {
    font-size: 21px !important;
    line-height: 1.3 !important;
  }
  body.mv-mobile-editorial #financements-container .fin-card button,
  body.mv-mobile-editorial #financements-container .fin-card a,
  body.mv-mobile-editorial .member-card-group button,
  body.mv-mobile-editorial .member-card-group a,
  body.mv-mobile-editorial .match-card button {
    min-height: 40px;
    border-radius: 0 !important;
  }
  body.mv-mobile-editorial #fin-filter-bar {
    background: var(--paper) !important;
    border-color: var(--rule) !important;
    margin-left: -16px !important;
    margin-right: -16px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  body.mv-mobile-editorial #fin-filter-toggle,
  body.mv-mobile-editorial #fin-filter-bar #fin-sort-score,
  body.mv-mobile-editorial #fin-filter-bar #fin-sort-deadline {
    min-height: 40px !important; padding: 9px 10px !important;
    font-size: 11px !important; letter-spacing: .02em !important;
  }
  body.mv-mobile-editorial #fin-filter-toggle,
  body.mv-mobile-editorial #fin-sheet-apply,
  body.mv-mobile-editorial #studio-new-btn,
  body.mv-mobile-editorial [data-action="open-project-form"],
  body.mv-mobile-editorial [data-action="open-fin-form"] {
    border-radius: 0 !important;
    background: #c2512d !important;
    border-color: #c2512d !important;
    color: #fff !important;
  }

  html.dark body.mv-mobile-editorial #page-collaborer > .flex > main,
  html.dark body.mv-mobile-editorial #members-search,
  html.dark body.mv-mobile-editorial #members-filter-country,
  html.dark body.mv-mobile-editorial #members-filter-tag,
  html.dark body.mv-mobile-editorial #studio-create-form input,
  html.dark body.mv-mobile-editorial #studio-create-form textarea,
  html.dark body.mv-mobile-editorial #studio-create-form select,
  html.dark body.mv-mobile-editorial .p-card {
    background: var(--paper) !important;
    color: var(--ink) !important;
  }

  /* ── Barre basse : cinq destinations lisibles et utilisables au pouce ─── */
  body.mv-mobile-editorial #page-collaborer #collab-tabbar { display: none !important; }
  body.mv-mobile-editorial #page-collaborer {
    padding-bottom: calc(120px + env(safe-area-inset-bottom));
  }
  body.mv-mobile-editorial #mv-mobile-tabbar {
    display: none;
    position: fixed;
    z-index: 900;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 80px;
    padding: 5px 4px calc(5px + env(safe-area-inset-bottom));
    grid-template-columns: repeat(5, minmax(0, 1fr));
    background: color-mix(in srgb, var(--paper) 97%, transparent);
    backdrop-filter: saturate(140%) blur(12px);
    border-top: 1px solid var(--rule);
  }
  body.mv-mobile-editorial:has(#page-accueil:not(.hidden)) #mv-mobile-tabbar,
  body.mv-mobile-editorial:has(#page-collaborer:not(.hidden)) #mv-mobile-tabbar {
    display: grid;
  }
  html.deck-open body.mv-mobile-editorial #mv-mobile-tabbar,
  html.fin-sheet-open body.mv-mobile-editorial #mv-mobile-tabbar {
    display: none !important;
  }
  body.mv-mobile-editorial #mv-mobile-tabbar button {
    position: relative;
    min-width: 0;
    min-height: 70px;
    padding: 3px 2px 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border: 0;
    background: none;
    color: var(--ink-2);
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  body.mv-mobile-editorial #mv-mobile-tabbar .mv-tab-icon {
    width: 44px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 12px;
  }
  body.mv-mobile-editorial #mv-mobile-tabbar .mv-tab-icon svg {
    width: 26px;
    height: 26px;
    flex: none;
  }
  body.mv-mobile-editorial #mv-mobile-tabbar .mv-tab-label {
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    font-family: var(--f-body);
    font-size: clamp(9px, 2.82vw, 11px);
    font-weight: 600;
    letter-spacing: -.02em;
    line-height: 1.2;
  }
  @media (max-width: 359px) {
    body.mv-mobile-editorial #mv-mobile-tabbar .mv-tab-label { font-size: 8.5px; }
  }
  body.mv-mobile-editorial #mv-mobile-tabbar button:focus-visible {
    outline: 2px solid var(--accent-text);
    outline-offset: -2px;
  }
  body.mv-mobile-editorial #mv-mobile-tabbar button.on { color: var(--accent-text); }
  body.mv-mobile-editorial #mv-mobile-tabbar button.on .mv-tab-icon {
    background: color-mix(in srgb, var(--accent-text) 13%, transparent);
  }
  body.mv-mobile-editorial #mv-mobile-tabbar button.on .mv-tab-label { font-weight: 700; }
  body.mv-mobile-editorial #mv-mobile-tabbar button.on::before {
    content: '';
    position: absolute;
    top: -5px;
    left: 33%;
    right: 33%;
    height: 3px;
    border-radius: 0 0 3px 3px;
    background: var(--accent-text);
  }
  body.mv-mobile-editorial #feedback-fab {
    bottom: calc(94px + env(safe-area-inset-bottom)) !important;
  }

  /* Financements : cartes verticales inspirées de la référence Stitch. */
  body.mv-mobile-editorial #financements-container .fin-ledger-row {
    display: flex !important; flex-direction: column !important;
    border: 1px solid var(--ink) !important; background: #fff !important;
    box-shadow: 3px 3px 0 var(--ink) !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-facts {
    display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
    border: 0 !important; border-bottom: 1px solid var(--rule) !important; background: #faf9f5 !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-group { display: contents !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-deadline {
    min-width: 0; padding: 12px 14px !important; border: 0 !important;
    border-right: 1px solid var(--rule) !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-cell {
    min-width: 0; padding: 12px 14px !important; border: 0 !important; background: transparent !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-cell--country { display: none !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-cell--amount { grid-column: 2; grid-row: 1; }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-label {
    margin-bottom: 4px !important; font-size: 11px !important; letter-spacing: .06em !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-value {
    display: block !important; font-size: 17px !important; line-height: 1.3 !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-deadline .fin-ledger-fact-value { color: #b94e2e !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-fact-value--amount { color: #00694c !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-center { display: block !important; padding: 15px 14px 13px !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-meta-bar {
    flex-direction: column !important; align-items: stretch !important; gap: 10px !important;
    margin-bottom: 13px !important; padding-bottom: 12px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-issuer-list {
    width: 100% !important; flex: none !important; gap: 10px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-issuer-row {
    display: grid !important; grid-template-columns: max-content minmax(0, 1fr) !important;
    align-items: center !important; width: 100% !important; max-width: none !important; gap: 12px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-issuer-name {
    font-size: 14px !important; line-height: 1.4 !important; letter-spacing: 0 !important;
    overflow-wrap: normal !important; word-break: normal !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-badges {
    justify-content: flex-start !important; width: 100% !important; flex: none !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-status,
  body.mv-mobile-editorial #financements-container .fin-glam-badge,
  body.mv-mobile-editorial #financements-container .fin-consortium-badge {
    font-size: 12px !important; line-height: 1.4 !important; padding: 4px 8px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-title {
    margin-bottom: 10px !important; font-size: 22px !important; line-height: 1.25 !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-country-chip {
    display: flex; flex-wrap: wrap; align-items: center; gap: 5px; width: fit-content; max-width: 100%;
    margin: 0 0 11px; padding: 5px 8px; border: 1px solid #dedbd5; background: #f4f2ed;
    color: var(--ink-2); font-size: 13px; font-weight: 600; line-height: 1.4;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-country-chip .fin-ledger-fact-subtext {
    display: inline !important; margin: 0 !important; color: var(--ink-3) !important; font-size: 12px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-desc {
    margin-bottom: 14px !important; font-size: 15px !important; line-height: 1.5 !important; -webkit-line-clamp: 3 !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-tags { margin-top: 0 !important; gap: 6px !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-tag { padding: 5px 8px !important; font-size: 12px !important; line-height: 1.3 !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-right {
    display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 11px !important;
    padding: 12px 14px 14px !important; border-top: 1px dashed var(--rule) !important; border-left: 0 !important; background: #fff !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-interest-block {
    flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-interest-stack { gap: 7px !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-interest-label { font-size: 11px !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-interest-count { font-size: 12px !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-actions {
    display: grid !important; width: 100% !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; gap: 8px !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-action {
    width: 100% !important; min-height: 48px !important; padding: 10px 8px !important;
    font-size: 13px !important; line-height: 1.25 !important; letter-spacing: .02em !important;
  }
  body.mv-mobile-editorial #financements-container .fin-ledger-action--partners { grid-column: 1 / -1 !important; }
  body.mv-mobile-editorial #financements-container .fin-ledger-attribution { margin-top: 10px !important; }
}

@media (max-width: 359px) {
  body.mv-mobile-editorial #financements-container .fin-ledger-actions { grid-template-columns: minmax(0, 1fr) !important; }
  body.mv-mobile-editorial #financements-container .fin-issuer-mark--image { width: 72px !important; }
}
