/* ==========================================================================
   SwissKH, récit épinglé CADRIA et animations SVG (pince B8, pick & place)
   ========================================================================== */

.skh-scrolly { position: relative; }
@media (min-width: 961px) {
	.e-con.skh-scrolly-pin { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
	html.skh-hdr-hidden .e-con.skh-scrolly-pin { padding-top: 0 !important; }
}

/* Scène : anneau, disque décor, machine, étiquettes */
.e-con.skh-stage { position: relative; aspect-ratio: 1 / 1; width: min(100%, 72vh) !important; margin-inline: auto; padding: 0 !important; }
.skh-stage .skh-ring { position: absolute !important; inset: 0; transform: rotate(calc(var(--p, 0) * 140deg)); transition: transform .2s linear; }
.skh-ring svg { width: 100%; height: 100%; overflow: visible; display: block; }
.e-con.skh-stage-disc { position: absolute !important; inset: 11%; width: auto !important; border-radius: 50%; overflow: hidden; background: #ECEEF0; box-shadow: inset 0 0 0 1px rgba(15, 18, 22, .08), 0 40px 80px -30px rgba(9, 11, 14, .35); }
.skh-stage-disc::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 50%; background: radial-gradient(circle at 50% 40%, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, .55) 72%, rgba(255, 255, 255, .9) 100%); pointer-events: none; }
.e-con.skh-stage-machine { position: absolute !important; inset: 6% 8% 4%; width: auto !important; z-index: 3; }
.skh-stage-machine > .elementor-widget-image { position: absolute !important; inset: 0; margin: 0 !important; opacity: 0; transform: translateY(14px) scale(.97); transition: opacity .7s var(--skh-ease), transform .9s var(--skh-ease); }
.skh-stage-machine > .elementor-widget-image.is-on { opacity: 1; transform: none; }
.skh-stage-machine img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 30px 30px rgba(9, 11, 14, .25)); }
.e-con.skh-stage-tag { position: absolute !important; z-index: 4; width: auto !important; gap: 2px !important; padding: 8px 12px !important; background: rgba(255, 255, 255, .9); border: 1px solid var(--skh-line); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.skh-stage-tag::before { content: ""; position: absolute; width: 7px; height: 7px; background: var(--skh-red); top: -4px; left: -4px; }
.skh-stage-tag--a { top: 6%; right: 0; }
.skh-stage-tag--b { bottom: 10%; left: -2%; }
.skh-stage-tag .elementor-heading-title { font-family: var(--skh-font-mono); font-size: .6875rem; letter-spacing: .08em; text-transform: uppercase; color: var(--skh-fg-3); line-height: 1.4; }
.skh-stage-tag .skh-tag-b .elementor-heading-title, .skh-stage-tag .skh-tag-strong .elementor-heading-title { font-size: .8125rem; letter-spacing: .04em; text-transform: none; color: var(--skh-fg); font-weight: 600; }

/* Étapes */
@media (min-width: 961px) {
	.e-con.skh-steps { position: relative; min-height: 520px; }
	.e-con.skh-step { position: absolute !important; inset: 0 0 auto 0; width: 100% !important; opacity: 0; transform: translateY(26px); pointer-events: none; transition: opacity .55s var(--skh-ease), transform .7s var(--skh-ease); }
	.e-con.skh-step.is-on { opacity: 1; transform: none; pointer-events: auto; }
}
.skh-step .skh-tagline .elementor-heading-title { font-family: var(--skh-font-display); font-size: clamp(1.25rem, 1rem + .9vw, 1.7rem); font-weight: 600; color: var(--skh-red); }
.skh-art .elementor-heading-title { display: inline-block; font-family: var(--skh-font-mono); font-size: .75rem; letter-spacing: .1em; padding: 6px 10px; background: var(--skh-steel-50); border: 1px solid var(--skh-line); color: var(--skh-fg); }
.skh-decor-list .elementor-icon-list-item { padding: 11px 0 !important; border-bottom: 1px solid var(--skh-line); transition: padding .4s var(--skh-ease); }
.skh-decor-list .elementor-icon-list-text { font-family: var(--skh-font-display); font-size: 1.2rem; font-weight: 600; letter-spacing: .02em; color: var(--skh-fg-3); transition: color .4s; }
.skh-decor-list .elementor-icon-list-item.is-on { padding-left: 10px !important; }
.skh-decor-list .elementor-icon-list-item.is-on .elementor-icon-list-text { color: var(--skh-fg); }
.skh-decor-list .elementor-icon-list-item.is-on::before { content: ""; width: 8px; height: 8px; background: var(--skh-red); margin-left: -18px; margin-right: 10px; }
.skh-spec-mini > .e-con { border-top: 1px solid var(--skh-fg); }

/* Rail de navigation */
.e-con.skh-rail-wrap { position: absolute !important; right: var(--skh-gutter); top: 50%; transform: translateY(-50%); width: auto !important; z-index: 5; }
.skh-rail .elementor-icon-list-item { justify-content: flex-end; cursor: pointer; }
.skh-rail .elementor-icon-list-text { display: inline-flex; align-items: center; gap: 10px; font-family: var(--skh-font-mono); font-size: .625rem; letter-spacing: .12em; text-transform: uppercase; color: var(--skh-fg-3); }
.skh-rail .elementor-icon-list-text::after { content: ""; width: 18px; height: 1.5px; background: var(--skh-line-strong); transition: width .4s var(--skh-ease), background .3s; }
.skh-rail .elementor-icon-list-item.is-on .elementor-icon-list-text { color: var(--skh-fg); }
.skh-rail .elementor-icon-list-item.is-on .elementor-icon-list-text::after { width: 34px; background: var(--skh-red); }
@media (max-width: 960px) { .e-con.skh-rail-wrap { display: none; } }

/* Pince Schaublin B8 (cycle 4,2 s) */
@keyframes cScrew { 0% { transform: translateY(-110px); opacity: 0; } 8% { opacity: 1; } 22%, 30% { transform: translateY(0); } 38%, 72% { transform: translateY(7px); } 80% { transform: translateY(0); } 92% { transform: translateY(-110px); opacity: 1; } 100% { transform: translateY(-110px); opacity: 0; } }
@keyframes cPull { 0%, 30% { transform: translateY(0); } 38%, 72% { transform: translateY(7px); } 80%, 100% { transform: translateY(0); } }
@keyframes cJawL { 0%, 30% { transform: rotate(-3deg); } 38%, 72% { transform: rotate(0); } 80%, 100% { transform: rotate(-3deg); } }
@keyframes cJawR { 0%, 30% { transform: rotate(3deg); } 38%, 72% { transform: rotate(0); } 80%, 100% { transform: rotate(3deg); } }
@keyframes cArrow { 0%, 28% { opacity: 0; transform: translateY(-6px); } 36%, 72% { opacity: 1; transform: none; } 80%, 100% { opacity: 0; } }
@keyframes cState { 0%, 32% { opacity: 0; } 38%, 72% { opacity: 1; } 78%, 100% { opacity: 0; } }
@keyframes cStateOff { 0%, 32% { opacity: 1; } 38%, 72% { opacity: 0; } 78%, 100% { opacity: 1; } }
@keyframes cFoot { 0%, 28% { transform: rotate(0); } 34%, 74% { transform: rotate(-8deg); } 80%, 100% { transform: rotate(0); } }
.is-playing .cScrew { animation: cScrew 4.2s ease-in-out infinite; }
.is-playing .cPull { animation: cPull 4.2s ease-in-out infinite; }
.is-playing .cJawL { animation: cJawL 4.2s ease-in-out infinite; transform-box: view-box; transform-origin: 125px 150px; }
.is-playing .cJawR { animation: cJawR 4.2s ease-in-out infinite; transform-box: view-box; transform-origin: 175px 150px; }
.is-playing .cArrow { animation: cArrow 4.2s ease-in-out infinite; }
.is-playing .cState { animation: cState 4.2s ease-in-out infinite; }
.is-playing .cStateOff { animation: cStateOff 4.2s ease-in-out infinite; }
.is-playing .cFoot { animation: cFoot 4.2s ease-in-out infinite; transform-box: fill-box; transform-origin: 90% 100%; }
.cState { opacity: 0; }

/* Pick & place (cycle 5,2 s) */
@keyframes gX { 0%, 18% { transform: translateX(0); } 42%, 58% { transform: translateX(300px); } 82%, 100% { transform: translateX(0); } }
@keyframes gZ { 0%, 4% { transform: translateY(0); } 10%, 13% { transform: translateY(78px); } 19%, 41% { transform: translateY(0); } 47%, 52% { transform: translateY(78px); } 58%, 100% { transform: translateY(0); } }
@keyframes gCarry { 0%, 11% { opacity: 0; } 12%, 50% { opacity: 1; } 51%, 100% { opacity: 0; } }
@keyframes gLeft { 0%, 11% { opacity: 1; } 12%, 88% { opacity: 0; } 96%, 100% { opacity: 1; } }
@keyframes gRight { 0%, 50% { opacity: 0; } 51%, 84% { opacity: 1; } 92%, 100% { opacity: 0; } }
@keyframes gScan { 0%, 60% { opacity: 0; } 64%, 76% { opacity: 1; } 80%, 100% { opacity: 0; } }
@keyframes belt { to { stroke-dashoffset: -24; } }
.is-playing .gX { animation: gX 5.2s cubic-bezier(.6, 0, .3, 1) infinite; }
.is-playing .gZ { animation: gZ 5.2s ease-in-out infinite; }
.is-playing .gCarry { animation: gCarry 5.2s linear infinite; }
.is-playing .gLeft { animation: gLeft 5.2s linear infinite; }
.is-playing .gRight { animation: gRight 5.2s linear infinite; }
.is-playing .gScan { animation: gScan 5.2s linear infinite; }
.is-playing .belt { animation: belt .8s linear infinite; }
.gCarry, .gRight, .gScan { opacity: 0; }
.skh-svg-anim svg { width: 100%; height: auto; display: block; overflow: visible; }