/* ============================================================
   GAMERO GIL · FLUID — capa de interacción y robustez (v3.1)
   ------------------------------------------------------------
   Se carga DESPUÉS de custom.css y animations.css.
   · Press feedback inmediato (al pulsar, no al soltar)
   · Hover sólo con ratón real: (hover:hover) and (pointer:fine)
   · Filas de lista: el fondo crece desde el borde por el que entra
     el puntero (direction-aware) con transform, sin animar padding
   · Materiales: cabecera translúcida + scroll edge effect
   · Accesibilidad: reduced-motion / reduced-transparency / contrast
   · Peor caso: textos largos, emails, imágenes que faltan
   Autor: Antonio Díaz · antoniodiaz.pro · nexopress.com
   ============================================================ */
:root{--ease-out:cubic-bezier(0.23,1,0.32,1);--ease-in-out:cubic-bezier(0.77,0,0.175,1);--ease-drawer:cubic-bezier(0.32,0.72,0,1)}

/* ---------- 1 · PRESS FEEDBACK ---------- */
header.site .cta,.site.gg-inline .cta,.cta-row .btn,.fchip,.viewtog button,.loadmore button,.empty button,.gg-sheet .sheet-cta,.hamb{transition-property:background-color,color,border-color,transform;transition-duration:.16s;transition-timing-function:var(--ease-out)}
header.site .cta:active,.site.gg-inline .cta:active,.cta-row .btn:active,.fchip:active,.viewtog button:active,.loadmore button:active,.empty button:active,.gg-sheet .sheet-cta:active,.hamb:active{transform:scale(.97)}
.gamero-web #masthead .header-button:active,.gamero-web #masthead .header-button-wrap .button:active{transform:scale(.97)}
.selected .item .ph,.archive-grid .card .ph,.related a .ph,.gallery .work .ph{transition:transform .16s var(--ease-out)}
.selected .item:active .ph,.archive-grid .card:active .ph,.related a:active .ph,.gallery .work:active .ph{transform:scale(.985)}
.hero-foot .scroll:active .arrow{transform:scale(.9);transition-duration:.1s}
.series-row:active,.archive-list .lrow:active{opacity:.92}

/* ---------- 2 · HOVER SÓLO CON RATÓN ---------- */
@media (hover:none),(pointer:coarse){
  a:hover .ph-img img,.item:hover .ph-img img,.work:hover .ph-img img,.gamero-web .selected .item:hover .ph img{transform:none}
  .gallery .work:hover .ph,.archive-grid .card:hover .ph{transform:none}
  .series-row:hover .peek,.archive-list .lrow:hover .peek{opacity:0}
  header.site .cta:hover .arr,.site.gg-inline .cta:hover .arr{transform:rotate(-45deg)}
  .hero-foot .scroll:hover .arrow{transform:none}
  .series-row:hover,.archive-list .lrow:hover{color:inherit}
  .series-row:hover .num,.series-row:hover .disc,.series-row:hover .yr,.archive-list .lrow:hover :is(.num,.yr,.disc,.ser,.dim,.av){color:var(--muted)}
  .series-row:hover .name .em,.archive-list .lrow:hover .nm .em{color:var(--accent)}
}

/* ---------- 3 · FILAS DE LISTA — fondo direction-aware ---------- */
.series-row,.archive-list .lrow{isolation:isolate;transition:color .18s ease .05s}
.series-row:hover,.archive-list .lrow:hover{background:transparent;padding-left:0;padding-right:0}
.series-row::before,.archive-list .lrow::before{content:"";position:absolute;inset:0 -18px;background:var(--fg);z-index:-1;transform:scaleY(0);transform-origin:50% var(--gg-o,100%);transition:transform .32s var(--ease-out);pointer-events:none}
.archive-list .lrow::before{inset:0 -14px}
@media (hover:hover) and (pointer:fine){
  .series-row:hover::before,.archive-list .lrow:hover::before{transform:scaleY(1)}
}
/* miniatura que sigue al puntero (JS escribe transform en la propia .peek) */
.gg-follow .peek{left:0!important;right:auto!important;top:0!important;transition:opacity .2s var(--ease-out)!important;will-change:transform}
.exh .row:hover{padding-left:0}
.exh .row>*{transition:transform .2s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.exh .row:hover>*{transform:translateX(8px)}}

