/* ===== Sémafor — Ingénierie + rouages interactifs (charte corporate) ===== */
.gears-sec{padding:84px 0;background:#fff;font-family:'Poppins',system-ui,sans-serif}
[dir=rtl] .gears-sec{font-family:'Noto Sans Arabic','Cairo',sans-serif}
.gears-wrap{max-width:1400px;margin:0 auto;padding:0 30px}
.gears-grid{display:grid;grid-template-columns:1fr 1.12fr;gap:clamp(30px,5vw,64px);align-items:center}
[dir=rtl] .gears-fig{order:-1}
.gears-txt h2{font-size:clamp(30px,3.8vw,47px);color:#18365A;font-weight:500;line-height:1.1;margin:0 0 14px}
.gears-sub{font-size:18px;color:#5A6473;line-height:1.6;margin:0 0 20px;max-width:46ch}
.gears-hint{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#00A6D8;margin:0 0 24px}
.gears-hint svg{flex:none}
.gears-actions{display:flex;gap:12px;flex-wrap:wrap}
.gears-btn{display:inline-block;padding:12px 26px;text-decoration:none;font-weight:600;font:600 16px/1 'Poppins',sans-serif;border:2px solid #FCA311;cursor:pointer;transition:.2s}
[dir=rtl] .gears-btn{font-family:'Noto Sans Arabic','Cairo',sans-serif}
.gears-btn.primary{background:#FCA311;color:#13213C}
.gears-btn.primary:hover{background:#ffb733}
.gears-btn.ghost{background:transparent;color:#FCA311}
.gears-btn.ghost:hover{background:#FCA311;color:#13213C}
.gears-fig{position:relative;border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(19,33,60,.28);line-height:0}
.gears-fig img{width:100%;display:block;aspect-ratio:761/387;object-fit:cover}
.gear-hot{position:absolute;transform:translate(-50%,-50%);width:23%;aspect-ratio:1;border:0;background:transparent;cursor:pointer;padding:0;border-radius:50%;z-index:2}
.gear-ring{position:absolute;inset:0;border-radius:50%;border:3px solid transparent;transition:border-color .25s,box-shadow .25s}
@keyframes gearPulse{0%,100%{box-shadow:0 0 0 0 rgba(0,166,216,0)}50%{box-shadow:0 0 16px 2px rgba(0,166,216,.4)}}
.gear-hot .gear-ring{animation:gearPulse 2.6s ease-in-out infinite}
.gear-hot[data-i="1"] .gear-ring{animation-delay:.6s}.gear-hot[data-i="2"] .gear-ring{animation-delay:1.2s}
.gear-hot:hover .gear-ring,.gear-hot:focus-visible .gear-ring{border-color:rgba(0,166,216,.95);box-shadow:0 0 26px 4px rgba(0,166,216,.55);animation:none}
.gear-hot.on .gear-ring{border-color:#FCA311;box-shadow:0 0 30px 5px rgba(252,163,17,.6);animation:none}
.gear-lbl{position:absolute;left:50%;top:calc(100% + 6px);transform:translateX(-50%);font-size:11px;font-weight:700;letter-spacing:.1em;color:#fff;background:rgba(13,21,40,.9);padding:3px 9px;border-radius:6px;opacity:0;transition:opacity .2s;white-space:nowrap;pointer-events:none}
.gear-hot:hover .gear-lbl,.gear-hot:focus-visible .gear-lbl,.gear-hot.on .gear-lbl{opacity:1}
@media(prefers-reduced-motion:reduce){.gear-hot .gear-ring{animation:none}}
@media(max-width:900px){.gears-grid{grid-template-columns:1fr;gap:30px}[dir=rtl] .gears-fig{order:0}}