/* ═══════════ MISE EN PLACE → architecture « LA CARTE » (menu gastronomique) ═══════════ */
/* colonne éditoriale resserrée + sections empilées */
html[data-da="mise-en-place"] .about-inner,
html[data-da="mise-en-place"] .story-inner{grid-template-columns:1fr;gap:3rem;max-width:820px;}
html[data-da="mise-en-place"] .skills-inner,
html[data-da="mise-en-place"] .projects-inner,
html[data-da="mise-en-place"] .contact-inner{max-width:880px;}

/* en-têtes de sections = services numérotés en termes de cuisine */
html[data-da="mise-en-place"] .section-tag{font-size:0;letter-spacing:0;}
html[data-da="mise-en-place"] .section-tag::before{
  font-family:var(--display);font-style:italic;font-weight:600;font-size:1rem;
  letter-spacing:.04em;color:var(--green);text-transform:none;}
html[data-da="mise-en-place"] #about .section-tag::before{content:'I — Le Chef';}
html[data-da="mise-en-place"] #skills .section-tag::before{content:'II — La Mise en Place';}
html[data-da="mise-en-place"] #projects .section-tag::before{content:'III — La Carte';}
html[data-da="mise-en-place"] #story .section-tag::before{content:'IV — Le Parcours';}
html[data-da="mise-en-place"] #contact .section-tag::before{content:"V — L'Addition";}

/* hero = couverture de menu */
html[data-da="mise-en-place"] .hero-prompt,
html[data-da="mise-en-place"] .hero-terminal{display:none;}
html[data-da="mise-en-place"] .hero-left::before{
  content:'❦  Maison Vellat · Lyon · Est. 2025  ❦';display:block;
  font-family:var(--display);font-style:italic;font-size:.92rem;letter-spacing:.1em;
  color:var(--green2);margin-bottom:1.6rem;}
html[data-da="mise-en-place"] h1.hero-name .green{animation:none;}
html[data-da="mise-en-place"] .hero-role{font-family:var(--display);font-style:italic;font-size:1rem;}
html[data-da="mise-en-place"] .hero-right{display:flex;align-items:center;justify-content:center;}

/* III — La Carte : projets en lignes de menu */
html[data-da="mise-en-place"] .proj-grid-clean{display:block;background:none;margin-top:2.5rem;}
html[data-da="mise-en-place"] .proj-card-clean{
  display:grid;grid-template-columns:120px 1fr;gap:1.6rem;align-items:center;
  background:none !important;border:none;border-bottom:1px solid rgba(var(--green-rgb),.22);
  border-radius:0;overflow:visible;padding:1.5rem .3rem;
  transition:padding .3s var(--ease),background .3s;}
html[data-da="mise-en-place"] .proj-card-clean:hover{
  background:rgba(var(--green-rgb),.05) !important;padding-left:1rem;padding-right:1rem;border-bottom-color:var(--green);}
html[data-da="mise-en-place"] .proj-vid-wrap{width:120px;height:84px;border-radius:8px;
  border:1px solid rgba(var(--green-rgb),.3);flex:none;}
html[data-da="mise-en-place"] .proj-vid-wrap video,
html[data-da="mise-en-place"] .proj-vid-wrap img{filter:brightness(.92) saturate(1.05) sepia(.12);}
html[data-da="mise-en-place"] .proj-vid-overlay{background:linear-gradient(to top,rgba(var(--bg-rgb),.45),transparent 70%);}
html[data-da="mise-en-place"] .proj-scan,
html[data-da="mise-en-place"] .proj-ext-icon{display:none;}
html[data-da="mise-en-place"] .proj-play-badge{width:28px;height:28px;font-size:.62rem;border-width:1.5px;}
html[data-da="mise-en-place"] .proj-num-badge{
  top:6px;left:6px;bottom:auto;width:24px;height:24px;padding:0;letter-spacing:0;
  font-family:var(--display);font-weight:900;font-size:.9rem;
  background:var(--green);color:var(--bg);border-radius:50%;
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(var(--bg-rgb),.5);}
html[data-da="mise-en-place"] .proj-text{
  padding:0;display:grid;grid-template-columns:1fr;
  grid-template-areas:'course' 'title' 'note' 'ingr';row-gap:.5rem;}
html[data-da="mise-en-place"] .proj-tag-line,
html[data-da="mise-en-place"] .proj-desc-text{display:none;}
/* intitulé du service (le plat sur la carte) */
html[data-da="mise-en-place"] .proj-text::before{
  content:attr(data-course);grid-area:course;
  font-family:var(--mono);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--green);}
/* note du chef */
html[data-da="mise-en-place"] .proj-text::after{
  content:'« ' attr(data-note) ' »';grid-area:note;
  font-family:var(--display);font-style:italic;font-size:.98rem;line-height:1.55;color:rgba(var(--text-rgb),.74);}
html[data-da="mise-en-place"] .proj-title-big{
  grid-area:title;display:flex;align-items:baseline;gap:.7rem;margin:0;
  font-size:1.55rem;font-weight:600;font-style:italic;white-space:nowrap;color:var(--text);}
html[data-da="mise-en-place"] .proj-title-big::after{
  content:'';flex:1 1 auto;min-width:1rem;height:0;
  border-bottom:1.5px dotted rgba(var(--green-rgb),.45);transform:translateY(-.3em);}