/* ---------- 4 · MATERIALES — cabecera translúcida + scroll edge ---------- */
header.site,.site.gg-inline{transition:backdrop-filter .2s ease,-webkit-backdrop-filter .2s ease}
html.gg-scrolled header.site,html.gg-scrolled .site.gg-inline{backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%)}
header.site::after,.site.gg-inline::after{content:"";position:absolute;left:0;right:0;top:100%;height:18px;background:linear-gradient(color-mix(in srgb,var(--bg) 70%,transparent),transparent);opacity:0;transition:opacity .2s ease;pointer-events:none}
html.gg-scrolled header.site::after,html.gg-scrolled .site.gg-inline::after{opacity:1}
html.gg-scrolled body.gamero-web #masthead .site-header-row-container-inner{backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%)}

/* ---------- 5 · MENÚ MÓVIL ---------- */
/* Kadence: el cajón usa la curva de drawer */
.gamero-web #mobile-drawer .drawer-inner{transition:transform .42s var(--ease-drawer)!important}
.gamero-web #mobile-drawer .drawer-overlay{transition:opacity .3s ease!important}
/* Hoja propia del mockup / cabecera inline */
.hamb{background:none;border:0;padding:10px 0;color:inherit;cursor:pointer;min-height:44px}
.gg-sheet-scrim{position:fixed;inset:0;z-index:44;background:rgba(14,12,11,.32);opacity:0;pointer-events:none;transition:opacity .3s ease}
.gg-sheet-scrim.open{opacity:1;pointer-events:auto}
.gg-sheet{position:fixed;left:0;right:0;top:0;z-index:45;display:flex;flex-direction:column;gap:4px;padding:88px 32px 20px;background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-bottom:1px solid var(--rule);box-shadow:0 30px 60px -30px rgba(14,12,11,.35);transform:translateY(-100%);visibility:hidden;transition:transform .42s var(--ease-drawer),visibility 0s linear .42s;touch-action:none;user-select:none}
.gg-sheet.open{transform:translateY(0);visibility:visible;transition:transform .42s var(--ease-drawer),visibility 0s}
.gg-sheet a{display:flex;align-items:baseline;gap:14px;min-height:52px;padding:8px 0;border-bottom:1px solid var(--rule);font-family:var(--serif);font-size:34px;line-height:1.1;letter-spacing:-0.015em;color:var(--fg);opacity:0;transform:translateY(-6px);transition:opacity .2s ease,transform .3s var(--ease-out)}
.gg-sheet a .idx{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted);font-variant-numeric:tabular-nums}
.gg-sheet.open a{opacity:1;transform:none;transition-delay:calc(var(--i,0) * 40ms + 80ms)}
.gg-sheet .sheet-cta{margin-top:20px;justify-content:center;border:1px solid var(--fg);border-radius:999px;border-bottom-color:var(--fg);font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;min-height:48px;align-items:center}
.gg-sheet .grip{align-self:center;width:36px;height:4px;border-radius:2px;background:var(--rule);margin-top:16px}
@media (min-width:761px){.gg-sheet,.gg-sheet-scrim{display:none}}

/* ---------- 6 · PEOR CASO (break-ui) ---------- */
.selected .item .caption{align-items:baseline}
.selected .item .caption .t{min-width:0;overflow-wrap:break-word;text-wrap:balance}
.selected .item .caption .y,.series-row .yr,.press-row .yr,.press-row .link,.exh .row .yr,.exh .row .link,.archive-list .lrow .yr{white-space:nowrap;flex-shrink:0;font-variant-numeric:tabular-nums}
.ph-img .ph-tag,.placeholder .ph-tag{max-width:calc(100% - 24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero-meta .cell,.hero-foot>*,.sec-head>*,.contact .crow>*,.manifesto .mfoot .cell,.obrador .meta>*,.mat{min-width:0}
.hero-meta .cell .v,.hero-foot .nowplaying .work,.sec-head .title,.obrador .meta .v,.mat .m-name{overflow-wrap:break-word;hyphens:manual}
.contact .crow a.v{overflow-wrap:anywhere}
.series-row{grid-template-columns:80px minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr) auto}
.series-row .name{text-wrap:balance;overflow-wrap:break-word}
.series-row .desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.press-row,.exh .row{grid-template-columns:80px minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) auto}
.press-row .ven,.exh .row .ven{overflow-wrap:break-word;text-wrap:balance}
.press-row .loc,.exh .row .loc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.press-row.featured{grid-template-columns:140px 80px minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) auto}
@media (max-width:900px){
  .series-row{grid-template-columns:60px minmax(0,1fr) auto}
  .press-row,.exh .row,.press-row.featured{grid-template-columns:60px minmax(0,1fr) auto}
  .press-row.featured .yr{grid-column:auto}
}
/* imagen que falta: el marco conserva su caja y muestra trama */
.ph-img.is-missing{background:repeating-linear-gradient(135deg,rgba(250,250,247,.08) 0 1px,transparent 1px 14px),var(--fg)}
.ph-img.is-missing img,.hero-fig.is-missing img{visibility:hidden}
.hero-fig.is-missing img{background:var(--fg)}

