:root{
  --ink:#0b2327;
  --ink-2:#12353b;
  --teal:#3ccbb7;
  --teal-d:#136f60;
  --yellow:#f5c400;
  --paper:#f3f5f4;
  --white:#fff;
  --line:#d5dddc;
  --muted:#4d6468;
  --red:#e5484d;
  --display:"Archivo","Arial Narrow",Arial,sans-serif;
  --body:"Instrument Sans",system-ui,Segoe UI,sans-serif;
  --wrap:1200px;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:100px}
html:has(.subnav){scroll-padding-top:164px}
body{font-family:var(--body);color:var(--ink);background:var(--white);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:4px}
::selection{background:var(--teal);color:var(--ink)}
.site-header :focus-visible,.hero :focus-visible,.dark :focus-visible,.mat-hero :focus-visible,.showcase :focus-visible,.form :focus-visible,.footer :focus-visible{outline-color:var(--yellow)}
.skip{position:absolute;left:-999px;top:8px;background:var(--yellow);padding:8px 14px;z-index:99}
.skip:focus{left:8px}
.wrap{width:min(var(--wrap),100% - 40px);margin-inline:auto}

h1,h2,h3,h4{font-family:var(--display);line-height:1.06;letter-spacing:-.01em}
h2{font-size:clamp(1.9rem,3.6vw,3.1rem);font-weight:800;font-stretch:108%}
h3{font-size:1.2rem;font-weight:750;line-height:1.2}
h1,h2,h3,h4,dt{text-wrap:balance}
p,li,dd{text-wrap:pretty}

