/* Página estrella JUKI RS-2 (prueba 06-10): tres formas de enseñarla. */
.es-escena{position:relative;background:#F1F4F8;overflow:hidden}
.es-escena canvas{display:block;width:100%;height:100%}
.es-carga{position:absolute;inset:0;display:grid;place-items:center;color:var(--gris);font-weight:600;background:#F1F4F8;transition:opacity .5s;z-index:2}
.es-carga[data-oculto]{opacity:0;pointer-events:none}
.es-cifra b{display:block;font:700 44px/1 Inter,sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--tinta)}
.es-cifra b small{font-size:18px;font-weight:600;color:var(--gris);margin-left:4px;letter-spacing:0}
.es-cifra span{display:block;font-size:14px;color:var(--gris);margin-top:8px}
.es-fuente{font-size:12px;color:var(--gris)}   /* 21-10: en el gris de la web, no en el clarito (--gris2 daba 3,2:1; --gris da 5,2:1 sobre blanco y 4,9:1 sobre el gris de las bandas: AA pide 4,5:1) */
.es-marca{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--azul)}
.es-botones{display:flex;gap:10px;flex-wrap:wrap}
.es-tabla{width:100%;border-collapse:collapse;font-size:15px}
.es-tabla th,.es-tabla td{text-align:left;padding:13px 0;border-top:1px solid var(--filete);vertical-align:top}
.es-tabla th{font-weight:500;color:var(--gris);width:42%;padding-right:24px}
.es-tabla td{font-variant-numeric:tabular-nums}

