/*
Theme Name: CyberVisionaries Funnel
Theme URI: https://cybervisionaries.com
Description: Custom sales funnel template theme with 10 funnel pages, password protection, and noindex.
Version: 1.0.0
Author: CyberVisionaries
Author URI: https://cybervisionaries.com
License: Private
License URI: https://cybervisionaries.com
Text Domain: cv-funnel
*/

/* ============================================
   RESET & BASE
   ============================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --primary: #f96e0e;
  --primary-hover: #e05d00;
  --accent-red: #cc0000;
  --accent-blue: #0174c7;
  --accent-orange: #ffa900;
  --accent-orange-hover: #d68e00;
  --dark-bg: #2d2d2d;
  --dark-card: #35393e;
  --success-green: #28a745;
  --text-dark: #333;
  --text-gray: #555;
  --text-light: #999;
  --border-light: #e5e7eb;
}

body {
  font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--text-dark);
  line-height: 1.6;
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; }
a { text-decoration: none; color: inherit; }

.container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}

.container-narrow {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 20px;
}

.text-center { text-align: center; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }
.mb-6 { margin-bottom: 3rem; }
.mt-2 { margin-top: 1rem; }
.mt-4 { margin-top: 2rem; }
.mt-6 { margin-top: 3rem; }
.py-4 { padding-top: 2rem; padding-bottom: 2rem; }
.py-6 { padding-top: 3rem; padding-bottom: 3rem; }
.py-8 { padding-top: 4rem; padding-bottom: 4rem; }

/* ============================================
   TYPOGRAPHY
   ============================================ */
.funnel-headline {
  font-family: 'Fjalla One', 'Roboto', sans-serif;
  font-weight: 700;
  line-height: 1.2;
  color: var(--text-dark);
}

.funnel-headline.large { font-size: 2.5rem; }
.funnel-headline.medium { font-size: 1.8rem; }
.funnel-headline.small { font-size: 1.4rem; }

@media (max-width: 768px) {
  .funnel-headline.large { font-size: 1.8rem; }
  .funnel-headline.medium { font-size: 1.4rem; }
  .funnel-headline.small { font-size: 1.2rem; }
}

.subheadline {
  font-size: 1.1rem;
  color: var(--text-gray);
  font-weight: 400;
}

.text-red { color: var(--accent-red); }
.text-blue { color: var(--accent-blue); }
.text-orange { color: var(--accent-orange); }
.text-white { color: #fff; }
.text-gray { color: var(--text-gray); }
.text-sm { font-size: 0.875rem; }
.font-bold { font-weight: 700; }

/* ============================================
   BUTTONS
   ============================================ */
.cta-button {
  background: linear-gradient(180deg, var(--primary) 0%, var(--primary-hover) 100%);
  color: #fff;
  font-weight: 700;
  font-size: 1.25rem;
  padding: 1rem 2.5rem;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  text-align: center;
  display: inline-block;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  line-height: 1.4;
}

.cta-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(249, 110, 14, 0.6);
  color: #fff;
}

.cta-button.blue {
  background: linear-gradient(180deg, #0e8dc7 0%, #0b72a1 100%);
  box-shadow: 0 4px 15px rgba(14, 141, 199, 0.4);
}

.cta-button.blue:hover {
  box-shadow: 0 6px 20px rgba(14, 141, 199, 0.6);
}

.cta-button.green {
  background: linear-gradient(180deg, #28a745 0%, #1e7e34 100%);
  box-shadow: 0 4px 15px rgba(40, 167, 69, 0.4);
}

.cta-button.green:hover {
  box-shadow: 0 6px 20px rgba(40, 167, 69, 0.6);
}

.cta-button.orange {
  background: linear-gradient(180deg, var(--accent-orange) 0%, var(--accent-orange-hover) 100%);
  box-shadow: 0 4px 15px rgba(255, 169, 0, 0.4);
}

.cta-button.orange:hover {
  box-shadow: 0 6px 20px rgba(255, 169, 0, 0.6);
}

.cta-button.full-width {
  display: block;
  width: 100%;
}

.cta-button .small-text {
  display: block;
  font-size: 0.8rem;
  font-weight: 400;
  opacity: 0.9;
  margin-top: 4px;
}

.skip-link {
  color: var(--text-light);
  text-decoration: underline;
  font-size: 0.85rem;
  cursor: pointer;
  transition: color 0.2s;
  display: inline-block;
}

.skip-link:hover { color: var(--text-gray); }

/* ============================================
   SECTIONS
   ============================================ */
.section-dark {
  background: var(--dark-bg);
  color: #fff;
}

.section-dark .funnel-headline,
.section-dark .subheadline {
  color: #fff;
}

.section-light-gray {
  background: #f3f3f3;
}

.warning-banner {
  background: #fff3cd;
  border: 1px solid #ffc107;
  color: #856404;
  padding: 12px 20px;
  text-align: center;
  font-weight: 600;
  font-size: 0.9rem;
}

/* ============================================
   STEP INDICATOR
   ============================================ */
.step-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1rem 0;
  background: #f5f5f5;
  font-size: 0.9rem;
  flex-wrap: wrap;
}

.step-indicator .step {
  padding: 0.25rem 0.75rem;
  border-radius: 4px;
  font-weight: 500;
  background: #e5e7eb;
  color: var(--text-gray);
}

.step-indicator .step.active {
  background: var(--accent-blue);
  color: #fff;
}

.step-indicator .step.completed {
  background: var(--success-green);
  color: #fff;
}

/* ============================================
   PRICING
   ============================================ */
.price-strike {
  text-decoration: line-through;
  color: var(--text-light);
  font-size: 1.2rem;
}

.price-highlight {
  color: var(--accent-red);
  font-weight: 900;
  font-size: 2.5rem;
}

.price-box {
  background: #f9f9f9;
  border: 2px solid var(--border-light);
  border-radius: 0;
  padding: 2rem;
  text-align: center;
}

.savings-badge {
  display: inline-block;
  background: var(--success-green);
  color: #fff;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 600;
}

/* ============================================
   TESTIMONIALS
   ============================================ */
.testimonial-card {
  background: #fff;
  border-radius: 0;
  padding: 1.25rem;
  border: 1px solid #e0e0e0;
  border-left: 1px solid #e0e0e0;
  margin-bottom: 1rem;
}

.testimonial-card .avatar {
  width: 60px;
  height: 60px;
  border-radius: 0;
  background: #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  font-weight: 700;
  color: var(--text-gray);
  flex-shrink: 0;
}

.testimonial-card .content {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}

.testimonial-card .quote {
  color: var(--text-gray);
  font-style: italic;
  margin-bottom: 0.5rem;
}

.testimonial-card .name {
  font-weight: 700;
  font-size: 0.9rem;
}

.testimonial-card .location {
  font-weight: 400;
  color: var(--text-light);
}

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
}

