/* v064 — PROYECTOS / REAL MEDIA INTEGRATION over locked v063 geometry and behavior
   Baseline behavior/navigation: v051, frozen.
   Grid organization: restored from v049. Only media tiles may expand into existing
   v049 empty unit cells so remaining whitespace is composed of equal 1×1 grid units.
   No algorithmic 11+11+11 puzzle repartition is retained. */
.projects-screen{
  --projects-accent:var(--launch-accent,#e1261c);
  --projects-ink:var(--launch-ink,#11110f);
  --projects-paper:var(--launch-paper2,#f3f1e9);
  --projects-muted:rgba(17,17,15,.54);
  --projects-ease:cubic-bezier(.22,.74,.18,1);
  --projects-motion:650ms;
  --projects-small-text-size:clamp(12px,1.02vw,14px);
  background:var(--projects-paper)!important;
}
.projects-experience{position:absolute;inset:0;z-index:18;overflow:hidden;background:var(--projects-paper)}
.projects-scroll{
  position:absolute;z-index:10;
  left:6.4vw;right:6.4vw;top:8.8vh;bottom:15.8vh;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;overscroll-behavior:contain;
  touch-action:pan-x;outline:0;
}
.projects-scroll::-webkit-scrollbar{display:none}
.projects-canvas{
  position:relative;width:166.6667vw;height:100%;min-height:0;box-sizing:border-box;
  padding:1.0vh 2.4vw 1.2vh;
}
.projects-grid{
  width:100%;height:100%;min-width:0;min-height:0;display:grid;
  grid-template-columns:repeat(22,minmax(0,1fr));
  grid-template-rows:repeat(9,minmax(0,1fr));
  grid-auto-flow:dense;gap:clamp(6px,.48vw,10px);
  transition:opacity 180ms ease;
}
.projects-card{
  position:relative;min-width:0;min-height:0;box-sizing:border-box;border:0;border-radius:0;
  overflow:hidden;font:inherit;transform-origin:top left;
  transition:filter 420ms ease,opacity 420ms ease,background 320ms ease;
}
.projects-card--media{padding:0;cursor:pointer;background:#d7d3ca;color:#fff;isolation:isolate}
.projects-card--media::before,.projects-card--media::after{content:"";position:absolute;inset:0;pointer-events:none}
.projects-card--media::before{z-index:-2;background:var(--project-surface)}
.projects-card--media::after{z-index:-1;background:linear-gradient(135deg,transparent 0 48%,rgba(255,255,255,.25) 48.3% 49%,transparent 49.3%),linear-gradient(0deg,rgba(17,17,15,.08),rgba(17,17,15,0) 40%);opacity:.75}
.projects-card--project-a{--project-surface:linear-gradient(145deg,#b94d37 0%,#d78a5c 48%,#7d8f82 100%)}
.projects-card--project-b{--project-surface:linear-gradient(145deg,#455e73 0%,#7995a2 48%,#cfb778 100%)}
.projects-card--project-c{--project-surface:linear-gradient(145deg,#78645c 0%,#bfa28e 45%,#768a92 100%)}
.projects-card--project-d{--project-surface:linear-gradient(145deg,#6d8064 0%,#aeba91 46%,#c97954 100%)}
.projects-card--project-e{--project-surface:linear-gradient(145deg,#5f536c 0%,#9787a0 44%,#bea16c 100%)}
.projects-card--project-f{--project-surface:linear-gradient(145deg,#766f60 0%,#b9a985 48%,#4d6c72 100%)}
.projects-card__placeholder-id{position:absolute;left:10px;bottom:8px;z-index:5;font-size:clamp(7px,.52vw,9px);font-weight:650;letter-spacing:.08em;color:rgba(255,255,255,.86);mix-blend-mode:difference}
.projects-card__frame{position:absolute;inset:0;opacity:0;background:var(--project-surface);animation:projectsPlaceholderSlideshow 12s linear infinite}
.projects-card__frame--1{animation-delay:0s;filter:hue-rotate(0deg) brightness(.96)}
.projects-card__frame--2{animation-delay:4s;filter:hue-rotate(18deg) brightness(1.02)}
.projects-card__frame--3{animation-delay:8s;filter:hue-rotate(-18deg) brightness(.92)}
@keyframes projectsPlaceholderSlideshow{0%,29%{opacity:1}33%,96%{opacity:0}100%{opacity:1}}
.projects-card--text{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:clamp(6px,.58vw,10px);background:rgba(17,17,15,.035);color:var(--projects-ink);border-top:1px solid rgba(17,17,15,.14);text-align:center}
.projects-card__text-label{display:block;margin:0 0 .34em;color:var(--projects-accent);font-family:var(--launch-font);font-size:clamp(7px,.52vw,8px);font-weight:650;line-height:1.04;letter-spacing:.035em;text-align:center}
.projects-card__text-value{display:block;width:100%;max-width:100%;font-family:var(--launch-font);font-size:var(--projects-small-text-size);font-weight:700;line-height:.98;letter-spacing:-.045em;text-align:center;text-wrap:balance}
.projects-grid.is-project-focus .projects-card--media:not(.is-project-active){filter:grayscale(1);opacity:.20}
.projects-grid.is-project-focus .projects-card--media.is-project-active{filter:none;opacity:1}
.projects-grid.is-project-focus .projects-card--media.is-promoted{box-shadow:inset 0 0 0 1px var(--projects-accent);z-index:3}
.projects-grid.is-project-focus .projects-card--text{background:rgba(17,17,15,.045)}
.projects-slider{position:absolute;z-index:28;left:50%;bottom:11.35vh;width:min(46vw,700px);height:34px;transform:translateX(-50%);display:flex;align-items:center}
.projects-slider__track{position:relative;width:100%;height:1px;background:rgba(17,17,15,.20)}
.projects-slider__thumb{position:absolute;left:0;top:50%;width:auto;min-width:50px;height:28px;transform:translateY(-50%);padding:0 8px;border:0;background:var(--projects-paper);color:var(--projects-ink);font-family:var(--launch-font);font-size:12px;font-weight:650;letter-spacing:-.04em;cursor:ew-resize;touch-action:none;transition:color 120ms ease}
.projects-slider__thumb.is-active{color:var(--projects-accent)}
.projects-slider__thumb::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:6px;background:currentColor}
.projects-slider__thumb:focus-visible{outline:1px solid var(--projects-accent);outline-offset:3px}
.projects-qa-note{position:absolute;z-index:12;left:50%;bottom:9.1vh;transform:translateX(-50%);font-size:7px;letter-spacing:.14em;color:rgba(17,17,15,.24);white-space:nowrap}

/* Frozen v051 shared-third and endpoint-navigation behavior. */
.projects-shared-third{position:relative!important;padding:0!important;overflow:hidden!important;background:var(--projects-paper2)!important;border:0!important}
.projects-shared-third__preview{position:absolute;left:0;right:0;top:8.8vh;bottom:15.8vh;overflow:hidden;pointer-events:none}
.projects-shared-third__hit{position:absolute;z-index:8;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer}
.projects-shared-third .projects-canvas--shared{position:absolute;top:0;pointer-events:none;max-width:none;max-height:none}
.projects-shared-third--left .projects-canvas--shared{left:0}
.projects-shared-third--right .projects-canvas--shared{right:0}
.projects-shared-third .projects-grid,.projects-shared-third .projects-card{pointer-events:none}
.branch-panel--projects .edge-nav--left,.branch-panel--projects .edge-nav--right{opacity:0;visibility:hidden;pointer-events:none;transition:opacity 180ms ease,visibility 0s linear 180ms}
.branch-panel--projects .edge-nav--left.is-projects-endpoint-visible,.branch-panel--projects .edge-nav--right.is-projects-endpoint-visible{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
@media (prefers-reduced-motion:reduce){.projects-card,.projects-card__frame{transition:none!important;animation:none!important}.projects-card__frame--1{opacity:1!important}}
/* v062 — overview square concept cells: no provisional taxonomy label; active-project labels still appear when populated by JS. */
.projects-card[data-project-text-shape="square"] .projects-card__text-label:empty{display:none;margin:0}
/* v063 — Admin-approved Projects overview text hierarchy.
   Overview only: square concepts and the six horizontal emotional titles share the
   same scale. Square concepts use the RuGo accent at rest and black on hover.
   Project-focus PUEBLO/AÑO and TIPO DE PROYECTO semantics remain unchanged. */
.projects-experience[data-project-state="overview"] .projects-card[data-project-text-shape="square"] .projects-card__text-value{
  color:var(--projects-accent);
  text-transform:uppercase;
  transition:color 120ms ease;
}
.projects-experience[data-project-state="overview"] .projects-card[data-project-text-shape="square"]:hover .projects-card__text-value{
  color:var(--projects-ink);
}
.projects-experience[data-project-state="overview"] .projects-card[data-project-text-shape="horizontal"] .projects-card__text-label{
  font-size:var(--projects-small-text-size);
  text-transform:uppercase;
}


/* v064 — approved real-media integration layer.
   Geometry, card positions, focus attenuation and shared-third clipping remain frozen. */
.projects-card__media-image,
.projects-card__media-video{
  position:absolute;inset:0;width:100%;height:100%;display:block;
  object-fit:cover;object-position:50% 50%;border:0;background:#d7d3ca;
}
.projects-card__media-image{z-index:1;opacity:1;transition:opacity 320ms ease;image-rendering:auto}
.projects-card__media-image.is-switching{opacity:.12}
.projects-card__media-image.is-video-hidden{opacity:0}
.projects-card__media-video{z-index:2;opacity:1;pointer-events:none}
.projects-card--media::before{z-index:0}
.projects-card--media::after{z-index:3;opacity:.10;background:linear-gradient(0deg,rgba(17,17,15,.035),rgba(17,17,15,0) 42%)}
.projects-grid.is-project-focus .projects-card--media.is-promoted::after{opacity:.04}
.projects-shared-third .projects-card__media-video{display:none!important}
@media (prefers-reduced-motion:reduce){.projects-card__media-image{transition:none!important}}


/* v066 — native raster fidelity candidate.
   Do not keep every Projects card permanently compositor-promoted with will-change.
   Chromium may raster transformed/composited descendants at a presentation scale,
   which can make photographic content look softer than the exact source bytes.
   FLIP promotion remains transient/automatic during the existing transform animation. */
