@import url('fonts.css');

  :root{
    --ink:#133A63;
    --navy:#0C2340;
    --navy2:#17456F;
    --paper:#ECEBE5;
    --paper2:#E1E0D8;
    --brand:#1668A8;
    --cyan:#17A6E6;
    --soft:#5A5F63;
    --mist:#93A9BE;
    --line-d:rgba(255,255,255,.14);
    --line-l:rgba(10,14,19,.12);
    --serif:'Playfair Display',Georgia,'Times New Roman',serif;
    --sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",Arial,sans-serif;
    --mono:"SF Mono","JetBrains Mono",ui-monospace,Menlo,monospace;
    --gut:clamp(1.3rem,5vw,6rem);
    --max:1360px;
    --e:cubic-bezier(.19,1,.22,1);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{color-scheme:dark;scroll-behavior:smooth;}
  body{background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;cursor:none;}
  a{color:inherit;text-decoration:none;}
  ::selection{background:var(--cyan);color:#fff;}
  .wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut);}
  .serif{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;}
  .lab{font-family:var(--mono);text-transform:uppercase;letter-spacing:.22em;font-size:.66rem;}

  /* ---- custom cursor ---- */
  .cur,.cur-d{position:fixed;top:0;left:0;z-index:9999;pointer-events:none;border-radius:50%;mix-blend-mode:difference;}
  .cur{width:7px;height:7px;background:#fff;transform:translate(-50%,-50%);transition:width .25s var(--e),height .25s var(--e);}
  .cur-d{width:34px;height:34px;border:1px solid rgba(255,255,255,.6);transform:translate(-50%,-50%);transition:transform .18s ease-out,width .25s,height .25s;}
  body.hovering .cur{width:0;height:0;}
  body.hovering .cur-d{width:56px;height:56px;background:rgba(255,255,255,.08);}
  @media (pointer:coarse){.cur,.cur-d{display:none;}body{cursor:auto;}}

  /* ---- header ---- */
  header{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .4s var(--e),border-color .4s,padding .4s;padding:1.5rem 0;border-bottom:1px solid transparent;}
  header.solid{background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(14px) saturate(1.3);border-bottom-color:var(--line-l);padding:.9rem 0;}
  .nav{display:flex;align-items:center;justify-content:space-between;}
  .brand{display:flex;align-items:center;gap:.65rem;color:#fff;transition:color .4s;}
  header.solid .brand{color:var(--ink);}
  .brand .mk{width:30px;height:30px;}
  .brand b{font-family:var(--serif);font-size:1.35rem;font-weight:400;letter-spacing:.01em;}
  .brand b i{font-style:italic;color:var(--cyan);}
  .menu{display:flex;gap:2rem;align-items:center;}
  .menu a{font-size:.82rem;color:rgba(255,255,255,.8);transition:color .3s;position:relative;}
  header.solid .menu a{color:var(--soft);}
  .menu a:hover{color:var(--cyan);}
  .cta-btn{font-family:var(--sans);font-size:.78rem;font-weight:600;color:var(--ink);background:#fff;padding:.7rem 1.25rem;border-radius:100px;transition:background .3s,color .3s,transform .3s var(--e);}
  header.solid .cta-btn{background:var(--ink);color:#fff;}
  .cta-btn:hover{background:var(--cyan);color:#fff;transform:translateY(-2px);}
  @media(max-width:900px){.menu{display:none;}}

  /* ---- HERO ---- */
  .hero{position:relative;min-height:100svh;background:var(--navy);color:#fff;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;}
  #flow{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-2;}
  .hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(120% 90% at 75% 0%,rgba(23,166,230,.16),transparent 55%),linear-gradient(180deg,rgba(4,12,22,.2),rgba(4,12,22,.72));}
  .hero-in{padding-bottom:clamp(3rem,7vw,6rem);padding-top:9rem;width:100%;}
  .hero .top{display:flex;justify-content:space-between;align-items:baseline;color:var(--mist);margin-bottom:auto;}
  .hero-h{font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,6.6vw,6.2rem);line-height:1.02;letter-spacing:-.02em;max-width:16ch;}
  .hero-h .ln{display:block;overflow:hidden;}
  .hero-h .ln > span{display:block;transform:translateY(115%);opacity:0;animation:rise 1.1s var(--e) forwards;}
  .hero-h .ln:nth-child(2) > span{animation-delay:.12s;}
  .hero-h .ln:nth-child(3) > span{animation-delay:.24s;}
  .hero-h em{font-style:italic;color:var(--cyan);}
  .cyc{display:inline-block;position:relative;color:var(--cyan);}
  .cyc span{position:absolute;left:0;top:0;white-space:nowrap;opacity:0;font-style:italic;}
  .cyc span.on{opacity:1;position:relative;}
  .hero-sub{margin-top:1.8rem;max-width:52ch;color:rgba(255,255,255,.82);font-size:clamp(1.02rem,1.5vw,1.28rem);line-height:1.6;opacity:0;animation:fade 1s ease .7s forwards;}
  .hero-acts{display:flex;gap:1rem;margin-top:2.2rem;flex-wrap:wrap;opacity:0;animation:fade 1s ease .85s forwards;}
  .b1,.b2{display:inline-flex;align-items:center;gap:.6rem;font-size:.9rem;font-weight:600;padding:1rem 1.7rem;border-radius:100px;transition:transform .35s var(--e),background .3s,color .3s;}
  .b1{background:#fff;color:var(--ink);}
  .b1:hover{background:var(--cyan);color:#fff;transform:translateY(-2px);}
  .b2{border:1px solid rgba(255,255,255,.3);color:#fff;}
  .b2:hover{background:rgba(255,255,255,.1);transform:translateY(-2px);}
  .scroll-cue{position:absolute;bottom:1.6rem;right:var(--gut);display:flex;align-items:center;gap:.6rem;color:var(--mist);}
  .scroll-cue .ln{width:44px;height:1px;background:var(--mist);position:relative;overflow:hidden;}
  .scroll-cue .ln::after{content:"";position:absolute;inset:0;background:var(--cyan);transform:translateX(-100%);animation:cue 2.4s var(--e) infinite;}
  @media(max-width:600px){.scroll-cue{display:none;}}

  /* ---- section frame ---- */
  section{position:relative;}
  .pad{padding-block:clamp(5rem,11vw,10rem);}
  .eyebrow{display:flex;align-items:center;gap:.8rem;color:var(--brand);margin-bottom:2rem;}
  .eyebrow .num{font-family:var(--mono);font-size:.72rem;}
  .eyebrow::before{content:"";width:34px;height:1px;background:var(--brand);}
  .rv{opacity:0;transform:translateY(30px);transition:opacity .9s var(--e),transform .9s var(--e);}
  .rv.in{opacity:1;transform:none;}
  .rv-d{transition-delay:.08s;} .rv-d2{transition-delay:.16s;} .rv-d3{transition-delay:.24s;}

  /* ---- manifeste ---- */
  .manifeste{background:var(--paper);}
  .manifeste .big{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,4.4vw,3.4rem);line-height:1.22;letter-spacing:-.01em;max-width:24ch;text-wrap:balance;}
  .manifeste .big b{font-style:normal;color:var(--brand);font-weight:400;}
  .manifeste .cols{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(2rem,6vw,5rem);align-items:end;margin-top:3rem;}
  .manifeste .lead{color:var(--soft);font-size:1.06rem;line-height:1.7;max-width:44ch;}
  @media(max-width:820px){.manifeste .cols{grid-template-columns:1fr;}}

  /* ---- expertises (dark) ---- */
  .exp{background:#0A1D33;color:#fff;}
  .exp .head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:3rem;}
  .exp h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.4rem);letter-spacing:-.02em;max-width:14ch;}
  .exp-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-d);}
  .pole{border-bottom:1px solid var(--line-d);border-right:1px solid var(--line-d);padding:2.4rem 2rem 2.6rem;position:relative;overflow:hidden;transition:background .5s var(--e);}
  .pole:nth-child(3n){border-right:0;}
  .pole::before{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--e);}
  .pole:hover{background:var(--navy);}
  .pole:hover::before{transform:scaleX(1);}
  .pole .n{font-family:var(--mono);font-size:.72rem;color:var(--cyan);}
  .pole h3{font-family:var(--serif);font-weight:400;font-size:1.7rem;margin:1.4rem 0 .7rem;letter-spacing:-.01em;}
  .pole p{color:var(--mist);font-size:.93rem;line-height:1.6;}
  .pole .go{margin-top:1.3rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;opacity:0;transform:translateX(-6px);transition:opacity .4s,transform .4s;}
  .pole:hover .go{opacity:1;transform:none;}
  @media(max-width:820px){.exp-grid{grid-template-columns:1fr;}.pole{border-right:0;}}

  /* ---- réalisations ---- */
  .work{background:var(--paper);}
  .work .head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-bottom:3rem;}
  .work h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.4rem);letter-spacing:-.02em;}
  .work-list{display:flex;flex-direction:column;gap:clamp(2.5rem,5vw,4.5rem);}
  .case{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;}
  .case:nth-child(even){grid-template-columns:1fr 1fr;}
  .case:nth-child(even) .case-media{order:2;}
  .case-media{position:relative;border-radius:6px;overflow:hidden;aspect-ratio:4/3;isolation:isolate;}
  .case-media .art{position:absolute;inset:0;z-index:-1;background-size:cover;background-position:center;transition:transform 1.1s var(--e),filter .6s;filter:saturate(.85);}
  .case:hover .case-media .art{transform:scale(1.05);filter:saturate(1.05);}
  .case-media .tag{position:absolute;top:1rem;left:1rem;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;background:rgba(7,24,42,.6);color:#fff;padding:.35rem .7rem;border-radius:100px;backdrop-filter:blur(6px);}
  .case-body .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brand);}
  .case-body h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3.4vw,2.6rem);letter-spacing:-.02em;margin:.6rem 0 .8rem;}
  .case-body p{color:var(--soft);font-size:1rem;line-height:1.65;max-width:46ch;}
  .case-body .exps{display:flex;flex-wrap:wrap;gap:.4rem;margin:1.2rem 0 1.4rem;}
  .case-body .exps span{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line-l);padding:.35rem .7rem;border-radius:100px;color:var(--soft);}
  .case-body .cta{display:inline-flex;align-items:center;gap:.8rem;padding:.5rem .5rem .5rem 1.3rem;border:1px solid var(--brand);border-radius:100px;color:var(--brand);font-weight:600;font-size:.85rem;width:fit-content;transition:background .4s var(--e),color .4s var(--e);}
  .case-body .cta:hover{background:var(--brand);color:#fff;}
  .case-body .cta .cta-ic{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;transition:background .4s var(--e),color .4s var(--e),transform .4s var(--e);}
  .case-body .cta:hover .cta-ic{background:#fff;color:var(--brand);transform:translateX(3px);}
  .case-body .cta .cta-ic svg{width:15px;height:15px;display:block;}
  @media(max-width:760px){.case,.case:nth-child(even){grid-template-columns:1fr;}.case:nth-child(even) .case-media{order:0;}}

  /* ---- chiffres (dark) ---- */
  .stats{background:var(--navy);color:#fff;}
  .stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line-d);border:1px solid var(--line-d);}
  .stat{background:var(--navy);padding:2.4rem 1.8rem;}
  .stat .n{font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,5vw,4rem);letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums;}
  .stat .n .todo{font-size:1rem;color:var(--cyan);vertical-align:super;}
  .stat .l{color:var(--mist);font-size:.82rem;margin-top:.7rem;}
  @media(max-width:760px){.stats-grid{grid-template-columns:1fr 1fr;}}

  /* ---- méthode ---- */
  .method{background:var(--paper);}
  .method h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.4rem);letter-spacing:-.02em;max-width:16ch;margin-bottom:3rem;}
  .steps{display:grid;grid-template-columns:repeat(5,1fr);gap:1.5rem;}
  .step{border-top:2px solid var(--ink);padding-top:1.2rem;transition:border-color .4s;}
  .step:hover{border-color:var(--cyan);}
  .step .n{font-family:var(--mono);font-size:.72rem;color:var(--brand);}
  .step h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;margin:.6rem 0 .5rem;}
  .step p{color:var(--soft);font-size:.88rem;line-height:1.55;}
  @media(max-width:900px){.steps{grid-template-columns:1fr 1fr;}}
  @media(max-width:520px){.steps{grid-template-columns:1fr;}}

  /* ---- medica ---- */
  .medica{background:var(--ink);color:#fff;}
  .medica-in{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center;background:linear-gradient(120deg,var(--navy),var(--navy2));border:1px solid var(--line-d);border-radius:10px;padding:clamp(2.5rem,5vw,4.5rem);position:relative;overflow:hidden;}
  .medica-in .glow{position:absolute;top:-40%;right:-8%;width:52%;aspect-ratio:1;background:radial-gradient(circle,rgba(23,166,230,.4),transparent 60%);filter:blur(28px);}
  .medica h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3.8vw,2.8rem);letter-spacing:-.02em;position:relative;}
  .medica p{color:var(--mist);max-width:44ch;margin:1rem 0 1.6rem;position:relative;line-height:1.65;}
  .medica .lab{color:var(--cyan);margin-bottom:1rem;display:block;}
  .medica-in .side{position:relative;text-align:right;}
  .medica-in .side .big{font-family:var(--serif);font-size:clamp(3rem,8vw,5.5rem);line-height:.9;}
  @media(max-width:820px){.medica-in{grid-template-columns:1fr;}.medica-in .side{text-align:left;}}

  /* ---- CTA final ---- */

  /* ---- footer ---- */
  footer{background:var(--ink);color:#fff;padding-top:clamp(3.5rem,7vw,6rem);}

  @keyframes rise{to{transform:translateY(0);opacity:1;}}
  @keyframes fade{to{opacity:1;}}
  @keyframes cue{0%{transform:translateX(-100%);}50%{transform:translateX(0);}100%{transform:translateX(100%);}}
  @media (prefers-reduced-motion:reduce){
    *{animation-duration:.001s!important;transition-duration:.001s!important;}
    .hero-h .ln>span,.hero-sub,.hero-acts{opacity:1;transform:none;}
    #flow{display:none;}
    .rv{opacity:1;transform:none;}
  }

/* liens éditoriaux réutilisables */
.pole{text-decoration:none;color:inherit;display:block;}
/* Bouton graphique « méthode » */
.cta-round{display:inline-flex;align-items:center;gap:1.1rem;padding:.5rem .5rem .5rem 1.5rem;border:1px solid var(--brand);border-radius:100px;color:var(--brand);font-weight:600;font-size:.95rem;line-height:1;width:fit-content;background:transparent;transition:background .45s var(--e),color .45s var(--e),box-shadow .45s var(--e);}
.cta-round:hover{background:var(--brand);color:#fff;box-shadow:0 14px 34px -14px rgba(22,104,168,.7);}
.cta-round-txt{white-space:nowrap;}
.cta-round-ic{flex:0 0 auto;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--brand);color:#fff;transition:background .45s var(--e),color .45s var(--e),transform .45s var(--e);}
.cta-round:hover .cta-round-ic{background:#fff;color:var(--brand);transform:translateX(4px);}
.cta-round-ic svg{width:17px;height:17px;display:block;}
/* Boutons d en-tete de section (graphiques, adaptatifs clair/sombre) */
.head-link{display:inline-flex;align-items:center;gap:.75rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;border:1px solid currentColor;border-radius:100px;padding:.55rem .55rem .55rem 1.2rem;white-space:nowrap;transition:background .4s var(--e),color .4s var(--e),border-color .4s var(--e);}
.head-link .hl-ic{flex:0 0 auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid currentColor;transition:transform .4s var(--e);}
.head-link .hl-ic svg{width:13px;height:13px;display:block;}
.head-link:hover .hl-ic{transform:translateX(3px);}
.exp .head-link:hover{background:#fff;color:var(--ink);border-color:#fff;}
.work .head-link:hover{background:var(--ink);color:#fff;border-color:var(--ink);}
/* Icones des 6 poles d expertise */
.pole-ic{display:block;color:var(--cyan);margin-bottom:1.3rem;}
.pole-ic svg{width:30px;height:30px;display:block;}

/* Icones des chiffres */
.stat-ic{display:block;color:var(--cyan);margin-bottom:1.1rem;}
.stat-ic svg{width:28px;height:28px;display:block;}

/* Icones des etapes de methode */
.step-top{display:flex;align-items:center;gap:.6rem;}
.step-ic{flex:0 0 auto;color:var(--brand);}
.step-ic svg{width:26px;height:26px;display:block;}
/* Manifeste : 2 colonnes texte + visuel/vidéo */
.manifeste .manifeste-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,5rem);align-items:center;}
.manifeste .manifeste-col{min-width:0;}
.manifeste .manifeste-col .big{max-width:22ch;margin-bottom:2rem;}
.manifeste .manifeste-col .lead{margin:0 0 2rem;max-width:46ch;}
.manifeste-media{min-width:0;}
.manifeste-slot,.manifeste-video{width:100%;aspect-ratio:4/5;border-radius:18px;display:block;box-shadow:0 40px 80px -40px rgba(7,24,42,.5);}
.manifeste-video{object-fit:cover;}
.manifeste-slot{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:linear-gradient(140deg,var(--navy),var(--brand));color:#fff;overflow:hidden;}
.manifeste-slot::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 20%,rgba(23,166,230,.4),transparent 60%);}
.manifeste-slot-ic{position:relative;width:54px;height:54px;opacity:.95;}
.manifeste-slot-ic svg{width:100%;height:100%;}
.manifeste-slot-lab{position:relative;font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;opacity:.85;}
@media(max-width:820px){.manifeste .manifeste-grid{grid-template-columns:1fr;}.manifeste-slot,.manifeste-video{aspect-ratio:16/10;}}

/* Texture points sur les sections sombres de l accueil */
.stats,.exp{background-image:radial-gradient(rgba(255,255,255,.14) 1.3px,transparent 1.8px);background-size:22px 22px;}
/* En-tête de la section chiffres (titre + intro) */
.stats-head{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:end;margin:1.4rem 0 3rem;}
.stats-h{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.4rem);line-height:1.06;letter-spacing:-.02em;max-width:16ch;margin:0;color:#fff;text-wrap:balance;}
.stats-sub{color:var(--mist);font-size:1.05rem;line-height:1.7;max-width:44ch;margin:0;}
@media(max-width:820px){.stats-head{grid-template-columns:1fr;gap:1.2rem;}}