/* ============================================
   GUARANTEE BOX
   ============================================ */
.guarantee-box {
  border: 3px dashed var(--accent-orange);
  border-radius: 0;
  padding: 2rem;
  background: #fffef5;
  text-align: center;
}

.guarantee-box .icon {
  font-size: 3rem;
  margin-bottom: 0.75rem;
}

.guarantee-box h3 {
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.guarantee-box p {
  color: var(--text-gray);
}

/* ============================================
   VIDEO EMBED
   ============================================ */
.video-placeholder {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  background: #111;
  border-radius: 0;
  overflow: hidden;
  cursor: pointer;
}

.video-placeholder .play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.video-placeholder .play-circle {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
  transition: background 0.3s;
}

.video-placeholder:hover .play-circle {
  background: rgba(255,255,255,0.3);
}

.video-placeholder .play-circle::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-top: 12px solid transparent;
  border-left: 20px solid #fff;
  border-bottom: 12px solid transparent;
  margin-left: 4px;
}

.video-placeholder .label {
  color: rgba(255,255,255,0.8);
  font-size: 0.9rem;
}

/* ============================================
   COUNTDOWN TIMER
   ============================================ */
.countdown-timer {
  display: flex;
  gap: 1rem;
  justify-content: center;
  align-items: center;
}

.countdown-unit {
  background: var(--dark-bg);
  color: #fff;
  padding: 0.75rem 1rem;
  border-radius: 4px;
  text-align: center;
  min-width: 70px;
}

.countdown-unit .number {
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
}

.countdown-unit .label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 4px;
}

/* ============================================
   ORDER FORM
   ============================================ */
.order-form-section {
  background: #fff;
  border: 1px solid var(--border-light);
  border-radius: 0;
  overflow: hidden;
}

.order-form-section .section-header {
  background: var(--dark-bg);
  color: #fff;
  padding: 0.75rem 1.25rem;
  font-weight: 700;
  font-size: 0.95rem;
}

.order-form-section .section-body {
  padding: 1.25rem;
}

.form-group {
  margin-bottom: 1rem;
}

.form-group label {
  display: block;
  font-weight: 600;
  margin-bottom: 0.375rem;
  font-size: 0.9rem;
}

.form-group input,
.form-group select {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 1rem;
  transition: border-color 0.2s;
  font-family: inherit;
}

.form-group input:focus,
.form-group select:focus {
  outline: none;
  border-color: var(--accent-blue);
  box-shadow: 0 0 0 3px rgba(1, 116, 199, 0.1);
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 600px) {
  .form-row { grid-template-columns: 1fr; }
}

.order-bump {
  border: 2px dashed var(--accent-orange);
  border-radius: 0;
  padding: 1rem;
  background: #fffef5;
  margin: 1rem 0;
}

.order-bump label {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  cursor: pointer;
}

.order-bump input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin-top: 2px;
  flex-shrink: 0;
}

.order-summary-table {
  width: 100%;
  border-collapse: collapse;
}

.order-summary-table th,
.order-summary-table td {
  padding: 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--border-light);
}

.order-summary-table .total td {
  font-weight: 700;
  font-size: 1.1rem;
  border-bottom: none;
}

/* ============================================
   BENEFITS LIST
   ============================================ */
.benefits-list {
  list-style: none;
  padding: 0;
}

.benefits-list li {
  padding: 0.5rem 0;
  padding-left: 2rem;
  position: relative;
}

.benefits-list li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--success-green);
  font-weight: 700;
  font-size: 1.1rem;
}

.value-list li {
  padding: 0.75rem 0;
  padding-left: 2rem;
  border-bottom: 1px solid var(--border-light);
}

.value-list li .value {
  float: right;
  color: var(--text-gray);
  text-decoration: line-through;
  font-size: 0.9rem;
}

/* ============================================
   BONUS SECTION
   ============================================ */
.bonus-item {
  display: flex;
  gap: 1.5rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--border-light);
  align-items: flex-start;
}

.bonus-item:last-child { border-bottom: none; }

.bonus-item .number {
  background: var(--primary);
  color: #fff;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.2rem;
  flex-shrink: 0;
}

.bonus-item h4 {
  font-size: 1.1rem;
  margin-bottom: 0.25rem;
}

.bonus-item .bonus-value {
  color: var(--accent-red);
  font-weight: 700;
  font-size: 0.85rem;
}

/* ============================================
   FAQ
   ============================================ */
.faq-item {
  border-bottom: 1px solid var(--border-light);
  padding: 1.25rem 0;
}

.faq-question {
  font-weight: 700;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.05rem;
}

.faq-question::after {
  content: '+';
  font-size: 1.5rem;
  color: var(--text-light);
  transition: transform 0.3s;
}

.faq-item.open .faq-question::after {
  content: '−';
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  color: var(--text-gray);
}

.faq-item.open .faq-answer {
  max-height: 500px;
  padding-top: 0.75rem;
}

/* ============================================
   ACCORDION
   ============================================ */
.accordion-toggle {
  cursor: pointer;
  user-select: none;
  padding: 1rem 1.25rem;
  background: var(--dark-bg);
  color: #fff;
  font-weight: 700;
  border-radius: 8px;
  margin-bottom: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.accordion-toggle::after {
  content: '▼';
  font-size: 0.8rem;
  transition: transform 0.3s;
}

.accordion-toggle.open::after {
  transform: rotate(180deg);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease;
}

.accordion-content.open {
  max-height: 2000px;
}

/* ============================================
   MEMBERSHIP MODAL
   ============================================ */
.membership-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1a1d21;
}

.membership-modal {
  background: var(--dark-card);
  border-radius: 8px;
  padding: 2.5rem;
  width: 400px;
  max-width: 90vw;
  color: #fff;
}

