/* Valle Escondido — extracted from the design template. Do not hand-edit hover states; see js/app.js data-hover shim. */
* { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body { margin: 0; background: #D5CEBE; -webkit-font-smoothing: antialiased; }
  ::selection { background: #3F4021; color: #EDE6D6; }
  nav[data-solid="1"] .ve-nl-cream { opacity: 0 !important; }
  nav[data-solid="1"] .ve-nl-esp { opacity: 1 !important; }
  a { text-decoration: none; color: inherit; }
  a.txtlink { color: #6B4E33; transition: color .3s ease; }
  a.txtlink:hover { color: #33271B; }
  [data-hscroll] { scrollbar-width: none; }
  [data-hscroll]::-webkit-scrollbar { display: none; }
  @keyframes ve_kb { 0% { transform: scale(1.05); } 100% { transform: scale(1.16); } }
  @keyframes ve_bob { 0%,100% { transform: translateY(0); opacity:.55; } 50% { transform: translateY(7px); opacity:1; } }
  @keyframes ve_breathe { 0% { opacity:.04; } 100% { opacity:.08; } }
  @media (max-width: 980px) {
    .ve-navlinks { display: none !important; }
    .ve-burger { display: flex !important; }
  }
  .ve-band:hover .ve-band-img { transform: scale(1.05); }
  @keyframes ve_spin { to { transform: rotate(360deg); } }
  .ve-orbit-ring { animation: ve_spin 90s linear infinite; }
  .ve-node { transition: transform .45s cubic-bezier(.2,.7,.2,1); }
  .ve-node:hover { transform: translate(-50%,-50%) scale(1.12); }
  .ve-node:hover .ve-node-disc { box-shadow: 0 12px 30px rgba(51,39,27,.28); filter: brightness(1.06); }
  .ve-node-disc { transition: box-shadow .45s ease, filter .45s ease; }
  @media (max-width: 760px) { .ve-orbit-wrap { transform: scale(.72); } }
  @media (max-width: 680px) {
    .ve-filo-cols { flex-direction: column !important; gap: 22px !important; }
    .ve-filo-div { display: none !important; }
  }

/* ---- Visor de presentaciones de proyecto ---- */
.ve-viewer { position: fixed; inset: 0; z-index: 1000; display: flex; flex-direction: column; background: rgba(26,20,13,.975); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.ve-viewer[hidden] { display: none; }
.ve-viewer-bar { display: flex; align-items: center; gap: 16px; padding: 14px clamp(16px,4vw,34px); color: #EDE6D6; font-family: 'Jost', sans-serif; }
.ve-viewer-title { font-size: 12.5px; letter-spacing: .2em; text-transform: uppercase; }
.ve-viewer-count { margin-left: auto; font-size: 12px; letter-spacing: .12em; opacity: .68; }
.ve-viewer-close { background: none; border: none; color: #EDE6D6; font-size: 24px; line-height: 1; cursor: pointer; padding: 4px 6px; opacity: .85; transition: opacity .2s ease; }
.ve-viewer-close:hover { opacity: 1; }
.ve-viewer-track { flex: 1; display: flex; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.ve-viewer-track::-webkit-scrollbar { display: none; }
.ve-slide { flex: 0 0 100%; scroll-snap-align: center; display: flex; align-items: center; justify-content: center; padding: 0 clamp(6px,3vw,44px) clamp(16px,3vw,34px); }
.ve-slide-img { width: 100%; height: 100%; background-size: contain; background-position: center; background-repeat: no-repeat; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; }
.ve-viewer-nav { position: absolute; top: 52%; transform: translateY(-50%); z-index: 2; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 26px; line-height: 1; cursor: pointer; color: #EDE6D6; background: rgba(237,230,214,.1); border: 1px solid rgba(237,230,214,.3); transition: background .2s ease; }
.ve-viewer-nav:hover { background: rgba(237,230,214,.24); }
.ve-prev { left: clamp(8px,2vw,26px); }
.ve-next { right: clamp(8px,2vw,26px); }
@media (max-width: 760px) { .ve-viewer-nav { display: none; } }

/* refuerzos responsive del visor + guard de overflow horizontal en móvil */
html, body { overflow-x: hidden; }
.ve-viewer-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ve-viewer-count, .ve-viewer-close { flex: 0 0 auto; }

/* En móvil el diagrama orbital (600px fijos) se recorta: lo reflujo a lista vertical de pasos */
@media (max-width: 760px) {
  .ve-orbit-wrap { position: static !important; width: 100% !important; height: auto !important; transform: none !important; margin: 4px auto 0 !important; display: flex; flex-direction: column; align-items: center; gap: 22px; }
  .ve-orbit-ring { display: none !important; }
  .ve-orbit-wrap > div:not(.ve-node) { position: static !important; transform: none !important; width: auto !important; max-width: 340px; margin: 0 auto 6px !important; }
  .ve-node { position: static !important; transform: none !important; margin: 0 !important; cursor: default; }
  .ve-node:hover { transform: none !important; }
}
