/* v4.20 · Portfolio and references only. Kept separate from Woo styles. */
.portfolio-section .portfolio-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0;padding:4px 0 10px;overflow:visible!important;scroll-snap-type:none!important;scrollbar-width:auto}
.portfolio-section .portfolio-card{display:flex;flex-direction:column;flex:none!important;min-width:0;width:100%!important;margin:0;transform:none;scroll-snap-align:none;border:1px solid #d6dfcf;border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 8px 22px #1827180a}
.portfolio-section .portfolio-card:hover{transform:none;box-shadow:0 12px 30px #18271815}
.portfolio-section .portfolio-card-image{aspect-ratio:1.43;background:linear-gradient(130deg,#e7eddf,#f4f6ed);position:relative;overflow:hidden;isolation:isolate}
.portfolio-section .portfolio-card-image .portfolio-snapshot{position:absolute;inset:0;width:100%;height:100%;min-height:100%;object-fit:cover;object-position:top center;display:block;opacity:1;visibility:visible;filter:none;transition:opacity .3s ease,visibility .3s ease;z-index:0}
.portfolio-section .portfolio-card-image.is-live .portfolio-snapshot{opacity:0;visibility:hidden}
.portfolio-section .portfolio-preview-stage{display:none;position:absolute;inset:0;background:transparent;z-index:1;overflow:hidden;opacity:0;pointer-events:none;transition:opacity .3s ease}
.portfolio-section .portfolio-preview-stage.is-active{display:block}
.portfolio-section .portfolio-preview-stage.is-loaded{opacity:1;pointer-events:auto}
.portfolio-section .portfolio-desktop-frame{position:absolute;top:0;left:0;display:block!important;width:1440px!important;min-width:1440px!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;transform:scale(var(--portfolio-scale,.24));transform-origin:top left;background:#fff}
.portfolio-section .portfolio-card-image:after{display:none}
.portfolio-section .portfolio-preview-toggle{display:none!important}
.portfolio-section .portfolio-loading{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:9px;white-space:nowrap;background:rgba(22,32,22,.92);color:#fff;border:1px solid #ffffff45;box-shadow:0 8px 24px #0003;padding:12px 16px;border-radius:999px;font-size:12px;line-height:1.3;font-weight:750;pointer-events:none}
.portfolio-section .portfolio-loading[hidden],.portfolio-section .portfolio-preview-fallback[hidden]{display:none!important}
.portfolio-section .portfolio-loading-spinner{width:15px;height:15px;flex:none;border:2px solid #c6d8a7;border-top-color:#d7ff3f;border-radius:50%;animation:am-preview-spin .85s linear infinite}
@keyframes am-preview-spin{to{transform:rotate(360deg)}}
.portfolio-section .portfolio-preview-fallback{z-index:2;position:absolute;inset:auto 10px 10px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;background:#1b261bea;border-radius:10px;color:#fff;font-size:11px;font-weight:700;line-height:1.35}
.portfolio-section .portfolio-preview-fallback a{display:inline-block;color:#e5ff81;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.portfolio-section .portfolio-card-info{margin-top:auto;min-height:82px;width:100%;display:flex;gap:10px;align-items:center;justify-content:space-between;padding:16px;background:#fff;color:#172316;overflow-wrap:anywhere}
.portfolio-section .portfolio-card-title{font:700 clamp(15px,1.3vw,19px)/1.35 var(--display);min-width:0}
.portfolio-section .portfolio-card-cta{font-size:12px;flex:none;white-space:nowrap;padding:10px 12px;border-radius:100px;color:#25351e;background:#eaf3d9}
.portfolio-section .portfolio-hint{font-size:14px;color:#485847;max-width:920px;margin-top:18px;line-height:1.7}
.portfolio-section .portfolio-browser-bar{gap:8px;padding:0 11px}.portfolio-section .portfolio-browser-host{font-size:11px;min-width:0}.portfolio-section .portfolio-desktop-label{font-size:9px}
/* A stationary responsive gallery is easier to scan than an automatically moving marquee. */
.clients-section .clients-intro{color:#43513e;font-size:16px;line-height:1.65;max-width:740px;margin:0 0 26px}
.clients-section .clients-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:stretch;margin-top:18px}
.clients-section .client-brand{width:100%;min-width:0;min-height:156px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#fff;border:1px solid #dce3d7;border-radius:18px;padding:20px 12px;text-align:center;color:#243323;transition:box-shadow .2s,border-color .2s;box-shadow:0 6px 20px #17281709;text-decoration:none}
.clients-section a.client-brand:hover,.clients-section a.client-brand:focus-visible{border-color:#94af70;box-shadow:0 10px 28px #17281714}
.clients-section .client-logo-wrap{display:flex;align-items:center;justify-content:center;width:100%;height:72px;min-height:72px;max-width:200px;overflow:hidden}
.clients-section .client-brand img{display:block;width:auto!important;height:auto!important;max-width:100%!important;max-height:68px!important;object-fit:contain!important;object-position:center;opacity:1!important;filter:none!important;transform:none!important;transition:none}
.clients-section .client-name{font:650 13px/1.45 var(--font);color:#34442f;overflow-wrap:anywhere}
@media(max-width:1180px){.clients-section .clients-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.portfolio-section .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:770px){.clients-section .clients-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.clients-section .client-brand{min-height:138px;padding:14px 9px}.portfolio-section .portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portfolio-section .portfolio-card-info{flex-wrap:wrap}.portfolio-section .portfolio-card-cta{margin-left:auto}}
@media(max-width:540px){.portfolio-section .portfolio-grid{grid-template-columns:minmax(0,1fr);gap:19px}.clients-section .clients-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.clients-section .client-logo-wrap{height:62px;min-height:62px}.clients-section .client-brand img{max-height:58px!important}.portfolio-section .portfolio-card-info{min-height:72px}.portfolio-section .portfolio-card-cta{margin-left:0}}
@media(prefers-reduced-motion:reduce){.portfolio-section .portfolio-loading-spinner{animation:none;border-top-color:#d7ff3f}.clients-section .client-brand{transition:none}}


/* 4.24.9: viewport de capturas navegables SOLO en las seis tarjetas del inicio. */
.portfolio-section:not(.am-work-gallery) .portfolio-card-image{position:relative;isolation:isolate;overflow:hidden}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-scroll{
  position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;
  overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#7f9a5f transparent;
  overscroll-behavior-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;
  background:#e7eee0;
}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-scroll:focus-visible{outline:3px solid #739500;outline-offset:-4px}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-scroll::-webkit-scrollbar{width:5px}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-scroll::-webkit-scrollbar-thumb{background:#839b68;border-radius:9px}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-scroll>.portfolio-snapshot{
  position:static!important;inset:auto!important;display:block!important;width:100%!important;
  height:auto!important;min-height:0!important;max-width:none!important;max-height:none!important;
  margin:0!important;padding:0!important;object-fit:fill!important;object-position:top center!important;
  opacity:1!important;visibility:visible!important;transform:none!important;transition:none!important;
}
.portfolio-section:not(.am-work-gallery) .portfolio-card-image.has-scroll:after{
  content:'';position:absolute;inset:auto 0 0;height:28px;
  background:linear-gradient(transparent,rgba(16,31,16,.15));pointer-events:none;z-index:2;
}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-control{
  position:absolute;z-index:3;left:50%;bottom:12px;transform:translateX(-50%);
  display:inline-flex;justify-content:center;align-items:center;gap:8px;white-space:nowrap;
  border:1px solid #f0f4e855;border-radius:999px;background:rgba(23,37,27,.92);color:#fff;
  min-height:36px;padding:9px 13px;font:750 11px/1.2 var(--font);box-shadow:0 6px 18px #07130840;
}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-control:hover{background:#30482a}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-control:focus-visible{outline:3px solid #d7ff3f;outline-offset:3px}
.portfolio-section:not(.am-work-gallery) .portfolio-shot-control[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){.portfolio-section:not(.am-work-gallery) .portfolio-shot-scroll{scroll-behavior:auto}}
/* Vista real opcional: nunca reemplaza la captura hasta que el visitante la solicita. */
.portfolio-section:not(.am-work-gallery) .portfolio-live-toggle{position:absolute;z-index:5;right:10px;top:10px;min-height:32px;padding:8px 11px;border:1px solid #f8fff5a6;border-radius:9px;color:#fff;background:#162a20f0;font:750 11px/1.2 var(--font);box-shadow:0 5px 12px #0003}
.portfolio-section:not(.am-work-gallery) .portfolio-live-toggle:hover,.portfolio-section:not(.am-work-gallery) .portfolio-live-toggle[aria-pressed="true"]{background:#d7ff3f;color:#152412}
.portfolio-section:not(.am-work-gallery) .portfolio-card-image.is-live .portfolio-shot-scroll{visibility:hidden;pointer-events:none}
.portfolio-section:not(.am-work-gallery) .portfolio-card-image.is-live .portfolio-shot-control{display:none!important}
.portfolio-section:not(.am-work-gallery) .portfolio-preview-stage.is-loaded{pointer-events:auto}
.portfolio-section:not(.am-work-gallery) .portfolio-card-image .portfolio-preview-fallback{bottom:12px;left:12px;right:12px}