/* ═════════════════════════════════════════════
   MOBILE (≤ 640 px) — l'ordinateur n'est pas touché.
   Moins d'éléments, et des mini-bentos à deux colonnes (comme sur ordinateur),
   au lieu d'une pile de cartes.
   ═════════════════════════════════════════════ */
.m-chans,.m-inclus,.m-swipe{display:none}
@media (max-width:640px){
  .m-swipe{display:none!important}
  .section{padding:56px 16px}
  .section__head{margin-bottom:18px}
  .section__head .lede{display:none}
  .h2{font-size:38px}

  /* ── hero : titre, une phrase, un bouton, et une petite composition ── */
  .hero{padding:92px 16px 28px;gap:22px}
  .hero__title{font-size:44px}
  .hero .eyebrow,.hero .link-arrow{display:none}
  .hero__sub{margin:18px 0 22px;font-size:16px}
  .stage{height:230px}
  .stage__grid,.cursor-hand,.piece--catalog,.piece--seg,.piece--toggle{display:none!important}
  .stage .piece{animation:none}
  .stage .piece--screen{left:0;top:0;width:58%}
  .stage .piece--type{left:auto;right:0;top:0;width:38%;height:112px}
  .stage .piece--type .type__big{font-size:40px}
  .stage .piece--btn{left:auto;right:0;top:128px}
  .stage .piece--chips{left:0;right:auto;top:auto;bottom:0}
  .scroll-hint{display:none}

  /* ── manifeste et bande : retirés sur mobile ── */
  .manif{display:none}

  /* ── travaux : bento 2 colonnes ── */
  html .bento--work{grid-template-columns:1fr 1fr!important;grid-auto-rows:120px!important;gap:10px!important;
    grid-template-areas:"ma ma" "ma ma" "fr lu" "fr lu" "fr lu" "im im" "im im" "mr mr" "mr mr"!important}
  .bento--work .tile__foot span{display:none!important}
  /* héros complets sur mobile : menus et boutons visibles, à l'échelle */
  .tile--mar .mar__nav{padding:10px 12px;gap:8px}
  .tile--mar .mar__links{display:none}
  .tile--mar .mar__nav i{padding:5px 9px;font-size:8px}
  .tile--mar .mar__copy p{font-size:10px;margin-top:6px}
  .matcha__hero{gap:6px}
  .matcha__hero p{font-size:13px}
  .matcha__btn{height:28px;padding:0 12px;font-size:9px}
  .matcha__hero small{margin-top:6px;font-size:8px}
  .lum__nav{padding:7px 9px;gap:6px;font-size:6px}
  .lum__logo{font-size:0}.lum__logo i{font-size:12px;width:15px;height:15px}
  .lum__btn{padding:3px 6px;margin-left:auto}
  .tile--immo .immo__page{padding:10px 10px 0}
  .tile--immo .immo__page h3{font-size:16px}
  .matcha__hero h3{font-size:30px}
  .tile--mar .mar__copy h3{font-size:18px}
  .lum__title em{font-size:36px}
  #travaux .bento--work>.tile::before{display:none}
  /* chaque projet garde tout le protagonisme de son hero : pas de légende */
  #travaux .bento--work .tile__foot{display:none!important}
  #travaux .tile--mar::after{background:linear-gradient(180deg,#080e1830,transparent 40%)}

  /* ── film : la scène seule ── */
  .film__row{display:none}

  /* ── pièces : 5 pièces, en bento ── */
  html .ap-board{display:grid!important;grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:26px 10px!important;flex-wrap:nowrap}
  html .ap-board>*{grid-column:auto!important;grid-row:auto!important;min-height:0;height:auto!important;flex:none!important;margin:0!important}
  .ap-board>*:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(6)){display:none!important}
  .ap-board>:nth-child(1),.ap-board>:nth-child(4),.ap-board>:nth-child(6){grid-column:1/-1!important}
  .ap-board>:nth-child(1){padding:22px!important}
  .ap-board>:nth-child(1) .ap-row{display:none}
  .ap-board>:nth-child(2){padding:26px 12px 16px!important}
  .ap-board>:nth-child(2) .ap-aa{font-size:56px}
  .ap-board>:nth-child(3){flex-direction:column!important;justify-content:center;padding:28px 10px 14px!important;border-radius:28px!important}
  .ap-board>:nth-child(3)>.ap-mut{display:none}
  .ap-board>:nth-child(3) .ap-hues{margin:0;display:grid;grid-template-columns:repeat(3,26px);gap:10px}
  .ap-board>:nth-child(3) .ap-hues button{width:26px;height:26px}
  .ap-board>:nth-child(4){padding:22px!important}
  .ap-board>:nth-child(4) .ap-clock{font-size:32px}
  .ap-board>:nth-child(6) .ap-mut{font-size:13px}

  /* ── atelier : texte, portrait + étapes côte à côte ── */
  html .bento--atelier{grid-template-columns:1fr 1fr!important;gap:22px 10px!important;grid-template-areas:"tx tx" "po po" "pr pr"!important}
  .bento--atelier .tile--value{display:none!important}
  .tile--text p:not(.big):not(.tile__kick){display:none}
  .tile--text .big{font-size:20px;margin:0}
  .pcard__bio{display:none}
  .pcard__photo{aspect-ratio:4/4!important;flex:none}
  .pcard__photo img{object-position:50% 28%!important}
  .pcard__body{padding:14px 8px 4px!important}
  .tile--process .process{grid-template-columns:1fr 1fr;gap:12px}
  .tile--process .process small{display:none}
  .tile--process .process span{font-size:18px}

  /* ── services : 2 × 2, titres seulement ── */
  html .bento--services{grid-template-columns:1fr 1fr!important;gap:26px 10px!important}
  .bento--services .tile--service{min-height:0;padding:22px 16px 16px;gap:8px}
  .bento--services .tile--service p{display:none}
  .bento--services .tile--service h3{font-size:19px}
  .bento--services .tile__tag{font-size:11px;padding:4px 9px}
  .bento--services .tile--service-wide{display:none!important}
  .m-inclus{display:block;margin-top:16px}
  .m-inclus p{margin:0;font-size:14px;color:var(--ink-2)}

  /* ── contact : trois canaux en une ligne, puis rendez-vous et formulaire ── */
  .m-chans{display:flex;gap:10px;margin:0 0 26px}
  .m-chans a{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;border-radius:20px;background:#171514;color:#f4f1ec;font:500 12px var(--font);box-shadow:0 20px 34px -22px rgba(23,21,20,.7),inset 0 0 0 1px rgba(244,241,236,.09)}
  .m-chans svg{width:22px;height:22px;fill:none;stroke:var(--accent-2);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .bento--contact{display:flex!important;flex-direction:column;gap:26px!important}
  .bento--contact>.tile--chan{display:none!important}
  .bento--contact>.tile--rdv{order:-1}
  .rdv__list,.tile--rdv .live{display:none}
  .rdv__num{font-size:56px}
  .tile--form .form__foot small{display:none}

  /* ── pied de page ── */
  .footer__giant{font-size:18vw;margin-bottom:22px}
  .footer__links,.footer__line{display:none}
}