/* =================================================================
   ROOT & BASE STYLES
   ================================================================= */
:root {
    --c-primary: #3a4f6a; 
    --c-secondary: #5a6f8a;
    --c-accent: #bf360c;          /* Laranja escuro - para contraste em botões */
    --c-accent-dark: #993008;     /* Laranja ainda mais escuro para hover */
    --c-light-bg: #f8f9fa;
    --c-text-light: #ffffff;
    --c-text-dark: #212529;
    --c-border: #dee2e6;
    --c-success: #237a2c;         /* Verde escuro para contraste */
    --c-danger: #b71c1c;          /* Vermelho escuro para contraste */
    --font-primary: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --shadow-sm: 0 4px 6px rgba(0,0,0,0.05);
    --shadow-md: 0 10px 20px rgba(0,0,0,0.07);
}

/* =================================================================
   GLOBAL / BASE
   ================================================================= */
body {
    font-family: var(--font-primary);
    line-height: 1.6;
    color: var(--c-primary);
    background-color: var(--c-text-light);
    margin: 0;
    font-size: 18px;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden; 
}
body.popup-open {
    overflow: hidden;
}
/* Estilos para a mensagem de sucesso do popup */
.popup-success-message {
    padding: 20px 0;
}
.popup-success-message h2 {
    color: var(--c-success);
}

.container { width: 90%; max-width: 1100px; margin: 0 auto; padding: 60px 0; }
.text-center { text-align: center; }
.section-title { font-size: 2.2rem; margin-bottom: 15px; text-align: center; }
.section-subtitle { font-size: 1.1rem; max-width: 700px; margin: 0 auto 40px auto; text-align: center; color: var(--c-secondary); line-height: 1.5; }

/* =================================================================
   HERO SECTION
   ================================================================= */