/* ---------- 7 · ACCESIBILIDAD ---------- */
@media (prefers-reduced-motion:reduce){
  .series-row::before,.archive-list .lrow::before{transform:none;opacity:0;transition:opacity .2s ease}
  .series-row:hover::before,.archive-list .lrow:hover::before{opacity:1}
  .gg-sheet,.gg-sheet.open{transition:opacity .2s ease,visibility 0s linear .2s;transform:none;opacity:0}
  .gg-sheet.open{opacity:1;transition:opacity .2s ease,visibility 0s}
  .gg-sheet a{transform:none}
  .exh .row:hover>*{transform:none}
  a:hover .ph-img img,.item:hover .ph-img img,.work:hover .ph-img img{transform:none}
}
@media (prefers-reduced-transparency:reduce){
  header.site,.site.gg-inline,.gg-sheet,html.gg-scrolled header.site{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--bg)}
  .ph-img .ph-tag,.ph-img .ph-corner{backdrop-filter:none;-webkit-backdrop-filter:none;background:#171413}
}
@media (prefers-contrast:more){
  :root{--rule:#0E0C0B66;--muted:#48433b}
  .gg-sheet,header.site{background:var(--bg);border-bottom:1px solid var(--fg)}
}

/* ---------- 8 · SERIES & CUERPOS — acordeón dinámico con sus obras ---------- */
details.series-item{border-bottom:1px solid var(--rule)}
details.series-item>summary{list-style:none}
details.series-item>summary::-webkit-details-marker{display:none}
details.series-item>summary.series-row{border-bottom:0}
details.series-item>summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.series-row .yr{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.series-row .tog{position:relative;width:13px;height:13px;flex-shrink:0;color:var(--fg)}
.series-row:hover .tog{color:var(--inv-fg)}
.series-row .tog::before,.series-row .tog::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:currentColor;transition:transform .25s var(--ease-out)}
.series-row .tog::after{transform:rotate(90deg)}
.series-item.is-open .tog::after,.series-list:not(.js) details[open] .tog::after{transform:rotate(0deg)}
.series-item.is-open .peek,.series-list:not(.js) details[open] .peek{opacity:0!important}
.series-panel-inner{padding:6px 0 40px}
.series-works{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:24px 20px}
.series-works li{margin:0;min-width:0}
.sw{display:flex;flex-direction:column;gap:10px;color:inherit;text-decoration:none}
.sw-img{display:block;position:relative;overflow:hidden;aspect-ratio:4/5;background:var(--fg);border:3px solid var(--fg);transition:transform .16s var(--ease-out)}
.sw-img img,.sw-img .placeholder{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease-out)}
.sw-img .placeholder{border:0}
.sw-cap{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.sw-cap .t{font-family:var(--serif);font-size:18px;line-height:1.15;min-width:0;overflow-wrap:break-word;text-wrap:balance;transition:color .2s ease}
.sw-cap .y{color:var(--muted);font-size:11px;letter-spacing:.06em;white-space:nowrap;font-variant-numeric:tabular-nums}
.sw:active .sw-img{transform:scale(.985)}
@media (hover:hover) and (pointer:fine){.sw:hover .t{color:var(--accent-warm,var(--accent))}.sw:hover .sw-img img{transform:scale(1.03)}}
.series-all{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:16px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--fg);text-decoration:none}
@media (hover:hover) and (pointer:fine){.series-all:hover{color:var(--accent-warm,var(--accent))}}
@media (min-width:901px){.series-panel-inner{padding-left:104px}}
/* las obras entran en cascada al abrir */
@keyframes gg-sw-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.series-item.is-open .series-works li{animation:gg-sw-in .4s var(--ease-out) both}
.series-item.is-open .series-works li:nth-child(2){animation-delay:40ms}
.series-item.is-open .series-works li:nth-child(3){animation-delay:80ms}
.series-item.is-open .series-works li:nth-child(4){animation-delay:120ms}
.series-item.is-open .series-works li:nth-child(5){animation-delay:160ms}
.series-item.is-open .series-works li:nth-child(n+6){animation-delay:200ms}
@media (max-width:600px){.series-works{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}.sw-cap{flex-direction:column;gap:2px}}
@media (prefers-reduced-motion:reduce){.series-item.is-open .series-works li{animation:none}.sw-img img{transition:none}}