.membership-modal input {
  width: 100%;
  padding: 0.875rem 1rem;
  border-radius: 6px;
  border: 2px solid rgba(255,255,255,0.2);
  background: #292d31;
  color: #fff;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

.membership-modal input:focus {
  outline: none;
  border-color: var(--accent-blue);
}

.membership-modal button {
  width: 100%;
  padding: 0.875rem;
  background: var(--accent-blue);
  color: #fff;
  border: none;
  border-radius: 6px;
  font-weight: 700;
  font-size: 1rem;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s;
}

.membership-modal button:hover {
  background: #0b72a1;
}

/* ============================================
   SCHEDULE CALL
   ============================================ */
.calendar-placeholder {
  background: #f3f3f3;
  border: 2px dashed #ddd;
  border-radius: 12px;
  padding: 3rem;
  text-align: center;
  color: var(--text-gray);
}

.calendar-placeholder .icon {
  font-size: 3rem;
  margin-bottom: 1rem;
}

.requirements-list {
  list-style: none;
  padding: 0;
  counter-reset: req;
}

.requirements-list li {
  counter-increment: req;
  padding: 0.75rem 0;
  padding-left: 2.5rem;
  position: relative;
  border-bottom: 1px solid var(--border-light);
}

.requirements-list li::before {
  content: counter(req) '.';
  position: absolute;
  left: 0;
  font-weight: 700;
  color: var(--primary);
}

.exclusion-list li::before {
  content: '✕';
  color: var(--accent-red);
}

/* ============================================
   FUNNEL HEADER & FOOTER
   ============================================ */
.funnel-header {
  background: #fff;
  border-bottom: 1px solid var(--border-light);
  padding: 0.75rem 1.5rem;
}

.funnel-header .inner {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.funnel-header .logo {
  font-size: 1.25rem;
  font-weight: 700;
}

.funnel-header .support {
  font-size: 0.85rem;
  color: var(--text-gray);
  display: flex;
  gap: 1rem;
}

.funnel-footer {
  background: #f5f5f5;
  padding: 1.5rem;
  margin-top: auto;
  text-align: center;
  font-size: 13px;
  color: #999;
}

.funnel-footer .links {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 0.75rem;
}

.funnel-footer .links a:hover { color: var(--text-dark); }

/* ============================================
   PASSWORD GATE
   ============================================ */
.password-gate {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.95);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
}

.password-gate .modal {
  background: var(--dark-card);
  border-radius: 8px;
  padding: 2.5rem;
  width: 400px;
  max-width: 90vw;
  color: #fff;
  text-align: center;
}

.password-gate h2 {
  font-size: 1.5rem;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.password-gate p {
  color: #999;
  font-size: 0.9rem;
  margin-bottom: 1.5rem;
}

.password-gate input {
  width: 100%;
  padding: 0.875rem 1rem;
  border-radius: 6px;
  border: 2px solid rgba(255,255,255,0.2);
  background: #292d31;
  color: #fff;
  font-size: 1rem;
  margin-bottom: 1rem;
}

.password-gate input:focus {
  outline: none;
  border-color: var(--accent-blue);
}

.password-gate button {
  width: 100%;
  padding: 0.875rem;
  background: #2563eb;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-weight: 700;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s;
}

.password-gate button:hover { background: #1d4ed8; }

.password-gate .error {
  color: #f87171;
  font-size: 0.85rem;
  margin-bottom: 0.75rem;
}

/* ============================================
   TWO-COLUMN LAYOUT
   ============================================ */
.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: start;
}

@media (max-width: 768px) {
  .two-col { grid-template-columns: 1fr; }
}

/* ============================================
   DASHBOARD
   ============================================ */
.dashboard {
  min-height: 100vh;
  background: #0f172a;
  color: #fff;
  padding: 3rem 1.5rem;
}

.dashboard h1 {
  font-size: 2.25rem;
  font-weight: 700;
  margin-bottom: 1rem;
}

.dashboard .subtitle {
  color: #94a3b8;
  margin-bottom: 2rem;
}

.page-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  max-width: 800px;
  margin: 0 auto;
}

.page-card {
  display: block;
  padding: 1.25rem;
  background: #1e293b;
  border-radius: 8px;
  border: 1px solid #334155;
  transition: all 0.2s;
}

.page-card:hover {
  background: #334155;
  border-color: #475569;
  color: #fff;
}

.page-card .header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.25rem;
}

.page-card h3 {
  font-size: 1.1rem;
  font-weight: 700;
}

.page-card .badge {
  font-size: 0.7rem;
  background: #2563eb;
  padding: 2px 8px;
  border-radius: 4px;
}

.page-card .desc {
  color: #94a3b8;
  font-size: 0.85rem;
}

/* ============================================
   PULSE ANIMATION
   ============================================ */
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 5px rgba(249, 110, 14, 0.4); }
  50% { box-shadow: 0 0 20px rgba(249, 110, 14, 0.8); }
}

.pulse-glow {
  animation: pulse-glow 2s ease-in-out infinite;
}

/* ============================================
   SECURITY BADGE
   ============================================ */
.security-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  padding: 0.5rem 1rem;
  border-radius: 8px;
  font-size: 0.85rem;
  color: #166534;
}

.security-badge .lock-icon::before {
  content: '🔒';
}

/* Letter format */
.letter-format {
  font-style: italic;
  max-width: 700px;
  margin: 0 auto;
  padding: 2rem;
  background: #fefce8;
  border: 1px solid #fef08a;
  border-radius: 8px;
}

.letter-format .from-line {
  font-style: normal;
  font-weight: 700;
  color: var(--text-gray);
  margin-bottom: 1rem;
}

.copy-block {
  margin-bottom: 1.5rem;
  line-height: 1.8;
  color: var(--text-dark);
}

.divider {
  border: none;
  border-top: 2px solid var(--border-light);
  margin: 2rem 0;
}


/* ============================================
   CLICKFUNNELS 1:1 STYLE OVERRIDES
   ============================================ */

/* CF uses max-width 960px containers, generous padding */
.container { max-width: 960px; }
.container-narrow { max-width: 750px; }

/* CF Hero sections have larger text */
.cf-hero { padding: 40px 0; text-align: center; }
.cf-hero .funnel-headline { font-size: 42px; line-height: 1.15; margin-bottom: 15px; }

