/* Gran Formato Work Showcase Section - generated from approved prototype */
.gfwss-showcase {
  --gf-page-bg: #f3f2ee;
  --gf-ink: #050505;
  --gf-muted: #5f5b55;
  --gf-orange: #ff3b14;
  --gf-green: #00d66b;
  --gf-line: rgba(5, 5, 5, 0.12);
  --gfwss-title-color: #050505;
  --gfwss-title-size: 154px;
  --gfwss-orb-color: #252627;
  --gfwss-cta-bg: #0c0c0c;
  --gfwss-cta-title-color: #ffffff;
  --gfwss-cta-text-color: rgba(255, 255, 255, 0.68);
  --gfwss-cta-mail-color: rgba(255, 255, 255, 0.7);
  --gfwss-button-bg: #ffffff;
  --gfwss-button-text: #0c0c0c;
  --gfwss-button-accent: #25d366;
  --gfwss-cta-min-height: 78svh;
  font-family: "Plus Jakarta Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color-scheme: light;
  font-synthesis: none;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
}

.gfwss-showcase,
.gfwss-showcase * {
  box-sizing: border-box;
}

.elementor-widget-gfwss_work_showcase,
.elementor-widget-gfwss-work-showcase,
.elementor-widget[data-widget_type^="gfwss_work_showcase"],
.elementor-widget[data-widget_type^="gfwss-work-showcase"] {
  display: block !important;
  width: 100vw !important;
  min-width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

.elementor-widget-gfwss_work_showcase > .elementor-widget-container,
.elementor-widget-gfwss-work-showcase > .elementor-widget-container,
.elementor-widget[data-widget_type^="gfwss_work_showcase"] > .elementor-widget-container,
.elementor-widget[data-widget_type^="gfwss-work-showcase"] > .elementor-widget-container {
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding: 0 !important;
}

.elementor-widget-gfwss_work_showcase .gfwss-showcase,
.elementor-widget-gfwss-work-showcase .gfwss-showcase,
.elementor-widget[data-widget_type^="gfwss_work_showcase"] .gfwss-showcase,
.elementor-widget[data-widget_type^="gfwss-work-showcase"] .gfwss-showcase {
  width: 100vw;
  min-width: 100vw;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.gfwss-showcase {
      position: relative;
      width: 100%;
      max-width: 100%;
      overflow-x: clip;
      overflow-y: visible;
      isolation: isolate;
      background: var(--gf-page-bg);
      color: var(--gf-ink);
    }

    .gfwss-showcase,
    .gfwss-showcase * {
      letter-spacing: 0;
    }

    .gfwss-showcase .gf-sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .gfwss-showcase .gf-title-scene {
      position: relative;
      height: 230svh;
      background: var(--gf-page-bg);
    }

    .gfwss-showcase .gf-title-sticky {
      position: sticky;
      top: 0;
      height: 100svh;
      display: grid;
      place-items: center;
      overflow: visible;
      perspective: 1200px;
      transform-style: preserve-3d;
    }

    .gfwss-showcase .gf-title-card {
      width: min(1320px, 92vw);
      transform-origin: 50% 52%;
      transform-style: preserve-3d;
      will-change: transform, opacity;
      backface-visibility: visible;
      overflow: visible;
    }

    .gfwss-showcase .gf-title-svg {
      display: block;
      width: 100%;
      height: auto;
      overflow: visible;
      shape-rendering: geometricPrecision;
    }

    .gfwss-showcase .gf-title-svg text {
      font-family: "Plus Jakarta Sans", Inter, Arial, sans-serif;
      font-size: var(--gfwss-title-size);
      font-weight: 900;
      fill: var(--gfwss-title-color);
    }

    .gfwss-showcase .gf-title-mobile-text {
      display: none;
      font-family: "Plus Jakarta Sans", Inter, Arial, sans-serif;
      font-weight: 900;
      line-height: 0.9;
      text-align: center;
      color: var(--gfwss-title-color);
      letter-spacing: 0;
      overflow-wrap: normal;
      word-break: keep-all;
      hyphens: none;
    }

    .gfwss-showcase .gf-title-mobile-text span {
      display: block;
    }

    .gfwss-showcase .gf-work-intro {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(240px, 420px) auto;
      align-items: end;
      gap: clamp(26px, 6vw, 90px);
      width: min(1440px, 94vw);
      margin: 0 auto;
      padding: clamp(30px, 6vw, 86px) 0 clamp(18px, 5vw, 56px);
      border-top: 1px solid var(--gf-line);
    }

    .gfwss-showcase .gf-work-intro h2 {
      margin: 0;
      max-width: 620px;
      font-size: clamp(58px, 8.4vw, 154px);
      line-height: 0.86;
      font-weight: 900;
      text-wrap: balance;
    }

    .gfwss-showcase .gf-work-intro p {
      margin: 0 0 10px;
      color: var(--gf-muted);
      font-size: clamp(14px, 1.1vw, 17px);
      font-weight: 700;
      line-height: 1.45;
    }

    .gfwss-showcase .gf-work-count {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 8px;
      color: var(--gf-ink);
      font-size: clamp(68px, 8vw, 150px);
      line-height: 0.8;
      font-weight: 900;
      white-space: nowrap;
    }

    .gfwss-showcase.is-cursor-active,
    .gfwss-showcase.is-cursor-active * {
      cursor: none;
    }

    .gfwss-showcase .gf-cursor-dot,
    .gfwss-showcase .gf-cursor-ring {
      position: fixed;
      top: 0;
      left: 0;
      pointer-events: none;
      border-radius: 50%;
      opacity: 0;
      mix-blend-mode: difference;
      transform: translate3d(-9999px, -9999px, 0);
      transition: opacity 120ms ease;
      will-change: transform, opacity;
    }

    .gfwss-showcase .gf-cursor-dot {
      z-index: 10000;
      width: 8px;
      height: 8px;
      background-color: #fff;
    }

    .gfwss-showcase .gf-cursor-ring {
      z-index: 9999;
      width: 40px;
      height: 40px;
      border: 1px solid #fff;
    }

    .gfwss-showcase.is-cursor-active .gf-cursor-dot,
    .gfwss-showcase.is-cursor-active .gf-cursor-ring {
      opacity: 1;
    }

    .gfwss-showcase.is-card-hover-active .gf-cursor-dot,
    .gfwss-showcase.is-card-hover-active .gf-cursor-ring {
      opacity: 0;
    }

    .gfwss-showcase.is-card-hover-active .gf-work-item,
    .gfwss-showcase.is-card-hover-active .gf-work-item * {
      cursor: pointer !important;
    }


    .gfwss-showcase .gf-work-list {
      position: relative;
      display: flex;
      flex-flow: column;
      align-items: center;
      justify-content: flex-start;
      gap: 8rem;
      width: 100%;
      min-height: 168rem;
      margin-top: 0;
      padding: 0 0 6rem;
      overflow: clip;
      background: var(--gf-page-bg);
    }

    .gfwss-showcase .gf-progressive-blur {
      --blur: 1rem;
      --ratio: 2;
      position: fixed;
      left: 0;
      right: 0;
      z-index: 99;
      height: 6rem;
      pointer-events: none;
      overflow: clip;
      opacity: 0;
      transition: opacity 260ms ease;
      contain: strict;
    }

    .gfwss-showcase.is-work-blur-active .gf-progressive-blur {
      opacity: 1;
    }

    .gfwss-showcase .gf-progressive-blur--bottom {
      bottom: 0;
      transform: rotate(180deg);
    }

    .gfwss-showcase .gf-progressive-blur__panel {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      padding: 0;
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 10%, #000 20% 40%, #0000 50%);
      mask: linear-gradient(#0000 10%, #000 20% 40%, #0000 50%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-1 {
      -webkit-backdrop-filter: blur(var(--blur));
      backdrop-filter: blur(var(--blur));
      -webkit-mask: linear-gradient(#000 0% 10%, #0000 30%);
      mask: linear-gradient(#000 0% 10%, #0000 30%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-2 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / var(--ratio)));
      backdrop-filter: blur(calc(var(--blur) / var(--ratio)));
      -webkit-mask: linear-gradient(#0000 0%, #000 10% 20%, #0000 40%);
      mask: linear-gradient(#0000 0%, #000 10% 20%, #0000 40%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-3 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 0%, #000 20% 30%, #0000 50%);
      mask: linear-gradient(#0000 0%, #000 20% 30%, #0000 50%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-4 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 10%, #000 30% 40%, #0000 60%);
      mask: linear-gradient(#0000 10%, #000 30% 40%, #0000 60%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-5 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 20%, #000 40% 50%, #0000 70%);
      mask: linear-gradient(#0000 20%, #000 40% 50%, #0000 70%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-6 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 30%, #000 50% 60%, #0000 80%);
      mask: linear-gradient(#0000 30%, #000 50% 60%, #0000 80%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-7 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 40%, #000 60% 70%, #0000 90%);
      mask: linear-gradient(#0000 40%, #000 60% 70%, #0000 90%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-8 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 50%, #000 70% 80%, #0000 100%);
      mask: linear-gradient(#0000 50%, #000 70% 80%, #0000 100%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-9 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 60%, #000 80% 90%, #0000 100%);
      mask: linear-gradient(#0000 60%, #000 80% 90%, #0000 100%);
    }

    .gfwss-showcase .gf-progressive-blur__panel.is-10 {
      -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
      -webkit-mask: linear-gradient(#0000 70%, #000 90%, #0000 100%);
      mask: linear-gradient(#0000 70%, #000 90%, #0000 100%);
    }

    .gfwss-showcase .gf-work-item {
      display: flex;
      flex-flow: column;
      justify-content: flex-start;
      align-items: center;
      width: 100%;
      padding: 0 1rem;
      perspective: 1440px;
      transform-style: preserve-3d;
    }

    .gfwss-showcase .gf-work-card {
      position: relative;
      width: min(88.8889vh, calc(100vw - 2rem), 88rem);
      max-width: min(100%, 88rem);
      height: 50vh;
      aspect-ratio: 16 / 9;
      isolation: isolate;
      transform-style: preserve-3d;
      will-change: transform;
      transform-origin: 50% 50%;
      backface-visibility: visible;
      border-radius: 3rem;
      overflow: clip;
      pointer-events: auto;
    }

    .gfwss-showcase .gf-work-card::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        radial-gradient(circle at 50% 20%, rgba(255, 255, 255, 0.14), transparent 36%),
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.48));
      opacity: 0;
      pointer-events: none;
      transition: opacity 420ms cubic-bezier(0.2, 0.8, 0.2, 1);
    }

    .gfwss-showcase .gf-work-card__shadow {
      position: absolute;
      left: 4%;
      right: 4%;
      bottom: -26px;
      height: 58px;
      border-radius: 999px;
      background: rgba(5, 5, 5, 0.22);
      filter: blur(26px);
      opacity: 0.54;
      transform: translateZ(-80px);
      pointer-events: none;
      display: none;
    }

    .gfwss-showcase .gf-work-card__clip {
      display: contents;
    }

    .gfwss-showcase .gf-work-card__clip::after {
      content: none;
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.02) 30%, rgba(0, 0, 0, 0.58) 100%),
        radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.28), transparent 28%);
      mix-blend-mode: soft-light;
      pointer-events: none;
    }

    .gfwss-showcase .gf-work-card img:not(.gf-card-hover-logo) {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      transform: scale(1);
      filter: none;
      backface-visibility: visible;
      user-select: none;
      pointer-events: none;
      transition: transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
      will-change: transform;
    }

    .gfwss-showcase .gf-work-item.is-card-hovered .gf-work-card::before {
      opacity: 0;
    }

    .gfwss-showcase .gf-work-item.is-card-hovered .gf-work-card img:not(.gf-card-hover-logo) {
      filter: none;
      transform: scale(1);
    }

    /* ESTADO BASE DEL LOGO INTACTO */
    .gfwss-showcase .gf-work-card .gf-card-hover-logo {
      position: absolute;
      left: 50%;
      top: 50%; 
      z-index: 3;
      display: block;
      width: min(420px, 48%);
      height: auto;
      max-height: 118px;
      object-fit: contain;
      pointer-events: none;
      user-select: none;
      will-change: transform, opacity, filter;
      
      opacity: 0;
      transform: translate3d(-50%, -35%, 0) scale(0.85);
      filter: blur(12px);
      
      transition:
        opacity 500ms cubic-bezier(0.16, 1, 0.3, 1),
        transform 600ms cubic-bezier(0.16, 1, 0.3, 1),
        filter 500ms cubic-bezier(0.16, 1, 0.3, 1);
    }

    /* ESTADO HOVER DEL LOGO INTACTO */
    .gfwss-showcase .gf-work-item.is-card-hovered .gf-work-card .gf-card-hover-logo {
      opacity: 1;
      transform: translate3d(-50%, -50%, 0) scale(1);
      filter: blur(0px);
      
      transition:
        opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
        transform 800ms cubic-bezier(0.16, 1, 0.3, 1),
        filter 800ms cubic-bezier(0.16, 1, 0.3, 1);
    }

    .gfwss-showcase .gf-work-card__meta {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .gfwss-showcase .gf-work-card h3 {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .gfwss-showcase .gf-card-contact-orb {
      position: fixed;
      top: 0;
      left: 0;
      z-index: 9998;
      display: grid;
      place-items: center;
      width: clamp(108px, 8.8vw, 142px);
      height: clamp(108px, 8.8vw, 142px);
      padding: 0 14px;
      border: 1px solid #fff;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.2);
      color: #252627;
      text-align: center;
      font-size: clamp(13px, 1vw, 17px);
      line-height: 1.2;
      font-weight: 500;
      letter-spacing: .01em;
      text-transform: uppercase;
      opacity: 0;
      overflow: hidden;
      pointer-events: none;
      transform: translate3d(-9999px, -9999px, 0) scale(0); /* Estado inicial escondido */
      -webkit-backdrop-filter: blur(5px);
      backdrop-filter: blur(5px);
      will-change: transform, opacity;
    }

    .gfwss-showcase .gf-card-contact-orb::before {
      content: none;
    }

    .gfwss-showcase .gf-card-contact-orb::after {
      content: none;
    }

    .gfwss-showcase .gf-card-contact-orb__label {
      position: relative;
      z-index: 1;
      white-space: nowrap;
    }

    .gfwss-showcase .gf-cta {
      position: relative;
      display: grid;
      place-items: center;
      min-height: var(--gfwss-cta-min-height, 78svh);
      padding: clamp(120px, 13vw, 220px) 20px;
      background: var(--gfwss-cta-bg);
      text-align: center;
    }

    .gfwss-showcase .gf-cta__inner {
      width: min(1000px, 94vw);
      margin: 0 auto;
    }

    .gfwss-showcase .gf-cta h2 {
      margin: 0 0 18px;
      color: var(--gfwss-cta-title-color);
      font-size: clamp(30px, 4.2vw, 58px);
      line-height: 1.02;
      font-weight: 800;
      text-wrap: balance;
    }

    .gfwss-showcase .gf-cta p {
      margin: 0 0 32px;
      color: var(--gfwss-cta-text-color);
      font-size: clamp(15px, 1.2vw, 19px);
      font-weight: 800;
      line-height: 1.35;
    }

    .gfwss-showcase .gf-cta__actions {
      display: grid;
      justify-items: center;
      gap: clamp(16px, 2vh, 24px);
    }

    .gfwss-showcase .gf-cta__mail {
      color: var(--gfwss-cta-mail-color);
      font-size: clamp(15px, 1.35vw, 20px);
      font-weight: 800;
      letter-spacing: 0;
      line-height: 1.25;
      text-decoration: none;
      transition: color 180ms ease;
    }

    .gfwss-showcase .gf-cta__mail:hover {
      color: rgba(255, 255, 255, 0.78);
    }

    .gfwss-showcase .gf-wa-btn {
      position: relative;
      display: inline-flex;
      align-items: center;
      gap: .625rem;
      height: clamp(48px, 6vh, 68px);
      padding: .25em .25em .25em 1.75em;
      border-radius: 3rem;
      background: var(--gfwss-button-bg);
      text-decoration: none;
      cursor: pointer;
      box-shadow: none;
      overflow: visible;
    }

    .gfwss-showcase .gf-wa-btn__text {
      color: var(--gfwss-button-text);
      font-size: clamp(14px, 1.35vw, 18px);
      line-height: 1;
      font-weight: 800;
      letter-spacing: -.01em;
      white-space: nowrap;
    }

    .gfwss-showcase .gf-wa-btn__circle {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: clamp(38px, 4.8vh, 56px);
      height: clamp(38px, 4.8vh, 56px);
      border-radius: 50%;
      background: var(--gfwss-button-accent);
      color: #fff;
      flex-shrink: 0;
      overflow: hidden;
      transition: transform 0.42s cubic-bezier(0.23, 1, 0.32, 1);
      will-change: transform;
    }

    .gfwss-showcase .gf-wa-btn__icon {
      position: absolute;
      width: 58%;
      height: 58%;
      object-fit: contain;
      transition: opacity 0.2s ease, transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    }

    .gfwss-showcase .gf-wa-btn__arrow {
      position: absolute;
      width: 46%;
      height: 46%;
      opacity: 0;
      color: #fff;
      transform: scale(0.65);
      transition: opacity 0.2s ease 0.08s, transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
    }

    .gfwss-showcase .gf-wa-btn:hover .gf-wa-btn__circle {
      transform: translate3d(2.5em, 0, 0) scale3d(1.25, 1.25, 1);
    }

    .gfwss-showcase .gf-wa-btn:hover .gf-wa-btn__icon {
      opacity: 0;
      transform: translate(20%, -20%) scale(0.6);
    }

    .gfwss-showcase .gf-wa-btn:hover .gf-wa-btn__arrow {
      opacity: 1;
      transform: scale(1);
    }

    .gfwss-showcase .gf-wa-btn:focus-visible,
    .gfwss-showcase .gf-cta__mail:focus-visible {
      outline: 3px solid rgba(255, 59, 20, 0.28);
      outline-offset: 4px;
    }

    .gfwss-showcase.is-reduced .gf-title-scene {
      height: auto;
    }

    .gfwss-showcase.is-reduced .gf-title-sticky {
      position: relative;
      height: auto;
      min-height: 70svh;
    }

    .gfwss-showcase.is-reduced .gf-work-item {
      min-height: auto;
    }

    .gfwss-showcase.is-reduced .gf-work-card {
      transform: none !important;
      opacity: 1 !important;
      filter: none !important;
    }

    .gfwss-showcase.is-reduced .gf-work-card__shadow {
      opacity: 0.28 !important;
      transform: translateZ(-80px) !important;
    }

    @media (max-width: 980px) {
      .gfwss-showcase .gf-work-intro {
        grid-template-columns: 1fr;
        align-items: start;
      }

      .gfwss-showcase .gf-work-count {
        justify-content: start;
      }
    }

    @media (max-width: 991px) {
      .gfwss-showcase .gf-work-list {
        gap: 5rem;
      }

      .gfwss-showcase .gf-work-item {
        padding: 0 1rem;
        perspective: 1440px;
      }

      .gfwss-showcase .gf-work-card {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        border-radius: 1.5rem;
      }
    }

    @media (max-width: 767px) {

      .gfwss-showcase .gf-title-scene {
        height: 430svh;
      }

      .gfwss-showcase .gf-title-sticky {
        overflow: clip;
      }

      .gfwss-showcase .gf-title-card {
        width: min(430px, calc(100vw - 48px));
        transform-origin: 50% 50%;
      }

      .gfwss-showcase .gf-title-svg {
        display: none;
      }

      .gfwss-showcase .gf-title-mobile-text {
        display: block;
        width: max-content;
        max-width: 100%;
        margin: 0 auto;
        font-size: clamp(68px, 18vw, 76px);
        line-height: 0.94;
        overflow-wrap: normal;
        word-break: keep-all;
        hyphens: none;
      }

      .gfwss-showcase .gf-title-mobile-text span {
        white-space: nowrap;
        overflow-wrap: normal;
        word-break: keep-all;
        hyphens: none;
      }

      .gfwss-showcase .gf-work-intro {
        padding-top: 64px;
        width: min(430px, 90vw);
      }

      .gfwss-showcase .gf-work-intro h2 {
        font-size: clamp(56px, 18vw, 86px);
      }

      .gfwss-showcase .gf-work-count {
        font-size: clamp(70px, 22vw, 112px);
      }

      .gfwss-showcase .gf-work-item {
        width: 100%;
        min-height: 0;
        height: auto;
        padding: 0 1rem;
        perspective: 1440px;
        transform-style: preserve-3d;
      }

      .gfwss-showcase .gf-work-card {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
        border-radius: 1.25rem;
        pointer-events: auto;
        transform-style: preserve-3d;
        backface-visibility: visible;
      }

      .gfwss-showcase .gf-work-card__shadow {
        bottom: -18px;
        height: 44px;
        filter: blur(24px);
      }

      .gfwss-showcase .gf-card-contact-orb {
        display: none;
      }

      .gfwss-showcase .gf-work-card .gf-card-hover-logo {
        width: min(255px, 58%);
      }

      .gfwss-showcase .gf-work-list {
        gap: 5rem;
        min-height: 126rem;
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 6rem;
      }

      .gfwss-showcase .gf-progressive-blur {
        height: 5.5rem;
      }

      .gfwss-showcase .gf-cta {
        min-height: auto;
      }
    }
  

.gfwss-showcase[data-logo-effect="zoom-pop"] .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="zoom-pop"] .gf-work-card .gf-card-hover-logo {
  transform: translate3d(-50%, -50%, 0) scale(0.55);
}
.gfwss-showcase[data-logo-effect="zoom-pop"] .gf-work-item.is-card-hovered .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="zoom-pop"].is-card-hovered .gf-work-card .gf-card-hover-logo {
  transform: translate3d(-50%, -50%, 0) scale(1);
}
.gfwss-showcase[data-logo-effect="slide-left"] .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="slide-left"] .gf-work-card .gf-card-hover-logo {
  transform: translate3d(-68%, -50%, 0) scale(0.9);
}
.gfwss-showcase[data-logo-effect="slide-left"] .gf-work-item.is-card-hovered .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="slide-left"].is-card-hovered .gf-work-card .gf-card-hover-logo {
  transform: translate3d(-50%, -50%, 0) scale(1);
}
.gfwss-showcase[data-logo-effect="flip-soft"] .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="flip-soft"] .gf-work-card .gf-card-hover-logo {
  transform: translate3d(-50%, -50%, 0) rotateX(42deg) scale(0.9);
}
.gfwss-showcase[data-logo-effect="flip-soft"] .gf-work-item.is-card-hovered .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="flip-soft"].is-card-hovered .gf-work-card .gf-card-hover-logo {
  transform: translate3d(-50%, -50%, 0) rotateX(0deg) scale(1);
}
.gfwss-showcase[data-logo-effect="glow-rise"] .gf-work-item.is-card-hovered .gf-work-card .gf-card-hover-logo,
.gfwss-showcase .gf-work-item[data-logo-effect="glow-rise"].is-card-hovered .gf-work-card .gf-card-hover-logo {
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.24));
}
.gfwss-showcase .gf-card-contact-orb {
  color: var(--gfwss-orb-color);
}
.gfwss-showcase .gf-card-contact-orb__label {
  color: inherit;
}
.gfwss-showcase .gf-cta[data-button-shape="rectangle"] .gf-wa-btn {
  border-radius: 12px;
  padding-right: .35em;
}
.gfwss-showcase .gf-cta[data-button-shape="rectangle"] .gf-wa-btn__circle {
  border-radius: 10px;
}
.gfwss-showcase .gf-cta[data-hover-effect="lift"] .gf-wa-btn:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(0,0,0,.22);
}
.gfwss-showcase .gf-cta[data-hover-effect="invert"] .gf-wa-btn:hover {
  background: var(--gfwss-button-accent);
}
.gfwss-showcase .gf-cta[data-hover-effect="invert"] .gf-wa-btn:hover .gf-wa-btn__text {
  color: #fff;
}
.gfwss-showcase .gf-cta[data-hover-effect="soft-glow"] .gf-wa-btn:hover {
  box-shadow: 0 0 0 8px rgba(37,211,102,.12), 0 18px 48px rgba(37,211,102,.22);
}
.gfwss-showcase .gf-cta__inner {
  will-change: transform, opacity, filter;
}

/* v1.1.1: keep original widget UI, use Alture/Webflow geometry only for the cards. */
.w-webflow-badge,
a.w-webflow-badge,
img[alt="Made in Webflow"] {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.gfwss-showcase[data-card-engine="webflow"] .gf-work-list {
  display: block;
  width: 100%;
  min-height: auto;
  margin-top: 0;
  padding: 0 0 6rem;
  overflow: visible;
  background: var(--gf-page-bg);
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_component {
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_wrapper-v1,
.gfwss-showcase[data-card-engine="webflow"] .work-list_wrapper {
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 100%;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_list {
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  gap: 8rem;
  grid-column-gap: 8rem;
  grid-row-gap: 8rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_item,
.gfwss-showcase[data-card-engine="webflow"] .gf-work-item.work-list_item {
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding: 0 1rem;
  perspective: none;
  transform-style: flat;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_block.gf-work-card {
  perspective: 100vw;
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: auto;
  border-radius: 0;
  overflow: visible;
  isolation: auto;
  pointer-events: auto;
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
  backface-visibility: visible;
  will-change: transform;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_link.gf-work-card__clip {
  display: block;
  position: relative;
  width: min(88.8889vh, calc(100vw - 2rem), 88rem);
  max-width: min(100%, 88rem);
  height: 50vh;
  aspect-ratio: 16 / 9;
  border-radius: 3rem;
  overflow: clip;
  text-decoration: none;
  color: inherit;
  background: #ddd;
  transform-style: preserve-3d;
  backface-visibility: visible;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  filter: none;
  backface-visibility: visible;
  user-select: none;
  pointer-events: none;
  transition: transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: transform;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_name {
  position: absolute;
  left: 1.5rem;
  bottom: 1.5rem;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: .5rem;
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  padding: .35rem .75rem;
  border-radius: 9rem;
  background-color: #fff;
  color: #000;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  pointer-events: none;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_dot {
  width: .25rem;
  height: .25rem;
  flex: 0 0 .25rem;
  border-radius: 50%;
  background-color: #f3350c;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_title {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  overflow: visible;
  clip: auto;
  white-space: nowrap;
  font-size: .875rem;
  line-height: 1;
  font-weight: 700;
  color: #000;
}

.gfwss-showcase[data-card-engine="webflow"] .gf-work-card::before,
.gfwss-showcase[data-card-engine="webflow"] .gf-work-card__shadow {
  display: none !important;
  content: none !important;
}

.gfwss-showcase[data-card-engine="webflow"] .gf-card-hover-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 3;
  display: block;
  width: min(420px, 48%);
  height: auto;
  max-height: 118px;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  will-change: transform, opacity, filter;
  opacity: 0;
  transform: translate3d(-50%, -35%, 0) scale(0.85);
  filter: blur(12px);
  transition:
    opacity 500ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 600ms cubic-bezier(0.16, 1, 0.3, 1),
    filter 500ms cubic-bezier(0.16, 1, 0.3, 1);
}

.gfwss-showcase[data-card-engine="webflow"] .gf-work-item.is-card-hovered .gf-card-hover-logo {
  opacity: 1;
  transform: translate3d(-50%, -50%, 0) scale(1);
  filter: blur(0px);
  transition:
    opacity 800ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 800ms cubic-bezier(0.16, 1, 0.3, 1),
    filter 800ms cubic-bezier(0.16, 1, 0.3, 1);
}

.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_wrap.gfwss-alture-blur {
  z-index: 99;
  pointer-events: none;
  width: 100%;
  height: 6rem;
  position: fixed;
  inset: auto 0% 0%;
  overflow: clip;
  transform: rotate(180deg);
}

.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 0;
  -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  -webkit-mask: linear-gradient(#0000 10%, #000 20% 40%, #0000 50%);
  mask: linear-gradient(#0000 10%, #000 20% 40%, #0000 50%);
}

.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-1 {
  -webkit-backdrop-filter: blur(var(--blur));
  backdrop-filter: blur(var(--blur));
  -webkit-mask: linear-gradient(#000 0% 10%, #0000 30%);
  mask: linear-gradient(#000 0% 10%, #0000 30%);
}
.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-2 {
  -webkit-backdrop-filter: blur(calc(var(--blur) / var(--ratio)));
  backdrop-filter: blur(calc(var(--blur) / var(--ratio)));
  -webkit-mask: linear-gradient(#0000 0%, #000 10% 20%, #0000 40%);
  mask: linear-gradient(#0000 0%, #000 10% 20%, #0000 40%);
}
.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-3 {
  -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio))));
  backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio))));
  -webkit-mask: linear-gradient(#0000 0%, #000 20% 30%, #0000 50%);
  mask: linear-gradient(#0000 0%, #000 20% 30%, #0000 50%);
}
.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-4 {
  -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio))));
  backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio))));
  -webkit-mask: linear-gradient(#0000 10%, #000 30% 40%, #0000 60%);
  mask: linear-gradient(#0000 10%, #000 30% 40%, #0000 60%);
}
.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-5 {
  -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  -webkit-mask: linear-gradient(#0000 20%, #000 40% 50%, #0000 70%);
  mask: linear-gradient(#0000 20%, #000 40% 50%, #0000 70%);
}
.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-6 {
  -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  -webkit-mask: linear-gradient(#0000 30%, #000 50% 60%, #0000 80%);
  mask: linear-gradient(#0000 30%, #000 50% 60%, #0000 80%);
}
.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_panel.is-7 {
  -webkit-backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  backdrop-filter: blur(calc(var(--blur) / (var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio) * var(--ratio))));
  -webkit-mask: linear-gradient(#0000 40%, #000 60% 70%, #0000 90%);
  mask: linear-gradient(#0000 40%, #000 60% 70%, #0000 90%);
}

@media (max-width: 991px) {
  .gfwss-showcase[data-card-engine="webflow"] .work-list_list {
    gap: 5rem;
    grid-column-gap: 5rem;
    grid-row-gap: 5rem;
  }
  .gfwss-showcase[data-card-engine="webflow"] .work-list_link.gf-work-card__clip {
    width: calc(100vw - 2rem);
    height: auto;
    border-radius: 1.5rem;
  }
}

@media (max-width: 767px) {
  .gfwss-showcase[data-card-engine="webflow"] .work-list_list {
    gap: 1.5rem;
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
  }
  .gfwss-showcase[data-card-engine="webflow"] .work-list_link.gf-work-card__clip {
    border-radius: 1.25rem;
  }
  .gfwss-showcase[data-card-engine="webflow"] .work-list_name {
    left: 1rem;
    bottom: 1rem;
  }
  .gfwss-showcase[data-card-engine="webflow"] .gfwss-alture-blur {
    height: 5.5rem;
  }
}

/* v1.1.2: CTA polish + original hover orb behavior restored without touching card scroll geometry. */
.gfwss-showcase .gf-cta p {
  font-weight: 500;
}

.gfwss-showcase .gf-cta h2,
.gfwss-showcase .gf-cta p,
.gfwss-showcase .gf-cta__actions {
  will-change: transform, opacity, filter, clip-path;
}

.gfwss-showcase .gf-wa-btn:hover,
.gfwss-showcase .gf-wa-btn:focus-visible {
  cursor: pointer !important;
}

.gfwss-showcase.is-cta-button-hover .gf-cursor-dot,
.gfwss-showcase.is-cta-button-hover .gf-cursor-ring {
  opacity: 0 !important;
}


/* v1.1.3: CTA height + premium animation presets. Cards and Alture scroll behavior untouched. */
.gfwss-showcase .gf-cta {
  min-height: var(--gfwss-cta-min-height, 78svh) !important;
  padding-top: clamp(120px, 13vw, 220px) !important;
  padding-bottom: clamp(120px, 13vw, 220px) !important;
  overflow: hidden;
  perspective: 1200px;
}

.gfwss-showcase .gf-cta p {
  font-weight: 100 !important;
}

@media (max-width: 767px) {
  .gfwss-showcase {
    --gfwss-cta-min-height: 72svh;
  }

  .gfwss-showcase .gf-cta {
    padding-top: clamp(92px, 18vw, 150px) !important;
    padding-bottom: clamp(92px, 18vw, 150px) !important;
  }
}


/* v1.2.1 - Micro-stutter performance pass. No visual changes intended. */
.gfwss-showcase[data-card-engine="webflow"] .work-list_block.gf-work-card,
.gfwss-showcase[data-card-engine="webflow"] .work-list_link.gf-work-card__clip,
.gfwss-showcase[data-card-engine="webflow"] .work-list_img {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
  will-change: transform;
}

.gfwss-showcase[data-card-engine="webflow"] .work-list_component,
.gfwss-showcase[data-card-engine="webflow"] .work-list_wrapper-v1,
.gfwss-showcase[data-card-engine="webflow"] .work-list_list {
  transform: translate3d(0, 0, 0);
}

.gfwss-showcase[data-card-engine="webflow"] .progressive-blur_wrap.gfwss-alture-blur {
  /* Preserve the original Alture bottom-edge blur orientation while keeping GPU compositing. */
  transform: rotate(180deg) translate3d(0, 0, 0);
  -webkit-transform: rotate(180deg) translate3d(0, 0, 0);
  inset: auto 0 0 0;
  contain: none;
  will-change: transform;
}

/* ═══════════════════════════════════════════════════════════
   MOBILE OVERRIDES — v5.1 (plugin v1.2.2)
   Solo max-width: 767px. Desktop sin ningún cambio.

   NOTA: scroll-snap-type en html fue removido — afectaba
   toda la página ocultando el contenido fuera del widget.
   El min-height de 58svh por tarjeta controla la cadencia
   sin romper el layout general de la página.
═══════════════════════════════════════════════════════════ */

@media (max-width: 767px) {

  /* 1 — Título: 260svh (era 430svh = 4+ scrolls) */
  .gfwss-showcase .gf-title-scene {
    height: 260svh;
  }

  /* 2 — Zona de scroll por tarjeta.
     min-height !important: el CSS base tiene min-height:0 en mobile
     y min-height:auto en el engine webflow. El !important garantiza
     que 58svh gane en cualquier entorno con caché parcial. */
  .gfwss-showcase[data-card-engine="webflow"] .gf-work-item.work-list_item {
    min-height: 58svh !important;
    justify-content: center;
  }

  /* 3 — Gap entre zonas.
     !important: el CSS base tiene gap:8rem sin media query y
     gap:1.5rem en el bloque mobile webflow. */
  .gfwss-showcase[data-card-engine="webflow"] .work-list_list {
    gap: 1rem !important;
    grid-column-gap: 1rem !important;
    grid-row-gap: 1rem !important;
  }

}

/* 4 — Fade de salida por tarjeta (Chrome 115+ / Android 13+) */
@media (max-width: 767px) {
  @supports (animation-timeline: view()) {

    @keyframes gf-card-exit-fade {
      from { opacity: 1; }
      to   { opacity: 0; }
    }

    .gfwss-showcase[data-card-engine="webflow"] .gf-work-item.work-list_item {
      animation: gf-card-exit-fade linear both;
      animation-timeline: view();
      animation-range: contain 50% exit 75%;
    }

  }
}