/* Buttons */
.btn{display:inline-block;background:var(--teal);color:var(--ink);text-decoration:none;padding:14px 24px;border-radius:6px;border:2px solid var(--teal);transition:background .15s;cursor:pointer;font:600 1rem var(--body)}
.btn:hover{background:#63dccb;border-color:#63dccb}
.btn-small{padding:9px 16px;font-size:.95rem}
.btn-dark{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-dark:hover{background:#17434a;border-color:#17434a}
.btn-yellow{background:var(--yellow);border-color:var(--yellow);width:100%;padding:16px}
.btn-yellow:hover{background:#ffd633;border-color:#ffd633}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,35,39,.95);backdrop-filter:blur(10px);color:var(--paper);transition:background .3s}
.site-header.over{position:fixed;left:0;right:0;background:linear-gradient(rgba(11,35,39,.65),transparent);backdrop-filter:none}
.site-header.over.scrolled{background:rgba(11,35,39,.95);backdrop-filter:blur(10px)}
.bar{display:flex;align-items:center;justify-content:space-between;height:84px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{height:60px;width:auto}
.nav{display:flex;align-items:center;gap:28px;font-size:.97rem}
.nav a:not(.btn){text-decoration:none;opacity:.9}
.nav a:not(.btn):hover{opacity:1;text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--teal)}
.burger{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer;position:relative}
.burger span{position:absolute;left:10px;right:10px;height:2px;background:var(--paper);transition:transform .2s}
.burger span:first-child{top:16px}.burger span:last-child{top:26px}
.burger[aria-expanded=true] span:first-child{transform:translateY(5px) rotate(45deg)}
.burger[aria-expanded=true] span:last-child{transform:translateY(-5px) rotate(-45deg)}

/* Menu Réalisations */
.has-sub{position:relative}
.sub-trigger::after{content:"";display:inline-block;width:6px;height:6px;margin-left:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-3px) rotate(45deg)}
.submenu{position:absolute;top:100%;left:-16px;min-width:250px;padding:14px 8px 8px;display:none;flex-direction:column}
.submenu::before{content:"";position:absolute;inset:6px 0 0;background:var(--ink-2);border:1px solid rgba(255,255,255,.14);border-radius:10px;box-shadow:0 20px 40px -16px rgba(0,0,0,.6);z-index:-1}
.has-sub:hover .submenu,.has-sub:focus-within .submenu,.has-sub.open .submenu{display:flex}
@media (min-width:901px){.has-sub.dismissed .submenu{display:none}}
.submenu a{padding:10px 14px;border-radius:6px;opacity:1!important}
.submenu a:hover{background:rgba(255,255,255,.08);text-decoration:none!important}

/* Hero photo */
.hero{position:relative;min-height:100svh;display:grid;align-items:end;color:#fff;background:var(--ink) url("img/hero.webp") center/cover no-repeat}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,35,39,.88) 0%,rgba(11,35,39,.6) 45%,rgba(11,35,39,.15) 100%),linear-gradient(180deg,rgba(11,35,39,.3) 0%,rgba(11,35,39,0) 30%,rgba(11,35,39,.55) 100%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:end;padding:120px 0 clamp(40px,6vw,72px)}
.hero h1{font-size:clamp(2.8rem,7.4vw,6.4rem);font-weight:800;font-stretch:100%;line-height:.98;letter-spacing:-.035em;max-width:9.5em}
.hero h1 em{white-space:nowrap;font-family:"Instrument Serif",Georgia,serif;font-weight:400;letter-spacing:-.01em}
.hero-text{margin-top:26px;font-size:1.2rem;max-width:30em;color:#e4ecea}
.hero-actions{display:flex;gap:30px;align-items:center;flex-wrap:wrap;margin-top:34px}
.platform{justify-self:end;width:min(100%,520px);background:rgba(11,35,39,.92);padding:20px;border-radius:4px}
.platform-title{display:flex;gap:12px;align-items:flex-start;font-weight:700;line-height:1.3;margin-bottom:16px}
.platform-title small{display:block;font-weight:400;font-size:.88rem;color:#b9cccb;margin-top:2px}
.live{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(60,203,183,.25);position:relative}
.live::after{content:"";position:absolute;inset:7px;border-radius:50%;background:var(--teal)}
.platform ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.platform li{display:flex;align-items:center;gap:7px;background:#fff;color:var(--ink);border-radius:4px;padding:10px 8px;font-size:.84rem;font-weight:700;line-height:1.15}
.platform li img{flex:none;width:22px;height:22px;border-radius:5px;object-fit:contain}

/* Sections */
.section{padding:clamp(64px,9vw,120px) 0}
.section.dark{background:var(--ink);color:var(--paper)}
.section.tint{background:var(--paper)}
.section-head{max-width:760px;margin-bottom:44px}
.section-head p{margin-top:16px;color:var(--muted);font-size:1.1rem}

/* Solution */
.intro-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(28px,5vw,80px);align-items:center;margin-bottom:64px}
.intro-grid h2{margin-bottom:20px}
.intro-grid p{font-size:1.15rem;max-width:34em}
.intro-grid p a{color:var(--teal-d);font-weight:600;text-decoration-thickness:1px;text-underline-offset:3px}
.intro-grid p+p{margin-top:14px;color:var(--muted);font-size:1.05rem}
.intro-photo{border-radius:14px;overflow:hidden;aspect-ratio:4/5;max-height:520px;justify-self:end;width:100%}
.intro-photo img{width:100%;height:100%;object-fit:cover}
.video-wrap{border-radius:16px;overflow:hidden;background:var(--ink);aspect-ratio:16/9;margin-bottom:72px;box-shadow:0 24px 50px -24px rgba(11,35,39,.45)}
.video-wrap video{width:100%;height:100%;display:block}

/* Secteurs */
.sectors{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.sectors a{display:flex;flex-direction:column;height:100%;text-decoration:none;background:#fff;border-radius:12px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.sectors a:hover{transform:translateY(-4px);box-shadow:0 18px 36px -18px rgba(11,35,39,.4)}
.sector-photo{aspect-ratio:16/10;overflow:hidden}
.sector-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.sectors a:hover img{transform:scale(1.04)}
.sector-body{padding:20px 22px 24px;display:flex;flex-direction:column;flex:1;border-bottom:4px solid var(--teal)}
.sector-body h3{font-size:1.35rem;margin-bottom:6px}
.sector-body p{font-size:.95rem;color:var(--muted)}
.more{margin-top:auto;padding-top:16px;font-weight:600;font-size:.93rem;color:var(--teal-d)}
.more::after{content:" →"}

/* Phrase sous les secteurs */
.cloud-note{text-align:center;margin-top:44px;font-size:1.2rem}
.cloud-note a{font-weight:600;text-underline-offset:4px}

/* Page secteur */
.subnav{background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:84px;z-index:40}
.subnav .wrap{display:flex;gap:6px;padding:10px 0;overflow-x:auto;scrollbar-width:none}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav .wrap.fade-r,.mat-nav.fade-r{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent)}
.subnav .wrap.fade-l,.mat-nav.fade-l{-webkit-mask-image:linear-gradient(90deg,transparent,#000 56px);mask-image:linear-gradient(90deg,transparent,#000 56px)}
.subnav .wrap.fade-l.fade-r,.mat-nav.fade-l.fade-r{-webkit-mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(90deg,transparent,#000 56px,#000 calc(100% - 56px),transparent)}
.subnav a{white-space:nowrap;text-decoration:none;font-weight:500;font-size:.95rem;padding:8px 16px;border-radius:99px;border:1.5px solid transparent}
.subnav a:hover{border-color:var(--teal)}
.subnav a[aria-current=page]{background:var(--ink);color:#fff}
.page-top{padding-top:clamp(40px,6vw,72px);padding-bottom:clamp(32px,4vw,48px)}
.crumb{font-size:.9rem;color:var(--muted);margin-bottom:18px}
.page-top h1{font-size:clamp(2.2rem,4.6vw,3.8rem);font-weight:850;font-stretch:110%}
.page-top .section-head{margin-bottom:0}
.page-top .section-head p{font-size:1.2rem;color:var(--ink);max-width:36em}
.list-title{font-size:clamp(1.6rem,2.6vw,2.2rem);margin-bottom:22px}

/* Cartes projets */
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.case{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.case-photo{aspect-ratio:3/2;overflow:hidden;background:var(--paper)}
.case-photo img{width:100%;height:100%;object-fit:cover}
.case-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.tag{align-self:flex-start;justify-self:start;font-size:.86rem;font-weight:600;color:var(--teal-d);background:rgba(60,203,183,.16);padding:3px 10px;border-radius:99px}
.case-body h3{margin:10px 0 8px}
.case-body .obj{color:var(--ink);font-size:.97rem}
.pts{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:6px;font-size:.92rem;color:var(--muted)}
.pts li{padding-left:16px;position:relative}
.pts li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--teal)}
.equip{margin-top:auto;padding-top:16px;font-size:.9rem;color:var(--muted)}
.equip::before{content:"";display:block;height:1px;background:var(--line);margin-bottom:12px}

/* Showcase crue */
.showcase{margin-top:26px;display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,4vw,56px);align-items:start;background:var(--ink);color:var(--paper);border-radius:14px;padding:clamp(24px,4vw,44px)}
.showcase-photo{border-radius:10px;overflow:hidden;aspect-ratio:16/9;margin-bottom:22px}
.showcase-photo img{width:100%;height:100%;object-fit:cover}
.showcase h3{font-size:clamp(1.5rem,2.4vw,2rem);margin:12px 0}
.showcase p{color:#b9cccb}
.showcase .pts{color:#b9cccb;margin-top:14px}
.showcase .tag{background:rgba(60,203,183,.2);color:#8ae8da}

/* Distinction */
.pillar{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(24px,5vw,80px);padding:40px 0;border-top:1px solid rgba(255,255,255,.2)}
.pillar-title h2{font-size:clamp(1.6rem,2.6vw,2.2rem);font-stretch:108%;font-weight:800;margin-bottom:10px}
.pillar-title p{color:#b9cccb;max-width:24em}
.diffs{display:grid;gap:0}
.diffs>div{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:24px 0;border-top:1px solid rgba(255,255,255,.18)}
.diffs dt{font-family:var(--display);font-weight:750;font-size:1.2rem;color:var(--yellow)}
.diffs dd{color:#b9cccb}
.pillar .diffs>div:first-child{border-top:0;padding-top:0}
.tint .pillar{border-top:0;padding:0}
.tint .pillar-title p{color:var(--muted)}
.diffs-dark>div{border-top-color:var(--line)}
.diffs-dark dt{color:var(--teal-d)}
.diffs-dark dd{color:var(--muted)}

/* Contact : formulaire visible, étapes suivantes */
.contact{background:var(--teal);padding:clamp(64px,8vw,112px) 0}
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);grid-template-areas:"head form" "more form";column-gap:clamp(32px,6vw,96px);row-gap:40px;align-items:start}
.contact-head{grid-area:head}
.contact .form{grid-area:form}
.contact-more{grid-area:more}
.contact h2{font-size:clamp(2.3rem,4.4vw,4rem);font-weight:850;font-stretch:100%;line-height:1;letter-spacing:-.03em;max-width:9.5em}
.contact h2 em{font-family:"Instrument Serif",Georgia,serif;font-weight:400;font-stretch:100%;letter-spacing:0}
.contact-text{margin-top:22px;max-width:30em;font-size:1.12rem}
.next-steps{list-style:none;padding:0;display:grid;gap:18px;counter-reset:n}
.next-steps li{counter-increment:n;display:grid;grid-template-columns:38px 1fr;gap:16px;align-items:start}
.next-steps li::before{content:counter(n);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--teal);font-family:var(--display);font-weight:800}
.next-steps p{color:#0b4a43;line-height:1.45;padding-top:1px}
.next-steps strong{display:block;font-family:var(--display);font-weight:750;font-size:1.12rem;color:var(--ink);margin-bottom:2px}
.contact-direct{margin-top:30px;padding-top:24px;border-top:1px solid rgba(11,35,39,.18);color:#0b4a43}
.contact-direct span{display:flex;flex-wrap:wrap;gap:6px 24px;margin-top:6px}
.contact-direct a{color:var(--ink);font-weight:700;font-size:1.1rem;text-decoration-thickness:2px;text-underline-offset:5px}
.contact-direct a:hover{text-decoration-color:#fff}
.form{background:var(--ink);color:var(--paper);padding:clamp(22px,3vw,34px);border-radius:16px;display:grid;gap:16px;box-shadow:0 30px 60px -28px rgba(11,35,39,.55);color-scheme:dark}
.form-title{font-size:clamp(1.3rem,2vw,1.6rem);font-weight:800;color:#fff;margin-bottom:4px}
.form label{display:grid;gap:6px;font-size:.9rem;color:#b9cccb;font-weight:500}
.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.req{color:var(--yellow)}
.form-note{font-size:.85rem;color:#b9cccb}
.form-note span{color:var(--yellow)}
.form-note a{color:#fff;text-underline-offset:3px}
.form-status{padding:12px 14px;border-radius:8px;border:1px solid rgba(60,203,183,.45);background:rgba(60,203,183,.12);color:#e4ecea;font-size:.95rem}
/* vide : hors de la mise en page mais présente pour les lecteurs d'écran, qui annonceront le message ajouté */
.form-status:empty{position:absolute;width:1px;height:1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%)}
.form-status a{color:#fff;font-weight:600}
.form input,.form select,.form textarea{font:400 1rem var(--body);padding:12px 14px;border-radius:6px;border:1.5px solid rgba(255,255,255,.42);background-color:rgba(255,255,255,.06);color:#fff;width:100%;caret-color:var(--yellow);transition:border-color .15s,background-color .15s;scroll-margin-top:48px}
.form select{appearance:none;padding-right:40px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%233ccbb7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;background-size:12px}
.form select option{background:var(--ink-2);color:#fff}
.form textarea{resize:vertical;min-height:96px}
.form ::placeholder{color:#8fa7a6;opacity:1}
.form input:hover,.form select:hover,.form textarea:hover{border-color:rgba(255,255,255,.62)}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--yellow);background-color:rgba(255,255,255,.09)}
.form input:user-invalid{border-color:#ff8a8d}
.form input:-webkit-autofill{-webkit-text-fill-color:#fff;box-shadow:0 0 0 100px #1b3a3f inset;caret-color:var(--yellow)}

/* Footer */
.footer{background:var(--ink);color:#b9cccb;padding:clamp(44px,6vw,72px) 0 48px;font-size:.95rem}
.foot{display:grid;grid-template-columns:1.3fr repeat(4,auto);justify-content:space-between;gap:32px 40px;align-items:start}
.foot-logo{display:inline-block}
.foot-logo img{height:64px;width:auto}
.foot-brand p{margin-top:18px;line-height:1.5;max-width:18em}
.foot-col{display:flex;flex-direction:column;gap:6px}
.foot-col strong{font-family:var(--display);font-size:1.05rem;color:#fff;margin-bottom:4px}
.foot a{text-decoration:none;text-underline-offset:4px}.foot a:hover{color:#fff;text-decoration:underline}

/* Responsive */
@media (max-width:980px){
  .intro-grid,.pillar,.showcase,.hero-grid{grid-template-columns:1fr}
  /* le texte occupe toute la largeur : voile plus uniforme pour qu'il reste lisible sur le ciel */
  .hero::before{background:linear-gradient(90deg,rgba(11,35,39,.86) 0%,rgba(11,35,39,.7) 100%),linear-gradient(180deg,rgba(11,35,39,.3) 0%,rgba(11,35,39,0) 30%,rgba(11,35,39,.45) 100%)}
  .platform{justify-self:start}
  .intro-photo{aspect-ratio:16/10;max-height:none}
  .sectors,.cases{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  .burger{display:block}
  .nav{position:absolute;top:84px;left:0;right:0;background:var(--ink);flex-direction:column;align-items:flex-start;padding:20px;gap:18px;display:none}
  .nav.open{display:flex}
  .submenu{position:static;display:flex;padding:6px 0 0 14px;min-width:0}
  .submenu::before{display:none}
  .nav{gap:2px}
  .has-sub{width:100%}
  .nav a:not(.btn){display:block;padding:11px 0}
  .nav .submenu a{padding:11px 14px}
  .nav .btn{margin-top:12px}
}
@media (max-width:720px){
  .sectors,.cases{grid-template-columns:1fr}
  .platform ul{grid-template-columns:1fr 1fr}
  .diffs>div{grid-template-columns:1fr;gap:6px}
  .two{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* Vidéo explicative sur les pages catégories */
.video-sec{padding-bottom:clamp(48px,6vw,80px)}
.video-lead{color:var(--muted);font-size:1.1rem;max-width:40em;margin:-8px 0 26px}
.video-sec .video-wrap{margin-bottom:0}

.video-item+.video-item{margin-top:48px}
.video-title{font-size:1.3rem;margin-bottom:6px}
.video-sub{color:var(--muted);margin:0 0 18px;max-width:40em}

.showcase-video .video-wrap{margin:0;box-shadow:none;border:1px solid rgba(255,255,255,.12)}

/* ===== Accueil : une idée par écran ===== */

/* Accroche */
.btn-ghost{background:transparent;border-color:currentColor;color:inherit}
.btn-ghost:hover{background:#fff;border-color:#fff;color:var(--ink)}

/* Présentation sur l'accueil */
.intro-home{margin-bottom:0}
.modes-wrap{margin-top:clamp(40px,6vw,72px)}
.modes-title{font-size:clamp(1.6rem,2.8vw,2.3rem);font-weight:800;font-stretch:106%;margin-bottom:22px}
.modes{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.modes li{background:var(--paper);border-radius:12px;border-top:4px solid var(--teal);padding:22px 24px 26px}
.modes h4{font-family:var(--display);font-size:1.2rem;font-weight:750;margin-bottom:8px}
.modes p{color:var(--muted);font-size:.97rem}
.modes .mode-main{background:var(--ink);color:#fff}
.modes .mode-main p{color:#b9cccb}
.intro-btn{display:inline-flex;align-items:center;gap:12px;margin-top:32px;padding:16px 26px;border-radius:99px;font-weight:700;font-size:1.05rem;box-shadow:0 12px 28px -12px rgba(23,128,111,.6)}
.intro-btn span{transition:transform .2s}
.intro-btn:hover span{transform:translateX(5px)}

/* Page matériel */
.nav a[aria-current=page],.has-sub:has([aria-current=page]) .sub-trigger{opacity:1;text-decoration:underline;text-underline-offset:6px;text-decoration-color:var(--teal)}
.nav .submenu a[aria-current=page]{background:rgba(60,203,183,.16);text-decoration:none}
.mat-hero{background:var(--ink);color:var(--paper);padding:clamp(48px,7vw,88px) 0 0;overflow:hidden}
.mat-hero .crumb{color:#8fa7a6}
.mat-hero h1{font-size:clamp(2.4rem,5.4vw,4.4rem);font-weight:850;font-stretch:108%;line-height:1;letter-spacing:-.02em;max-width:12em}
.flag-bar{display:block;width:clamp(120px,16vw,200px);height:6px;margin-top:22px;border-radius:3px;background:linear-gradient(90deg,#0055a4 0 33.33%,#fff 33.33% 66.66%,#ef4135 66.66% 100%)}
.mat-lead{margin-top:20px;max-width:38em;font-size:1.15rem;color:#b9cccb}
.mat-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:clamp(36px,5vw,56px);transform:translateY(1px)}
.mat-nav a{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 12px 18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-bottom:0;border-radius:14px 14px 0 0;text-decoration:none;font-weight:600;font-size:.95rem;transition:background .2s}
.mat-nav a:hover{background:rgba(60,203,183,.18)}
.mat-nav-img{width:100%;aspect-ratio:4/3;border-radius:10px;background:#fff;display:grid;place-items:center;overflow:hidden;padding:8px}
.mat-nav-img img{max-height:100%;width:auto}
.mat-nav-img.cover{padding:0}
.mat-nav-img.cover img{width:100%;height:100%;object-fit:cover}

.prod{padding:clamp(64px,9vw,120px) 0;background:var(--white);scroll-margin-top:84px}
.prod-alt{background:var(--paper)}
.prod-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.prod-alt .prod-visual{order:2}
.prod-visual{position:relative;aspect-ratio:1/1;max-height:520px;width:100%;border-radius:24px;display:grid;place-items:center;padding:clamp(24px,4vw,48px);background:radial-gradient(circle at 50% 45%,#fff 0%,#e6f4f1 55%,#d3ebe6 100%);overflow:hidden}
.prod-alt .prod-visual{background:radial-gradient(circle at 50% 45%,#fff 0%,#eef3f2 55%,#dde6e4 100%)}
.prod-visual img{max-height:100%;width:auto;object-fit:contain;mix-blend-mode:multiply}
.prod-visual.cover{padding:0;aspect-ratio:4/3}
.prod-visual.cover img{width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.prod-role{display:inline-flex;align-items:center;gap:10px;font-size:.84rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--teal-d);margin-bottom:14px}
.prod-role::before{content:"";width:28px;height:2px;background:currentColor}
.prod-body h2{font-size:clamp(2rem,3.6vw,3rem);margin-bottom:18px}
.prod-text{font-size:1.12rem;color:var(--muted);max-width:34em;margin-bottom:28px}
.specs{list-style:none;padding:0;border-top:1px solid var(--line)}
.specs li{position:relative;padding:13px 0 13px 34px;border-bottom:1px solid var(--line);font-size:.98rem}
.specs li::before{content:"";position:absolute;left:2px;top:15px;width:20px;height:20px;border-radius:50%;background:var(--teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%230b2327' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.soft-visual{box-shadow:0 30px 60px -30px rgba(11,35,39,.45)}
.soft-title{font-size:clamp(1.4rem,2.2vw,1.8rem);font-weight:800;margin:clamp(56px,7vw,88px) 0 24px}
.soft-features{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.soft-features li{background:var(--paper);border-radius:14px;padding:24px 24px 26px}
.soft-features svg{width:34px;height:34px;padding:7px;border-radius:10px;background:var(--ink);fill:none;stroke:var(--teal);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-bottom:16px;box-sizing:content-box}
.soft-features h4{font-family:var(--display);font-size:1.15rem;font-weight:750;margin-bottom:6px}
.soft-features p{color:var(--muted);font-size:.96rem}
.existing-band{background:var(--paper);padding:clamp(32px,4vw,48px) 0}
.existing-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}
.existing-inner p{font-size:1.15rem;max-width:42em}
.existing-inner strong{font-family:var(--display);font-weight:800}

.partners{margin-top:40px;padding-top:28px;border-top:1px solid var(--line);display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.partners p{font-size:.86rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.partners ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.partners li{display:flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:6px;padding:7px 12px;font-size:.9rem;font-weight:700}
.partners img{width:20px;height:20px;object-fit:contain;border-radius:4px}

/* Logiciel */
.arrow-link{display:inline-flex;align-items:center;gap:10px;font-weight:700;text-decoration:none}
.arrow-link::after{content:"→";transition:transform .2s}
.arrow-link:hover::after{transform:translateX(5px)}

/* Apparition au défilement (seulement si JavaScript actif) */
.js .reveal{transform:translateY(22px);transition:transform 1s cubic-bezier(.16,1,.3,1)}
.js .reveal.in{transform:none}

@media (max-width:980px){
  .prod-grid{grid-template-columns:1fr}
  .soft-features{grid-template-columns:1fr 1fr}
  .modes{grid-template-columns:1fr}
  .prod-alt .prod-visual{order:0}
  .prod-visual{max-height:none;aspect-ratio:4/3}
  .mat-nav{grid-template-columns:repeat(5,minmax(110px,1fr));overflow-x:auto;scrollbar-width:none}
}
@media (max-width:720px){
  .mat-nav a{font-size:.9rem;padding:12px 10px 14px}
  .soft-features{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .js .reveal{transform:none}
}

/* Ce qui nous distingue */
.dist-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:last baseline;padding-bottom:clamp(36px,5vw,56px)}
.dist-head h2{color:#fff}
.dist-claim{font-family:var(--display);font-size:clamp(1.4rem,2.4vw,2rem);font-weight:700;line-height:1.2;color:var(--teal)}
.dist-claim em{font-family:"Instrument Serif",Georgia,serif;font-weight:400;color:#fff}
.dist-block{padding:clamp(36px,5vw,56px) 0;border-top:1px solid rgba(255,255,255,.16)}
.dist-block:last-child{padding-bottom:0}
.dist-label{display:flex;justify-content:space-between;gap:clamp(24px,5vw,72px);align-items:baseline;margin-bottom:28px}
.dist-label h3{font-size:clamp(1.6rem,2.8vw,2.3rem);font-weight:800;font-stretch:106%}
.dist-label p{color:#b9cccb;font-size:1.2rem;text-align:right}
@media (min-width:1180px){.dist-label p{white-space:nowrap}}

.pillars{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pillars li{background:var(--ink-2);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:26px 24px 28px;transition:border-color .2s,transform .2s}
.pillars li:hover{border-color:var(--teal);transform:translateY(-3px)}
.pillars svg{width:26px;height:26px;padding:10px;box-sizing:content-box;border-radius:12px;background:var(--teal);fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-bottom:18px}
.pillars h4{font-family:var(--display);font-size:1.2rem;font-weight:750;margin-bottom:8px}
.pillars p{color:#b9cccb;font-size:.97rem}

.journey{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:j;position:relative}
.journey::before{content:"";position:absolute;left:20px;right:calc(25% - 4px);top:20px;height:2px;background:rgba(60,203,183,.5)}
.journey li{counter-increment:j;position:relative}
.journey li::before{content:counter(j);position:relative;z-index:1;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--teal);color:var(--ink);font-family:var(--display);font-weight:800;margin-bottom:18px;box-shadow:0 0 0 6px var(--ink)}
.journey h4{font-family:var(--display);font-size:1.2rem;font-weight:750;margin-bottom:6px}
.journey p{color:#b9cccb;font-size:.97rem}

@media (max-width:980px){
  .dist-head{grid-template-columns:1fr;gap:12px}
  .dist-label{flex-direction:column;gap:12px}
  .dist-label p{text-align:left}
  .pillars{grid-template-columns:1fr}
  .journey{grid-template-columns:1fr 1fr;row-gap:32px}
  .journey::before{display:none}
}
@media (max-width:720px){
  .journey{grid-template-columns:1fr}
  .journey li{padding-left:58px}
  .journey li::before{position:absolute;left:0;top:0;margin:0}
}

/* Alignement des cartes : titres et textes à la même hauteur d'une carte à l'autre */
.modes li,.pillars li,.soft-features li{display:grid;grid-template-rows:subgrid;row-gap:0;align-items:start}
.modes li{grid-row:span 2}
.pillars li,.soft-features li{grid-row:span 3}
.case{display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0}
.case-body{grid-row:2/span 5;display:grid;grid-template-rows:subgrid;row-gap:0;align-items:start}
.case-body>.tag{grid-row:1}
.case-body>h3{grid-row:2}
.case-body>.obj{grid-row:3}
.case-body>.pts{grid-row:4}
.case-body>.equip{grid-row:5;margin-top:0}

/* Dernière ligne de cartes centrée au lieu d'un trou à droite */
@media (min-width:981px){
  .sectors,.cases{grid-template-columns:repeat(6,1fr)}
  .sectors>li,.case{grid-column:span 2}
  .sectors>li:last-child:nth-child(3n+1):not(:first-child),.case:last-child:nth-child(3n+1):not(:first-child){grid-column:3/span 2}
  .sectors>li:nth-last-child(2):nth-child(3n+1),.case:nth-last-child(2):nth-child(3n+1){grid-column:2/span 2}
}
@media (min-width:721px) and (max-width:980px){
  .sectors,.cases{grid-template-columns:repeat(4,1fr)}
  .sectors>li,.case{grid-column:span 2}
  .sectors>li:last-child:nth-child(odd):not(:first-child),.case:last-child:nth-child(odd):not(:first-child){grid-column:2/span 2}
}

/* Pages légales */
.legal-sec{padding-top:0}
.legal>*{max-width:780px}
.legal h2{font-size:clamp(1.3rem,2vw,1.6rem);margin:48px 0 14px}
.legal h2:first-child{margin-top:0}
.legal h3{font-size:1.1rem;margin:28px 0 8px}
.legal p+p{margin-top:12px}
.legal ul{padding-left:22px;display:grid;gap:8px;margin:12px 0}
.legal a{color:var(--teal-d);font-weight:600;text-underline-offset:3px}
.legal-card{margin-top:18px;background:var(--paper);border-radius:14px;padding:8px 28px}
.legal-card>div{display:grid;grid-template-columns:220px 1fr;gap:16px;padding:14px 0;border-top:1px solid var(--line)}
.legal-card>div:first-child{border-top:0}
.legal-card dt{font-weight:600;color:var(--muted)}
@media (max-width:720px){.legal-card>div{grid-template-columns:1fr;gap:2px}}
.legal-date{margin-top:48px!important;font-size:.9rem;color:var(--muted)}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form{position:relative}
.btn[disabled]{opacity:.6;cursor:progress}
.form-status.is-error{border-color:rgba(229,72,77,.6);background:rgba(229,72,77,.14)}

/* ===== Téléphone : ergonomie ===== */
@media (max-width:720px){
  /* photo d'accueil recadrée sur la partie visible : trois fois plus légère */
  .hero{background-image:url("img/hero-mobile.webp")}
  /* en-tête plus compact ; la barre des secteurs défile avec la page */
  .bar{height:64px}
  .logo img{height:46px}
  .nav{top:64px;max-height:calc(100svh - 64px);overflow-y:auto}
  .subnav{position:static}
  html,html:has(.subnav){scroll-padding-top:80px}
  .prod{scroll-margin-top:64px}
  /* boutons de l'accroche : pleine largeur, empilés */
  .hero-actions{flex-direction:column;align-items:stretch;gap:12px}
  .hero-actions .btn{text-align:center}
  /* cartes secteurs en liste compacte */
  .sectors{gap:12px}
  .sectors a{flex-direction:row}
  .sector-photo{flex:0 0 112px;aspect-ratio:auto}
  .sector-body{padding:14px 16px;border-bottom:0}
  .sector-body h3{font-size:1.1rem;margin-bottom:4px}
  .sector-body p{font-size:.9rem;line-height:1.45}
  .more{padding-top:8px}
  /* vidéos bord à bord pour gagner en lisibilité */
  .video-sec .video-wrap{margin-inline:-20px;border-radius:0}
  /* contact et formulaire */
  .form{padding:22px 18px}
  .contact-direct a{padding:8px 0}
  /* pied de page en une colonne, liens confortables au doigt */
  .foot{grid-template-columns:1fr 1fr;gap:28px 20px}
  .foot-brand{grid-column:1/-1}
  .foot-col{gap:0}
  .foot-col strong{margin-bottom:2px}
  .foot-col a{padding:10px 0}
  /* fil d'Ariane : zone de clic agrandie sans changer l'apparence */
  .crumb a,.cloud-note a{display:inline-block;padding:12px 0;margin:-12px 0}
  .page-cta .btn{flex:1 1 100%;text-align:center}
}

/* ===== Conversion ===== */

/* Accroche : une seule entrée animée, au chargement */
@keyframes heroIn{from{opacity:0;transform:translateY(30px);filter:blur(8px)}}
.hero h1{animation:heroIn 1.1s cubic-bezier(.16,1,.3,1) both}
.hero-text{animation:heroIn 1.1s .1s cubic-bezier(.16,1,.3,1) both}
.hero-actions{animation:heroIn 1.1s .2s cubic-bezier(.16,1,.3,1) both}
.platform{animation:heroIn 1.1s .34s cubic-bezier(.16,1,.3,1) both}
.live::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--teal);opacity:.5;animation:pulse 2.4s cubic-bezier(.16,1,.3,1) infinite}
@keyframes pulse{from{transform:scale(.5);opacity:.6}to{transform:scale(1.7);opacity:0}}

/* Pages secteurs : appel à l'action dès le haut de page */
.page-cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 30px;margin-top:30px}
.page-cta .arrow-link{color:var(--teal-d)}

@media (max-width:980px){
  .contact-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "form" "more"}
  .foot{grid-template-columns:1fr 1fr 1fr}
  .foot-brand{grid-column:1/-1}
}

/* Téléphone : barre d'appel à l'action */
.mobile-cta{display:none}
@media (max-width:720px){
  .mobile-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:auto 1fr;gap:10px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(11,35,39,.96);backdrop-filter:blur(10px);box-shadow:0 -14px 30px -18px rgba(0,0,0,.55);transform:translateY(110%);visibility:hidden;transition:transform .4s cubic-bezier(.16,1,.3,1),visibility 0s .4s}
  .mobile-cta.show{transform:none;visibility:visible;transition:transform .4s cubic-bezier(.16,1,.3,1)}
  .mobile-call{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;border-radius:6px;border:2px solid rgba(255,255,255,.28);color:#fff;font-weight:600;text-decoration:none}
  .mobile-call svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .mobile-cta .btn{display:grid;place-items:center;min-height:48px;padding:0 14px;text-align:center}
  .mobile-cta :focus-visible{outline-color:var(--yellow)}
  .foot{grid-template-columns:1fr 1fr;gap:28px 20px}
  .foot-col:nth-child(4){grid-column:1/-1}
}