/* CF dark sections */
.cf-dark-section { background: #2d2d2d; color: #fff; padding: 50px 0; }
.cf-dark-section .funnel-headline { color: #fff; }
.cf-dark-section p { color: rgba(255,255,255,0.85); }

/* CF light gray alternating sections */
.cf-section { padding: 50px 0; }
.cf-section-alt { padding: 50px 0; background: #f3f3f3; }

/* CF-style orange CTA button */
.cf-cta {
  display: inline-block;
  background: linear-gradient(180deg, #FFA900 0%, #d68e00 100%);
  color: #fff !important;
  font-weight: 700;
  font-size: 22px;
  padding: 18px 40px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  line-height: 1.3;
}
.cf-cta:hover { background: linear-gradient(180deg, #d68e00 0%, #b37700 100%); color: #fff !important; transform: translateY(-1px); }
.cf-cta .cf-cta-sub { display: block; font-size: 14px; font-weight: 400; opacity: 0.9; margin-top: 5px; }

/* CF secondary button (red/orange) */
.cf-cta-red {
  background: linear-gradient(180deg, #F96909 0%, #d95705 100%);
}

/* CF product image container */
.cf-product-img {
  background: #e8e8e8;
  max-width: 350px;
  margin: 0 auto 20px;
  padding: 20px;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  font-size: 13px;
  min-height: 350px;
}

/* CF price display */
.cf-price-old { text-decoration: line-through; color: #999; font-size: 18px; }
.cf-price-new { color: #cc0000; font-weight: 900; font-size: 36px; }
.cf-price-save { display: inline-block; background: #4CAF50; color: #fff; padding: 4px 15px; border-radius: 3px; font-size: 14px; font-weight: 600; }

/* CF testimonial style */
.cf-testimonial {
  background: #fff;
  border: 1px solid #e0e0e0;
  padding: 20px;
  margin-bottom: 15px;
  border-radius: 0;
}
.cf-testimonial .cf-test-img {
  width: 80px; height: 80px;
  background: #e0e0e0;
  display: flex; align-items: center; justify-content: center;
  color: #999; font-size: 11px; flex-shrink: 0;
}
.cf-testimonial .cf-test-body { display: flex; gap: 15px; align-items: flex-start; }
.cf-testimonial .cf-test-quote { font-style: italic; color: #555; margin-bottom: 8px; }
.cf-testimonial .cf-test-name { font-weight: 700; font-size: 14px; }

/* CF bonus card */
.cf-bonus-card {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  background: #fff;
  border: 1px solid #e0e0e0;
  padding: 20px;
  margin-bottom: 10px;
}
.cf-bonus-card .cf-bonus-img {
  width: 120px; min-height: 120px;
  background: #e0e0e0;
  display: flex; align-items: center; justify-content: center;
  color: #999; font-size: 11px; flex-shrink: 0;
}
.cf-bonus-card h4 { font-weight: 700; margin-bottom: 5px; font-size: 16px; }
.cf-bonus-card .cf-bonus-val { color: #cc0000; font-weight: 700; font-size: 14px; }

/* CF guarantee box */
.cf-guarantee {
  border: 2px dashed #ffa900;
  padding: 30px;
  text-align: center;
  background: #fff;
}
.cf-guarantee h3 { font-size: 24px; font-weight: 700; margin-bottom: 10px; }

/* CF letter format */
.cf-letter {
  background: #FFFDE7;
  border: 1px solid #FFF9C4;
  padding: 30px;
  margin: 20px 0;
}
.cf-letter .cf-from { font-weight: 700; color: #666; margin-bottom: 15px; font-style: normal; }

/* CF countdown */
.cf-countdown { display: flex; gap: 8px; justify-content: center; margin: 15px 0; }
.cf-countdown .cf-cd-unit {
  background: #2d2d2d; color: #fff;
  padding: 10px 15px; min-width: 70px; text-align: center;
}
.cf-countdown .cf-cd-num { font-size: 28px; font-weight: 900; line-height: 1; }
.cf-countdown .cf-cd-label { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; }

/* CF FAQ */
.cf-faq-item { border-bottom: 1px solid #e0e0e0; }
.cf-faq-q {
  font-weight: 700; padding: 15px 0; cursor: pointer;
  display: flex; justify-content: space-between; font-size: 16px;
}
.cf-faq-q::after { content: "+"; font-size: 20px; color: #999; }
.cf-faq-item.open .cf-faq-q::after { content: "−"; }
.cf-faq-a { max-height: 0; overflow: hidden; transition: max-height 0.3s; color: #666; }
.cf-faq-item.open .cf-faq-a { max-height: 500px; padding-bottom: 15px; }

/* CF step indicator */
.cf-steps { display: flex; justify-content: center; background: #f5f5f5; padding: 10px; gap: 5px; font-size: 13px; }
.cf-steps span { padding: 5px 12px; border-radius: 3px; }
.cf-steps .active { background: #0174c7; color: #fff; }
.cf-steps .done { background: #4CAF50; color: #fff; }

/* CF security badge */
.cf-security { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: #888; margin-top: 10px; }

/* CF red accent text */
.cf-red { color: #cc0000; }
.cf-bold { font-weight: 700; }

/* CF value comparison table */
.cf-value-table { width: 100%; border-collapse: collapse; }
.cf-value-table td { padding: 10px 15px; border-bottom: 1px solid #e0e0e0; }
.cf-value-table .cf-val-price { text-align: right; text-decoration: line-through; color: #999; }
.cf-value-table .cf-val-total td { font-weight: 700; font-size: 18px; border-bottom: none; }

/* CF two-col grid */
.cf-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
@media (max-width: 768px) { .cf-grid-2 { grid-template-columns: 1fr; } }

/* CF book review grid */
.cf-review-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.cf-review-grid .cf-review-item {
  background: #e8e8e8; padding: 30px; text-align: center; color: #999; font-size: 11px;
}

/* CF video placeholder */
.cf-video {
  position: relative; width: 100%; padding-bottom: 56.25%;
  background: #000; margin: 15px 0; cursor: pointer;
}
.cf-video .cf-play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 70px; height: 70px; background: rgba(255,255,255,0.2); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.cf-video .cf-play::after {
  content: ""; display: block; width: 0; height: 0;
  border-top: 12px solid transparent; border-left: 20px solid #fff; border-bottom: 12px solid transparent; margin-left: 4px;
}
.cf-video:hover .cf-play { background: rgba(255,255,255,0.3); }

/* CF header bar */
.cf-header { background: #fff; border-bottom: 1px solid #e0e0e0; padding: 12px 20px; }
.cf-header-inner { max-width: 960px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }
.cf-header-logo { font-size: 20px; font-weight: 700; }
.cf-header-support { font-size: 13px; color: #888; }

/* CF footer */
.cf-footer { background: #f5f5f5; padding: 15px; text-align: center; font-size: 13px; color: #999; }
.cf-footer a { color: #999; }
.cf-footer a:hover { color: #666; }

/* CF dual buttons (OTO pages) */
.cf-dual-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin: 15px 0; }
.cf-dual-btns .cf-btn-skip {
  padding: 15px 20px; background: #ebebeb; border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  color: #666; font-size: 13px; text-decoration: none; flex: 1; max-width: 320px; text-align: center;
}

/* CF warning banner */
.cf-warning { background: #fff3cd; border: 1px solid #ffc107; color: #856404; padding: 10px 20px; text-align: center; font-size: 13px; }

/* CF skip link */
.cf-skip { color: #999; text-decoration: underline; font-size: 13px; display: inline-block; margin-top: 10px; }
.cf-skip:hover { color: #666; }

/* Checkbox list with check marks */
.cf-checklist { list-style: none; padding: 0; }
.cf-checklist li { padding: 8px 0 8px 30px; position: relative; color: #555; }
.cf-checklist li::before { content: "✓"; position: absolute; left: 0; color: #4CAF50; font-weight: 700; font-size: 16px; }

/* X-mark list */
.cf-xlist { list-style: none; padding: 0; }
.cf-xlist li { padding: 8px 0 8px 30px; position: relative; color: #555; }
.cf-xlist li::before { content: "✗"; position: absolute; left: 0; color: #cc0000; font-weight: 700; font-size: 16px; }

/* Numbered list CF style */
.cf-numlist { list-style: none; padding: 0; counter-reset: cfnum; }
.cf-numlist li { padding: 8px 0 8px 35px; position: relative; color: #555; counter-increment: cfnum; }
.cf-numlist li::before { content: counter(cfnum) "."; position: absolute; left: 0; font-weight: 700; color: #333; }

@media (max-width: 768px) {
  .cf-review-grid { grid-template-columns: repeat(2, 1fr); }
  .cf-grid-2 { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .cf-review-grid { grid-template-columns: 1fr; }
}

/* body text CF overrides */
.cf-section p, .cf-section-alt p { color: #555; font-size: 16px; line-height: 1.6; }
.cf-dark-section a.cf-cta { color: #fff !important; }


/* ============================================
   ROUND 2 FIXES
   ============================================ */

/* Countdown timer on dark section needs contrast */
.cf-dark-section .countdown-timer .countdown-unit {
  background: rgba(255,255,255,0.15);
  border: 1px solid rgba(255,255,255,0.2);
}
.cf-dark-section .countdown-timer .countdown-unit .number {
  color: #fff;
}
.cf-dark-section .countdown-timer .countdown-unit .label {
  color: rgba(255,255,255,0.7);
}

/* CTA button max-width so it does not stretch full container */
.cf-cta {
  max-width: 500px;
}

/* Order page - red CTA per CF spec */
.cf-cta-red {
  display: inline-block;
  background: linear-gradient(180deg, #E43B2C 0%, #c42f22 100%) !important;
  color: #fff !important;
  font-weight: 700;
  font-size: 22px;
  padding: 18px 40px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  line-height: 1.3;
  width: 100%;
}
.cf-cta-red:hover {
  background: linear-gradient(180deg, #c42f22 0%, #a22518 100%) !important;
  color: #fff !important;
  transform: translateY(-1px);
}
.cf-cta-red .cf-cta-sub {
  display: block;
  font-size: 14px;
  font-weight: 400;
  opacity: 0.9;
  margin-top: 5px;
}

/* Order page 2-col layout - form left wider */
.order-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 25px;
  align-items: start;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}
@media (max-width: 768px) { .order-2col { grid-template-columns: 1fr; } }

/* Order form section headers - dark bg per CF */
.cf-form-header {
  background: #2d2d2d;
  color: #fff;
  padding: 12px 18px;
  font-weight: 700;
  font-size: 15px;
}

/* Order form inputs CF style */
.cf-form-body {
  padding: 18px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-top: none;
}
.cf-form-body .cf-input-group {
  margin-bottom: 15px;
}
.cf-form-body label {
  display: block;
  font-weight: 600;
  margin-bottom: 5px;
  font-size: 14px;
  color: #333;
}
.cf-form-body input,
.cf-form-body select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 15px;
  font-family: inherit;
}
.cf-form-body input:focus,
.cf-form-body select:focus {
  outline: none;
  border-color: #0174c7;
  box-shadow: 0 0 0 2px rgba(1,116,199,0.1);
}
.cf-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Order summary table CF style */
.cf-summary-table {
  width: 100%;
  border-collapse: collapse;
}
.cf-summary-table td {
  padding: 10px 15px;
  border-bottom: 1px solid #eee;
  font-size: 14px;
  color: #555;
}
.cf-summary-table td:last-child {
  text-align: right;
  color: #999;
  text-decoration: line-through;
}
.cf-summary-table .cf-total td {
  font-weight: 700;
  font-size: 16px;
  color: #333;
  border-bottom: none;
}
.cf-summary-table .cf-total td:last-child {
  text-decoration: none;
  color: #cc0000;
}

/* Order bump CF style */
.cf-order-bump {
  border: 2px dashed #ffa900;
  padding: 18px;
  background: #fffef5;
  margin-top: 15px;
}
.cf-order-bump label {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  cursor: pointer;
  font-size: 14px;
}
.cf-order-bump input[type="checkbox"] {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 2px;
}
.cf-order-bump .cf-bump-title {
  font-weight: 700;
  font-size: 15px;
  margin-bottom: 3px;
}
.cf-order-bump .cf-bump-price {
  color: #cc0000;
  font-weight: 700;
}

/* OTO page dual buttons */
.cf-dual-btns {
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 20px 0;
}
.cf-dual-btns .cf-btn-yes {
  flex: 1;
  max-width: 320px;
}
.cf-dual-btns .cf-btn-skip {
  padding: 15px 20px;
  background: #ebebeb;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  font-size: 13px;
  text-decoration: none;
  flex: 1;
  max-width: 320px;
  text-align: center;
}
.cf-dual-btns .cf-btn-skip:hover {
  background: #ddd;
}

/* OTO green CTA */
.cf-cta-green {
  display: inline-block;
  background: linear-gradient(180deg, #28a745 0%, #1e7e34 100%);
  color: #fff !important;
  font-weight: 700;
  font-size: 22px;
  padding: 18px 40px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  line-height: 1.3;
}
.cf-cta-green:hover {
  background: linear-gradient(180deg, #1e7e34 0%, #166528 100%);
  color: #fff !important;
}
.cf-cta-green .cf-cta-sub {
  display: block; font-size: 14px; font-weight: 400; opacity: 0.9; margin-top: 5px;
}

/* OTO dark blue CTA for downsells */
.cf-cta-darkblue {
  display: inline-block;
  background: linear-gradient(180deg, #042c3d 0%, #021e2a 100%);
  color: #fff !important;
  font-weight: 700;
  font-size: 22px;
  padding: 18px 40px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  line-height: 1.3;
}
.cf-cta-darkblue:hover {
  background: linear-gradient(180deg, #021e2a 0%, #01141d 100%);
  color: #fff !important;
}
.cf-cta-darkblue .cf-cta-sub {
  display: block; font-size: 14px; font-weight: 400; opacity: 0.9; margin-top: 5px;
}

/* Warning banner per CF */
.cf-warning {
  background: #fff3cd;
  border-bottom: 1px solid #ffc107;
  color: #856404;
  padding: 10px 20px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
}

/* CF skip/decline link */
.cf-skip {
  color: #999;
  text-decoration: underline;
  font-size: 13px;
  display: inline-block;
  margin-top: 12px;
}
.cf-skip:hover { color: #666; }

/* Downsell countdown */
.cf-countdown-inline {
  display: inline-flex;
  gap: 4px;
  font-size: 28px;
  font-weight: 900;
  color: #cc0000;
}

/* Thank you page */
.cf-product-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
}
.cf-product-table th {
  background: #f5f5f5;
  padding: 10px 15px;
  text-align: left;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 2px solid #e0e0e0;
}
.cf-product-table td {
  padding: 10px 15px;
  border-bottom: 1px solid #eee;
  font-size: 14px;
}

/* Schedule call dark hero */
.cf-hero-dark {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  color: #fff;
  padding: 60px 0;
  text-align: center;
}
.cf-hero-dark h1 { color: #fff; }
.cf-hero-dark p { color: rgba(255,255,255,0.8); }

/* Calendar placeholder */
.cf-calendar {
  background: #f3f3f3;
  border: 2px dashed #ddd;
  padding: 60px 30px;
  text-align: center;
  color: #999;
  font-size: 14px;
}

/* Membership page dark modal */
.cf-membership-bg {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #2d3136;
}
.cf-membership-modal {
  background: #35393E;
  border-radius: 8px;
  padding: 40px;
  width: 400px;
  max-width: 90vw;
  color: #fff;
  text-align: center;
}
.cf-membership-modal input {
  width: 100%;
  padding: 12px;
  border-radius: 4px;
  border: 2px solid rgba(255,255,255,0.2);
  background: #292d31;
  color: #fff;
  font-size: 15px;
  margin-bottom: 12px;
}
.cf-membership-modal button {
  width: 100%;
  padding: 12px;
  background: #0174c7;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-weight: 700;
  font-size: 15px;
  text-transform: uppercase;
  cursor: pointer;
}
.cf-membership-modal button:hover { background: #0b72a1; }


/* ============================================
   ROUND 3 FIXES - Sales Page Fine-Tuning
   ============================================ */

/* CTA button centering when max-width applied */
.cf-cta {
  margin-left: auto;
  margin-right: auto;
}

/* Bonus item styling (S31 numbered bonus list) */
.bonus-item {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 18px 0;
  border-bottom: 1px solid #e0e0e0;
}
.bonus-item:last-child {
  border-bottom: none;
}
.bonus-item .number {
  background: #ffa900;
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 18px;
  flex-shrink: 0;
}
.bonus-item h4 {
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 5px;
}
.bonus-value {
  color: #cc0000;
  font-weight: 700;
  font-size: 14px;
}

/* Value table total row */
.cf-value-table .cf-val-total td {
  font-weight: 700;
  font-size: 18px;
  border-top: 2px solid #333;
  border-bottom: none;
  padding-top: 15px;
}
.cf-value-table .cf-val-total .cf-val-price {
  text-decoration: none;
  color: #cc0000;
}

/* Testimonial star rating */
.cf-test-stars {
  color: #ffa900;
  font-size: 14px;
  margin-bottom: 6px;
}

/* Review grid responsive fix */
@media (max-width: 768px) {
  .bonus-item { flex-direction: column; align-items: center; text-align: center; }
  .cf-bonus-card { flex-direction: column; align-items: center; text-align: center; }
}


/* ============================================
   ROUND 4 FIXES - OTO/Schedule/ThankYou page classes
   ============================================ */

/* Map old-style CTA button classes to CF style */
.cta-button {
  display: inline-block;
  background: linear-gradient(180deg, #FFA900 0%, #d68e00 100%);
  color: #fff !important;
  font-weight: 700;
  font-size: 20px;
  padding: 18px 35px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  line-height: 1.3;
}
.cta-button:hover {
  transform: translateY(-1px);
  color: #fff !important;
}
.cta-button .small-text {
  display: block;
  font-size: 13px;
  font-weight: 400;
  opacity: 0.9;
  margin-top: 5px;
}
.cta-button.orange {
  background: linear-gradient(180deg, #FFA900 0%, #d68e00 100%);
}
.cta-button.orange:hover {
  background: linear-gradient(180deg, #d68e00 0%, #b37700 100%);
}
.cta-button.green {
  background: linear-gradient(180deg, #28a745 0%, #1e7e34 100%);
}
.cta-button.green:hover {
  background: linear-gradient(180deg, #1e7e34 0%, #166528 100%);
}
.cta-button.blue {
  background: linear-gradient(180deg, #0E8DC7 0%, #0b72a1 100%);
}
.cta-button.blue:hover {
  background: linear-gradient(180deg, #0b72a1 0%, #095d84 100%);
}
.cta-button.full-width {
  display: block;
  width: 100%;
}

/* Old step-indicator class map */
.step-indicator {
  display: flex;
  justify-content: center;
  background: #f5f5f5;
  padding: 10px;
  gap: 5px;
  font-size: 13px;
}
.step-indicator .step {
  padding: 5px 12px;
  border-radius: 3px;
  background: #e5e7eb;
  color: #666;
}
.step-indicator .step.active {
  background: #0174c7;
  color: #fff;
}
.step-indicator .step.completed {
  background: #4CAF50;
  color: #fff;
}

/* Letter format for OTO pages */
.letter-format {
  background: #FFFDE7;
  border: 1px solid #FFF9C4;
  padding: 30px;
  margin: 20px 0;
  border-radius: 4px;
}
.letter-format .from-line {
  font-weight: 700;
  color: #666;
  margin-bottom: 15px;
}
.copy-block {
  margin-bottom: 20px;
}
.copy-block h3 {
  margin-bottom: 8px;
}
.copy-block p {
  color: #555;
  font-size: 16px;
  line-height: 1.6;
}

/* Benefits list for OTO pages */
.benefits-list {
  list-style: none;
  padding: 0;
}
.benefits-list li {
  padding: 10px 0 10px 35px;
  position: relative;
  color: #555;
  font-size: 16px;
  line-height: 1.5;
  border-bottom: 1px solid #eee;
}
.benefits-list li:last-child {
  border-bottom: none;
}
.benefits-list li::before {
  content: "\2713";
  position: absolute;
  left: 0;
  color: #4CAF50;
  font-weight: 700;
  font-size: 16px;
}

/* Skip link for OTO pages */
.skip-link {
  color: #999;
  text-decoration: underline;
  font-size: 13px;
  display: inline-block;
  margin-top: 8px;
}
.skip-link:hover {
  color: #666;
}

/* Section dark (schedule call page) */
.section-dark {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  color: #fff;
}
.section-dark h1,
.section-dark h2,
.section-dark h3 {
  color: #fff;
}

/* Guarantee box */
.guarantee-box {
  border: 2px solid #ffa900;
  padding: 30px;
  text-align: center;
  background: #fff;
  border-radius: 0;
}
.guarantee-box .icon {
  font-size: 48px;
  margin-bottom: 10px;
}
.guarantee-box h3 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
}
.guarantee-box p {
  color: #555;
  font-size: 15px;
  line-height: 1.6;
}

/* Accordion for schedule call */
.accordion-toggle {
  background: #f5f5f5;
  padding: 15px 20px;
  font-weight: 700;
  cursor: pointer;
  border: 1px solid #e0e0e0;
  position: relative;
  font-size: 16px;
}
.accordion-toggle::after {
  content: "+";
  position: absolute;
  right: 20px;
  font-size: 20px;
  color: #999;
}
.accordion-toggle.open::after {
  content: "\2212";
}
.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  border: 1px solid #e0e0e0;
  border-top: none;
}
.accordion-toggle.open + .accordion-content {
  max-height: 2000px;
  padding: 0 20px;
}

/* Calendar placeholder */
.calendar-placeholder {
  background: #f3f3f3;
  border: 2px dashed #ddd;
  padding: 60px 30px;
  text-align: center;
  color: #999;
  border-radius: 4px;
}
.calendar-placeholder .icon {
  font-size: 48px;
  margin-bottom: 10px;
}

/* Requirements list */
.requirements-list {
  padding-left: 20px;
  list-style: none;
}
.requirements-list li {
  padding: 8px 0 8px 25px;
  position: relative;
  color: #555;
  font-size: 15px;
}
.requirements-list li::before {
  content: counter(list-item, decimal) ".";
  position: absolute;
  left: 0;
  font-weight: 700;
  color: #333;
}
.exclusion-list li::before {
  content: "\2717";
  color: #cc0000;
}

/* Divider */
.divider {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 0;
}

/* Savings badge for call confirmed */
.savings-badge {
  display: inline-block;
  background: #4CAF50;
  color: #fff;
  padding: 4px 15px;
  border-radius: 3px;
  font-size: 14px;
  font-weight: 600;
}

/* Video placeholder overrides for old class */
.video-placeholder {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  background: #000;
  margin: 15px 0;
  cursor: pointer;
  border-radius: 0;
}
.video-placeholder .play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}
.video-placeholder .play-circle {
  width: 70px;
  height: 70px;
  background: rgba(255,255,255,0.2);
  border-radius: 50%;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-placeholder .play-circle::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-top: 12px solid transparent;
  border-left: 20px solid #fff;
  border-bottom: 12px solid transparent;
  margin-left: 4px;
}
.video-placeholder .label {
  color: #fff;
  font-size: 14px;
}

/* Thank you page order-summary-table */
.order-summary-table {
  width: 100%;
  border-collapse: collapse;
}
.order-summary-table th {
  background: #f5f5f5;
  padding: 10px 15px;
  text-align: left;
  font-size: 14px;
  font-weight: 700;
  border-bottom: 2px solid #e0e0e0;
}
.order-summary-table td {
  padding: 10px 15px;
  border-bottom: 1px solid #eee;
  font-size: 14px;
}

/* Testimonials grid for call-confirmed */
.testimonials-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}
@media (max-width: 768px) {
  .testimonials-grid { grid-template-columns: 1fr; }
  .accordion-toggle + .accordion-content { max-height: none; }
}

/* Testimonial card for old-style template part */
.testimonial-card {
  background: #fff;
  border: 1px solid #e0e0e0;
  padding: 20px;
  border-radius: 0;
}
.testimonial-card .content {
  display: flex;
  gap: 15px;
  align-items: flex-start;
}
.testimonial-card .avatar {
  width: 60px;
  height: 60px;
  background: #e0e0e0;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: #999;
  font-size: 16px;
  flex-shrink: 0;
}
.testimonial-card .quote {
  font-style: italic;
  color: #555;
  margin-bottom: 8px;
  font-size: 14px;
  line-height: 1.5;
}
.testimonial-card .name {
  font-weight: 700;
  font-size: 14px;
}
.testimonial-card .location {
  color: #999;
  font-weight: 400;
}


/* ============================================
   ROUND 5 FIXES - Visual Polish
   ============================================ */

/* Fix testimonial card to use plain white border (no colored left border) */
.testimonial-card {
  border-left: 1px solid #e0e0e0;
}

/* Fix sales page star rating to not show twice */
.cf-test-stars {
  color: #ffa900;
  font-size: 14px;
  margin-bottom: 6px;
  line-height: 1;
}

/* Order page - make grid 60/40 per CF spec */
.order-2col {
  grid-template-columns: 3fr 2fr;
}

/* Order page declined card alert should be red per CF spec */
.cf-declined-alert {
  background: #f8d7da;
  border: 1px solid #f5c6cb;
  color: #721c24;
  padding: 10px 15px;
  border-radius: 4px;
  font-size: 13px;
  margin-bottom: 15px;
}

/* Ensure CTA buttons on dark sections show white text */
.cf-dark-section .cf-cta,
.cf-dark-section .cta-button {
  color: #fff !important;
}

/* Schedule call accordion - make toggle look more like CF */
.accordion-toggle {
  font-size: 15px;
  letter-spacing: 0.5px;
}

/* Fix OTO page CTA button sizing */
.cta-button.full-width {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

/* Membership modal button should be #2d3136 per CF spec */
/* Already set in inline styles, reinforcing here */

/* Thank You page - ensure Montserrat applies */
.thankyou-heading {
  font-family: "Montserrat", "Roboto", sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  color: #333;
}

/* Responsive improvements for order page */
@media (max-width: 768px) {
  .order-2col {
    grid-template-columns: 1fr;
  }
}


/* ============================================
   ROUND 6 FIXES - Final Polish
   ============================================ */

/* Star rating as p element - ensure no double rendering */
p.cf-test-stars {
  color: #ffa900 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  margin: 0 0 6px 0 !important;
  letter-spacing: 2px;
}

/* Ensure order page 60/40 split */
.order-2col {
  grid-template-columns: 3fr 2fr !important;
}
@media (max-width: 768px) {
  .order-2col {
    grid-template-columns: 1fr !important;
  }
}

/* OTO1 downsell - ensure blue CTA uses correct dark navy gradient */
a.cta-button[style*="042c3d"] {
  border-radius: 4px;
}

/* Call confirmed page - testimonial card remove orange left border */
.testimonial-card {
  border: 1px solid #e0e0e0 !important;
  border-left: 1px solid #e0e0e0 !important;
}

/* Ensure all CTA buttons have consistent border-radius: 4px per CF */
.cf-cta, .cta-button, .cf-cta-red, .cf-cta-green, .cf-cta-darkblue {
  border-radius: 4px;
}

/* Sales page section text not visible on dark sections */
.cf-dark-section .cf-value-table td {
  border-color: rgba(255,255,255,0.15);
}
.cf-dark-section .cf-val-price {
  color: rgba(255,255,255,0.5) !important;
}

/* Guarantee box consistent styling */
.cf-guarantee, .guarantee-box {
  border-radius: 0 !important;
}


/* ============================================
   ROUND 9 FIXES - Pixel-perfect sales page tuning
   ============================================ */

/* Price display uses Fjalla One for impact, matching CF */
.cf-price-new {
  font-family: "Fjalla One", "Roboto", sans-serif;
}

/* Ensure all form inputs have consistent border-radius */
.form-group input,
.form-group select {
  border-radius: 4px;
}

/* Fix order-form-section overflow since border-radius is now 0 */
.order-form-section {
  border-radius: 0;
}

/* Ensure video containers have no border-radius */
.cf-video {
  border-radius: 0;
}

/* Ensure checklist items have correct text color #555 */
.cf-checklist li {
  color: #555;
}

/* cf-numlist items correct color */
.cf-numlist li {
  color: #555;
}

/* Bonus item number circles should be #ffa900 */
.bonus-item .number {
  background: #ffa900;
}


/* ============================================
   ROUND 10 FIXES - Footer, spacing, consistency
   ============================================ */

/* Footer links with pipe separators per CF spec */
.funnel-footer .links a {
  position: relative;
  color: #999;
}
.funnel-footer .links a:not(:last-child)::after {
  content: "|";
  margin-left: 1rem;
  color: #ccc;
}

/* CF footer link style */
.cf-footer a:not(:last-child)::after {
  content: "|";
  margin-left: 0.5rem;
  color: #ccc;
}

/* Header border should be #e0e0e0 per CF */
.funnel-header {
  border-bottom: 1px solid #e0e0e0;
}

/* Ensure header text matches CF */
.funnel-header .logo {
  font-size: 20px;
  font-weight: 700;
  color: #333;
}
.funnel-header .logo a {
  color: #333;
}
.funnel-header .support {
  font-size: 13px;
  color: #888;
}

/* Review grid items consistent look */
.cf-review-grid .cf-review-item {
  background: #e8e8e8;
  border-radius: 0;
}

/* Ensure Fjalla One headings have correct weight (400 is only weight available) */
.funnel-headline {
  font-weight: 400;
}

/* Fix funnel-headline color to match spec #333 */
.funnel-headline {
  color: #333;
}

/* Sale price should use Fjalla One and be bold-looking */
.cf-price-new {
  font-family: "Fjalla One", sans-serif;
  font-weight: 900;
}

/* Ensure social proof grid wraps better on small screens */
@media (max-width: 600px) {
  .cf-review-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}


/* ============================================
   ROUNDS 11-15 FIXES - Cross-page consistency
   ============================================ */

/* Global border-radius sweep - ensure 0 on all containers per CF spec */
.testimonial-card,
.cf-testimonial,
.cf-bonus-card,
.cf-guarantee,
.guarantee-box,
.order-form-section,
.price-box,
.video-placeholder,
.cf-video,
.order-bump,
.cf-product-img,
.cf-review-grid .cf-review-item {
  border-radius: 0 !important;
}

/* Testimonial avatar should be square (no border-radius) per CF spec */
.testimonial-card .avatar,
.cf-testimonial .cf-test-img {
  border-radius: 0 !important;
}

/* Order page avatars */
.order-form-section .avatar,
.avatar {
  border-radius: 0 !important;
}

/* Ensure consistent image placeholder color across all pages */
.cf-product-img,
.cf-bonus-img,
.cf-test-img,
[style*="background:#e0e0e0"] {
  background-color: #e8e8e8 !important;
}

/* Ensure Red CTA matches spec exactly: #E43B2C gradient */
.cf-cta-red,
.cta-button.red,
a.cf-cta-red {
  background: linear-gradient(180deg, #E43B2C 0%, #cd291a 100%) !important;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

/* Blue CTA for thank you page */
.cf-cta-blue,
.cta-button.blue {
  background: linear-gradient(180deg, #0E8DC7 0%, #0b72a1 100%) !important;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Dark blue CTA for downsell pages */
.cf-cta-darkblue,
a[style*="042c3d"] {
  border-radius: 4px;
}

/* Ensure checklist checkmarks are consistent green */
.cf-checklist li::before {
  color: #4CAF50;
  font-weight: 700;
}

/* Order page form input height should be consistent */
.order-form-section input[type="text"],
.order-form-section input[type="email"],
.order-form-section input[type="tel"],
.order-form-section input[type="number"],
.order-form-section select {
  height: 45px;
  border-radius: 4px;
  border: 1px solid #ddd;
  font-size: 15px;
}

/* Order summary table header bg should be #2D2D2D per CF dark section */
.order-form-section .section-header {
  background: #2D2D2D;
}

/* Ensure countdown on all pages uses same style */
.countdown-unit {
  border-radius: 4px;
}

/* Ensure skip links on OTO pages are consistent */
.skip-link, .cf-skip {
  color: #999;
  text-decoration: underline;
  font-size: 14px;
}

/* Cross-page: all h2 headings should use Fjalla One */
h2.funnel-headline {
  font-family: "Fjalla One", sans-serif;
  color: #333;
}

/* Ensure step indicator uses consistent styling */
.cf-steps {
  font-size: 13px;
}
.cf-steps span {
  border-radius: 3px;
}

/* Ensure section padding is exactly 50px everywhere */
.cf-section,
.cf-section-alt,
.cf-dark-section {
  padding: 50px 0;
}

/* Letter sections on OTO pages */
.cf-letter {
  background: #FFFDE7;
  border: 1px solid #FFF9C4;
  border-radius: 0;
  padding: 30px;
}

/* OTO page dual buttons - consistent layout */
.cf-dual-btns {
  gap: 12px;
}
.cf-dual-btns .cf-btn-skip {
  border-radius: 4px;
}

/* Make footer links consistent across all page templates */
.cf-footer,
.funnel-footer {
  background: #f5f5f5;
  padding: 15px 20px;
  text-align: center;
  font-size: 13px;
  color: #999;
}
.cf-footer a,
.funnel-footer a,
.funnel-footer .links a {
  color: #999;
  text-decoration: none;
}
.cf-footer a:hover,
.funnel-footer a:hover,
.funnel-footer .links a:hover {
  color: #666;
}

/* Ensure header is identical across all pages */
.funnel-header,
.cf-header {
  background: #fff;
  border-bottom: 1px solid #e0e0e0;
  padding: 12px 20px;
}