.section-hero { background-color: var(--c-light-bg); padding: 40px 0; overflow: hidden; }
.hero-container { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
.hero-text h1 { font-size: 2.2rem; line-height: 1.25; text-align: left; margin-bottom: 20px; color: var(--c-primary);}
.hero-text .sub-headline { font-size: 1.15rem; text-align: left; margin: 0 0 30px 0; max-width: 100%; color: var(--c-primary);}
.cta-button, .cta-inside-offer .cta-button, .final-cta-button, .hero-cta-button {
    display: inline-block;
    background: var(--c-accent) !important;
    color: #fff !important;
    font-weight: 700;
    text-decoration: none;
    padding: 18px 35px;
    border-radius: 8px;
    text-align: center;
    font-size: 1.2rem;
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: var(--shadow-sm);
    border: none;
    cursor: pointer;
}
.cta-button:hover, .cta-inside-offer .cta-button:hover, .final-cta-button:hover, .hero-cta-button:hover {
    background: var(--c-accent-dark) !important;
    color: #fff !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-md);
}
.hero-cta-button { animation: pulse-light 2.5s infinite; }
@keyframes pulse-light {
    0% { box-shadow: 0 0 0 0 rgba(191,54,12, 0.5), var(--shadow-sm);}
    70% { box-shadow: 0 0 0 12px rgba(191,54,12, 0), var(--shadow-sm);}
    100% { box-shadow: 0 0 0 0 rgba(191,54,12, 0), var(--shadow-sm);}
}
.trust-elements { display: flex; align-items: center; gap: 5px; font-size: 0.9rem; font-weight: 500; color: var(--c-primary); margin-top: 20px; }
.trust-elements .trust-check { color: var(--c-success); font-weight: bold; }
.trust-elements span:not(:last-child) { margin-right: 15px; }
.hero-image img { width: 100%; max-width: 400px; margin: 0 auto; border-radius: 12px; box-shadow: var(--shadow-md); display: block; }

/* =================================================================
   PAIN & SYMPTOMS SECTION
   ================================================================= */
.section-pain { background-color: #fff; }
.section-pain h4 { margin-top: 30px; font-size: 1.2rem; text-align: center; color: var(--c-text-dark); }
.symptoms-visual-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 15px; margin-top: 30px; }
.symptom-visual-card { background-color: var(--c-light-bg); padding: 20px; border-radius: 10px; text-align: left; font-weight: 500; color: var(--c-primary); border: 1px solid var(--c-border); display: flex; align-items: center; }
.symptom-visual-card .symptom-check { color: var(--c-success); font-size: 1.2rem; font-weight: bold; margin-right: 15px; }


/* =================================================================
   SOLUTION SECTION (INTRO BOX)
   ================================================================= */
.section-solution { background-color: var(--c-light-bg); }
.intro-box { display: grid; grid-template-columns: 1fr; gap: 30px; align-items: center; text-align: left; margin-bottom: 40px; }
.intro-image-wrapper {
    display: flex; 
    justify-content: center; 
    align-items: center;
}
.intro-image-wrapper img { 
    max-width: 200px; 
    border-radius: 8px; 
    display: block; 
}
.intro-text-wrapper h3 { font-size: 1.4rem; color: var(--c-text-dark); margin-bottom: 15px; }
.intro-text-wrapper ul { list-style: '✓ '; color: var(--c-accent); padding-left: 20px; }
.intro-text-wrapper li { padding-left: 10px; margin-bottom: 10px; color: var(--c-primary); }

/* =================================================================
   DEEPER LOOK INSIDE / STRATEGIES SECTION (EXPANDED)
   ================================================================= */
.section-deeper-look { background-color: #fff; } 
.detailed-strategies-grid { display: grid; grid-template-columns: 1fr; gap: 25px; }
.detailed-strategy-card { background-color: var(--c-light-bg); padding: 25px; border-radius: 12px; box-shadow: var(--shadow-sm); }
.detailed-strategy-card .strategy-icon { font-size: 2rem; display: inline-block; margin-right: 10px; color: var(--c-accent); vertical-align: middle; }
.detailed-strategy-card h4 { font-size: 1.25rem; margin: 0 0 10px 0; color: var(--c-text-dark); display: inline; vertical-align: middle;}
.detailed-strategy-card p { font-size: 1rem; color: var(--c-secondary); margin: 10px 0 0 0; line-height: 1.6; }

/* =================================================================
   VALUE & URGENCY SECTION
   ================================================================= */
.section-value { background-color: var(--c-light-bg); } 
.value-container { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: flex-start; }
.value-text ul { list-style: none; padding-left: 0; }
.value-text li { background: url('https://img.icons8.com/ios-filled/16/237a2c/ok.png') no-repeat left 5px; padding-left: 25px; margin-bottom: 15px; color: #222;}
.comparison-box { background: #fff; border: 1px solid var(--c-border); border-radius: 12px; padding: 25px; box-shadow: var(--shadow-sm); margin: 0 auto; max-width: 500px; color: #222;}
.comparison-box h4 { text-align: center; margin-top: 0; font-size: 1.3rem; color: var(--c-text-dark); }
.comparison-box ul { list-style: none; padding: 0; margin: 15px 0 0 0; }
.comparison-box li { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid #e9ecef; font-size: 1rem; color: #222;}
.comparison-box li:last-child { border-bottom: none; }
.comparison-box .icon { font-size: 1.3rem; color: var(--c-danger); }
.comparison-box .our-offer { font-weight: 700; color: var(--c-success); }
.comparison-box .our-offer .icon { color: var(--c-success); }

/* =================================================================
   OFFER & GUARANTEE SECTION
   ================================================================= */
.section-offer { background: #fff; } 
.offer-box { background: white; border: 2px solid var(--c-accent); border-radius: 12px; padding: 30px; max-width: 600px; margin: 0 auto; box-shadow: var(--shadow-md); }
.offer-box .offer-subtitle { color: var(--c-secondary); font-size: 1.1rem; margin-top: 0; }
.price-box { margin: 20px 0; background-color: #fff5f2; padding: 20px; border-radius: 8px; }
.price-label.highlighted-offer {
    display: inline-block;
    background-color: var(--c-accent) !important;
    color: #fff !important;
    padding: 8px 15px;
    border-radius: 5px;
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 1.1rem;
    text-transform: uppercase;
}
.price-line { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.price-old-offer { font-size: 1.2rem; text-decoration: line-through; color: var(--c-secondary); }
.price-new-offer { font-size: 2.5rem; font-weight: 700; color: var(--c-accent); }
.seals-image { 
    display: block; 
    width: 100%; 
    max-width: 350px; 
    margin: 25px auto; 
    border-radius: 12px; 
    box-sizing: border-box; 
} 
.guarantee-box { background-color: #f0f4f8; padding: 20px; border-radius: 8px; margin-top: 30px; border: 1px dashed var(--c-secondary); }
.guarantee-box h4 { color: var(--c-text-dark); margin: 0 0 10px 0; }
.guarantee-box p { color: var(--c-primary); margin: 0; font-size: 0.9rem; }

/* Bonus Section Styles */
.bonus-section { margin-top: 30px; padding-top: 20px; border-top: 1px dashed var(--c-border); }
.bonus-section h4 { font-size: 1.2rem; color: var(--c-accent); text-align: center; margin-bottom: 15px; }
.bonus-item { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 10px; background-color: #fffaf0; padding: 15px; border-radius: 8px;}
.bonus-icon { font-size: 1.5rem; }
.bonus-item p { margin: 0; font-size: 0.95rem; color: #212529;}
.bonus-item p strong { color: var(--c-accent); }

.additional-trust-seals { margin-top: 25px; text-align: center; }
.seal-item { display: inline-block; margin: 5px 10px; font-size: 0.85rem; color: var(--c-secondary); padding: 5px 10px; background-color: var(--c-light-bg); border-radius: 4px; border: 1px solid var(--c-border); }
.seal-item strong { color: var(--c-text-dark); }

/* =================================================================
   TESTIMONIALS SECTION (NEW)
   ================================================================= */
.section-testimonials { background-color: var(--c-light-bg); }
.testimonials-grid { display: grid; grid-template-columns: 1fr; gap: 25px; }
.testimonial-card { background-color: #fff; padding: 25px; border-radius: 12px; box-shadow: var(--shadow-sm); border-left: 5px solid var(--c-accent); display: flex; flex-direction: column; align-items: center; text-align: center; }
.testimonial-image { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; margin-bottom: 15px; border: 3px solid var(--c-accent); }
.testimonial-card p:not(.testimonial-author) { font-style: italic; color: var(--c-secondary); margin-bottom: 15px; position: relative; }
.testimonial-card p:not(.testimonial-author)::before { content: '“'; font-size: 3rem; color: var(--c-accent); position: absolute; left: -15px; top: -10px; opacity: 0.5; }
.testimonial-author { font-weight: bold; color: var(--c-primary); font-size: 0.9rem; margin-top: auto; }

/* =================================================================
   FINAL CTA SECTION
   ================================================================= */
.section-final-cta { background-color: #fff; }
.final-cta-button { animation: pulse-strong 2s infinite; }
@keyframes pulse-strong {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(191,54,12,0.7), var(--shadow-sm);}
    50% { transform: scale(1.03); box-shadow: 0 0 0 10px rgba(191,54,12,0), var(--shadow-sm);}
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(191,54,12,0), var(--shadow-sm);}
}
.cta-subtext { text-align: center; font-size: 0.85rem; color: var(--c-secondary); display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-top: 15px; }
.cta-trust-seals { margin-top: 20px; } 

/* ABOUT US SECTION (Revised Copy) */
.section-about { background-color: var(--c-light-bg); } 
.about-container { display: grid; grid-template-columns: 1fr; gap: 30px; align-items: center; }
.about-text-content .section-title { text-align: center; margin-bottom: 10px; } 
.about-paragraph { text-align: left; margin-bottom: 1em; color: #222;}
.about-logo-container { text-align: center; margin-top: 20px; }
.about-logo { margin: 0 auto; max-width: 180px; border-radius: 8px; display: block; }

/* =================================================================
   EXIT-INTENT POPUP STYLES
   ================================================================= */
.popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 1000;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0s 0.3s linear; 
}
.popup-overlay.active {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease, visibility 0s 0s linear;
}
.popup-content {
    background-color: #fff;
    padding: 30px 40px;
    border-radius: 12px;
    box-shadow: var(--shadow-lg);
    max-width: 500px;
    width: 90%;
    text-align: center;
    position: relative;
    transform: scale(0.95);
    transition: transform 0.3s ease;
}
.popup-overlay.active .popup-content {
    transform: scale(1);
}
.close-popup {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 2rem;
    color: var(--c-secondary);
    cursor: pointer;
    line-height: 1;
}
.close-popup:hover { color: var(--c-text-dark); }
.popup-content h2 { font-size: 1.8rem; color: var(--c-accent); margin-bottom: 15px; }
.popup-content p { margin-bottom: 20px; font-size: 1rem; color: #222;}
#exit-popup-form input[type="email"] {
    width: calc(100% - 22px); 
    padding: 12px;
    margin-bottom: 20px;
    border: 1px solid var(--c-border);
    border-radius: 6px;
    font-size: 1rem;
}
.popup-cta {
    display: block;
    width: 100%;
    background-color: var(--c-success);
    color: var(--c-text-light);
    padding: 15px;
    border: none;
    border-radius: 6px;
    font-size: 1.1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.popup-cta:hover { background-color: #14501a; }

/* =================================================================
   FOOTER
   ================================================================= */
.main-footer { background-color: var(--c-text-dark); color: #a0aec0; padding: 40px 0; font-size: 0.8rem; }
.footer-container { text-align: center; }
.footer-links { margin-bottom: 20px; }
.footer-links a { color: var(--c-text-light); text-decoration: none; margin: 0 8px; }
.main-footer p { max-width: 90%; margin: 10px auto; }

/* =================================================================
   RESPONSIVE DESIGN (DESKTOP OVERRIDES)
   ================================================================= */
@media (min-width: 768px) {
    .intro-box { grid-template-columns: 220px 1fr; gap: 40px; }
    .intro-image-wrapper { text-align: left; }
    .detailed-strategies-grid { grid-template-columns: repeat(2, 1fr); }
    .testimonials-grid { grid-template-columns: repeat(2, 1fr); }
    .about-container { grid-template-columns: 2fr 1fr; gap: 40px; }
    .about-text-content { order: 1; text-align: left; }
    .about-text-content .section-title,
    .about-text-content .about-paragraph { text-align: left; margin-left: 0; margin-right: 0; }
    .about-logo-container { order: 2; margin-top: 0; display: flex; justify-content: center; align-items: center; }
    .about-logo { margin: 0; }
}

@media (min-width: 992px) {
    .container { padding: 80px 0; }
    .section-title { font-size: 2.5rem; }
    .hero-container { grid-template-columns: 1.2fr 0.8fr; }
    .hero-text h1 { font-size: 2.8rem; }
    .detailed-strategies-grid { grid-template-columns: repeat(3, 1fr); }
    .strategy-card-center { grid-column: 2 / 3; }
    .value-container { grid-template-columns: 1fr 1fr; align-items: flex-start; }
    .testimonials-grid { grid-template-columns: repeat(3, 1fr); }
    .about-logo-container { justify-content: flex-end; }
    .about-logo { max-width: 150px; }
}

.no-copy { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/* =================================================================
   NEW STYLES ADDED FOR CTA OPTIMIZATIONS
   ================================================================= */
.samcart-slide-trigger {
    cursor: pointer;
}
.price-label.samcart-slide-trigger:hover,
.seals-image.samcart-slide-trigger:hover,
.guarantee-box.samcart-slide-trigger:hover {
    transform: scale(1.02) translateY(-2px);
    box-shadow: var(--shadow-md); 
}
.price-label,
.seals-image,
.guarantee-box {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
.cta-inside-offer {
    margin: 35px 0;
}
.cta-inside-offer .cta-button {
    font-size: 1.2rem; 
    padding: 18px 35px; 
    animation: pulse-strong 2s infinite;
}
.mobile-only-cta-container {
    display: block; 
    margin: 40px auto 20px auto; 
    text-align: center;
}
.mobile-only-cta {
    animation: pulse-strong 2s infinite; 
    width: 100%; 
    max-width: 350px; 
    box-sizing: border-box; 
    font-size: 1.1rem;
    background: var(--c-accent);
    color: #fff !important;
}
@media (min-width: 768px) {
    .mobile-only-cta-container {
        display: none;
    }
}

/* ===================== CONTRASTE ALTO PARA TEXTOS DESTACADOS =================== */
strong, b, .comparison-box strong, .comparison-box .our-offer, .comparison-box li {
    color: #222 !important;
}
.main-footer {
    background-color: var(--c-text-dark); 
    color: #e1e1e1; /* cinza claro, contraste alto */
    padding: 40px 0;
    font-size: 0.93rem;
}

.main-footer a,
.main-footer strong,
.main-footer b {
    color: #fff !important; /* links e <strong> ficam brancos para contraste perfeito */
    font-weight: 700;
}

.main-footer p, .main-footer span {
    color: #e1e1e1;
}

.main-footer .footer-links a {
    color: #fff !important;
}
/* =================================================================
   ESTILOS GERAIS PARA POPUPS
   ================================================================= */
.hidden { 
    display: none !important; 
}

@keyframes popup-fadein {
  from { 
    opacity: 0; 
    transform: translateY(20px); 
  }
  to { 
    opacity: 1; 
    transform: translateY(0); 
  }
}

/* =================================================================
   POPUP DE ESCASSEZ (SCARCITY)
   ================================================================= */
#scarcity-popup {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
  background: white;
  border-radius: 12px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.07);
  padding: 20px 25px;
  min-width: 310px;
  max-width: 90vw;
  border-top: 4px solid #bf360c; /* Cor de destaque */
  animation: popup-fadein 0.5s ease-out;
}

.scarcity-popup-content { 
  text-align: center; 
  position: relative; 
}

.scarcity-popup-content h4 { 
  color: #212529; /* Cor de texto escuro */
  font-size: 1.1rem; 
  margin: 0 0 5px 0; 
}

.scarcity-popup-content p { 
  color: #5a6f8a; /* Cor de texto secundária */
  margin: 0 0 15px 0; 
  font-size: 1rem; 
  line-height: 1.4;
}

#scarcity-timer { 
  font-weight: bold; 
  color: #bf360c; /* Cor de destaque */
}

.scarcity-note { 
  font-size: 0.8rem !important; 
  margin-top: 10px !important; 
}

.scarcity-close { 
  position: absolute; 
  top: -15px; 
  right: -10px; 
  font-size: 1.6rem; 
  color: #aaa; 
  cursor: pointer;
  line-height: 1;
  transition: color 0.2s;
}

.scarcity-close:hover {
  color: #333;
}

.scarcity-cta { 
  padding: 12px 25px; 
  font-size: 1rem; 
}


/* =================================================================
   POPUP DE PROVA SOCIAL (SOCIAL PROOF)
   ================================================================= */
#social-proof {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 1100;
  display: flex; /* O JS irá remover a classe 'hidden' para mostrar */
  align-items: flex-end;
  animation: popup-fadein 0.7s;
}

.social-proof-content {
  background: white;
  border-radius: 10px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.07);
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 15px;
  max-width: 360px;
  border: 1px solid #dee2e6; /* Cor da borda */
}

.social-proof-img { 
  width: 50px; 
  height: 50px; 
  object-fit: cover; 
  border-radius: 50%; 
  border: 2px solid #bf360c; /* Cor de destaque */
}

.social-proof-name { 
  font-weight: 600; 
  color: #212529; /* Cor de texto escuro */
  font-size: 0.95rem; 
}

.social-proof-location { 
  color: #5a6f8a; /* Cor de texto secundária */
  font-size: 0.9rem;
  margin-left: 5px;
}

.social-proof-text { 
  color: #3a4f6a; /* Cor de texto primária */
  font-size: 0.95rem; 
  margin-top: 4px; 
  line-height: 1.3; 
}


/* =================================================================
   RESPONSIVIDADE PARA DISPOSITIVOS MÓVEIS
   ================================================================= */
@media (max-width: 768px) {
  #scarcity-popup, #social-proof {
    left: 10px;
    right: 10px;
    bottom: 10px;
    max-width: calc(100% - 20px); /* Ocupa a largura toda com pequenas margens */
    z-index: 1100; /* Garante que os popups fiquem acima de outros elementos */
  }

  /* Para evitar sobreposição em telas pequenas, o de escassez fica acima */
  #scarcity-popup {
    bottom: auto;
    top: 10px;
    z-index: 1200;
  }
}

/* Privacy Policy Page Styles – Detailed */
.privacy-content {
    background-color: var(--c-light-bg);
    padding: 25px;
    border-radius: 5px;
    margin-top: 20px;
    font-size: 1rem;
    line-height: 1.8;
}
.privacy-content h2 {
    color: #a52a2a;
    margin-top: 25px;
    margin-bottom: 10px;
}
.privacy-content ul {
    margin-left: 20px;
    margin-bottom: 15px;
}
.privacy-content ul li {
    margin-bottom: 8px;
}
.privacy-content p {
    margin-bottom: 15px;
}