:root {
  --navy: #1F2562; --cream: #EDF0CC; --mustard: #E8B530;
  --navy-soft: rgba(31, 37, 98, 0.6); --navy-line: rgba(31, 37, 98, 0.12);
}
@property --acc  { syntax:'<color>'; inherits:true; initial-value:#1F2562; }
@property --acc2 { syntax:'<color>'; inherits:true; initial-value:#4A5299; }

* { margin: 0; padding: 0; box-sizing: border-box; }
html { transition: --acc 900ms cubic-bezier(.4,0,.2,1), --acc2 900ms cubic-bezier(.4,0,.2,1); }
body { font-family: 'Inter', sans-serif; color: var(--navy); line-height: 1.5; font-weight: 400; overflow: hidden; background: var(--cream); }

/* ===== Champ de formes animé (remplace les mesh statiques) ===== */
.field { position: fixed; inset: 0; z-index: -1; overflow: hidden; background: var(--cream); }
.blob { position: absolute; border-radius: 50%; will-change: transform; } /* flou figé, jamais animé */
#far1 { left:-15%; top:-10%; width:80vw; height:80vw; opacity:.30; filter:blur(120px); background:radial-gradient(circle, var(--navy) 0%, transparent 70%); }
#far2 { right:-20%; bottom:-25%; width:90vw; height:90vw; opacity:.36; filter:blur(125px); background:radial-gradient(circle, var(--acc) 0%, transparent 72%); }
#mid1 { left:5%; top:5%; width:50vw; height:50vw; opacity:.52; filter:blur(68px); background:radial-gradient(circle, var(--acc2) 0%, transparent 66%); }
#mid2 { right:0; top:10%; width:45vw; height:45vw; opacity:.44; filter:blur(72px); background:radial-gradient(circle, var(--mustard) 0%, transparent 66%); }
#near { left:25%; bottom:-30%; width:55vw; height:55vw; opacity:.50; filter:blur(40px); background:radial-gradient(circle, var(--acc) 0%, transparent 64%); }
.mesh, .mesh-soft { background: transparent; }

/* ===== Nav (fixe, partagée) ===== */
nav { position: fixed; top:0; left:0; right:0; background: rgba(237,240,204,0.82); backdrop-filter: blur(12px); z-index: 100; padding: 18px 48px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--navy-line); }
.logo { font-family: 'Instrument Serif', serif; font-size: 24px; letter-spacing: -0.02em; cursor:pointer; }
.nav-links { display: flex; gap: 32px; list-style: none; font-size: 14px; }
.nav-links a { color: var(--navy); text-decoration: none; font-weight: 500; cursor:pointer; }
.nav-links a.active { color: var(--mustard); }
.nav-cta { font-size: 14px; padding: 10px 20px; background: var(--navy); color: var(--cream); border-radius: 999px; text-decoration: none; font-weight: 500; cursor:pointer; }

/* ===== Shell SPA ===== */
.scroll { height: 100vh; overflow-y: auto; }
.scroll::-webkit-scrollbar { width: 0; }
.page { display: none; opacity: 0; transition: opacity 380ms ease; }
.page.show { opacity: 1; }

section { padding: 120px 48px; max-width: 1280px; margin: 0 auto; }

/* Hero (commun) */
.hero { min-height: 88vh; display: flex; flex-direction: column; justify-content: center; padding-top: 130px; padding-bottom: 80px; }
.tagline { font-size: 14px; text-transform: uppercase; letter-spacing: 0.2em; color: var(--navy-soft); margin-bottom: 32px; font-weight: 500; }
.hero h1 { font-family: 'Instrument Serif', serif; font-size: clamp(72px, 12vw, 160px); line-height: 0.9; font-weight: 400; letter-spacing: -0.04em; margin-bottom: 48px; }
.hero h1 em { font-style: italic; color: var(--navy-soft); }
.hero p { font-size: clamp(20px, 2.4vw, 28px); line-height: 1.4; max-width: 880px; margin-bottom: 20px; font-weight: 400; }
.hero-promise { font-family: 'Instrument Serif', serif; font-style: italic; font-size: clamp(24px, 3vw, 36px) !important; color: var(--navy); margin-top: 24px !important; margin-bottom: 40px !important; }
.btn-primary { display: inline-block; padding: 18px 36px; background: var(--navy); color: var(--cream); text-decoration: none; border-radius: 999px; font-size: 16px; font-weight: 500; width: fit-content; cursor:pointer; transition: transform 0.2s; }
.btn-primary:hover { transform: translateY(-2px); }

/* ===== HOME ===== */
.position h2 { font-family:'Instrument Serif',serif; font-size:clamp(48px,7vw,88px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:48px; max-width:1100px; }
.use-cases { list-style:none; margin-bottom:48px; }
.use-cases li { font-size:clamp(16px,1.4vw,20px); line-height:1.5; padding:12px 0; border-bottom:1px solid var(--navy-line); transition:padding-left .3s,color .3s; }
.use-cases li:hover { padding-left:16px; color:var(--navy); }
.use-cases li:first-child { border-top:1px solid var(--navy-line); }
.use-cases li.more { font-family:'Instrument Serif',serif; font-size:clamp(20px,2vw,28px); color:var(--navy-soft); letter-spacing:0.1em; border-bottom:none; padding-top:20px; }
.use-cases li.more:hover { padding-left:0; }
.services h2, .apps h2 { font-family:'Instrument Serif',serif; font-size:clamp(40px,5vw,64px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:64px; }
.apps h2 { margin-bottom:48px; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.service { padding:48px; border-radius:24px; background:rgba(255,255,255,0.5); border:1px solid var(--navy-line); min-height:320px; display:flex; flex-direction:column; justify-content:space-between; transition:transform .3s,background .3s; }
.service:hover { transform:translateY(-4px); background:rgba(255,255,255,0.8); }
.service-name { font-family:'Instrument Serif',serif; font-size:48px; line-height:1; margin-bottom:12px; letter-spacing:-0.02em; }
.service-tagline { font-family:'Instrument Serif',serif; font-style:italic; font-size:22px; color:var(--navy-soft); margin-bottom:24px; }
.service-body { font-size:16px; line-height:1.5; flex:1; margin-bottom:24px; }
.service-link { color:var(--navy); text-decoration:none; font-weight:500; font-size:15px; cursor:pointer; }
.service-link::after { content:' →'; }
.apps-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.app { padding:40px; border-radius:20px; background:#FFFFFF; min-height:280px; display:flex; flex-direction:column; justify-content:space-between; transition:transform .3s,box-shadow .3s; border-top:4px solid var(--mustard); box-shadow:0 2px 12px rgba(31,37,98,0.04); }
.app:hover { transform:translateY(-4px); box-shadow:0 8px 24px rgba(31,37,98,0.08); }
.app.soon { background:transparent; border:1px dashed var(--navy); border-top:4px dashed var(--mustard); box-shadow:none; }
.app-name { font-family:'Instrument Serif',serif; font-size:32px; margin-bottom:8px; letter-spacing:-0.02em; line-height:1; }
.app-promise { font-family:'Instrument Serif',serif; font-style:italic; font-size:18px; color:var(--navy-soft); margin-bottom:32px; }
.app-price { font-size:18px; font-weight:600; color:var(--mustard); margin-bottom:8px; }
.app-cta { display:inline-block; color:var(--navy); text-decoration:none; font-size:14px; font-weight:500; }
.app.soon .app-cta { color:var(--navy-soft); }
.team h2 { font-family:'Instrument Serif',serif; font-size:clamp(40px,5vw,64px); line-height:1.05; font-weight:400; letter-spacing:-0.03em; margin-bottom:40px; max-width:900px; }
.team p { font-size:clamp(18px,2vw,22px); line-height:1.5; max-width:880px; }

/* ===== ENGINE ===== */
.method h2 { font-family:'Instrument Serif',serif; font-size:clamp(48px,7vw,88px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:64px; max-width:1100px; }
.method-steps { list-style:none; counter-reset:step; }
.method-steps li { counter-increment:step; padding:32px 0; border-bottom:1px solid var(--navy-line); font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(24px,3vw,40px); line-height:1.3; display:flex; align-items:baseline; gap:32px; }
.method-steps li::before { content:counter(step,decimal-leading-zero); font-family:'Inter',sans-serif; font-style:normal; font-size:14px; color:var(--mustard); font-weight:600; letter-spacing:0.1em; flex-shrink:0; min-width:32px; }
.method-steps li:first-child { border-top:1px solid var(--navy-line); }
.modalities h2, .cases h2 { font-family:'Instrument Serif',serif; font-size:clamp(40px,5vw,64px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:64px; }
.modalities-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.modality { padding:48px; border-radius:24px; background:rgba(255,255,255,0.5); border:1px solid var(--navy-line); min-height:320px; display:flex; flex-direction:column; transition:transform .3s,background .3s; }
.modality:hover { transform:translateY(-4px); background:rgba(255,255,255,0.8); }
.modality-name { font-family:'Instrument Serif',serif; font-size:36px; line-height:1; margin-bottom:12px; letter-spacing:-0.02em; }
.modality-tagline { font-family:'Instrument Serif',serif; font-style:italic; font-size:20px; color:var(--navy-soft); margin-bottom:24px; }
.modality-body { font-size:16px; line-height:1.5; }
.case-list { list-style:none; }
.case-item { padding:40px 0; border-bottom:1px solid var(--navy-line); display:grid; grid-template-columns:1fr 2fr; gap:48px; align-items:baseline; transition:padding-left .3s; }
.case-item:hover { padding-left:16px; }
.case-item:first-child { border-top:1px solid var(--navy-line); }
.case-title { font-family:'Instrument Serif',serif; font-size:clamp(22px,2.4vw,32px); line-height:1.2; letter-spacing:-0.02em; }
.case-body { font-size:16px; line-height:1.5; color:var(--navy-soft); }

/* ===== STUDIO ===== */
.manifesto h2 { font-family:'Instrument Serif',serif; font-size:clamp(48px,7vw,88px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:48px; }
.manifesto p { font-size:clamp(20px,2.2vw,28px); line-height:1.4; max-width:900px; margin-bottom:20px; font-family:'Instrument Serif',serif; font-style:italic; }
.ai-input h2 { font-family:'Instrument Serif',serif; font-size:clamp(40px,5vw,64px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:48px; }
.ai-input p { font-size:clamp(18px,2vw,24px); line-height:1.5; max-width:900px; margin-bottom:24px; }
.ai-input p.lead { font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(24px,3vw,36px); line-height:1.3; margin-bottom:40px; }
.projects h2 { font-family:'Instrument Serif',serif; font-size:clamp(40px,5vw,64px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:64px; }
.project-list { list-style:none; }
.project { padding:32px 0; border-bottom:1px solid var(--navy-line); display:grid; grid-template-columns:2fr 3fr; gap:48px; align-items:baseline; transition:padding-left .3s; }
.project:hover { padding-left:16px; }
.project:first-child { border-top:1px solid var(--navy-line); }
.project-client { font-family:'Instrument Serif',serif; font-size:clamp(22px,2.4vw,32px); line-height:1.2; letter-spacing:-0.02em; }
.project-location { font-style:italic; color:var(--navy-soft); font-family:'Inter',sans-serif; font-size:0.7em; margin-left:8px; }
.project-details { font-size:16px; line-height:1.5; color:var(--navy-soft); }
.white-label { margin-top:80px; padding-top:48px; border-top:1px solid var(--navy-line); text-align:center; }
.white-label p { font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(22px,2.6vw,32px); line-height:1.4; margin-bottom:16px; }
.white-label .agencies { font-family:'Inter',sans-serif; font-size:14px; letter-spacing:0.15em; color:var(--navy-soft); font-weight:600; text-transform:uppercase; }

/* ===== WHY (Engine + Studio) ===== */
.why h2 { font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(48px,7vw,88px); line-height:1; font-weight:400; letter-spacing:-0.03em; margin-bottom:64px; }
.why-list { list-style:none; counter-reset:why; }
.why-list li { counter-increment:why; padding:28px 0; border-bottom:1px solid var(--navy-line); font-size:clamp(18px,2vw,22px); line-height:1.5; display:flex; align-items:baseline; gap:32px; }
.why-list li::before { content:counter(why,decimal-leading-zero); font-size:14px; color:var(--mustard); font-weight:600; letter-spacing:0.1em; flex-shrink:0; min-width:32px; }
.why-list li:first-child { border-top:1px solid var(--navy-line); }

/* ===== CARE (Engine + Academy) ===== */
.care { text-align:center; padding:120px 48px; }
.care h2 { font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(48px,6vw,72px); font-weight:400; line-height:1.1; margin-bottom:40px; }
.care p { font-size:clamp(18px,2vw,22px); max-width:800px; margin:0 auto; line-height:1.6; }

/* ===== ACADEMY ===== */
.hero-badges { display:flex; gap:12px; margin-bottom:32px; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; padding:8px 18px; border:1.5px solid var(--navy-line); border-radius:999px; font-size:13px; font-weight:500; color:var(--navy-soft); }
.hero-badge.qualiopi { border-color:var(--navy); color:var(--navy); font-weight:600; }
.hero-tracks { display:flex; gap:16px; flex-wrap:wrap; }
.track-pill { display:inline-flex; align-items:center; gap:10px; padding:12px 24px; border:1.5px solid var(--navy); border-radius:999px; font-size:14px; font-weight:500; color:var(--navy); text-decoration:none; transition:background .2s,color .2s; }
.track-pill:hover { background:var(--navy); color:var(--cream); }
.track-pill .ltr { font-size:11px; font-weight:700; letter-spacing:0.1em; color:var(--mustard); }
.tracks-grid { display:grid; grid-template-columns:1fr 1fr; gap:32px; margin-top:64px; }
.track-block { padding:48px; border-radius:24px; background:rgba(255,255,255,0.5); border:1px solid var(--navy-line); transition:transform .3s,background .3s; }
.track-block:hover { transform:translateY(-4px); background:rgba(255,255,255,0.8); }
.track-index { font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--mustard); margin-bottom:20px; }
.track-title { font-family:'Instrument Serif',serif; font-size:clamp(28px,3vw,40px); letter-spacing:-0.02em; line-height:1.1; margin-bottom:16px; }
.track-desc { font-size:16px; line-height:1.6; color:var(--navy-soft); margin-bottom:28px; }
.track-target { font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:0.08em; color:var(--navy-soft); }
.track-target span { font-weight:400; text-transform:none; letter-spacing:0; margin-left:6px; color:var(--navy); }
.catalogue-section { padding-top:120px; padding-bottom:120px; }
.catalogue-header { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:48px; }
.catalogue-header h2 { font-family:'Instrument Serif',serif; font-size:clamp(40px,5vw,64px); line-height:1; letter-spacing:-0.03em; margin-bottom:12px; }
.catalogue-header p { font-size:16px; color:var(--navy-soft); max-width:480px; line-height:1.6; }
.track-toggle { display:flex; border:1.5px solid var(--navy); border-radius:999px; overflow:hidden; flex-shrink:0; }
.toggle-btn { padding:10px 24px; font-size:13px; font-weight:600; background:transparent; color:var(--navy-soft); border:none; cursor:pointer; transition:all .2s; font-family:'Inter',sans-serif; }
.toggle-btn.active { background:var(--navy); color:var(--cream); }
.catalogue-pane { display:none; }
.catalogue-pane.active { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.module-card { padding:36px 28px; border-radius:16px; background:rgba(255,255,255,0.5); border:1px solid var(--navy-line); min-height:280px; display:flex; flex-direction:column; justify-content:space-between; transition:transform .25s,background .25s; }
.module-card:hover { transform:translateY(-4px); background:rgba(255,255,255,0.85); }
.module-card.soon { opacity:0.5; pointer-events:none; }
.module-num { font-size:11px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--mustard); margin-bottom:24px; }
.module-title { font-family:'Instrument Serif',serif; font-size:20px; letter-spacing:-0.01em; line-height:1.2; margin-bottom:10px; }
.module-subtitle { font-size:13px; color:var(--navy-soft); line-height:1.6; }
.module-footer { display:flex; align-items:center; justify-content:space-between; margin-top:28px; padding-top:20px; border-top:1px solid var(--navy-line); }
.module-duration { font-size:12px; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--navy-soft); }
.module-tag { font-size:11px; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--navy-soft); border:1px solid var(--navy-line); padding:4px 10px; border-radius:999px; }
.module-tag.dispo { color:var(--navy); border-color:var(--navy); }
.cta-block { text-align:center; padding:120px 48px; }
.cta-block h2 { font-family:'Instrument Serif',serif; font-style:italic; font-size:clamp(48px,6vw,80px); line-height:1.05; letter-spacing:-0.03em; margin-bottom:24px; }
.cta-block p { font-size:18px; color:var(--navy-soft); max-width:480px; margin:0 auto 40px; line-height:1.6; }

/* ===== Footer ===== */
footer { padding:60px 48px 40px; border-top:1px solid var(--navy-line); max-width:1280px; margin:0 auto; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:48px; margin-bottom:48px; }
.footer-logo { font-family:'Instrument Serif',serif; font-size:32px; margin-bottom:8px; }
.footer-addr { font-size:14px; color:var(--navy-soft); line-height:1.6; }
.footer-col h4 { font-size:12px; text-transform:uppercase; letter-spacing:0.1em; margin-bottom:16px; font-weight:600; }
.footer-col a { display:block; font-size:14px; color:var(--navy); text-decoration:none; margin-bottom:8px; cursor:pointer; }
.footer-bottom { padding-top:32px; border-top:1px solid var(--navy-line); display:flex; justify-content:space-between; align-items:center; font-size:13px; color:var(--navy-soft); }
.footer-bottom .sig { font-family:'Instrument Serif',serif; font-style:italic; font-size:16px; color:var(--navy); }

.draft-note { font-size:12px; font-weight:600; color:var(--mustard); letter-spacing:0.04em; margin-top:16px; }

@media (max-width: 900px) {
  nav { padding:16px 24px; } .nav-links { display:none; }
  section { padding:80px 24px; }
  .services-grid, .apps-grid, .modalities-grid, .tracks-grid { grid-template-columns:1fr; }
  .case-item, .project { grid-template-columns:1fr; gap:16px; }
  .catalogue-pane.active { grid-template-columns:repeat(2,1fr); }
  .catalogue-header { flex-direction:column; align-items:flex-start; gap:24px; }
  .footer-grid { grid-template-columns:1fr; gap:32px; }
}

:root { --logo: url(logo.png); }
.brand { background: var(--logo) left center / contain no-repeat; display:block; }
.brand-nav { height:22px; width:84px; }
.brand-foot { height:30px; width:112px; }
.nav-right { display:flex; align-items:center; gap:16px; }
.lang-switch { display:flex; border:1px solid var(--navy-line); border-radius:999px; overflow:hidden; }
.lang-btn { font:600 12px Inter,sans-serif; padding:6px 12px; background:transparent; color:var(--navy-soft); border:none; cursor:pointer; letter-spacing:.04em; transition:all .2s; }
.lang-btn.active { background:var(--navy); color:var(--cream); }

/* ===== Menu mobile ===== */
/* Le bouton et le panneau n'existent qu'en dessous de 900px : au-dessus, la
   barre de navigation reste rigoureusement celle d'origine. */
.burger { display:none; width:40px; height:40px; padding:0; margin-left:4px; border:0; background:none; cursor:pointer; position:relative; }
.burger span { position:absolute; left:10px; width:20px; height:1.5px; background:var(--navy); border-radius:2px; transition:transform 260ms cubic-bezier(.4,0,.2,1), opacity 160ms ease; }
.burger span:nth-child(1) { top:14px; }
.burger span:nth-child(2) { top:19.5px; }
.burger span:nth-child(3) { top:25px; }
.burger[aria-expanded="true"] span:nth-child(1) { transform:translateY(5.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform:translateY(-5.5px) rotate(-45deg); }
.burger:focus-visible { outline:2px solid var(--navy); outline-offset:2px; border-radius:4px; }

.mobile-menu { position:absolute; top:100%; left:0; right:0; background:var(--cream); border-bottom:1px solid var(--navy-line); box-shadow:0 12px 32px rgba(31,37,98,0.10); padding:8px 24px 28px; opacity:0; transform:translateY(-8px); transition:opacity 220ms ease, transform 220ms cubic-bezier(.4,0,.2,1); }
.mobile-menu.open { opacity:1; transform:translateY(0); }
.mm-links { display:flex; flex-direction:column; }
.mm-links a, .mm-links button { display:block; width:100%; text-align:left; background:none; border:0; border-radius:0; font-family:'Instrument Serif',serif; font-size:30px; line-height:1.25; letter-spacing:-0.02em; color:var(--navy); text-decoration:none; padding:11px 0; border-bottom:1px solid var(--navy-line); cursor:pointer; }
.mm-links a.active, .mm-links button.active { color:var(--mustard); }
.mm-links button:focus-visible, .mm-cta:focus-visible, .mm-foot .lang-btn:focus-visible { outline:2px solid var(--navy); outline-offset:2px; }
.mm-foot { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:24px; }
.mm-foot .lang-switch { margin:0; }
.mm-cta { border:0; font-family:inherit; font-size:15px; padding:12px 24px; background:var(--navy); color:var(--cream); border-radius:999px; text-decoration:none; font-weight:500; cursor:pointer; }
.mm-addr { margin-top:22px; font-size:13px; line-height:1.65; color:var(--navy-soft); }

@media (max-width: 900px) {
  .burger { display:block; }
  /* Le sélecteur de langue et l'appel à l'action passent dans le panneau :
     la barre ne garde que le logo et le bouton. */
  nav .nav-right > .lang-switch, nav > .nav-right > .nav-cta { display:none; }
}
@media (min-width: 901px) {
  .mobile-menu { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  .burger span, .mobile-menu { transition:none; }
}
