/* ALTEC — page activité V12. Uses the exact V5 global header/navigation. */
.a-hero{height:470px;display:grid;grid-template-columns:47% 53%;overflow:hidden;background:linear-gradient(105deg,#f4fbff,#e9f6ff)}
.a-hero-copy{padding:62px 8% 52px 10%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.eyebrow,.section-title small,.form-intro small,.faq small{margin:0;color:#c87c00;font-size:11px;font-weight:900;letter-spacing:1.7px}
.a-hero h1{margin:13px 0 17px;color:#082f68;font-size:57px;line-height:.96;letter-spacing:-2.3px}
.a-hero .lead{max-width:530px;margin:0 0 25px;color:#173d67;font-size:16px;line-height:1.58}
.a-hero-visual{position:relative;overflow:hidden}
.a-hero-visual:before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(90deg,#edf8ff 0,rgba(237,248,255,.42) 10%,transparent 28%)}
.a-hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center 44%;display:block}
.quote{position:absolute;z-index:2;right:5%;top:25%;max-width:260px;color:#082f68;font:italic 25px/1.28 Georgia,serif;text-align:center;transform:rotate(-2deg)}
.quote:after{content:"";display:block;width:92px;margin:12px auto;border-top:3px solid #d38a06}

.jump{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:24px max(3.5%,28px) 30px;background:#fff}
.jump>a{position:relative;display:grid;grid-template-columns:62px 1fr;gap:18px;min-height:205px;padding:28px;border:1px solid #dbe6ef;border-radius:16px;background:#fff;box-shadow:0 10px 26px rgba(13,52,91,.06)}
.num{position:absolute;left:27px;top:22px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#f8ecd8;color:#c87d00;font-size:11px;font-weight:900}
.jump-icon,.role-icon,.adv-icon{display:grid;place-items:center;border-radius:50%;background:#eaf4ff;color:#0b55a7}
.jump-icon{width:52px;height:52px;margin-top:48px}.jump-icon svg{width:23px;height:23px}
.jump svg,.process svg,.advantages svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.jump div{padding-top:3px}.jump small{color:#687f99;font-size:10px;font-weight:900;letter-spacing:1.25px}
.jump h2{margin:7px 0 9px;color:#082f68;font-size:21px;line-height:1.17;letter-spacing:-.35px}
.jump p{min-height:42px;margin:0;color:#405f7e;font-size:13px;line-height:1.5}
.jump b{display:block;margin-top:14px;color:#c77c00;font-size:12px}

.process{padding:42px 3.5% 50px;background:linear-gradient(135deg,#eef9ff,#e7f4ff)}
.section-title{text-align:center}.section-title h2{margin:7px 0 7px;color:#082f68;font-size:38px;line-height:1.05;letter-spacing:-1.1px}.section-title p{margin:0;color:#44617e;font-size:14px}
.flow{display:grid;grid-template-columns:1fr 105px 1fr 105px 1fr;gap:14px;align-items:center;max-width:1500px;margin:32px auto 0}
.flow article{min-height:275px;padding:27px 25px;border:1px solid #d9e5ef;border-radius:15px;background:#fff;box-shadow:0 9px 25px rgba(15,56,97,.055)}
.role-title{display:flex;align-items:center;gap:14px}.role-icon{width:52px;height:52px;flex:0 0 52px}.role-icon svg{width:23px;height:23px}.role-title h3{margin:0 0 3px;color:#082f68;font-size:23px}.role-title small{color:#0d58ae;font-size:9px;font-weight:900}
.altec-a{width:52px;text-align:center;color:#cf8709;font-size:37px;font-weight:950}
.flow ul{list-style:none;margin:17px 0 0;padding:0}.flow li{position:relative;margin:11px 0;padding-left:27px;color:#173c63;font-size:13px;line-height:1.45}.flow li:before{content:"✓";position:absolute;left:0;color:#ce8507;font-size:17px;font-weight:900}
.connector{display:flex;flex-direction:column;align-items:center;text-align:center;color:#34516f;font-size:10px}.connector b,.connector .blue{font-size:28px;line-height:1}.connector b{color:#cb8105}.connector .blue{margin-top:13px;color:#1261b9}.connector small{font-size:10px}

.advantages{padding:42px 2.4% 50px;background:#fff}.adv-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;max-width:1540px;margin:28px auto 0}
.adv-grid article{min-height:230px;padding:23px 18px;border:1px solid #dbe5ee;border-radius:14px;background:#fff;box-shadow:0 8px 23px rgba(13,48,84,.05)}
.adv-icon{width:50px;height:50px}.adv-icon svg{width:23px;height:23px}.adv-grid h3{margin:15px 0 9px;color:#082f68;font-size:16px;line-height:1.25}.adv-grid p{margin:0;color:#405d79;font-size:12.5px;line-height:1.55}

.simulation{padding:54px 4%;background:#eef5fa}.sim-wrap{display:grid;grid-template-columns:42% 58%;max-width:1320px;margin:0 auto;border:1px solid #d7e3ed;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 20px 50px rgba(8,43,79,.09)}
.sim-photo{position:relative;min-height:525px;overflow:hidden;background:#0b2d4e}.sim-photo img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;filter:brightness(.56) saturate(.8)}
.sim-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,24,47,.55),rgba(2,24,47,.1))}
.sim-copy{position:absolute;z-index:2;left:9%;right:8%;top:50%;transform:translateY(-50%);color:#fff}.sim-copy h2{margin:0 0 26px;font-size:34px;line-height:1.08;letter-spacing:-.7px}.sim-copy ul{list-style:none;margin:0;padding:0}.sim-copy li{margin:15px 0;font-size:14px;font-weight:750}.sim-copy li:before{content:"✓";display:inline-grid;place-items:center;width:29px;height:29px;margin-right:12px;border-radius:50%;background:#fff0cc;color:#c67b00}
#lead{padding:43px 46px}.form-intro{text-align:center;max-width:700px;margin:0 auto 27px}.form-intro h2{margin:7px 0 8px;color:#082f68;font-size:28px;line-height:1.15}.form-intro p{margin:0;color:#48647f;font-size:13px;line-height:1.5}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:17px 16px}.fields label{color:#082f68;font-size:11px;font-weight:850}.fields input,.fields select{width:100%;height:48px;margin-top:7px;padding:0 14px;border:1px solid transparent;border-radius:8px;outline:0;background:#edf3f8;color:#244665;font:600 13px/1 Arial,sans-serif}.fields input:focus,.fields select:focus{border-color:#d59a2e;box-shadow:0 0 0 3px rgba(213,154,46,.12)}
.fields label:last-child{grid-column:1/-1}.form-btn{width:100%;margin-top:20px}.privacy{text-align:center;margin:12px 0 0;color:#687c90;font-size:10px}.success{display:none;text-align:center;margin:12px 0 0;padding:10px;border-radius:7px;background:#edf8f1;color:#28603d;font-size:12px}.success.show{display:block}
.faq{display:flex;align-items:center;justify-content:space-between;padding:35px 5%;background:#fff}.faq h2{margin:7px 0 4px;color:#082f68;font-size:29px}.faq p{margin:0;color:#59718a;font-size:13px}.questions{max-width:950px;margin:0 auto;padding:0 25px 55px}.questions details{padding:18px 0;border-bottom:1px solid #dce5ed}.questions summary{color:#082f68;font-weight:800;cursor:pointer}.questions p{color:#536d86;font-size:13px;line-height:1.55}

@media(max-width:1120px){.a-hero{height:auto;grid-template-columns:1fr}.a-hero-copy{padding:48px 7%}.a-hero-visual{height:390px}.jump{grid-template-columns:1fr}.jump>a{min-height:0}.jump p{min-height:0}.flow{grid-template-columns:1fr;max-width:760px}.connector{display:none}.adv-grid{grid-template-columns:repeat(2,1fr)}.sim-wrap{grid-template-columns:1fr}.sim-photo{min-height:390px}}
@media(max-width:700px){.a-hero h1{font-size:43px}.a-hero-visual{height:320px}.quote{font-size:20px}.jump{padding:18px}.adv-grid{grid-template-columns:1fr}.adv-grid article{min-height:0}.simulation{padding:30px 16px}.sim-photo{min-height:340px}.sim-copy h2{font-size:28px}#lead{padding:30px 20px}.fields{grid-template-columns:1fr}.fields label:last-child{grid-column:auto}.faq{align-items:flex-start;flex-direction:column;gap:20px}}

/* =========================================================
   V13 — MICRO-INTERACTIONS PREMIUM
   Mouvement discret, lumière, profondeur. Aucun effet gadget.
   ========================================================= */

/* Animation fluide uniquement sur appareils avec souris */
@media (hover:hover) and (pointer:fine){

  /* Cartes d'accès rapide */
  .jump>a{
    isolation:isolate;
    overflow:hidden;
    transition:
      transform .28s cubic-bezier(.2,.8,.2,1),
      box-shadow .28s ease,
      border-color .28s ease;
  }
  .jump>a::before{
    content:"";
    position:absolute;
    z-index:-1;
    width:180px;height:180px;
    left:-90px;top:-110px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(239,176,54,.18),rgba(239,176,54,0) 70%);
    opacity:0;
    transform:scale(.65);
    transition:opacity .3s ease,transform .38s ease;
  }
  .jump>a:hover{
    transform:translateY(-7px);
    border-color:#cbddea;
    box-shadow:0 22px 48px rgba(8,47,91,.13);
  }
  .jump>a:hover::before{opacity:1;transform:scale(1.3)}
  .jump>a:hover .jump-icon{
    transform:translateY(-2px) scale(1.08);
    background:#fff4dc;
    color:#c97f00;
    box-shadow:0 8px 22px rgba(202,128,0,.16);
  }
  .jump>a:hover b{color:#a96700;transform:translateX(4px)}
  .jump-icon,.jump b{
    transition:transform .26s ease,background .26s ease,color .26s ease,box-shadow .26s ease;
  }

  /* Les 3 acteurs du fonctionnement */
  .flow article{
    position:relative;
    overflow:hidden;
    transition:
      transform .3s cubic-bezier(.2,.8,.2,1),
      box-shadow .3s ease,
      border-color .3s ease;
  }
  .flow article::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(125deg,transparent 30%,rgba(255,255,255,.72) 48%,transparent 65%);
    transform:translateX(-130%);
    transition:transform .65s ease;
  }
  .flow article:hover{
    transform:translateY(-7px);
    border-color:#c8dce9;
    box-shadow:0 22px 46px rgba(8,48,91,.13);
  }
  .flow article:hover::after{transform:translateX(130%)}
  .flow article:hover .role-icon{
    transform:scale(1.08) rotate(-3deg);
    background:#fff1d4;
    color:#c97e00;
  }
  .flow article:hover .altec-a{transform:scale(1.08)}
  .role-icon,.altec-a{transition:transform .28s ease,background .28s ease,color .28s ease}

  /* Six cartes avantages */
  .adv-grid article{
    position:relative;
    overflow:hidden;
    transition:
      transform .28s cubic-bezier(.2,.8,.2,1),
      box-shadow .28s ease,
      border-color .28s ease,
      background .28s ease;
  }
  .adv-grid article::before{
    content:"";
    position:absolute;
    left:0;right:0;top:0;
    height:3px;
    background:linear-gradient(90deg,#d08a0b,#f2bd55);
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .3s ease;
  }
  .adv-grid article:hover{
    transform:translateY(-8px);
    border-color:#cbdce9;
    background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);
    box-shadow:0 22px 45px rgba(8,47,91,.12);
  }
  .adv-grid article:hover::before{transform:scaleX(1)}
  .adv-grid article:hover .adv-icon{
    transform:translateY(-3px) scale(1.1);
    background:#fff0d1;
    color:#c77b00;
    box-shadow:0 9px 20px rgba(201,125,0,.15);
  }
  .adv-icon{transition:transform .28s ease,background .28s ease,color .28s ease,box-shadow .28s ease}

  /* Simulation : profondeur légère */
  .sim-wrap{
    transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
  }
  .sim-wrap:hover{
    transform:translateY(-4px);
    border-color:#c9dce9;
    box-shadow:0 28px 65px rgba(8,43,79,.14);
  }

  /* Boutons : petite impulsion premium */
  .button{
    transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
  }
  .button:hover{
    transform:translateY(-2px);
    filter:brightness(1.025);
    box-shadow:0 10px 24px rgba(199,125,0,.18);
  }
}

/* Petite apparition au chargement : douce, pas spectaculaire */
@keyframes altecReveal{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}
.jump>a,.flow article,.adv-grid article,.sim-wrap{
  animation:altecReveal .55s ease both;
}
.jump>a:nth-child(2),.flow article:nth-of-type(2),.adv-grid article:nth-child(2){animation-delay:.05s}
.jump>a:nth-child(3),.adv-grid article:nth-child(3){animation-delay:.1s}
.adv-grid article:nth-child(4){animation-delay:.15s}
.adv-grid article:nth-child(5){animation-delay:.2s}
.adv-grid article:nth-child(6){animation-delay:.25s}

/* Accessibilité : aucune animation si l'utilisateur les réduit */
@media (prefers-reduced-motion:reduce){
  .jump>a,.flow article,.adv-grid article,.sim-wrap,.button,.jump-icon,.adv-icon,.role-icon,.altec-a{
    animation:none!important;
    transition:none!important;
    transform:none!important;
  }
}


/* ==========================================================
   V14 — POLISH / VISIBILITY / SEQUENTIAL MOTION
   ========================================================== */

/* Hero label: more visible, centered above the title */
.a-hero-copy{align-items:flex-start}
.hero-badge{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 15px;
  margin:0 0 4px!important;
  border:1px solid rgba(205,132,5,.24);
  border-radius:999px;
  background:rgba(255,255,255,.78);
  box-shadow:0 7px 20px rgba(9,49,90,.055);
  color:#b96f00!important;
  font-size:12px!important;
  letter-spacing:1.45px!important;
  white-space:nowrap;
}

/* Shortcut icons: bigger, cleaner, stronger contrast */
.jump-icon{
  width:58px!important;
  height:58px!important;
  margin-top:46px!important;
  border:1px solid #d8e9fa;
  background:linear-gradient(145deg,#f1f8ff,#e3f1ff)!important;
  color:#075bb8!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 8px 18px rgba(8,75,145,.08);
}
.jump-icon svg{width:29px!important;height:29px!important;stroke-width:2!important}

/* Process cards: slightly stronger visual hierarchy */
.role-icon{
  width:58px!important;height:58px!important;flex-basis:58px!important;
  border:1px solid #d8e9fa;
  background:linear-gradient(145deg,#f2f8ff,#e5f2ff)!important;
  color:#075bb8!important;
  box-shadow:0 7px 17px rgba(8,75,145,.07);
}
.role-icon svg{width:27px!important;height:27px!important;stroke-width:2!important}
.altec-a{
  width:58px!important;
  font-size:41px!important;
  text-shadow:0 5px 16px rgba(207,135,9,.13);
}

/* Clear connectors */
.connector{
  width:100%;
  min-width:0;
  color:#163f6b!important;
  font-size:11px!important;
  font-weight:750;
}
.connector .flow-label,.connector small{
  font-size:10.5px!important;
  font-weight:750;
  color:#294d72;
  white-space:nowrap;
}
.flow-line{
  position:relative;
  width:82px;
  height:20px;
  margin:5px auto;
  display:flex;
  align-items:center;
}
.flow-line i{
  display:block;
  width:61px;
  height:2px;
  border-radius:2px;
  transform-origin:left center;
}
.flow-line b{
  width:21px;
  font-size:24px!important;
  line-height:1!important;
  font-weight:800;
}
.flow-line.forward i{background:linear-gradient(90deg,#e4a021,#d17f00)}
.flow-line.forward b{color:#d17f00}
.flow-line.return{justify-content:flex-end}
.flow-line.return i{background:linear-gradient(90deg,#0d63bd,#4c91d4)}
.flow-line.return b{color:#0d63bd}

/* Sequential animated flow: You -> ALTEC -> Client, then return */
@keyframes lineOut{0%,12%{transform:scaleX(0);opacity:.25}32%,72%{transform:scaleX(1);opacity:1}88%,100%{transform:scaleX(0);opacity:.25}}
@keyframes arrowPulse{0%,12%{opacity:.25;transform:translateX(-4px)}32%,72%{opacity:1;transform:translateX(2px)}88%,100%{opacity:.25;transform:translateX(-4px)}}
@keyframes cardSignal{0%,18%,100%{box-shadow:0 9px 25px rgba(15,56,97,.055)}35%,62%{box-shadow:0 16px 38px rgba(8,77,145,.15),0 0 0 2px rgba(209,137,9,.10)}}
@media (prefers-reduced-motion:no-preference){
  .connector-one .forward i,.connector-one .forward b{animation-delay:0s}
  .connector-two .forward i,.connector-two .forward b{animation-delay:1.15s}
  .connector-two .return i,.connector-two .return b{animation-delay:2.55s}
  .connector-one .return i,.connector-one .return b{animation-delay:3.7s}
  .flow-line i{animation:lineOut 5s ease-in-out infinite}
  .flow-line b{animation:arrowPulse 5s ease-in-out infinite}
  .flow article:nth-of-type(1){animation:cardSignal 5s ease-in-out infinite}
  .flow article:nth-of-type(2){animation:cardSignal 5s ease-in-out .9s infinite}
  .flow article:nth-of-type(3){animation:cardSignal 5s ease-in-out 1.9s infinite}
}

/* Simulation photo: visible coffee cup, no text baked into image */
.sim-photo{background:linear-gradient(135deg,#0b2d4e,#173e60)}
.sim-photo img{
  object-position:58% center!important;
  filter:brightness(.55) saturate(.78)!important;
}
.coffee-cup{
  position:absolute;
  z-index:2;
  right:8%;
  bottom:13%;
  width:112px;
  height:128px;
  border-radius:8px 8px 30px 30px;
  background:linear-gradient(145deg,#0a2947,#123f67);
  box-shadow:0 17px 32px rgba(0,0,0,.24),inset 0 1px 1px rgba(255,255,255,.15);
  opacity:.96;
}
.coffee-cup:before{
  content:"";
  position:absolute;
  right:-31px;
  top:25px;
  width:45px;
  height:55px;
  border:10px solid #123f67;
  border-left:0;
  border-radius:0 28px 28px 0;
}
.coffee-cup:after{
  content:"ALTEC";
  position:absolute;
  left:0;right:0;
  top:73px;
  text-align:center;
  color:#e3ae48;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.8px;
}
.cup-mark{
  position:absolute;
  left:0;right:0;
  top:27px;
  text-align:center;
  color:#e3ae48;
  font-size:31px;
  font-weight:950;
}

/* More breathing room around the simulation copy */
.sim-copy{max-width:390px}
.sim-copy h2{text-shadow:0 2px 14px rgba(0,0,0,.28)}
.sim-copy li{filter:drop-shadow(0 1px 4px rgba(0,0,0,.25))}

@media(max-width:1120px){
  .hero-badge{align-self:flex-start}
  .coffee-cup{right:8%;transform:scale(.9);transform-origin:bottom right}
}
@media(max-width:700px){
  .hero-badge{font-size:10.5px!important;min-height:31px}
  .coffee-cup{transform:scale(.7);right:4%;bottom:7%}
}