:root {
      /* 
         Mude a fonte aqui para testar:
         'Inter', sans-serif           -> Original
         'Instrument Sans', sans-serif -> Elegante/Anthropic Style (Recomendada)
         'Space Grotesk', sans-serif   -> Tech/Startup IA
         'Plus Jakarta Sans', sans-serif -> Geométrica/Moderna
         'Manrope', sans-serif         -> Funcional/Dados
         'Outfit', sans-serif          -> Bold/Clean
      */
      --font-primary: 'Plus Jakarta Sans', sans-serif; 
  }
  
  body, html {
    font-family: var(--font-primary) !important;
  }
  
  /* Força a fonte em todos os elementos */
  h1, h2, h3, h4, h5, h6, p, span, a, button, input, textarea, select, .btn, .font-sans {
      font-family: var(--font-primary) !important;
  }

  /* Ajustes finos para cada fonte se necessário */
  body:has(style*="Space Grotesk") { letter-spacing: -0.02em; }
  body:has(style*="Plus Jakarta Sans") { letter-spacing: -0.01em; }

  #paywall-content-wrapper { 
    padding-top: var(--paywall-topbar-height, 0px);
    min-height: 100vh;
    height: 100%;
    width: 100%;
  }
  #paywall-header,
  #paywall-header-content {
    background-color: transparent !important;
    box-shadow: none !important;
    z-index: 1000 !important;
    position: relative;
  }

/* ---- Scroll Reveal ---- */
.hp-reveal{opacity:0;transform:translateY(30px);transition:opacity .85s cubic-bezier(.16,1,.3,1),transform .85s cubic-bezier(.16,1,.3,1)}
.hp-reveal.in-view{opacity:1;transform:none}
.hp-reveal[data-d="1"]{transition-delay:.12s}
.hp-reveal[data-d="2"]{transition-delay:.24s}
.hp-reveal[data-d="3"]{transition-delay:.36s}
.hp-reveal[data-d="4"]{transition-delay:.48s}
.hp-reveal[data-d="5"]{transition-delay:.6s}

/* ---- Card Hover Glow ---- */
.hp-card{
  position:relative;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:20px;
  padding:40px 32px;transition:all .4s cubic-bezier(.16,1,.3,1);overflow:hidden;
}
.hp-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#000,transparent);opacity:0;transition:opacity .4s ease;
}
.hp-card:hover{transform:translateY(-4px);box-shadow:0 24px 48px rgba(0,0,0,.08);border-color:rgba(0,0,0,.1)}
.hp-card:hover::before{opacity:1}

/* ---- Timeline Connector ---- */
.hp-timeline-line{
  position:absolute;top:20px;left:80px;right:80px;height:1px;
  background:repeating-linear-gradient(90deg,#000 0,#000 8px,transparent 8px,transparent 16px);
  opacity:.15;
}
@media(max-width:768px){.hp-timeline-line{display:none}}

/* ---- Step Connector ---- */
.hp-step-connector{
  position:absolute;top:48px;left:calc(33.33% - 8px);width:calc(33.33% + 16px);height:1px;
  background:repeating-linear-gradient(90deg,rgba(0,0,0,.15) 0,rgba(0,0,0,.15) 6px,transparent 6px,transparent 12px);
}
.hp-step-connector-2{left:calc(66.66% - 8px)}
@media(max-width:768px){.hp-step-connector{display:none}}

/* ---- Geometric Deco ---- */
.hp-geo{position:absolute;border-radius:50%;border:1px solid rgba(0,0,0,.04);pointer-events:none}
.hp-geo-dark{border-color:rgba(255,255,255,.04)}

/* ---- CTA Glow ---- */
.hp-cta-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 80% 50% at 50% -20%,rgba(255,255,255,.06),transparent),
    radial-gradient(ellipse 50% 40% at 80% 120%,rgba(255,255,255,.03),transparent);
  pointer-events:none;
}

.paywall-embed-container { max-width: 900px; margin: 0 auto; overflow: hidden; border-radius: 16px; box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1); }
            .paywall-embed-container iframe { width: 100% !important; height: 100% !important; border: 0 !important; border-radius: 16px !important; position: absolute !important; top: 0 !important; left: 0 !important; }