/* ---------- A · Recorrido ligado al scroll ---------- */
.esA{position:relative;height:640vh}
.esA-fija{position:sticky;top:0;height:100vh;height:100svh}
.esA-fija .es-escena{position:absolute;inset:0}
.esA-paso{position:absolute;left:clamp(16px,5vw,72px);top:50%;transform:translateY(-50%);width:min(440px,86vw);display:grid;gap:12px;padding:26px 28px;border-radius:20px;
  background:rgba(255,255,255,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 18px 50px rgba(21,40,61,.10);transition:opacity .4s,transform .4s;z-index:3}
.esA-paso[data-oculto]{opacity:0;transform:translateY(calc(-50% + 14px));pointer-events:none}
.esA-paso h1{font-size:clamp(34px,4.4vw,56px);line-height:1.02}
.esA-paso h2{font-size:clamp(26px,2.8vw,36px);line-height:1.08;letter-spacing:-.025em}
.esA-paso p{color:var(--gris);line-height:1.55;margin:0}
.esA-paso .es-cifra{margin-top:6px}
.esA-pista{position:absolute;right:clamp(16px,3vw,40px);top:50%;transform:translateY(-50%);display:grid;gap:14px;z-index:3}
.esA-pista span{display:flex;align-items:center;gap:10px;justify-content:flex-end;font-size:12.5px;font-weight:600;color:var(--gris2);transition:color .3s}
.esA-pista span::after{content:"";width:8px;height:8px;border-radius:50%;background:rgba(21,40,61,.18);transition:background .3s,transform .3s}
.esA-pista span[data-activo]{color:var(--tinta)}.esA-pista span[data-activo]::after{background:var(--amarillo);transform:scale(1.4)}
.esA-baja{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);font-size:13px;color:var(--gris);z-index:3;transition:opacity .3s}
.esA-cifras{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.esA-cifras .es-cifra{padding-top:16px;border-top:1px solid var(--filete)}

/* ---------- B · Explorador ---------- */
.esB-cab{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;padding-top:48px;margin-bottom:22px}
.esB-cab h1{font-size:52px}
.esB-cab p{color:var(--gris);font-size:17px;margin-top:10px;max-width:620px}
.esB-marco{position:relative;height:min(calc(100vh - 110px),760px);min-height:520px;border-radius:26px;border:1px solid var(--borde);overflow:hidden;background:#F1F4F8}
.esB-marco .es-escena{position:absolute;inset:0}
.esB-pestanas{position:absolute;left:20px;top:20px;display:flex;gap:4px;padding:4px;background:rgba(255,255,255,.9);border:1px solid var(--borde);border-radius:999px;z-index:4;backdrop-filter:blur(10px)}
.esB-pestanas button{border:0;background:none;padding:9px 16px;border-radius:999px;font:600 14px/1 Inter,sans-serif;color:var(--gris);cursor:pointer}
.esB-pestanas button[aria-pressed="true"]{background:var(--azul);color:#fff}
.esB-pin{position:absolute;z-index:3;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid #fff;background:var(--azul);color:#fff;font:700 13px/26px Inter,sans-serif;text-align:center;cursor:pointer;box-shadow:0 6px 18px rgba(0,76,151,.35);transition:transform .2s,background .2s}
.esB-pin::before{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(0,76,151,.35);animation:esLatido 2.2s infinite}
.esB-pin[aria-pressed="true"]{background:var(--amarillo);color:var(--tinta);transform:scale(1.15)}
.esB-pin[hidden]{display:none}
@keyframes esLatido{0%{transform:scale(.7);opacity:1}100%{transform:scale(1.5);opacity:0}}
.esB-ficha{position:absolute;right:20px;top:20px;bottom:20px;width:min(360px,40%);z-index:4;background:rgba(255,255,255,.94);border:1px solid var(--borde);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:12px;backdrop-filter:blur(12px);box-shadow:var(--sombra)}
.esB-ficha[hidden]{display:none}
.esB-ficha h2{font-size:24px;letter-spacing:-.02em;line-height:1.15}
.esB-ficha p{color:var(--gris);font-size:15px;line-height:1.55}
.esB-ficha ol{list-style:none;padding:0;margin:auto 0 0;display:grid;gap:6px;counter-reset:p}
.esB-ficha li button{width:100%;text-align:left;display:flex;gap:10px;align-items:center;border:1px solid var(--filete);background:#fff;border-radius:12px;padding:9px 12px;font:500 13.5px/1.25 Inter,sans-serif;color:var(--tinta);cursor:pointer}
.esB-ficha li button b{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--hueco);font-size:12px}
.esB-ficha li button[aria-pressed="true"]{border-color:var(--azul)}.esB-ficha li button[aria-pressed="true"] b{background:var(--azul);color:#fff}
.esB-marcha{position:absolute;left:20px;bottom:20px;z-index:4;display:flex;gap:18px;align-items:center;background:rgba(255,255,255,.92);border:1px solid var(--borde);border-radius:16px;padding:12px 16px}
.esB-marcha[hidden]{display:none}
.esB-marcha span{font-size:13px;color:var(--gris)}.esB-marcha b{font-size:15px;color:var(--tinta)}
.esB-marcha i{font-style:normal;font-size:11px;font-weight:700;color:#7A5E0C;background:#FBF3D6;border-radius:6px;padding:3px 6px}
.esB-pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:18px}
.esB-pasos div{padding:16px 18px;border-radius:16px;border:1px solid var(--filete);background:#fff;transition:border-color .3s,box-shadow .3s}
.esB-pasos div[data-activo]{border-color:var(--amarillo);box-shadow:0 0 0 3px rgba(233,185,32,.18)}
.esB-pasos small{font-size:12px;font-weight:700;color:var(--azul);letter-spacing:.08em}.esB-pasos h3{font-size:17px;margin:6px 0 4px}.esB-pasos p{font-size:13.5px;color:var(--gris);line-height:1.45}
.esB-abajo{display:grid;grid-template-columns:1.1fr .9fr;gap:48px}
.esB-encaja{background:#fff;border:1px solid var(--borde);border-radius:22px;padding:28px;display:grid;gap:14px;align-self:start}
.esB-encaja .campos{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.esB-encaja label{display:grid;gap:6px;font-size:12.5px;color:var(--gris);font-weight:600}
.esB-encaja input{padding:11px 12px}
.esB-res{display:flex;gap:10px;align-items:center;font-size:14.5px}
.esB-res b{font-size:12px;font-weight:700;padding:5px 9px;border-radius:999px}
.esB-res[data-e="cabe"] b{background:#E3F4EA;color:#1D7A46}.esB-res[data-e="fuera"] b{background:#FBE7E5;color:#B3261E}

/* ---------- C · Despiece editorial ---------- */
.esC-hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:24px;align-items:center;padding-top:40px}
.esC-hero h1{font-size:68px;line-height:.98}
.esC-hero .lead{font-size:19px;color:var(--gris);line-height:1.55;margin:20px 0 28px;max-width:470px}
.esC-grande{display:flex;align-items:baseline;gap:12px;margin:8px 0 26px}
.esC-grande b{font:800 96px/0.9 Inter,sans-serif;letter-spacing:-.05em;color:var(--azul);font-variant-numeric:tabular-nums}
.esC-grande span{max-width:170px;font-size:15px;color:var(--gris);line-height:1.35}
.esC-marco{position:relative;height:min(80vh,740px);min-height:520px}
.esC-marco .es-escena{position:absolute;inset:0;border-radius:26px}
.esC-rotulo{position:absolute;z-index:3;font-size:13px;font-weight:600;color:var(--tinta);white-space:nowrap;transition:opacity .3s}
.esC-rotulo span{display:block;background:#fff;border:1px solid var(--borde);border-radius:10px;padding:7px 11px;box-shadow:var(--sombra)}
.esC-rotulo em{display:block;font-style:normal;font-weight:500;color:var(--gris);font-size:12px;margin-top:2px}
.esC-lineas{position:absolute;inset:0;z-index:2;pointer-events:none}
.esC-lineas line{stroke:#7D8EA3;stroke-width:1.2;stroke-dasharray:3 3}.esC-lineas circle{fill:var(--azul);stroke:#fff;stroke-width:2}
.esC-control{position:absolute;left:20px;bottom:20px;z-index:4;display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.92);border:1px solid var(--borde);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600;color:var(--gris)}
.esC-control input{width:150px;accent-color:var(--azul);padding:0}
.esC-cifras{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid var(--tinta)}
.esC-cifras .es-cifra{padding:26px 24px 26px 0;border-right:1px solid var(--filete)}
.esC-cifras .es-cifra+.es-cifra{padding-left:24px}.esC-cifras .es-cifra:last-child{border-right:0}
.esC-cifras .es-cifra b{font-size:52px}
.esC-dos{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.esC-dos h2{font-size:40px}
.esC-dos p.lead{font-size:17px;color:var(--gris);line-height:1.65;margin-top:16px}
.esC-proceso{display:grid;gap:0;counter-reset:pr}
.esC-proceso div{display:grid;grid-template-columns:48px 1fr;gap:4px 16px;padding:18px 0;border-top:1px solid var(--filete)}
.esC-proceso div::before{counter-increment:pr;content:"0" counter(pr);grid-row:span 2;font:700 22px/1 Inter,sans-serif;color:var(--amarillo)}
.esC-proceso h3{font-size:18px}.esC-proceso p{font-size:14.5px;color:var(--gris);line-height:1.5}
.esC-linea{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:22px}
.esC-linea span{font-size:13px;font-weight:600;padding:8px 12px;border-radius:999px;border:1px solid var(--borde);background:#fff;color:var(--gris)}
.esC-linea span[data-yo]{background:var(--azul);border-color:var(--azul);color:#fff}
.esC-linea i{font-style:normal;color:var(--gris2)}

@media (max-width:860px){
  .esA-cifras,.esC-cifras{grid-template-columns:1fr 1fr}.esC-cifras .es-cifra{padding-left:0!important;border-right:0}
  .esA-pista{display:none}.esA-paso{top:auto;bottom:18px;transform:none;padding:18px 20px}.esA-paso[data-oculto]{transform:translateY(12px)}
  .esB-cab{grid-template-columns:1fr}.esB-cab h1{font-size:40px}
  .esB-marco{height:70vh}.esB-ficha{left:12px;right:12px;top:auto;bottom:12px;width:auto;max-height:46%;overflow:auto}.esB-ficha ol{display:none}.esB-pestanas{left:12px;top:12px}
  .esB-pasos{grid-template-columns:1fr 1fr}.esB-abajo,.esC-dos,.esC-hero{grid-template-columns:1fr}.esB-encaja .campos{grid-template-columns:1fr 1fr}
  .esC-hero h1{font-size:46px}.esC-grande b{font-size:70px}.esC-marco{height:62vh}.esC-rotulo{font-size:11.5px}
}
/* Móvil: el 3D no bloquea el scroll vertical (los controles de órbita ponen touch-action:none en el lienzo) */
.es-escena canvas{touch-action:pan-y!important}
