/* Prime Studio — selector temporal de hero / panel lateral deslizante */
.ps-hero-switcher{
  --ps-switcher-width:218px;
  --ps-switcher-tab:48px;
  --ps-switcher-bg:rgba(15,15,16,.96);
  --ps-switcher-border:rgba(255,255,255,.15);
  --ps-switcher-text:#fff;
  --ps-switcher-accent:#ff5322;
  position:absolute;
  left:0;
  top:50%;
  z-index:220;
  width:var(--ps-switcher-width);
  color:var(--ps-switcher-text);
  font-family:var(--ps-font-body,"Inter",Arial,sans-serif);
  pointer-events:auto;
  transform:translate(-100%,-50%);
  transition:transform .48s cubic-bezier(.16,1,.3,1),opacity .2s ease,visibility .2s ease;
  will-change:transform;
}
.ps-hero-switcher.is-open{transform:translate(0,-50%)}
.ps-hero-switcher-tab{
  position:absolute;
  left:100%;
  top:50%;
  width:var(--ps-switcher-tab);
  height:56px;
  padding:0;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  color:var(--ps-switcher-text);
  background:var(--ps-switcher-bg);
  border:1px solid var(--ps-switcher-border);
  border-left:0;
  border-radius:0 9px 9px 0;
  box-shadow:9px 12px 30px rgba(0,0,0,.2);
  cursor:pointer;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:background-color .2s ease,color .2s ease;
}
.ps-hero-switcher-tab:hover,
.ps-hero-switcher.is-open .ps-hero-switcher-tab{background:#111113}
.ps-hero-switcher-tab svg{
  display:block;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:1.55;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .45s cubic-bezier(.16,1,.3,1);
}
.ps-hero-switcher.is-open .ps-hero-switcher-tab svg{transform:rotate(90deg)}
.ps-hero-switcher-tab:focus-visible,
.ps-hero-switcher-option:focus-visible{outline:2px solid var(--ps-switcher-accent);outline-offset:3px}
.ps-hero-switcher-panel{
  position:relative;
  width:100%;
  padding:16px;
  display:grid;
  gap:8px;
  background:var(--ps-switcher-bg);
  border:1px solid var(--ps-switcher-border);
  border-left:0;
  border-radius:0 14px 14px 0;
  box-shadow:14px 22px 48px rgba(0,0,0,.28);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.ps-hero-switcher-option{
  width:100%;
  min-height:46px;
  padding:12px 16px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:8px;
  background:rgba(255,255,255,.025);
  color:rgba(255,255,255,.76);
  font:700 12px/1 var(--ps-font-body,"Inter",Arial,sans-serif);
  letter-spacing:.075em;
  text-align:left;
  text-transform:uppercase;
  cursor:pointer;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .18s ease;
}
.ps-hero-switcher-option:hover{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.2);
  color:#fff;
  transform:translateX(3px);
}
.ps-hero-switcher-option.is-active{
  background:var(--ps-switcher-accent);
  border-color:var(--ps-switcher-accent);
  color:#111010;
}
.ps-hero-switcher.is-changing{pointer-events:none;opacity:.45}

/* En Esfera solo desaparece durante la vista grande de detalle. Las imágenes
   pequeñas de la órbita 3D no alteran su visibilidad ni interacción. */
.ps-sphere-hero .ps-hero-switcher{z-index:8}
.ps-sphere-hero.is-detail-open .ps-hero-switcher{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

@media (max-width:760px){
  .ps-hero-switcher{
    --ps-switcher-width:min(218px,76vw);
    --ps-switcher-tab:44px;
    top:48%;
  }
  .ps-hero-switcher-tab{height:52px}
  .ps-hero-switcher-tab svg{width:21px;height:21px}
  .ps-hero-switcher-panel{padding:13px;gap:7px}
  .ps-hero-switcher-option{min-height:43px;font-size:11px}
}
@media (prefers-reduced-motion:reduce){
  .ps-hero-switcher,
  .ps-hero-switcher-tab,
  .ps-hero-switcher-tab svg,
  .ps-hero-switcher-option{transition-duration:.01ms!important}
}

/* Orbit móvil: compatibilidad con HTML nuevo y versiones cacheadas anteriores.
   El selector por contexto evita que el título de la card herede el headline. */
@media (max-width: 900px) {
  body.ps-home-orbit .ps-orbit-hero .ps-orbit-card > .ps-orbit-card-title,
  body.ps-home-orbit .ps-orbit-hero .ps-orbit-card > .ps-orbit-title,
  .ps-orbit-hero .ps-orbit-card > .ps-orbit-card-title,
  .ps-orbit-hero .ps-orbit-card > .ps-orbit-title {
    margin: 10px 0 0 !important;
    font-family: "DM Sans", sans-serif !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    letter-spacing: .02em !important;
    font-weight: 700 !important;
    text-transform: none !important;
    text-shadow: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    color: #222 !important;
    white-space: normal !important;
  }
}