:root{
    --black:#0b0b0b;
    --ink:#1a1a1a;
    --grey-600:#6b6b6b;
    --grey-400:#a3a3a3;
    --grey-200:#e4e4e4;
    --grey-100:#f3f3f3;
    --white:#ffffff;
    --logo-grey:#3d3c3a;
    --teal:#0f6468;
    --teal-light:#6fb8bb;
    --display:'Italiana', 'Didot', serif;
    --body:'Poppins', system-ui, sans-serif;
    --max:1240px;
    --gutter:clamp(16px, 4vw, 48px);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:var(--body);color:var(--ink);background:var(--white);line-height:1.65;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
  .eyebrow{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;font-weight:500;color:var(--grey-600)}
  .display{font-family:var(--display);font-weight:400;line-height:.95;letter-spacing:-.01em}
  .display .light{color:var(--grey-400)}
  .btn{display:inline-flex;align-items:center;gap:.7em;padding:1em 1.8em;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;font-weight:500;border:1px solid currentColor;transition:background .3s,color .3s}
  .btn--dark{background:var(--black);color:var(--white);border-color:var(--black)}
  .btn--dark:hover{background:transparent;color:var(--black)}
  .btn--light{color:var(--white)}
  .btn--light:hover{background:var(--white);color:var(--black)}
  .btn--white{background:var(--white);color:var(--black);border-color:var(--white)}
  .btn--white:hover{background:transparent;color:var(--white)}
  .btn .arrow{transition:transform .3s}
  .btn:hover .arrow{transform:translateX(4px)}

  /* ---------- HEADER ---------- */
  .header{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .35s, box-shadow .35s;color:var(--white)}
  .header.scrolled{background:rgba(255,255,255,.96);color:var(--black);box-shadow:0 1px 0 var(--grey-200);backdrop-filter:blur(8px)}
  .header__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;height:84px}
  .logo{display:flex;align-items:center;gap:14px;flex-shrink:0}
  .logo{font-family:'Lato',sans-serif;color:var(--white);gap:12px}
  .logo__mark{font-weight:700;font-size:2.15rem;line-height:1;letter-spacing:-.075em;padding-right:.08em}
  .logo__text{display:flex;flex-direction:column;line-height:1.25}
  .logo__text strong{font-weight:400;font-size:.8rem;letter-spacing:.34em}
  .logo__text span{font-size:.62rem;letter-spacing:.2em;font-style:italic;color:var(--teal-light)}
  .header.scrolled .logo{color:var(--logo-grey)}
  .header.scrolled .btn--light{color:var(--black)}
  .header.scrolled .btn--light:hover{background:var(--black);color:var(--white)}
  .header.scrolled .logo__text span{color:var(--teal)}
  .menu-open .header .logo{color:var(--white)}
  .menu-open .header .logo__text span{color:var(--teal-light)}
  .nav{display:flex;gap:2rem}
  .nav a{font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-weight:400;position:relative;padding:4px 0;white-space:nowrap}
  .nav a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1px;background:currentColor;transition:width .3s}
  .nav a:hover::after{width:100%}
  .header__cta{display:flex;align-items:center;gap:1.2rem}
  .lang{display:flex;font-size:.72rem;letter-spacing:.15em}
  .lang a{color:inherit;padding:6px;opacity:.5}
  .lang a.on{opacity:1;font-weight:600}
  .lang a:focus-visible,.nav a:focus-visible,.btn:focus-visible,.tab:focus-visible{outline:2px solid currentColor;outline-offset:3px}
  .btn--compact{padding:.75em 1.3em}
  .burger{display:none;width:44px;height:44px;border:0;background:none;color:inherit;cursor:pointer;position:relative}
  .burger span,.burger::before,.burger::after{content:"";position:absolute;left:10px;right:10px;height:1px;background:currentColor;transition:transform .3s,opacity .3s}
  .burger::before{top:15px}.burger span{top:22px}.burger::after{top:29px}
  .menu-open .burger::before{transform:translateY(7px) rotate(45deg)}
  .menu-open .burger span{opacity:0}
  .menu-open .burger::after{transform:translateY(-7px) rotate(-45deg)}

  .mobile-menu{position:fixed;inset:0;background:var(--black);color:var(--white);z-index:40;display:flex;flex-direction:column;justify-content:center;padding:0 var(--gutter);transform:translateY(-100%);transition:transform .5s cubic-bezier(.7,0,.2,1)}
  .menu-open .mobile-menu{transform:none}
  .menu-open .header{color:var(--white);background:transparent;box-shadow:none}
  .mobile-menu a{font-family:var(--display);font-size:2.4rem;line-height:1.35;border-bottom:1px solid #222;padding:.2em 0}

  /* ---------- HERO ---------- */
  .hero{padding:0;position:relative;min-height:100vh;min-height:100svh;background:var(--black);color:var(--white);display:flex;align-items:flex-end;overflow:hidden}
  .hero__bg{position:absolute;inset:0;background:
      radial-gradient(ellipse at 70% 30%, #3a3a3a 0%, transparent 55%),
      linear-gradient(120deg,#0b0b0b 0%,#1e1e1e 50%,#0b0b0b 100%)}
  .hero__bg::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0 140px,rgba(255,255,255,.025) 140px 141px)}
  .hero__monogram{position:absolute;right:-2vw;top:50%;transform:translateY(-50%);font-family:var(--display);font-size:clamp(16rem,42vw,44rem);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.08);letter-spacing:-.08em;pointer-events:none;user-select:none}
  .hero__content{position:relative;padding-top:160px;padding-bottom:72px;width:100%}
  .hero h1{font-size:clamp(3rem,8vw,7.5rem);margin:24px 0 32px;max-width:14ch}
  .hero h1 .light{color:#7d7d7d}
  .hero__bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.18);padding-top:32px}
  .hero .eyebrow{color:#9a9a9a}
  .hero__sectors{display:flex;flex-wrap:wrap;gap:.4em 1.4em;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:#8a8a8a}
  .hero__sectors span+span::before{content:"|";margin-right:1.4em;color:#444}
  .hero__ctas{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
  .scroll-hint{display:flex;align-items:center;gap:12px;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:#9a9a9a;margin-left:16px}
  .scroll-hint i{display:block;width:1px;height:48px;background:linear-gradient(#fff,transparent);animation:drip 2s infinite}
  @keyframes drip{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

  /* ---------- SECTIONS ---------- */
  section{padding:clamp(80px,11vw,150px) 0}
  .section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:clamp(48px,6vw,80px)}
  .section-head h2{font-size:clamp(3rem,7vw,6rem)}
  .section-head p{max-width:420px;color:var(--grey-600)}
  .rule{display:flex;align-items:center;gap:20px;margin-bottom:24px}
  .rule::after{content:"";flex:1;height:1px;background:var(--grey-200);max-width:120px}

  /* About */
  .about__grid{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(40px,7vw,120px);align-items:start}
  .about h2{font-size:clamp(3rem,7vw,6rem)}
  .about__lead{font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.55;color:var(--ink);font-weight:300;margin-bottom:24px}
  .about__lead strong{font-weight:500}
  .about__text p{color:var(--grey-600)}
  .sectors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--black);margin-top:48px}
  .sector{padding:22px 0 0}
  .sector small{display:block;font-size:.68rem;letter-spacing:.2em;color:var(--grey-400);margin-bottom:6px}
  .sector span{font-family:var(--display);font-size:1.6rem}

  /* Figures */
  .figures{background:var(--grey-100);padding:clamp(70px,9vw,120px) 0}
  .figures__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
  .figure{padding:0 clamp(16px,2.5vw,36px);border-left:1px solid #d0d0d0}
  .figure:first-child{border-left:0;padding-left:0}
  .figure .num{font-family:var(--display);font-size:clamp(4rem,8vw,7rem);line-height:1}
  .figure .label{font-size:1.05rem;font-weight:500;margin-top:6px}

  /* Vision */
  .vision{background:var(--black);color:var(--white);position:relative;overflow:hidden}
  .vision__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center}
  .vision h2{font-size:clamp(3.5rem,9vw,8rem)}
  .vision h2 .light{color:#6a6a6a}
  .vision .eyebrow{color:#8a8a8a}
  .vision .rule::after{background:#333}
  .vision__text p{font-size:clamp(1.15rem,1.8vw,1.5rem);line-height:1.6;color:#cfcfcf}
  .vision__text strong{color:var(--white);font-weight:500}

  /* Pôles */
  .brands{border-top:1px solid var(--grey-200)}
  .tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:40px}
  .tab{font-family:var(--body);background:none;border:1px solid var(--grey-200);padding:.8em 1.4em;font-size:.74rem;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;color:var(--grey-600);transition:all .25s}
  .tab:hover{border-color:var(--black);color:var(--black)}
  .tab.active{background:var(--black);border-color:var(--black);color:var(--white)}
  .brand-panel{display:none}
  .brand-panel.active{display:block;animation:fade .5s}
  @keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .brand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--grey-200);border-left:1px solid var(--grey-200)}
  .brand{min-height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-right:1px solid var(--grey-200);border-bottom:1px solid var(--grey-200);padding:16px;transition:background .35s,color .35s;cursor:default}
  .brand__logo{--h:48px;height:var(--h);width:auto;max-width:78%;object-fit:contain;transition:filter .35s}
  .brand__logo--mono{filter:brightness(0)}
  .brand:hover .brand__logo--mono{filter:brightness(0) invert(1)}
  .size-xs{--h:24px}.size-s{--h:40px}.size-m{--h:48px}.size-l{--h:64px}.size-xl{--h:80px}
  .brand__logo--color{border-radius:4px}
  .brand__mark--stack{flex-direction:column;gap:8px}
  .brand__wordmark{font-size:.62rem;letter-spacing:.32em;text-transform:uppercase;font-weight:500}
  .brand__mark{height:84px;width:100%;display:flex;align-items:center;justify-content:center}
  .brand .brand__cat{margin-top:14px;min-height:3.4em}
  .unit{font-family:var(--body);font-size:.32em;font-weight:400;margin-left:.2em;letter-spacing:0}
  .brand__name{font-size:clamp(.8rem,1.5vw,1.25rem);letter-spacing:.14em;overflow-wrap:anywhere;text-transform:uppercase;font-weight:500}
  .brand__cat{font-size:.65rem;letter-spacing:.22em;text-transform:uppercase;color:var(--grey-400);margin-top:10px;transition:color .35s}
  .brand:hover{background:var(--black);color:var(--white)}
  .brand:hover .brand__cat{color:#8a8a8a}

  /* E-com */
  .ecom{background:var(--grey-100)}
  .ecom__grid{display:grid;grid-template-columns:1fr;gap:20px}
  .platform{background:var(--white);padding:clamp(32px,4vw,56px);display:grid;grid-template-columns:1fr 1.2fr auto;gap:24px 48px;align-items:center;border:1px solid transparent;transition:border-color .3s}
  .platform:hover{border-color:var(--black)}
  .platform__tag{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--grey-600);border:1px solid var(--grey-200);align-self:flex-start;padding:.45em .9em}
  .platform h3{font-family:var(--display);font-weight:400;font-size:clamp(2.6rem,5vw,4rem);margin:18px 0 0;line-height:1}
  .platform p{color:var(--grey-600);font-size:1rem}
  .platform a{font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:500;display:inline-flex;gap:.6em;border-bottom:1px solid var(--black);padding-bottom:4px;white-space:nowrap}

  /* Savoir-faire */
  .sf__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--black)}
  .sf{padding:36px 36px 8px 0}
  .sf + .sf{padding-left:36px;border-left:1px solid var(--grey-200)}
  .sf__idx{font-family:var(--display);font-size:3rem;line-height:1;color:var(--grey-400)}
  .sf h3{font-size:.85rem;letter-spacing:.24em;text-transform:uppercase;font-weight:600;margin:28px 0 12px}
  .sf p{color:var(--grey-600);font-size:.95rem}

  /* Values */
  .values{border-top:1px solid var(--grey-200)}
  .values__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
  .value{position:relative;padding:44px 30px 36px;min-height:300px;display:flex;flex-direction:column;transition:transform .4s}
  .value:hover{transform:translateY(-6px)}
  .value--dark{background:var(--black);color:var(--white)}
  .value--light{background:var(--grey-100)}
  .value__idx{font-family:var(--display);font-size:1rem;opacity:.5}
  .value h3{font-size:.85rem;letter-spacing:.24em;text-transform:uppercase;font-weight:600;margin:auto 0 16px;padding-top:60px}
  .value h3::before{content:"";display:block;width:32px;height:1px;background:currentColor;margin-bottom:18px}
  .value p{font-size:.92rem;line-height:1.7;opacity:.82}

  /* Partenaires */
  .partners{background:var(--grey-100)}
  .partners__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,120px);align-items:end}
  .partners h2{font-size:clamp(3rem,7vw,6rem)}
  .partners p{font-size:clamp(1.1rem,1.6vw,1.3rem);line-height:1.6;margin-bottom:36px}

  /* Careers */
  .careers{background:var(--black);color:var(--white);text-align:center}
  .careers h2{font-size:clamp(3rem,8vw,7rem);margin:20px auto 28px;max-width:14ch}
  .careers h2 .light{color:#6a6a6a}
  .careers p{max-width:560px;margin:0 auto 40px;color:#a8a8a8}
  .careers .eyebrow{color:#8a8a8a}

  /* Footer */
  .footer{background:var(--black);color:#9a9a9a;border-top:1px solid #222;padding:80px 0 32px;font-size:.88rem}
  .footer__grid{display:grid;grid-template-columns:2fr 1fr;gap:48px;margin-bottom:64px;align-items:start}
  .footer .logo{color:var(--white);margin-bottom:20px}
  .footer h4{color:var(--white);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:500;margin-bottom:20px}
  .footer li{list-style:none;margin-bottom:10px}
  .footer a:hover{color:var(--white)}
  .footer__bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid #222;padding-top:28px;font-size:.76rem;letter-spacing:.06em}
  .socials{display:flex;gap:20px}

  /* Reveal */
  @keyframes rise{from{opacity:.001;transform:translateY(20px)}to{opacity:1;transform:none}}
  .reveal.in{animation:rise .9s ease both}
  @media (prefers-reduced-motion:reduce){*{animation:none!important}}

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:1180px){
    .nav,.header__cta .btn{display:none}
    .burger{display:block}
  }
  @media (max-width:1080px){
    .values__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  }
  @media (max-width:980px){
    .about__grid,.vision__grid,.partners__grid{grid-template-columns:1fr}
    .figures__grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
    .figure:nth-child(3){border-left:0;padding-left:0}
    .ecom__grid{grid-template-columns:1fr}
    .platform{grid-template-columns:1fr;align-items:start}
    .sf__grid{grid-template-columns:1fr}
    .sf,.sf + .sf{padding:28px 0;border-left:0;border-bottom:1px solid var(--grey-200)}
  }
  @media (max-width:600px){
    .header__inner{height:70px}
    .logo__mark{font-size:1.8rem}
    .logo__text strong{font-size:.66rem;letter-spacing:.28em}
    .logo__text span{font-size:.56rem}
    .hero__content{padding-top:130px;padding-bottom:48px}
    .hero__bottom{flex-direction:column;align-items:flex-start}
    .scroll-hint{display:none}
    .sectors{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px}
    .values__grid{grid-template-columns:1fr}
    .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .footer__grid{grid-template-columns:1fr;gap:36px}
    .mobile-menu a{font-size:2.1rem}
    section{padding:64px 0}
    .section-head{margin-bottom:36px}
    .hero h1{font-size:clamp(2.4rem,11vw,3.4rem)}
    .hero__ctas{width:100%}
    .hero__ctas .btn{flex:1 1 100%;justify-content:center}
    .figures{padding:48px 0}
    .figures__grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
    .figure,.figure:nth-child(3){border:0;padding:0}
    .figure:nth-child(even){border-left:1px solid #d0d0d0;padding-left:20px}
    .figure .num{font-size:3.4rem}
    .figure .label{font-size:.9rem}
    .value{min-height:0;padding:28px 24px}
    .value h3{padding-top:28px}
    .brand{aspect-ratio:auto;min-height:150px;padding:24px 10px}
    .brand__logo{height:calc(var(--h) * .75)}
    .brand__mark{height:64px}
    .brand__name{letter-spacing:.08em}
    .brand__cat{letter-spacing:.14em;font-size:.58rem}
    .tab{padding:.7em 1em}
    .platform{padding:28px 22px}
    .partners p{margin-bottom:24px}
    .careers h2{font-size:clamp(2.6rem,12vw,3.6rem)}
    .careers .btn{white-space:normal;text-align:center}
    .footer{padding:56px 0 28px}
    .footer__grid{margin-bottom:40px}
  }
