/* Pampili Slider CSS */
.rev-wrap, .rev-wrap *, .rev-wrap *::before, .rev-wrap *::after { box-sizing: border-box; }
    .rev-wrap * { margin: 0; padding: 0; }

    .rev-wrap {
      position: relative;
      width: 100%;
      height: 740px;
      overflow: hidden;
      background: #2a0a18;
    }

    .rev-slide {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      opacity: 0;
      transition: opacity 0.8s ease;
      pointer-events: none;
    }
    .rev-slide.active {
      opacity: 1;
      pointer-events: auto;
    }

    .rev-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center;
      transition: transform 8s ease;
    }
    .rev-slide .rev-bg { transform: scale(1); }
    .rev-slide.active .rev-bg { transform: scale(1.07); }

    .rev-overlay { position: absolute; inset: 0; }

    .deco {
      position: absolute;
      pointer-events: none;
      z-index: 1;
      opacity: 0;
      transition: opacity 1s 0.2s;
    }
    .rev-slide.active .deco { opacity: 1; }

    .rev-layout {
      position: relative;
      z-index: 2;
      display: flex;
      align-items: center;
      width: 100%;
      padding: 0 8% 0 10%;
      gap: 0;
    }

    .rev-content { flex: 1; }

    .rev-tag {
      display: inline-block;
      background: #16c35b;
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      padding: 5px 14px;
      border-radius: 2px;
      margin-bottom: 16px;
      transform: translateY(30px);
      opacity: 0;
      transition: all 0.6s 0.3s ease;
    }
    .rev-slide.active .rev-tag { transform: translateY(0); opacity: 1; }

    .rev-title {
      font-family: 'Cormorant Garamond', 'Playfair Display', serif;
      font-size: 2.8rem;
      line-height: 1.2;
      color: #fff;
      margin: 0 0 16px;
      transform: translateY(40px);
      opacity: 0;
      transition: all 0.7s 0.45s ease;
    }
    .rev-slide.active .rev-title { transform: translateY(0); opacity: 1; }

    .rev-desc {
      font-size: 1rem;
      color: rgba(255,255,255,0.82);
      line-height: 1.7;
      margin: 0 0 32px;
      max-width: 420px;
      transform: translateY(30px);
      opacity: 0;
      transition: all 0.6s 0.6s ease;
    }
    .rev-slide.active .rev-desc { transform: translateY(0); opacity: 1; }

    .rev-btns {
      display: flex;
      gap: 14px;
      align-items: center;
      transform: translateY(20px);
      opacity: 0;
      transition: all 0.5s 0.75s ease;
    }
    .rev-slide.active .rev-btns { transform: translateY(0); opacity: 1; }

    .rev-btn {
      display: inline-block;
      background: #16c35b;
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 13px 28px;
      border-radius: 3px;
      cursor: pointer;
      border: none;
      text-decoration: none;
      font-family: 'Inter', 'Nunito', sans-serif;
      transition: background 0.2s, transform 0.15s;
    }
    .rev-btn:hover { background: #0ea64b; transform: translateY(-2px); }

    .rev-btn-outline {
      display: inline-block;
      background: transparent;
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 12px 28px;
      border-radius: 3px;
      cursor: pointer;
      border: 2px solid rgba(255,255,255,0.6);
      text-decoration: none;
      font-family: 'Inter', 'Nunito', sans-serif;
      transition: border-color 0.2s, background 0.2s, transform 0.15s;
    }
    .rev-btn-outline:hover {
      border-color: #fff;
      background: rgba(255,255,255,0.1);
      transform: translateY(-2px);
    }

    .rev-img-side {
      flex: 0 0 660px;
      align-self: stretch;
      position: relative;
    }

    .rev-shoe-img {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -45%) scale(0.9);
      width: 650px;
      max-height: 640px;
      object-fit: contain;
      opacity: 0;
      transition: transform 0.9s 0.35s cubic-bezier(.22,1,.36,1), opacity 0.8s 0.35s ease;
      filter: drop-shadow(0 20px 40px rgba(0,0,0,0.3));
    }
    .rev-slide.active .rev-shoe-img {
      transform: translate(-50%, -50%) scale(1);
      opacity: 1;
    }

    .rev-arrow {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 10;
      background: rgba(22,195,91,0.85);
      border: none;
      width: 46px;
      height: 46px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: background 0.2s;
      border-radius: 2px;
    }
    .rev-arrow:hover { background: #16c35b; }
    .rev-arrow svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 2.5; }
    .rev-arrow.prev { left: 16px; }
    .rev-arrow.next { right: 16px; }

    .rev-nav {
      position: absolute;
      bottom: 24px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 8px;
      z-index: 10;
    }
    .rev-dot {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: rgba(255,255,255,0.3);
      cursor: pointer;
      transition: all 0.3s;
      border: none;
      padding: 0;
    }
    .rev-dot.active { background: #16c35b; transform: scale(1.3); }

    .rev-progress {
      position: absolute;
      bottom: 0;
      left: 0;
      height: 3px;
      background: #16c35b;
      width: 0%;
      z-index: 10;
      transition: width linear;
    }

    .slide-num {
      position: absolute;
      bottom: 24px;
      right: 22px;
      font-size: 11px;
      color: rgba(255,255,255,0.4);
      z-index: 10;
      font-weight: 700;
      letter-spacing: 1px;
    }

    @media (max-width: 768px) {
      .rev-wrap { height: auto; min-height: 500px; }
      .rev-layout { flex-direction: column-reverse; padding: 40px 5% 90px; gap: 20px; }
      .rev-img-side { flex: 0 0 220px; width: 100%; }
      .rev-title { font-size: 2rem; }
      .rev-shoe-img { width: 420px; position: relative; bottom: auto; right: auto; }
      .rev-btns { flex-wrap: wrap; }
    }