/* ═══════════════════════════════════════════════════════════════════════════
   REGULARIZACIÓN EXPRESS - TEXT COLOR FIXES
   Fix text visibility and contrast issues across all sections
   ═══════════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════════
   1. HERO SECTION - Ensure all text is visible on dark background
   ═══════════════════════════════════════════════════════════════════════════ */

/* Override animation opacity issues - make hero content always visible */
.reg-hero .reg-hero-content,
.reg-hero .reg-hero-badge,
.reg-hero .reg-hero-title,
.reg-hero .reg-hero-description,
.reg-hero .reg-cta-group,
.reg-hero .reg-hero-stats {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Hero title - white text on dark green background */
.reg-hero-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Hero title highlight - green color */
.reg-hero-title .highlight {
    color: #4ade80 !important;
    -webkit-text-fill-color: #4ade80 !important;
}

/* Hero description text */
.reg-hero-description {
    color: rgba(255, 255, 255, 0.85) !important;
}

.reg-hero-description strong {
    color: #ffffff !important;
}

/* Hero stats */
.reg-hero-stats .reg-stat-value {
    color: #ffffff !important;
}

.reg-hero-stats .reg-stat-label {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Hero badge text */
.reg-hero-badge {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Hero guarantee badge text */
.reg-guarantee-badge {
    color: #86efac !important;
}

.reg-guarantee-badge span {
    color: #86efac !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   2. BRANDS SECTION - Better text visibility on dark background (WCAG AA)
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-brands-label {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Fixed contrast ratio for accessibility - minimum 4.5:1 */
.reg-brand-item {
    color: #ffffff !important;
}

.reg-brand-item span {
    color: #ffffff !important;
}

.reg-brand-item i {
    color: rgba(255, 255, 255, 0.9) !important;
    opacity: 1 !important;
}

.reg-brand-item:hover {
    color: #ffffff !important;
}

.reg-brand-item:hover span,
.reg-brand-item:hover i {
    color: #ffffff !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   3. STATS SECTION - Fix opacity issues for numbers on white/light background
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-stats-card .stat-number {
    color: #1a1a1a !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.reg-stats-card .stat-unit {
    color: #6b7280 !important;
}

.reg-stats-card .stat-desc {
    color: #4a4a4a !important;
}

.reg-stats-card .stat-desc strong {
    color: #1a1a1a !important;
}

/* Section title in stats area */
.reg-stats-section .reg-section-title {
    color: #1a1a1a !important;
}

.reg-stats-section .reg-section-title .highlight {
    color: #22c55e !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   4. PROBLEM SECTION (ALT BACKGROUND) - Contrast on light gray
   ═══════════════════════════════════════════════════════════════════════════ */

/* Section header on light background */
.reg-section-alt .reg-section-title {
    color: #1a1a1a !important;
}

.reg-section-alt .reg-section-title .highlight {
    color: #22c55e !important;
}

.reg-section-alt .reg-section-subtitle {
    color: #4a4a4a !important;
}

.reg-section-alt .reg-section-subtitle strong {
    color: #1a1a1a !important;
}

/* Problem cards - front side on white */
.reg-problem-card .problem-card-front h3 {
    color: #1a1a1a !important;
}

.reg-problem-card .problem-card-front p {
    color: #4a4a4a !important;
}

.reg-problem-card .flip-hint {
    color: #6b7280 !important;
}

/* Problem cards - back side (red gradient background) */
.reg-problem-card .problem-card-back h4 {
    color: #dc2626 !important;
}

.reg-problem-card .problem-card-back p {
    color: #7f1d1d !important;
}

/* Reframe box on dark background */
.reg-reframe-box .main-text {
    color: #ffffff !important;
}

.reg-reframe-box .main-text .highlight {
    color: #4ade80 !important;
}

.reg-reframe-box .sub-text {
    color: rgba(255, 255, 255, 0.7) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   5. METHOD/BENTO SECTION - Ensure text visible on themed cards
   ═══════════════════════════════════════════════════════════════════════════ */

/* Section headers on white/light background */
.reg-section:not(.reg-section-alt):not(.reg-section-dark) .reg-section-title {
    color: #1a1a1a !important;
}

.reg-section:not(.reg-section-alt):not(.reg-section-dark) .reg-section-subtitle {
    color: #4a4a4a !important;
}

/* Bento cards text */
.reg-bento-card h3 {
    color: #1a1a1a !important;
}

.reg-bento-card p {
    color: #4a4a4a !important;
}

.reg-bento-tag {
    color: #374151 !important;
}

/* Theme-specific tag colors for better visibility */
.reg-bento-card.red-theme .reg-bento-tag,
.reg-bento-card.green-theme .reg-bento-tag {
    color: #166534 !important;
    background: rgba(34, 197, 94, 0.15) !important;
}

.reg-bento-card.blue-theme .reg-bento-tag {
    color: #1e40af !important;
    background: rgba(59, 130, 246, 0.15) !important;
}

.reg-bento-card.purple-theme .reg-bento-tag {
    color: #5b21b6 !important;
    background: rgba(139, 92, 246, 0.15) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   6. TESTIMONIALS SECTION (ALT BACKGROUND) - Light gray background
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-testimonial-card .reg-testimonial-quote {
    color: #374151 !important;
}

/* New testimonial name styling */
.reg-testimonial-info .testimonial-name,
.reg-testimonial-info h5 {
    color: #1a1a1a !important;
    font-size: 1rem;
    margin: 0 0 4px 0;
}

.reg-testimonial-info span {
    color: #6b7280 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   7. VIDEO TESTIMONIALS SECTION - White/Light background
   ═══════════════════════════════════════════════════════════════════════════ */

/* Video card labels - text over gradient overlay */
.reg-video-label h4,
.reg-video-label .video-title {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 4px 0;
}

.reg-video-label span {
    color: rgba(255, 255, 255, 0.9) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   8. HOW IT WORKS SECTION (DARK BACKGROUND)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Section header on dark */
.reg-section-dark .reg-section-badge {
    color: #1a2e1a !important;
}

.reg-section-dark .reg-section-title {
    color: #ffffff !important;
}

.reg-section-dark .reg-section-subtitle {
    color: rgba(255, 255, 255, 0.75) !important;
}

/* Step cards */
.reg-step-card h3 {
    color: #ffffff !important;
}

.reg-step-card p {
    color: rgba(255, 255, 255, 0.75) !important;
}

/* Step number - decorative, should be subtle */
.reg-step-card .step-number {
    color: rgba(255, 255, 255, 0.1) !important;
}

/* Step arrow */
.reg-step-card .step-arrow {
    color: #22c55e !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   9. GUARANTEE SECTION - Gold/Yellow background
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-guarantee-box .guarantee-content h3 {
    color: #78350f !important;
}

.reg-guarantee-box .guarantee-content p {
    color: #92400e !important;
}

.reg-guarantee-box .guarantee-badge {
    color: #b45309 !important;
    background: #ffffff !important;
}

.reg-guarantee-box .guarantee-badge i {
    color: #d97706 !important;
}

/* Guarantee extended text */
.guarantee-extended p {
    color: #4a4a4a !important;
}

.guarantee-extended strong {
    color: #1a1a1a !important;
}

.guarantee-extended em {
    color: #b45309 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   10. OFFER SECTION (ALT BACKGROUND) - Light gray background
   ═══════════════════════════════════════════════════════════════════════════ */

/* Offer card header - dark background */
.reg-offer-header h3 {
    color: #ffffff !important;
}

.reg-offer-header p {
    color: rgba(255, 255, 255, 0.8) !important;
}

/* Offer body - white background */
.reg-value-name {
    color: #1a1a1a !important;
}

.reg-value-price {
    color: #6b7280 !important;
}

/* Value total section - dark background */
.reg-value-total {
    background: linear-gradient(135deg, #1a2e1a 0%, #0f1f0f 100%) !important;
}

.reg-value-total-label {
    color: #ffffff !important;
}

.reg-value-total-price {
    color: #4ade80 !important;
}

/* Final price display */
.reg-offer-final-price .label {
    color: #1a1a1a !important;
}

.reg-offer-final-price .price {
    color: #16a34a !important;
}

.reg-offer-final-price .price-note {
    color: #4a4a4a !important;
}

.reg-offer-final-price .price-note strong {
    color: #16a34a !important;
}

/* Scarcity badge - green background */
.reg-scarcity {
    color: #ffffff !important;
}

.reg-scarcity span {
    color: #ffffff !important;
}

/* Offer guarantee text */
.reg-offer-guarantee {
    color: #6b7280 !important;
}

.reg-offer-guarantee i {
    color: #22c55e !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   11. FAQ SECTION - White/Light background
   ═══════════════════════════════════════════════════════════════════════════ */

/* FAQ headings - changed from h4 to h3 for proper hierarchy */
.reg-faq-question h3,
.reg-faq-question h4 {
    color: #1a1a1a !important;
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.reg-faq-answer-content {
    color: #4a4a4a !important;
}

.reg-faq-item.active .reg-faq-question h3,
.reg-faq-item.active .reg-faq-question h4 {
    color: #16a34a !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   12. FOOTER - Dark background
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-footer-logo {
    color: #ffffff !important;
}

.reg-footer-tagline {
    color: rgba(255, 255, 255, 0.7) !important;
}

.reg-footer-copy {
    color: rgba(255, 255, 255, 0.6) !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   13. STICKY CTA BAR & MOBILE BAR
   ═══════════════════════════════════════════════════════════════════════════ */

/* Desktop sticky CTA */
.sticky-cta-text strong {
    color: #1a1a1a !important;
}

.sticky-cta-text span {
    color: #6b7280 !important;
}

/* Mobile sticky bar buttons */
.reg-mobile-sticky-bar .btn-whatsapp,
.reg-mobile-sticky-bar .btn-schedule {
    color: #ffffff !important;
}

.reg-mobile-sticky-bar .btn-whatsapp span,
.reg-mobile-sticky-bar .btn-schedule span {
    color: #ffffff !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   14. FLOATING CARDS (HERO) - White background cards
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-float-card .card-value {
    color: #1a1a1a !important;
}

.reg-float-card .card-label {
    color: #6b7280 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   15. SECTION BADGE COLORS - Ensure text visible on colored backgrounds
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-section-badge.green {
    background: #22c55e !important;
    color: #ffffff !important;
}

.reg-section-badge.mint {
    background: #dcfce7 !important;
    color: #166534 !important;
}

.reg-section-badge.red {
    background: #fce7f3 !important;
    color: #be185d !important;
}

.reg-section-badge.blue {
    background: #dbeafe !important;
    color: #1e40af !important;
}

.reg-section-badge.purple {
    background: #f3e8ff !important;
    color: #6b21a8 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   16. CTA BUTTONS - Ensure text always visible
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-cta-primary {
    color: #ffffff !important;
}

.reg-cta-primary i,
.reg-cta-primary span {
    color: #ffffff !important;
}

.reg-navbar-cta {
    color: #ffffff !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   17. HIGHLIGHT COLORS - Consistent across all sections
   ═══════════════════════════════════════════════════════════════════════════ */

.highlight,
.reg-section-title .highlight {
    color: #22c55e !important;
}

.highlight-green {
    color: #22c55e !important;
}

.highlight-blue {
    color: #3b82f6 !important;
}

/* Dark background highlight exception */
.reg-section-dark .highlight,
.reg-hero .highlight,
.reg-reframe-box .highlight {
    color: #4ade80 !important;
}


/* ═══════════════════════════════════════════════════════════════════════════
   18. WhatsApp TOOLTIP
   ═══════════════════════════════════════════════════════════════════════════ */

.whatsapp-tooltip {
    color: #ffffff !important;
    background: #1a2e1a !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   19. VIDEO THUMBNAILS - Generated Images Styles
   ═══════════════════════════════════════════════════════════════════════════ */

.reg-video-thumb {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.reg-video-card:hover .reg-video-thumb {
    transform: scale(1.05);
}

/* Ensure gradients overlay the image correctly */
.reg-video-card::after {
    z-index: 1;
}

.reg-video-play,
.reg-video-label {
    z-index: 2;
    position: relative;
}