@keyframes shimmer {
        0% {
            background-position: -1000px 0;
        }
        100% {
            background-position: 1000px 0;
        }
    }
    
    .skeleton-shimmer {
        background: linear-gradient(90deg, rgba(0,0,0,0.05) 25%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.05) 75%);
        background-size: 1000px 100%;
        animation: shimmer 2s infinite;
    }
    
    #paywall-skeletons.hidden {
        opacity: 0;
        pointer-events: none;
        visibility: hidden;
    }
    
    /* Rounded CTA for Vidalytics player */
    #paywall-video .CallToAction__button,
    #paywall-video .vidalytics-cta-button {
        border-radius: 9999px !important;
        background-color: #000000 !important;
    }
    
    /* Currency selector size fix - match simple-pricing.blade.php */
    /* Override global styles from table to ensure header currency button matches simple-pricing */
    #paywall-header-content #currency-container-guest .select2-payment-currency-container,
    #currency-container-guest .select2-payment-currency-container {
        min-width: 95px !important;
        height: 32px !important;
        max-height: 40px !important;
        padding: 0 !important;
    }

    #paywall-header-content #currency-container-guest .select2-selection,
    #currency-container-guest .select2-selection {
        border: 1px solid rgba(0, 0, 0, 0.1) !important;
        border-radius: 0.5rem !important;
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
    }

    #paywall-header-content #currency-container-guest .select2-selection__rendered,
    #currency-container-guest .select2-selection__rendered {
        display: flex !important;
        align-items: center !important;
        line-height: 16px !important;
        padding-right: 12px !important;
        padding-left: 12px !important;
        gap: 6px !important;
        height: 100% !important;
    }

    #paywall-header-content #currency-container-guest .select2-selection__arrow,
    #currency-container-guest .select2-selection__arrow {
        height: 38px !important;
        right: 8px !important;
        top: 1px !important;
    }

    #paywall-header-content #currency-container-guest .select2-selection__arrow b,
    #currency-container-guest .select2-selection__arrow b {
        border-color: #374151 transparent transparent transparent !important;
        border-width: 5px 4px 0 4px !important;
    }

    #paywall-header-content #currency-container-guest .select2-payment-currency-dropdown,
    #currency-container-guest .select2-payment-currency-dropdown {
        border: 1px solid rgba(0, 0, 0, 0.2) !important;
        border-radius: 0.5rem !important;
        margin-top: 4px !important;
        z-index: 10000 !important;
    }
    
    #paywall-header-content #currency-container-guest .select2-container,
    #currency-container-guest .select2-container {
        z-index: 10000 !important;
    }

    @media (max-width: 516px) {
        #paywall-header-content #currency-container-guest .select2-payment-currency-container,
        #currency-container-guest .select2-payment-currency-container {
            min-width: 85px !important;
            height: 32px !important;
            max-height: 40px !important;
        }

        #paywall-header-content #currency-container-guest .select2-selection,
        #currency-container-guest .select2-selection {
            height: 36px !important;
            min-height: 36px !important;
            max-height: 36px !important;
        }

        #paywall-header-content #currency-container-guest .select2-selection__arrow,
        #currency-container-guest .select2-selection__arrow {
            height: 34px !important;
        }
    }

.scroll-to-plans-floating-btn {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    /* Glassmorphism mais sólido e premium */
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #000000;
    border: 1px solid rgba(255, 255, 255, 0.8);
    border-radius: 100px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    /* Sombra suave e difusa (High-end) */
    box-shadow: 
        0 4px 6px -1px rgba(0, 0, 0, 0.1), 
        0 2px 4px -1px rgba(0, 0, 0, 0.06),
        0 20px 25px -5px rgba(0, 0, 0, 0.1);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    overflow: hidden; /* Importante para o efeito de brilho */
    letter-spacing: -0.01em;
}

/* Efeito de brilho passando (Shimmer) */
.scroll-to-plans-floating-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.8),
        transparent
    );
    transform: skewX(-20deg);
    animation: buttonShimmer 6s infinite; /* Passa a cada 6 segundos */
}

.scroll-to-plans-floating-btn.visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    animation: fadeInUp 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.scroll-to-plans-floating-btn:hover {
    background: rgba(255, 255, 255, 0.9);
    transform: translateX(-50%) translateY(-2px);
    box-shadow: 
        0 20px 25px -5px rgba(0, 0, 0, 0.1), 
        0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.scroll-to-plans-floating-btn svg {
    width: 18px;
    height: 18px;
    /* Pequeno bounce contínuo na seta */
    animation: smallBounce 2s infinite ease-in-out;
}

@keyframes buttonShimmer {
    0% { left: -100%; }
    10% { left: 200%; } /* Passagem rápida */
    100% { left: 200%; } /* Pausa longa */
}

@keyframes smallBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(3px); }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

@media (max-width: 768px) {
    .scroll-to-plans-floating-btn {
        bottom: 24px;
        padding: 12px 24px;
        font-size: 14px;
        background: rgba(255, 255, 255, 0.85); /* Mais sólido no mobile */
    }
}