html[data-da="mise-en-place"] .proj-tech-chips{
  grid-area:ingr;flex-wrap:wrap;gap:.5rem;align-items:baseline;margin-top:.25rem;}
html[data-da="mise-en-place"] .proj-tech-chips::before{
  content:'Ingrédients —';font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--green2);opacity:.85;}
html[data-da="mise-en-place"] .proj-chip{
  border:none !important;background:none !important;padding:0;
  font-family:var(--mono);font-size:.62rem;letter-spacing:.05em;text-transform:uppercase;color:rgba(var(--text-rgb),.55) !important;}
html[data-da="mise-en-place"] .proj-chip:not(:last-child)::after{content:'  ·';color:var(--green2);}
/* aligner la vignette en haut du plat + ornement de carte */
html[data-da="mise-en-place"] .proj-card-clean{align-items:start;}
html[data-da="mise-en-place"] .proj-vid-wrap{margin-top:.15rem;}
html[data-da="mise-en-place"] .proj-grid-clean::before{
  content:'❦';display:block;text-align:center;color:var(--green);font-size:1.15rem;opacity:.7;margin-bottom:1.6rem;}
html[data-da="mise-en-place"] #projects .section-tag::after{
  content:'  ·  menu dégustation, six services';font-family:var(--display);font-style:italic;
  font-size:.82rem;letter-spacing:.02em;color:var(--green2);text-transform:none;}
/* dernière ligne = renvoi vers GitHub */
html[data-da="mise-en-place"] .proj-cta-card{
  flex-direction:row;justify-content:center;gap:.9rem;padding:1.6rem;background:none !important;
  border:none;border-top:2px solid rgba(var(--green-rgb),.25);border-radius:0;margin-top:.4rem;}
html[data-da="mise-en-place"] .proj-cta-card i{font-size:1.3rem;color:var(--green);}
html[data-da="mise-en-place"] .proj-cta-card span{font-family:var(--display);font-style:italic;color:var(--text) !important;}

/* ═══════════ MISE EN PLACE : STRUCTURE « CARTE CONTINUE » (squelette ≠ autres thèmes) ═══════════ */
/* au lieu de sections-panneaux pleine largeur : UNE colonne-menu étroite, centrée, sur un parchemin */
html[data-da="mise-en-place"] body{position:relative;}
html[data-da="mise-en-place"] body::before{
  content:'';position:absolute;top:0;bottom:0;left:50%;transform:translateX(-50%);
  width:min(860px,94vw);z-index:-1;pointer-events:none;
  background:linear-gradient(rgba(var(--bg-rgb),.74),rgba(var(--bg-rgb),.68));
  border-left:1px solid rgba(var(--green-rgb),.14);border-right:1px solid rgba(var(--green-rgb),.14);
  box-shadow:0 0 90px rgba(0,0,0,.45);}
/* sections : plus de panneaux distincts → flux continu transparent */
html[data-da="mise-en-place"] #hero,
html[data-da="mise-en-place"] #about,
html[data-da="mise-en-place"] #skills,
html[data-da="mise-en-place"] #projects,
html[data-da="mise-en-place"] #story,
html[data-da="mise-en-place"] #contact{
  background:transparent !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
  border:none !important;padding:3.4rem 2rem;}
html[data-da="mise-en-place"] #hero{min-height:auto;padding:8.5rem 2rem 2rem;}
html[data-da="mise-en-place"] footer{background:transparent !important;border:none !important;}
/* colonne unique centrée pour tout le contenu */
html[data-da="mise-en-place"] .hero-grid,
html[data-da="mise-en-place"] .about-inner,
html[data-da="mise-en-place"] .skills-inner,
html[data-da="mise-en-place"] .projects-inner,
html[data-da="mise-en-place"] .story-inner,
html[data-da="mise-en-place"] .contact-inner{
  grid-template-columns:1fr !important;max-width:680px !important;margin:0 auto !important;gap:2.4rem;}
/* en-têtes de services centrés */
html[data-da="mise-en-place"] .section-tag{text-align:center;display:block;}
html[data-da="mise-en-place"] .section-title{text-align:center;}
/* ornement typographique entre les services */
html[data-da="mise-en-place"] #about::before,
html[data-da="mise-en-place"] #skills::before,
html[data-da="mise-en-place"] #story::before,
html[data-da="mise-en-place"] #contact::before{
  content:'❧';display:block;text-align:center;color:var(--green);opacity:.5;font-size:1.15rem;margin-bottom:2.4rem;}
/* hero = couverture de menu centrée */
html[data-da="mise-en-place"] .hero-grid{align-items:center;}
html[data-da="mise-en-place"] .hero-left{text-align:center;}
html[data-da="mise-en-place"] .hero-btns{justify-content:center;}
html[data-da="mise-en-place"] .hero-status{justify-content:center;flex-wrap:wrap;gap:1.2rem;}
html[data-da="mise-en-place"] .hero-right{display:flex;justify-content:center;margin-top:1.5rem;}
html[data-da="mise-en-place"] .photo-wrap{max-width:230px;}
html[data-da="mise-en-place"] .hero-desc{margin-left:auto;margin-right:auto;max-width:460px;}


/* i18n — version anglaise des textes générés en CSS */
html[lang="en"][data-da="mise-en-place"] .proj-tech-chips::before{content:'Ingredients —';}
html[lang="en"][data-da="mise-en-place"] #projects .section-tag::after{content:'  ·  tasting menu, six services';}