/**
 * Deliverables Common Styles
 * Unified styles for all deliverable dashboards (Problem Validation, Market Analysis, etc.)
 *
 * Color Palette:
 * - Primary Blue: #5180ef → #4b8ef1
 * - Success Green: #5f9025 → #6ba82e
 * - Warning Orange: #f39c12 → #e67e22
 * - Info Violet: #3f51b5
 * - Progress Teal: #80cbc4
 */

/* =================================================================
   COMMON CONTAINER STYLES
   ================================================================= */

.problem-validation-display,
.market-analysis-display {
  padding: 0;
}

/* =================================================================
   HERO SECTIONS (Score & Summary)
   ================================================================= */

.pv-header-grid,
.ma-hero-section {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 30px;
  margin-bottom: 40px;
  background: linear-gradient(135deg, #5180ef 0%, #4b8ef1 100%);
  padding: 40px;
  border-radius: 8px;
  color: white;
}

@media (max-width: 991px) {
  .pv-header-grid,
  .ma-hero-section {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

/* =================================================================
   CIRCULAR SCORE WIDGETS
   ================================================================= */

.pv-score-widget,
.ma-score-widget {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.pv-score-circle,
.ma-score-circle {
  position: relative;
  width: 140px;
  height: 140px;
  margin-bottom: 20px;
}

.pv-circular-chart,
.ma-circular-chart {
  display: block;
  max-width: 100%;
  max-height: 100%;
}

.pv-circle-bg,
.ma-circle-bg {
  fill: none;
  stroke: rgba(255, 255, 255, 0.2);
  stroke-width: 8;
}

.pv-circle-progress,
.ma-circle-progress {
  fill: none;
  stroke-width: 8;
  stroke-linecap: round;
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  transition: stroke-dashoffset 1.5s ease-in-out;
}

/* Unified progress color */
.pv-score-high .pv-circle-progress,
.pv-score-medium .pv-circle-progress,
.pv-score-low .pv-circle-progress,
.ma-score-high .ma-circle-progress,
.ma-score-medium .ma-circle-progress,
.ma-score-low .ma-circle-progress {
  stroke: #80cbc4;
}

.pv-score-text,
.ma-score-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.pv-score-value,
.ma-score-value {
  display: block;
  font-size: 36px;
  font-weight: 700;
  color: white;
  line-height: 1;
}

.pv-score-label,
.ma-score-label {
  display: block;
  font-size: 16px;
  color: rgba(255, 255, 255, 0.8);
  margin-top: 5px;
}

.pv-score-title,
.ma-score-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 15px;
}

/* =================================================================
   STATUS & TREND BADGES
   ================================================================= */

.pv-status-badge,
.ma-trend-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
}

.pv-status-success,
.pv-status-warning,
.pv-status-danger,
.trend-growth,
.trend-decline,
.trend-stable {
  background: rgba(255, 255, 255, 0.2);
}

/* =================================================================
   SUMMARY WIDGETS
   ================================================================= */

.pv-summary-widget,
.ma-summary-widget {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.pv-widget-title {
  font-size: 18px;
  font-weight: 600;
  color: white;
  margin: 0 0 15px 0;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.pv-widget-title i {
  font-size: 20px;
  color: white;
}

.pv-widget-content {
  font-size: 16px;
  line-height: 1.6;
  color: white;
  opacity: 0.95;
}

/* Market Size specific */
.ma-market-size {
  margin-bottom: 20px;
}

.ma-size-label {
  font-size: 14px;
  opacity: 0.9;
  margin-bottom: 8px;
}

.ma-size-value {
  font-size: 42px;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 8px;
}

.ma-size-volume {
  font-size: 16px;
  opacity: 0.9;
  margin-bottom: 12px;
}

.ma-growth-rate {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 16px;
  font-size: 15px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.2);
}

.ma-growth-rate.positive {
  background: rgba(74, 222, 128, 0.3);
}

.ma-growth-rate.negative {
  background: rgba(248, 113, 113, 0.3);
}

.ma-summary-text {
  font-size: 16px;
  line-height: 1.6;
  opacity: 0.95;
}

/* =================================================================
   SECTION TITLES
   ================================================================= */

.pv-section-title,
.ma-section-title {
  font-size: 20px;
  font-weight: 600;
  color: #101c3d;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.pv-section-title i,
.ma-section-title i {
  color: #5180ef;
  font-size: 22px;
}

/* =================================================================
   KEY FIGURES / METRICS GRID
   ================================================================= */

.ma-key-figures {
  margin-bottom: 40px;
}

.ma-figures-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
}

.ma-figure-card {
  background: linear-gradient(135deg, #5180ef 0%, #4b8ef1 100%);
  padding: 25px;
  border-radius: 8px;
  text-align: center;
  color: white;
  box-shadow: 0 4px 12px rgba(81, 128, 239, 0.3);
  transition: transform 0.2s;
}

.ma-figure-card:hover {
  transform: translateY(-4px);
}

.ma-figure-label {
  font-size: 13px;
  opacity: 0.9;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ma-figure-value {
  font-size: 32px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.ma-figure-trend {
  font-size: 20px;
}

.ma-figure-trend.trend-up {
  color: #5f9025;
}

.ma-figure-trend.trend-down {
  color: #EC407A;
}

.ma-figure-trend.trend-stable {
  color: #f39c12;
}

/* =================================================================
   ANALYSIS CARDS GRID
   ================================================================= */

.pv-analysis-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-bottom: 30px;
}

.pv-analysis-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(16, 28, 61, 0.08);
  border: 1px solid #f2f4fc;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.pv-card-header {
  padding: 20px;
  background: linear-gradient(135deg, #5180ef 0%, #4b8ef1 100%);
  color: #fff;
  display: flex;
  align-items: center;
  gap: 10px;
}

.pv-card-header i {
  font-size: 22px;
  color: #fff;
}

.pv-card-header h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
}

.pv-card-content {
  padding: 20px;
  font-size: 14px;
  line-height: 1.7;
  color: #333;
  flex: 1;
}

/* =================================================================
   OPPORTUNITIES & THREATS / STRENGTHS & WEAKNESSES
   ================================================================= */

.pv-sw-grid,
.ma-ot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}

@media (max-width: 768px) {
  .pv-sw-grid,
  .ma-ot-grid {
    grid-template-columns: 1fr;
  }
}

.pv-strengths-card,
.pv-weaknesses-card,
.ma-opportunities-card,
.ma-threats-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(16, 28, 61, 0.08);
  border: 1px solid #f2f4fc;
  overflow: hidden;
}

/* Header Colors */
.pv-success-header,
.ma-success-header {
  background: linear-gradient(135deg, #5f9025 0%, #6ba82e 100%);
}

.pv-warning-header,
.ma-danger-header {
  background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
}

.ma-card-header {
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: white;
}

.ma-card-header i {
  font-size: 24px;
  color: #fff;
}

.ma-card-header h4 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}

/* Lists */
.pv-list,
.ma-list {
  padding: 0;
}

.pv-list-item,
.ma-list-item {
  padding: 20px;
  border-bottom: 1px solid #f0f0f0;
  display: flex;
  gap: 15px;
}

.pv-list-item:last-child,
.ma-list-item:last-child {
  border-bottom: none;
}

.pv-list-icon,
.ma-list-icon {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.pv-list-icon i,
.ma-list-icon i {
  font-size: 20px;
}

/* List item backgrounds */
.pv-strength-item {
  background: #ddfbe6;
}

.pv-strength-item .pv-list-icon i {
  color: #5f9025;
}

.pv-weakness-item {
  background: #fef3c7;
}

.pv-weakness-item .pv-list-icon i {
  color: #f39c12;
}

.ma-opportunities-card .ma-list-icon i {
  color: #5f9025;
}

.ma-threats-card .ma-list-icon i {
  color: #f39c12;
}

/* Priority/Severity Badges */
.ma-priority-badge,
.ma-severity-badge {
  font-size: 10px;
  padding: 4px 8px;
  border-radius: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ma-priority-high,
.ma-priority-medium,
.ma-priority-low {
  background: #ddfbe6;
  color: #5f9025;
}

.ma-severity-high,
.ma-severity-medium,
.ma-severity-low  {
  background: #fef3c7;
  color: #f39c12;
}

.pv-list-content,
.ma-list-content {
  flex: 1;
  font-size: 14px;
  line-height: 1.6;
  color: #333;
}

.ma-list-title {
  font-size: 16px;
  font-weight: 600;
  color: #101c3d;
  margin-bottom: 8px;
}

.ma-list-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

/* =================================================================
   TRENDS SECTION
   ================================================================= */

.ma-trends-section {
  margin-bottom: 40px;
}

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

.ma-trend-card {
  background: white;
  border: 2px solid #e5e7eb;
  border-radius: 8px;
  padding: 25px;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}

.ma-trend-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #5180ef 0%, #4b8ef1 100%);
}

.ma-trend-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(102, 126, 234, 0.2);
}

.ma-trend-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}

.ma-trend-number {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, #5180ef 0%, #4b8ef1 100%);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
}

.ma-impact-badge {
  font-size: 11px;
  padding: 4px 10px;
  border-radius: 12px;
  font-weight: 600;
  text-transform: uppercase;
}

.ma-impact-critical,
.ma-impact-high,
.ma-impact-medium,
.ma-impact-low {
  background: #e8eaf6;
  color: #3f51b5;
}

/* Badges colorés selon la priorité/impact */
.ma-impact-badge.ma-impact-critical {
  background: #fee2e2;
  color: #991b1b;
}

.ma-impact-badge.ma-impact-high {
  background: #fef3c7;
  color: #92400e;
}

.ma-impact-badge.ma-impact-medium {
  background: #dbeafe;
  color: #1e3a8a;
}

.ma-impact-badge.ma-impact-low {
  background: #d1fae5;
  color: #065f46;
}

.ma-trend-title {
  font-size: 17px;
  font-weight: 600;
  color: #101c3d;
  margin-bottom: 10px;
}

.ma-trend-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

/* =================================================================
   RECOMMENDATIONS SECTION
   ================================================================= */

.pv-recommendations {
  margin-bottom: 20px;
  background: #f7fafc;
  padding: 25px;
  border-radius: 8px;
}

.pv-recommendations-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

.pv-recommendation-card {
  background: #fff;
  border-radius: 8px;
  padding: 25px;
  box-shadow: 0 2px 12px rgba(16, 28, 61, 0.1);
  border-left: 5px solid #5180ef;
  display: flex;
  gap: 18px;
  align-items: flex-start;
  transition: transform 0.2s, box-shadow 0.2s;
}

.pv-recommendation-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(16, 28, 61, 0.15);
}

.pv-rec-number {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: linear-gradient(135deg, #5180ef 0%, #4b8ef1 100%);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
  box-shadow: 0 2px 6px rgba(81, 128, 239, 0.3);
}

.pv-rec-content {
  font-size: 15px;
  line-height: 1.7;
  color: #333;
  font-weight: 500;
}

/* =================================================================
   SEGMENTATION SECTION
   ================================================================= */

.ma-segmentation-section {
  margin-bottom: 40px;
}

.ma-segments-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.ma-segment-card {
  background: white;
  border-radius: 8px;
  padding: 25px;
  box-shadow: 0 2px 12px rgba(16, 28, 61, 0.08);
  border-left: 4px solid #5180ef;
  transition: transform 0.2s;
}

.ma-segment-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(16, 28, 61, 0.12);
}

.ma-segment-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.ma-segment-name {
  font-size: 17px;
  font-weight: 600;
  color: #101c3d;
}

.ma-segment-size {
  font-size: 20px;
  font-weight: 700;
  color: #5180ef;
}

.ma-segment-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

/* =================================================================
   FORECASTS SECTION
   ================================================================= */

.ma-forecasts-section {
  margin-bottom: 40px;
}

.ma-forecasts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 20px;
}

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

.ma-forecast-card {
  background: white;
  border-radius: 8px;
  padding: 25px;
  box-shadow: 0 2px 12px rgba(16, 28, 61, 0.08);
}

.ma-forecast-header {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #5180ef;
  margin-bottom: 15px;
}

.ma-forecast-content {
  font-size: 14px;
  line-height: 1.7;
  color: #333;
}

/* =================================================================
   DETAILS & SOURCES SECTIONS
   ================================================================= */

.ma-details-section {
  margin-bottom: 40px;
  background: #f9fafb;
  padding: 30px;
  border-radius: 8px;
}

.ma-details-content {
  font-size: 15px;
  line-height: 1.7;
  color: #333;
}

.ma-sources-section {
  padding: 20px;
  background: #f9fafb;
  border-radius: 8px;
  border-left: 4px solid #5180ef;
}

.ma-sources-title {
  font-size: 14px;
  font-weight: 600;
  color: #5180ef;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ma-sources-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.ma-sources-list li {
  font-size: 13px;
  color: #666;
  margin-bottom: 6px;
  padding-left: 18px;
  position: relative;
}

.ma-sources-list li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: #5180ef;
}

.ma-sources-list li:last-child {
  margin-bottom: 0;
}

/* =================================================================
   RESPONSIVE ADJUSTMENTS
   ================================================================= */

@media (max-width: 768px) {
  .pv-analysis-grid,
  .pv-sw-grid {
    grid-template-columns: 1fr;
  }

  .pv-recommendations-grid {
    grid-template-columns: 1fr;
  }

  .pv-score-widget {
    padding: 20px;
  }

  .pv-score-circle,
  .ma-score-circle {
    width: 100px;
    height: 100px;
  }

  .pv-summary-widget {
    padding: 20px;
    max-height: none;
  }

  .pv-recommendations {
    padding: 20px;
  }

  .pv-recommendation-card {
    padding: 20px;
  }
}

/* ============================================
   COMPETITIVE ANALYSIS DISPLAY
   ============================================ */

/* Container */
.competitive-analysis-display {
  padding: 0;
}

/* Hero Section */
.ca-hero-section {
  background: linear-gradient(135deg, #5180ef 0%, #4b8ef1 100%);
  padding: 40px;
  border-radius: 8px;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 40px;
  color: white;
  margin-bottom: 24px;
}

/* Score Widget */
.ca-score-widget {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.ca-score-circle {
  position: relative;
  width: 140px;
  height: 140px;
}

.ca-circular-chart {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

.ca-circle-bg {
  fill: none;
  stroke: rgba(255, 255, 255, 0.2);
  stroke-width: 8;
}

.ca-circle-progress {
  fill: none;
  stroke: #80cbc4;
  stroke-width: 8;
  stroke-linecap: round;
  transition: stroke-dashoffset 0.6s ease;
}

.ca-score-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.ca-score-value {
  font-size: 36px;
  font-weight: 700;
  color: white;
  line-height: 1;
}

.ca-score-label {
  font-size: 18px;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 500;
}

.ca-score-title {
  font-size: 16px;
  font-weight: 600;
  color: white;
  text-align: center;
}

/* Position Badge */
/* Market Position Badge - Uses global trend classes (trend-growth, trend-stable, trend-decline) */

/* Summary Widget */
.ca-summary-widget {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.ca-intensity-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 8px;
}

.ca-intensity-label {
  font-size: 15px;
  font-weight: 600;
  color: white;
}

.ca-intensity-badge {
  padding: 6px 14px;
  border-radius: 16px;
  font-size: 13px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
}

.ca-intensity-badge.intensity-very-high {
  background: rgba(231, 76, 60, 0.3);
  border: 1px solid rgba(231, 76, 60, 0.5);
}

.ca-intensity-badge.intensity-high {
  background: rgba(243, 156, 18, 0.3);
  border: 1px solid rgba(243, 156, 18, 0.5);
}

.ca-intensity-badge.intensity-moderate {
  background: rgba(241, 196, 15, 0.3);
  border: 1px solid rgba(241, 196, 15, 0.5);
}

.ca-intensity-badge.intensity-low {
  background: rgba(95, 144, 37, 0.3);
  border: 1px solid rgba(95, 144, 37, 0.5);
}

.ca-summary-text {
  font-size: 15px;
  line-height: 1.6;
  color: white;
}

/* Section Titles */
.ca-section-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 20px;
  font-weight: 600;
  color: #2c3e50;
  margin-bottom: 20px;
}

.ca-section-title i {
  font-size: 24px;
  color: #5180ef;
}

/* Competitors Grid */
.ca-competitors-section {
  margin-bottom: 32px;
}

.ca-competitors-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
  gap: 20px;
}

.ca-competitor-card {
  background: white;
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
  border-left: 4px solid #5180ef;
}

.ca-competitor-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}

.ca-competitor-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
  gap: 12px;
}

.ca-competitor-name {
  font-size: 18px;
  font-weight: 700;
  color: #2c3e50;
  flex: 1;
}

.ca-competitor-badges {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-end;
}

.ca-type-badge {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}

.ca-type-badge.ca-type-direct {
  background: #e8eaf6;
  color: #3f51b5;
}

.ca-type-badge.ca-type-indirect {
  background: #f3e5f5;
  color: #9c27b0;
}

.ca-threat-badge {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
}

.ca-threat-badge.ca-threat-high {
  background: #ffebee;
  color: #c62828;
}

.ca-threat-badge.ca-threat-medium {
  background: #fff3e0;
  color: #e65100;
}

.ca-threat-badge.ca-threat-low {
  background: #f1f8e9;
  color: #558b2f;
}

.ca-competitor-website {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  margin-bottom: 12px;
  padding: 8px 12px;
  background: #f8f9fc;
  border-radius: 6px;
}

.ca-competitor-website i {
  font-size: 14px;
  color: #5180ef;
}

.ca-competitor-website a {
  color: #5180ef;
  text-decoration: none;
  word-break: break-all;
}

.ca-competitor-website a:hover {
  text-decoration: underline;
}

.ca-market-share {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #5180ef;
  margin-bottom: 12px;
}

.ca-market-share i {
  font-size: 16px;
}

.ca-positioning-text {
  font-size: 14px;
  color: #546e7a;
  font-style: italic;
  margin-bottom: 12px;
  padding: 8px 12px;
  background: #f5f7fa;
  border-radius: 6px;
}

.ca-competitor-description {
  font-size: 14px;
  line-height: 1.6;
  color: #546e7a;
  margin-bottom: 16px;
}

/* Strengths & Weaknesses Row */
.ca-sw-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 16px;
}

.ca-strengths-col,
.ca-weaknesses-col {
  padding: 12px;
  border-radius: 6px;
}

.ca-strengths-col {
  background: #f1f8e9;
}

.ca-weaknesses-col {
  background: #fff3e0;
}

.ca-sw-title {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
}

.ca-strengths-title {
  color: #5f9025;
}

.ca-weaknesses-title {
  color: #f39c12;
}

.ca-sw-title i {
  font-size: 14px;
}

.ca-sw-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.ca-sw-list li {
  font-size: 13px;
  line-height: 1.5;
  color: #546e7a;
  padding-left: 12px;
  position: relative;
  margin-bottom: 6px;
}

.ca-sw-list li:before {
  content: "•";
  position: absolute;
  left: 0;
  font-weight: 700;
}

.ca-strengths-col .ca-sw-list li:before {
  color: #5f9025;
}

.ca-weaknesses-col .ca-sw-list li:before {
  color: #f39c12;
}

/* Competitive Advantages - Uses Market Analysis Trends classes (ma-trends-section, ma-trends-grid, ma-trend-card, ma-trend-header, ma-trend-number, ma-impact-badge, ma-trend-title, ma-trend-description) */

/* Differentiation Strategy - Uses Market Analysis Segmentation classes (ma-segmentation-section, ma-segments-grid, ma-segment-card, ma-segment-description) */

/* Barriers & Opportunities Grid - Uses Market Analysis classes (ma-ot-grid, ma-threats-card, ma-opportunities-card) */

/* Key Insights - Uses Problem Validation classes (pv-recommendations, pv-recommendations-grid, pv-recommendation-card, pv-rec-number, pv-rec-content) */

/* Responsive */
@media (max-width: 768px) {
  .ca-hero-section {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px;
  }

  .ca-competitors-grid {
    grid-template-columns: 1fr;
  }

  .ca-sw-row {
    grid-template-columns: 1fr;
  }

  .ca-score-circle {
    width: 100px;
    height: 100px;
  }

  .ca-score-value {
    font-size: 28px;
  }

  .ca-score-label {
    font-size: 14px;
  }
}

/* =================================================================
   VALUE PROPOSITION CANVAS STYLES (vp-*)
   Value Proposition Display Dashboard
   Prefix: vp-
   Réutilise: ma-* pour les grilles et layouts
   ================================================================= */

.value-proposition-display {
  padding: 0;
}

/* Hero Section with UVP */
.vp-hero-section {
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  padding: 50px 40px;
  border-radius: 8px;
  margin-bottom: 40px;
  text-align: center;
}

.vp-hero-content {
  max-width: 900px;
  margin: 0 auto;
}

.vp-uvp-title {
  font-size: 32px;
  font-weight: 700;
  color: white;
  line-height: 1.4;
  margin: 0;
}

/* Canvas Grid - Two Column Layout */
.vp-canvas-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-bottom: 40px;
}

@media (max-width: 991px) {
  .vp-canvas-grid {
    grid-template-columns: 1fr;
  }
}

/* Customer Profile & Value Map Containers */
.vp-customer-profile,
.vp-value-map {
  background: #ffffff;
  border: 2px solid #e5e7eb;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 2px 8px rgba(16, 28, 61, 0.08);
}

.vp-customer-profile {
  border-color: #ffffff;
}

.vp-value-map {
  border-color: #ffffff;
}

/* Section Headers */
.vp-section-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 30px;
  padding-bottom: 16px;
  border-bottom: 2px solid #667eea;
}

.vp-section-header i {
  font-size: 24px;
}

.vp-section-header h3 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
}

.vp-customer-header {
  color: #667eea;
}

.vp-value-header {
  color: #667eea;
}

/* Subsections */
.vp-subsection {
  margin-bottom: 30px;
}

.vp-subsection:last-child {
  margin-bottom: 0;
}

.vp-subsection-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 16px;
}

.vp-subsection-title i {
  font-size: 20px;
  color: #6366f1;
}

/* Items List (Jobs, Pains, Gains) */
.vp-items-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.vp-item {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 16px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  transition: all 0.2s ease;
}

.vp-item:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  transform: translateY(-1px);
}

.vp-item-badge {
  flex-shrink: 0;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Job Type Badges */
.vp-badge-functional {
  background: #dbeafe;
  color: #1e40af;
}

.vp-badge-social {
  background: #fce7f3;
  color: #be185d;
}

.vp-badge-emotional {
  background: #fef3c7;
  color: #92400e;
}

/* Severity Badges (Pains) */
.vp-severity-badge.vp-severity-extreme {
  background: #fce7f3;
  color: #be185d;
}

.vp-severity-badge.vp-severity-severe {
  background: #fef3c7;
  color: #92400e;
}

.vp-severity-badge.vp-severity-moderate {
  background: #dbeafe;
  color: #1e40af;
}

/* Importance Badges (Gains) */
.vp-importance-badge.vp-importance-essential {
  background: #d1fae5;
  color: #065f46;
}

.vp-importance-badge.vp-importance-expected {
  background: #dbeafe;
  color: #1e40af;
}

.vp-importance-badge.vp-importance-desired {
  background: #e0e7ff;
  color: #3730a3;
}

.vp-item-content {
  flex: 1;
  color: #374151;
  line-height: 1.6;
  font-size: 15px;
}

/* Products Grid */
.vp-products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.vp-product-card {
  background: #f0fdf4;
  border: 2px solid #10b981;
  border-radius: 8px;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 500;
  color: #065f46;
  transition: all 0.2s ease;
}

.vp-product-card:hover {
  background: #d1fae5;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2);
}

.vp-product-card i {
  font-size: 20px;
  color: #10b981;
}

/* Pain Relievers List */
.vp-relievers-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.vp-reliever-item {
  background: #fef3c7;
  border: 2px solid #f59e0b;
  border-radius: 8px;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
}

@media (max-width: 768px) {
  .vp-reliever-item {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

.vp-reliever-pain {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #dc2626;
}

.vp-reliever-pain i {
  font-size: 20px;
  flex-shrink: 0;
}

.vp-reliever-pain strong {
  font-weight: 600;
}

.vp-reliever-arrow {
  font-size: 24px;
  color: #f59e0b;
  font-weight: bold;
  text-align: center;
}

.vp-reliever-solution {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #16a34a;
}

.vp-reliever-solution i {
  font-size: 20px;
  flex-shrink: 0;
}

/* Gain Creators List */
.vp-creators-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.vp-creator-item {
  background: #d1fae5;
  border: 2px solid #10b981;
  border-radius: 8px;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
}

@media (max-width: 768px) {
  .vp-creator-item {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

.vp-creator-gain {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #6366f1;
}

.vp-creator-gain i {
  font-size: 20px;
  flex-shrink: 0;
}

.vp-creator-gain strong {
  font-weight: 600;
}

.vp-creator-arrow {
  font-size: 24px;
  color: #10b981;
  font-weight: bold;
  text-align: center;
}

.vp-creator-how {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #16a34a;
}

.vp-creator-how i {
  font-size: 20px;
  flex-shrink: 0;
}

/* Canvas Summary */
.vp-summary-section {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 30px;
  margin-top: 40px;
}

.vp-summary-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 20px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 20px;
}

.vp-summary-title i {
  font-size: 24px;
  color: #6366f1;
}

.vp-summary-content {
  color: #374151;
  line-height: 1.7;
  font-size: 15px;
}

.vp-summary-content h1,
.vp-summary-content h2,
.vp-summary-content h3,
.vp-summary-content h4 {
  color: #111827;
  margin-top: 20px;
  margin-bottom: 12px;
}

.vp-summary-content ul,
.vp-summary-content ol {
  padding-left: 24px;
  margin: 12px 0;
}

.vp-summary-content li {
  margin-bottom: 8px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  .vp-hero-section {
    padding: 30px 24px;
  }

  .vp-uvp-title {
    font-size: 24px;
  }

  .vp-customer-profile,
  .vp-value-map {
    padding: 20px;
  }

  .vp-section-header h3 {
    font-size: 20px;
  }

  .vp-products-grid {
    grid-template-columns: 1fr;
  }
}

/* =================================================================
   PRODUCT DESCRIPTION STYLES (pd-*)
   Product Description Display Dashboard
   Prefix: pd-
   Réutilise: ma-* pour certains layouts
   ================================================================= */

.product-description-display {
  padding: 0;
}

/* Hero Section with Product Name & Tagline */
.pd-hero-section {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  padding: 60px 40px;
  border-radius: 8px;
  margin-bottom: 40px;
  text-align: center;
}

.pd-hero-content {
  max-width: 900px;
  margin: 0 auto;
}

.pd-product-name {
  font-size: 42px;
  font-weight: 700;
  color: white;
  margin: 0 0 15px 0;
  line-height: 1.2;
}

.pd-tagline {
  font-size: 20px;
  color: rgba(255, 255, 255, 0.95);
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
}

/* Section Styles */
.pd-section {
  margin-bottom: 50px;
}

.pd-section-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 26px;
  font-weight: 700;
  color: #1a202c;
  margin-bottom: 25px;
  padding-bottom: 12px;
  border-bottom: 3px solid #667eea;
}

.pd-section-title i {
  font-size: 28px;
  color: #667eea;
}

.pd-content {
  color: #4a5568;
  line-height: 1.8;
  font-size: 16px;
}

.pd-content h1,
.pd-content h2,
.pd-content h3,
.pd-content h4 {
  color: #2d3748;
  margin-top: 20px;
  margin-bottom: 12px;
}

.pd-content ul,
.pd-content ol {
  padding-left: 28px;
  margin: 15px 0;
}

.pd-content li {
  margin-bottom: 10px;
}

/* Problem & Solution Grid */
.pd-problem-solution-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-bottom: 50px;
}

@media (max-width: 991px) {
  .pd-problem-solution-grid {
    grid-template-columns: 1fr;
  }
}

.pd-problem-card,
.pd-solution-card {
  background: white;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
}

.pd-problem-card:hover,
.pd-solution-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  transform: translateY(-2px);
}

.pd-problem-card {
  border-left: 4px solid #f56565;
}

.pd-solution-card {
  border-left: 4px solid #48bb78;
}

.pd-card-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 15px;
}

.pd-problem-card .pd-card-title {
  color: #f56565;
}

.pd-solution-card .pd-card-title {
  color: #48bb78;
}

.pd-card-title i {
  font-size: 24px;
}

.pd-card-content {
  color: #4a5568;
  line-height: 1.7;
  font-size: 15px;
}

/* Features Section - Using Market Segmentation Style */
.pd-features-section {
  margin-bottom: 40px;
}

.pd-feature-benefit {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px;
  background: #f0fdf4;
  border-left: 3px solid #48bb78;
  border-radius: 4px;
  font-size: 14px;
  color: #2f855a;
  margin-top: 12px;
  font-weight: 500;
}

.pd-feature-benefit i {
  font-size: 16px;
  flex-shrink: 0;
}

/* Technical Specs Section */
.pd-tech-section {
  background: #f7fafc;
  padding: 40px;
  border-radius: 12px;
  border: 2px solid #cbd5e0;
}

.pd-tech-content {
  background: #f7fafc;
  padding: 25px;
  border-radius: 8px;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  .pd-hero-section {
    padding: 40px 24px;
  }

  .pd-product-name {
    font-size: 32px;
  }

  .pd-tagline {
    font-size: 18px;
  }

  .pd-section-title {
    font-size: 22px;
  }
}

/* =================================================================
   MVP DEFINITION DISPLAY
   ================================================================= */

/* Hero Section */
.mvp-hero-section {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  padding: 60px 40px;
  border-radius: 12px;
  margin-bottom: 40px;
  position: relative;
  overflow: hidden;
}

.mvp-hero-section::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
}

.mvp-hero-content {
  position: relative;
  z-index: 1;
  text-align: center;
  max-width: 900px;
  margin: 0 auto;
}

.mvp-hero-icon {
  width: 80px;
  height: 80px;
  background: rgba(255,255,255,0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  backdrop-filter: blur(10px);
}

.mvp-hero-icon i {
  font-size: 40px;
  color: white;
}

.mvp-hero-title {
  color: white;
  font-size: 42px;
  font-weight: 700;
  margin: 0 0 20px 0;
  text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.mvp-vision {
  color: rgba(255,255,255,0.95);
  font-size: 18px;
  line-height: 1.8;
  font-weight: 400;
}

.mvp-vision p {
  margin: 0;
}

/* Context Grid */
.mvp-context-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 30px;
  margin-bottom: 40px;
}

.mvp-context-card {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: transform 0.3s, box-shadow 0.3s;
}

.mvp-context-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
}

.mvp-context-header {
  padding: 20px 25px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: white;
}

.mvp-problem-card .mvp-context-header {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

.mvp-users-card .mvp-context-header {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
}

.mvp-context-header i {
  font-size: 24px;
}

.mvp-context-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

.mvp-context-content {
  padding: 25px;
  line-height: 1.7;
  color: #4a5568;
  font-size: 15px;
}

/* User Journey */
.mvp-journey-section {
  margin-bottom: 40px;
  background: #f8fafc;
  padding: 30px;
  border-radius: 12px;
  border-left: 5px solid #3b82f6;
}

.mvp-journey-content {
  line-height: 1.8;
  color: #4a5568;
  font-size: 15px;
}

/* Core Features Matrix */
.mvp-features-section {
  margin-bottom: 40px;
}

.mvp-priority-matrix {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 25px;
}

.mvp-feature-card {
  background: white;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}

.mvp-feature-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
}

.mvp-feature-card.mvp-priority-critical {
  border: 2px solid #fee2e2;
}

.mvp-feature-card.mvp-priority-critical::before {
  background: linear-gradient(180deg, #ef4444 0%, #dc2626 100%);
}

.mvp-feature-card.mvp-priority-high {
  border: 2px solid #fef3c7;
}

.mvp-feature-card.mvp-priority-high::before {
  background: linear-gradient(180deg, #f59e0b 0%, #d97706 100%);
}

.mvp-feature-card.mvp-priority-medium {
  border: 2px solid #dbeafe;
}

.mvp-feature-card.mvp-priority-medium::before {
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
}

.mvp-feature-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0,0,0,0.12);
}

.mvp-feature-header {
  display: flex;
  gap: 10px;
  margin-bottom: 15px;
  flex-wrap: wrap;
}

.mvp-priority-badge,
.mvp-effort-badge {
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.mvp-priority-badge.badge-critical {
  background: #fee2e2;
  color: #991b1b;
}

.mvp-priority-badge.badge-high {
  background: #fef3c7;
  color: #92400e;
}

.mvp-priority-badge.badge-medium {
  background: #dbeafe;
  color: #1e3a8a;
}

.mvp-effort-badge.effort-low {
  background: #d1fae5;
  color: #065f46;
}

.mvp-effort-badge.effort-medium {
  background: #e0e7ff;
  color: #3730a3;
}

.mvp-effort-badge.effort-high {
  background: #fce7f3;
  color: #831843;
}

.mvp-feature-name {
  font-size: 18px;
  font-weight: 600;
  color: #1f2937;
  margin: 0 0 10px 0;
}

.mvp-feature-desc {
  color: #6b7280;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 15px 0;
}

.mvp-feature-value {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  background: #f5f6fc;
  border-radius: 8px;
  margin-bottom: 10px;
}

.mvp-feature-value i {
  color: #3F51B5;
  font-size: 18px;
  flex-shrink: 0;
  margin-top: 2px;
}

.mvp-feature-value span {
  color: #3F51B5;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
}

.mvp-feature-effort {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 12px;
  background: #ecfdf5;
  border-radius: 6px;
  margin-bottom: 10px;
}

.mvp-feature-effort i {
  color: #3F51B5;
  font-size: 14px;
  margin-top: 2px;
}

.mvp-feature-effort small {
  color: #3F51B5;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
}

.mvp-feature-deps {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid #e5e7eb;
}

.mvp-feature-deps i {
  color: #6b7280;
  font-size: 14px;
  margin-top: 2px;
}

.mvp-feature-deps small {
  color: #6b7280;
  font-size: 12px;
  line-height: 1.5;
}

/* Success Metrics */
.mvp-metrics-section {
  margin-bottom: 40px;
}

.mvp-metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 20px;
}

.mvp-metric-card {
  background: white;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  display: flex;
  gap: 20px;
  align-items: flex-start;
  transition: all 0.3s;
  position: relative;
  overflow: hidden;
}

.mvp-metric-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
}

.mvp-metric-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.1);
}

.mvp-metric-activation::before {
  background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
}

.mvp-metric-engagement::before {
  background: linear-gradient(180deg, #8b5cf6 0%, #7c3aed 100%);
}

.mvp-metric-retention::before {
  background: linear-gradient(180deg, #10b981 0%, #059669 100%);
}

.mvp-metric-satisfaction::before {
  background: linear-gradient(180deg, #f59e0b 0%, #d97706 100%);
}

.mvp-metric-business::before {
  background: linear-gradient(180deg, #ef4444 0%, #dc2626 100%);
}

.mvp-metric-icon {
  width: 50px;
  height: 50px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.mvp-metric-activation .mvp-metric-icon {
  background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
  color: #1e40af;
}

.mvp-metric-engagement .mvp-metric-icon {
  background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);
  color: #5b21b6;
}

.mvp-metric-retention .mvp-metric-icon {
  background: linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%);
  color: #065f46;
}

.mvp-metric-satisfaction .mvp-metric-icon {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  color: #92400e;
}

.mvp-metric-business .mvp-metric-icon {
  background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
  color: #991b1b;
}

.mvp-metric-icon i {
  font-size: 24px;
}

.mvp-metric-content h4 {
  margin: 0 0 8px 0;
  font-size: 14px;
  font-weight: 600;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.mvp-metric-content p {
  margin: 0;
  color: #1f2937;
  font-size: 15px;
  line-height: 1.6;
  font-weight: 500;
}

/* Timeline */
.mvp-timeline-section {
  margin-bottom: 40px;
}

.mvp-timeline-container {
  position: relative;
  padding: 20px 0;
}

.mvp-timeline-container::before {
  content: '';
  position: absolute;
  left: 20px;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
}

.mvp-timeline-phase {
  display: flex;
  gap: 30px;
  margin-bottom: 30px;
  position: relative;
}

.mvp-phase-number {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: 700;
  font-size: 18px;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
  z-index: 1;
  border: 4px solid white;
}

.mvp-phase-content {
  flex: 1;
  background: white;
  border-radius: 12px;
  padding: 20px 25px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: all 0.3s;
}

.mvp-phase-content:hover {
  transform: translateX(5px);
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.mvp-phase-title {
  margin: 0 0 12px 0;
  font-size: 18px;
  font-weight: 600;
  color: #1f2937;
}

.mvp-phase-duration {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: #667eea;
  font-weight: 600;
  font-size: 14px;
}

.mvp-phase-duration i {
  font-size: 16px;
}

.mvp-phase-deliverables {
  color: #6b7280;
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}

.mvp-timeline-summary {
  display: flex;
  gap: 40px;
  margin-top: 30px;
  padding: 20px 25px;
  background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
  border-radius: 12px;
}

.mvp-timeline-total,
.mvp-timeline-launch {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #1f2937;
  font-size: 15px;
}

.mvp-timeline-total i,
.mvp-timeline-launch i {
  color: #667eea;
  font-size: 20px;
}

/* Risk Impact Badges */
.mvp-impact-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-top: 4px;
}

.mvp-impact-badge.impact-high {
  background: #fee2e2;
  color: #991b1b;
}

.mvp-impact-badge.impact-medium {
  background: #fef3c7;
  color: #92400e;
}

.mvp-impact-badge.impact-low {
  background: #d1fae5;
  color: #065f46;
}

.mvp-risk-high {
  background: #fef2f2 !important;
}

.mvp-risk-medium {
  background: #fffbeb !important;
}

.mvp-risk-low {
  background: #f0fdf4 !important;
}

/* Phase Badge for Excluded Features */
.mvp-phase-badge {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Mitigation text styling */
.mvp-mitigation {
  color: #059669 !important;
  margin-top: 8px !important;
}

.mvp-mitigation i {
  margin-right: 6px;
  font-size: 14px;
}

/* Info Cards */
.mvp-info-card {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(16, 28, 61, 0.08);
  transition: all 0.3s;
}

.mvp-info-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(16, 28, 61, 0.12);
}

.mvp-info-header {
  padding: 20px 25px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: white;
}

.mvp-tech-header {
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
}

.mvp-validation-header {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.mvp-info-header i {
  font-size: 24px;
}

.mvp-info-header h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

.mvp-info-content {
  padding: 25px;
  line-height: 1.7;
  color: #4a5568;
  font-size: 15px;
}

/* Responsive */
@media (max-width: 768px) {
  .mvp-hero-title {
    font-size: 32px;
  }

  .mvp-vision {
    font-size: 16px;
  }

  .mvp-context-grid {
    grid-template-columns: 1fr;
  }

  .mvp-priority-matrix {
    grid-template-columns: 1fr;
  }

  .mvp-metrics-grid {
    grid-template-columns: 1fr;
  }

  .mvp-timeline-summary {
    flex-direction: column;
    gap: 15px;
  }

  .mvp-hero-section {
    padding: 40px 24px;
  }
}

/* ============================================
   PRICING STRATEGY STYLES (ps-*)
   ============================================ */

/* Positioning Badge */
.ps-positioning-badge {
  display: inline-block;
  padding: 8px 16px;
  border-radius: 20px;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 16px;
}

.ps-pos-premium {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.ps-pos-mid-market {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  color: white;
}

.ps-pos-low-cost {
  background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
  color: white;
}

/* Pricing Model Badge */
.ps-model-badge {
  display: inline-block;
  padding: 8px 16px;
  border-radius: 20px;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 16px;
  background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
  color: white;
}

/* Tiers Section */
.ps-tiers-section {
  margin-bottom: 40px;
}

.ps-tiers-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.ps-tier-card {
  background: white;
  border: 2px solid #e0e6ed;
  border-radius: 12px;
  padding: 28px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.ps-tier-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.ps-tier-card:hover {
  border-color: #667eea;
  box-shadow: 0 8px 24px rgba(102, 126, 234, 0.15);
  transform: translateY(-4px);
}

.ps-tier-card:hover::before {
  opacity: 1;
}

.ps-tier-highlighted {
  border-color: #667eea;
  box-shadow: 0 12px 32px rgba(102, 126, 234, 0.2);
  transform: scale(1.05);
}

.ps-tier-highlighted::before {
  opacity: 1;
}

.ps-tier-popular-badge {
  position: absolute;
  top: -12px;
  right: 20px;
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  color: white;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: flex;
  align-items: center;
  gap: 4px;
  box-shadow: 0 4px 12px rgba(245, 87, 108, 0.3);
}

.ps-tier-popular-badge i {
  font-size: 13px;
}

.ps-tier-header {
  margin-bottom: 20px;
}

.ps-tier-name {
  font-size: 24px;
  font-weight: 700;
  color: #2d3748;
  margin: 0 0 8px 0;
}

.ps-tier-target {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #718096;
}

.ps-tier-target i {
  font-size: 14px;
}

.ps-tier-price {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 2px solid #edf2f7;
}

.ps-price-amount {
  font-size: 42px;
  font-weight: 700;
  color: #667eea;
  line-height: 1;
}

.ps-price-currency {
  font-size: 18px;
  font-weight: 600;
  color: #4a5568;
}

.ps-price-period {
  font-size: 14px;
  color: #718096;
  margin-left: 4px;
}

.ps-tier-value {
  background: #f7fafc;
  padding: 12px;
  border-radius: 8px;
  font-size: 14px;
  color: #4a5568;
  font-style: italic;
  margin-bottom: 20px;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.ps-tier-value i {
  color: #ecc94b;
  font-size: 16px;
  margin-top: 2px;
}

.ps-tier-features {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.ps-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #4a5568;
}

.ps-feature-item i {
  color: #48bb78;
  font-size: 16px;
  margin-top: 2px;
  flex-shrink: 0;
}

/* Benchmark Section */
.ps-benchmark-section {
  margin-bottom: 40px;
}

.ps-market-range {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  padding: 20px 24px;
  border-radius: 12px;
  margin: 20px 0;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.ps-range-label {
  font-size: 14px;
  font-weight: 500;
  opacity: 0.9;
}

.ps-range-value {
  font-size: 24px;
  font-weight: 700;
}

.ps-analysis-content {
  margin-top: 20px;
  padding: 20px;
  background: #f7fafc;
  border-radius: 8px;
  border-left: 4px solid #667eea;
}

/* Subsection Titles */
.ps-subsection-title {
  font-size: 15px;
  font-weight: 600;
  color: #2d3748;
  margin: 16px 0 8px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.ps-subsection-title:first-child {
  margin-top: 0;
}

/* Sensitivity Badge */
.ps-sensitivity-badge {
  display: inline-block;
  padding: 10px 16px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 16px;
}

.ps-sens-low {
  background: #d1fae5;
  color: #065f46;
}

.ps-sens-medium {
  background: #fef3c7;
  color: #92400e;
}

.ps-sens-high {
  background: #fee2e2;
  color: #991b1b;
}

/* Launch Section */
.ps-launch-section {
  margin-bottom: 40px;
}

/* Projections Section */
.ps-projections-section {
  margin-bottom: 40px;
}

/* Responsive */
@media (max-width: 768px) {
  .ps-tiers-grid {
    grid-template-columns: 1fr;
  }

  .ps-tier-highlighted {
    transform: none;
  }

  .ps-price-amount {
    font-size: 36px;
  }

  .ps-market-range {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}

/* ============================================
   REVENUE STREAMS STYLES (rs-*)
   ============================================ */

/* Overview Section */
.rs-overview-section {
  margin-bottom: 40px;
}

.rs-model-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 24px;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 20px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.rs-model-badge i {
  font-size: 18px;
}

.rs-model-rationale {
  background: #f7fafc;
  padding: 16px 20px;
  border-radius: 8px;
  border-left: 4px solid #667eea;
  margin-bottom: 16px;
}

/* Streams Section */
.rs-streams-section {
  margin-bottom: 40px;
}

.rs-streams-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.rs-stream-card {
  background: white;
  border: 2px solid #e0e6ed;
  border-radius: 12px;
  padding: 24px;
  transition: all 0.3s ease;
}

.rs-stream-card:hover {
  border-color: #667eea;
  box-shadow: 0 8px 24px rgba(102, 126, 234, 0.12);
  transform: translateY(-4px);
}

.rs-growth-high {
  border-left: 4px solid #48bb78;
}

.rs-growth-medium {
  border-left: 4px solid #ed8936;
}

.rs-growth-low {
  border-left: 4px solid #a0aec0;
}

.rs-stream-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
}

.rs-stream-number {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 16px;
}

.rs-stream-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.rs-type-badge {
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 600;
  background: #edf2f7;
  color: #4a5568;
}

.rs-growth-badge {
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 600;
}

.rs-growth-badge.rs-growth-high {
  background: #c6f6d5;
  color: #22543d;
}

.rs-growth-badge.rs-growth-medium {
  background: #feebc8;
  color: #7c2d12;
}

.rs-growth-badge.rs-growth-low {
  background: #e2e8f0;
  color: #2d3748;
}

.rs-stream-name {
  font-size: 20px;
  font-weight: 700;
  color: #2d3748;
  margin: 0 0 12px 0;
}

.rs-stream-description {
  color: #4a5568;
  margin-bottom: 16px;
  line-height: 1.6;
}

.rs-stream-details {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 16px;
  border-top: 1px solid #e2e8f0;
}

.rs-detail-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #4a5568;
}

.rs-detail-item i {
  color: #667eea;
  font-size: 16px;
  margin-top: 2px;
  flex-shrink: 0;
}

/* Metrics Section */
.rs-metrics-section {
  margin-bottom: 40px;
}

.rs-metrics-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  margin-top: 24px;
}

.rs-metric-card {
  background: white;
  border-radius: 12px;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  border: 2px solid #e0e6ed;
  transition: all 0.3s ease;
}

.rs-metric-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.rs-metric-icon {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}

.rs-metric-primary .rs-metric-icon {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.rs-metric-success .rs-metric-icon {
  background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
  color: white;
}

.rs-metric-warning .rs-metric-icon {
  background: linear-gradient(135deg, #ed8936 0%, #dd6b20 100%);
  color: white;
}

.rs-metric-info .rs-metric-icon {
  background: linear-gradient(135deg, #4299e1 0%, #3182ce 100%);
  color: white;
}

.rs-metric-neutral .rs-metric-icon {
  background: linear-gradient(135deg, #718096 0%, #4a5568 100%);
  color: white;
}

.rs-metric-content {
  flex: 1;
}

.rs-metric-label {
  font-size: 13px;
  color: #718096;
  font-weight: 500;
  margin-bottom: 4px;
}

.rs-metric-value {
  font-size: 20px;
  font-weight: 700;
  color: #2d3748;
}

/* Projections Section */
.rs-projections-section {
  margin-bottom: 40px;
}

.rs-projections-timeline {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 24px;
}

.rs-projection-card {
  background: white;
  border: 2px solid #e0e6ed;
  border-radius: 12px;
  padding: 24px;
  transition: all 0.3s ease;
}

.rs-projection-card:hover {
  border-color: #667eea;
  box-shadow: 0 8px 20px rgba(102, 126, 234, 0.1);
}

.rs-year-1 {
  border-left: 4px solid #48bb78;
}

.rs-year-2 {
  border-left: 4px solid #4299e1;
}

.rs-year-3 {
  border-left: 4px solid #9f7aea;
}

.rs-projection-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 2px solid #edf2f7;
}

.rs-projection-year {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 700;
  color: #2d3748;
}

.rs-projection-year i {
  color: #667eea;
  font-size: 20px;
}

.rs-projection-total {
  font-size: 28px;
  font-weight: 700;
  color: #667eea;
}

.rs-projection-breakdown {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 20px;
}

.rs-breakdown-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rs-breakdown-bar {
  height: 8px;
  background: #edf2f7;
  border-radius: 4px;
  overflow: hidden;
}

.rs-breakdown-fill {
  height: 100%;
  background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
  border-radius: 4px;
  transition: width 0.5s ease;
}

.rs-breakdown-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
}

.rs-breakdown-stream {
  font-weight: 600;
  color: #2d3748;
}

.rs-breakdown-amount {
  color: #667eea;
  font-weight: 600;
}

.rs-projection-assumptions {
  background: #f7fafc;
  padding: 16px;
  border-radius: 8px;
  font-size: 14px;
  color: #4a5568;
  line-height: 1.6;
}

/* Diversification & Monetization */
.rs-diversification-section,
.rs-monetization-section {
  margin-bottom: 40px;
}

/* Responsive */
@media (max-width: 768px) {
  .rs-streams-grid {
    grid-template-columns: 1fr;
  }

  .rs-metrics-grid {
    grid-template-columns: 1fr;
  }

  .rs-projection-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .rs-projection-total {
    font-size: 24px;
  }
}

/* ============================================
   COST STRUCTURE STYLES (cs-*)
   ============================================ */

/* Overview Section */
.cs-overview-section {
  margin-bottom: 40px;
}

.cs-strategy-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 24px;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 20px;
  color: white;
}

.cs-strategy-badge i {
  font-size: 18px;
}

.cs-strategy-cost-driven {
  background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
}

.cs-strategy-value-driven {
  background: linear-gradient(135deg, #9f7aea 0%, #805ad5 100%);
}

.cs-strategy-balanced {
  background: linear-gradient(135deg, #4299e1 0%, #3182ce 100%);
}

.cs-strategy-rationale {
  background: #f7fafc;
  padding: 16px 20px;
  border-radius: 8px;
  border-left: 4px solid #667eea;
  margin-bottom: 16px;
}

/* Costs Grid */
.cs-costs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
  gap: 32px;
  margin-bottom: 40px;
}

.cs-costs-section {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  border: 2px solid #e0e6ed;
}

.cs-section-header {
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 700;
  font-size: 18px;
  color: white;
}

.cs-section-header i {
  font-size: 22px;
}

.cs-fixed-header {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.cs-variable-header {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}

.cs-costs-list {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cs-cost-item {
  background: #f7fafc;
  padding: 16px;
  border-radius: 8px;
  border-left: 4px solid #cbd5e0;
  transition: all 0.3s ease;
}

.cs-cost-item:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transform: translateX(4px);
}

.cs-criticality-critical {
  border-left-color: #e53e3e;
  background: #fff5f5;
}

.cs-criticality-high {
  border-left-color: #ed8936;
  background: #fffaf0;
}

.cs-criticality-medium {
  border-left-color: #4299e1;
  background: #ebf8ff;
}

.cs-criticality-low {
  border-left-color: #48bb78;
  background: #f0fff4;
}

.cs-cost-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.cs-cost-category {
  font-size: 16px;
  font-weight: 700;
  color: #2d3748;
  margin: 0;
}

.cs-criticality-badge {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.cs-criticality-badge.cs-criticality-critical {
  background: #feb2b2;
  color: #742a2a;
}

.cs-criticality-badge.cs-criticality-high {
  background: #fbd38d;
  color: #7c2d12;
}

.cs-criticality-badge.cs-criticality-medium {
  background: #90cdf4;
  color: #1e3a8a;
}

.cs-criticality-badge.cs-criticality-low {
  background: #9ae6b4;
  color: #22543d;
}

.cs-cost-description {
  color: #4a5568;
  margin: 0 0 12px 0;
  line-height: 1.5;
  font-size: 14px;
}

.cs-cost-amounts {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.cs-amount-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #2d3748;
}

.cs-amount-item i {
  color: #667eea;
  font-size: 16px;
}

.cs-optimization,
.cs-scalability {
  background: white;
  padding: 12px;
  border-radius: 6px;
  margin-top: 8px;
  font-size: 13px;
  color: #4a5568;
  border: 1px dashed #cbd5e0;
}

.cs-volume {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  font-size: 13px;
  color: #4a5568;
  font-style: italic;
}

.cs-volume i {
  color: #667eea;
}

/* Cost Breakdown */
.cs-breakdown-section {
  margin-bottom: 40px;
}

.cs-breakdown-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
  margin-top: 24px;
}

.cs-breakdown-card {
  background: white;
  border: 2px solid #e0e6ed;
  border-radius: 12px;
  padding: 20px;
  transition: all 0.3s ease;
}

.cs-breakdown-card:hover {
  border-color: #667eea;
  box-shadow: 0 8px 20px rgba(102, 126, 234, 0.1);
  transform: translateY(-4px);
}

.cs-breakdown-icon {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-bottom: 16px;
  color: white;
}

.cs-icon-personnel {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.cs-icon-infrastructure {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}

.cs-icon-marketing {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}

.cs-icon-operations {
  background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
}

.cs-icon-rd {
  background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
}

.cs-icon-other {
  background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
}

.cs-breakdown-content h4 {
  font-size: 14px;
  font-weight: 600;
  color: #718096;
  margin: 0 0 8px 0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.cs-breakdown-amount {
  font-size: 24px;
  font-weight: 700;
  color: #2d3748;
  margin-bottom: 4px;
}

.cs-breakdown-percentage {
  font-size: 14px;
  color: #667eea;
  font-weight: 600;
  margin-bottom: 12px;
}

.cs-breakdown-details {
  font-size: 13px;
  color: #4a5568;
  line-height: 1.5;
}

/* Break-even Section */
.cs-breakeven-section {
  margin-bottom: 40px;
}

.cs-breakeven-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
  margin-top: 24px;
}

.cs-breakeven-card {
  background: white;
  border-radius: 12px;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  border: 2px solid #e0e6ed;
  transition: all 0.3s ease;
}

.cs-breakeven-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.cs-breakeven-icon {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}

.cs-primary .cs-breakeven-icon {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}

.cs-success .cs-breakeven-icon {
  background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
  color: white;
}

.cs-warning .cs-breakeven-icon {
  background: linear-gradient(135deg, #ed8936 0%, #dd6b20 100%);
  color: white;
}

.cs-info .cs-breakeven-icon {
  background: linear-gradient(135deg, #4299e1 0%, #3182ce 100%);
  color: white;
}

.cs-breakeven-content {
  flex: 1;
}

.cs-breakeven-label {
  font-size: 13px;
  color: #718096;
  font-weight: 500;
  margin-bottom: 4px;
}

.cs-breakeven-value {
  font-size: 20px;
  font-weight: 700;
  color: #2d3748;
}

/* Profitability Section */
.cs-profitability-section {
  margin-bottom: 40px;
}

/* Projections */
.cs-projections-section {
  margin-bottom: 40px;
}

.cs-projection-amounts {
  background: #f7fafc;
  padding: 12px;
  border-radius: 8px;
  margin-bottom: 12px;
}

.cs-proj-total {
  font-size: 16px;
  color: #2d3748;
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e2e8f0;
}

.cs-proj-item {
  font-size: 14px;
  color: #4a5568;
  margin-bottom: 4px;
}

/* Runway */
.cs-runway-metric {
  padding: 10px 0;
  border-bottom: 1px solid #e2e8f0;
  font-size: 14px;
  color: #4a5568;
}

.cs-runway-metric:last-of-type {
  border-bottom: none;
}

.cs-runway-highlight {
  background: #ebf8ff;
  padding: 12px;
  border-radius: 6px;
  margin: 8px 0;
  font-size: 16px;
  color: #2c5282;
  border-left: 4px solid #4299e1;
}

/* Responsive */
@media (max-width: 768px) {
  .cs-costs-grid {
    grid-template-columns: 1fr;
  }

  .cs-breakdown-grid {
    grid-template-columns: 1fr;
  }

  .cs-breakeven-metrics {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   BUYER PERSONAS (bp-*)
   ======================================== */

.buyer-personas-display {
  padding: 20px 0;
}

/* Summary Section */
.bp-summary-section {
  margin-bottom: 40px;
  padding: 30px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 12px;
  color: white;
}

.bp-primary-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 30px;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 15px;
  backdrop-filter: blur(10px);
}

.bp-primary-badge i {
  font-size: 16px;
}

.bp-summary {
  font-size: 16px;
  line-height: 1.6;
  opacity: 0.95;
}

/* Personas Grid */
.bp-personas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
  gap: 30px;
  margin: 30px 0;
}

.bp-persona-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 30px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.07);
  border: 2px solid #e2e8f0;
  transition: all 0.3s ease;
}

.bp-persona-card:hover {
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
  transform: translateY(-4px);
}

.bp-persona-primary {
  border-color: #667eea;
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.2);
}

/* Persona Header */
.bp-persona-header {
  display: flex;
  gap: 20px;
  margin-bottom: 30px;
  padding-bottom: 25px;
  border-bottom: 2px solid #edf2f7;
}

.bp-persona-avatar {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(102, 126, 234, 0.3);
}

.bp-persona-intro {
  flex: 1;
}

.bp-persona-name {
  font-size: 24px;
  font-weight: 700;
  color: #1a202c;
  margin: 0 0 5px 0;
}

.bp-persona-role {
  font-size: 14px;
  color: #667eea;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

.bp-persona-job {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #4a5568;
  font-size: 14px;
  margin-bottom: 10px;
}

.bp-persona-job i {
  color: #667eea;
}

.bp-persona-quote {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding: 12px;
  background: #f7fafc;
  border-left: 3px solid #667eea;
  border-radius: 6px;
  font-size: 13px;
  color: #2d3748;
  line-height: 1.5;
}

.bp-persona-quote i {
  color: #667eea;
  font-size: 16px;
  flex-shrink: 0;
  margin-top: 2px;
}

/* Section */
.bp-section {
  margin-bottom: 25px;
}

.bp-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 700;
  color: #2d3748;
  margin: 0 0 15px 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #e2e8f0;
}

.bp-section-title i {
  color: #667eea;
  font-size: 18px;
}

/* Demographics */
.bp-demo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}

.bp-demo-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bp-demo-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #718096;
  font-weight: 600;
}

.bp-demo-value {
  font-size: 14px;
  color: #2d3748;
  font-weight: 500;
}

/* Lists */
.bp-list-group {
  margin-bottom: 15px;
}

.bp-list-label {
  font-weight: 600;
  color: #2d3748;
  margin-bottom: 8px;
  font-size: 14px;
}

.bp-list {
  list-style: none;
  padding: 0;
  margin: 8px 0 0 0;
}

.bp-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 0;
  font-size: 14px;
  color: #4a5568;
  line-height: 1.5;
}

.bp-list li i {
  color: #667eea;
  font-size: 14px;
  margin-top: 3px;
  flex-shrink: 0;
}

.bp-list-frustrations li i {
  color: #f56565;
}

.bp-list-objections li i {
  color: #ed8936;
}

.bp-list-inline {
  list-style: none;
  padding: 0;
  margin: 8px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.bp-list-inline li {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: #edf2f7;
  border-radius: 6px;
  font-size: 13px;
  color: #2d3748;
}

.bp-list-inline li i {
  color: #667eea;
  font-size: 12px;
}

/* Tags */
.bp-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.bp-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: #edf2f7;
  color: #2d3748;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 500;
  transition: all 0.2s;
}

.bp-tag:hover {
  background: #e2e8f0;
}

.bp-tag-channel {
  background: linear-gradient(135deg, #667eea20, #764ba220);
  color: #5a67d8;
  border: 1px solid #667eea40;
}

.bp-tag-channel i {
  font-size: 12px;
}

/* Badges */
.bp-badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.bp-tech-low {
  background: #fed7d7;
  color: #742a2a;
}

.bp-tech-medium {
  background: #feebc8;
  color: #7c2d12;
}

.bp-tech-high {
  background: #c6f6d5;
  color: #22543d;
}

.bp-loyalty-low {
  background: #fed7d7;
  color: #742a2a;
}

.bp-loyalty-medium {
  background: #feebc8;
  color: #7c2d12;
}

.bp-loyalty-high {
  background: #c6f6d5;
  color: #22543d;
}

.bp-speed-impulsive {
  background: #fbb6ce;
  color: #702459;
}

.bp-speed-considered {
  background: #bee3f8;
  color: #2c5282;
}

.bp-speed-very_slow {
  background: #e9d8fd;
  color: #44337a;
}

/* Behaviors */
.bp-behavior-block {
  margin-bottom: 15px;
  padding: 12px;
  background: #f7fafc;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: #4a5568;
}

.bp-behavior-block strong {
  color: #2d3748;
  display: block;
  margin-bottom: 6px;
}

.bp-behavior-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  margin-top: 15px;
}

.bp-badge-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.bp-badge-label {
  font-size: 13px;
  color: #718096;
  font-weight: 500;
}

/* Buying Journey */
.bp-journey-steps {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.bp-journey-step {
  display: flex;
  gap: 15px;
  padding: 15px;
  background: #f7fafc;
  border-radius: 10px;
  border-left: 4px solid #cbd5e0;
  transition: all 0.3s;
}

.bp-journey-step:hover {
  background: #edf2f7;
  border-left-color: #667eea;
}

.bp-journey-icon {
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: white;
}

.bp-journey-awareness {
  background: linear-gradient(135deg, #4299e1, #3182ce);
}

.bp-journey-consideration {
  background: linear-gradient(135deg, #9f7aea, #805ad5);
}

.bp-journey-decision {
  background: linear-gradient(135deg, #48bb78, #38a169);
}

.bp-journey-retention {
  background: linear-gradient(135deg, #ed8936, #dd6b20);
}

.bp-journey-content {
  flex: 1;
}

.bp-journey-content h5 {
  margin: 0 0 8px 0;
  font-size: 15px;
  font-weight: 700;
  color: #2d3748;
}

.bp-journey-content p {
  margin: 0;
  font-size: 14px;
  color: #4a5568;
  line-height: 1.6;
}

/* Description */
.bp-description {
  margin-top: 25px;
  padding-top: 20px;
  border-top: 2px dashed #e2e8f0;
}

.bp-description p {
  font-size: 14px;
  line-height: 1.7;
  color: #4a5568;
  margin-bottom: 12px;
}

.bp-description strong {
  color: #2d3748;
}

/* Comparison Section */
.bp-comparison-section {
  margin-top: 50px;
  padding-top: 30px;
  border-top: 3px solid #e2e8f0;
}

.margin-top-15 {
  margin-top: 15px;
}

/* Responsive */
@media (max-width: 768px) {
  .bp-personas-grid {
    grid-template-columns: 1fr;
  }

  .bp-persona-header {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .bp-demo-grid {
    grid-template-columns: 1fr;
  }

  .bp-journey-step {
    flex-direction: column;
  }

  .bp-journey-icon {
    align-self: flex-start;
  }
}

/* ============================================ */
/* SWOT ANALYSIS STYLES */
/* ============================================ */

/* Summary Section */
.swot-summary-section {
  margin-bottom: 40px;
  padding: 30px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 12px;
  color: white;
}

.swot-scores-container {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.swot-score-card {
  display: flex;
  align-items: center;
  gap: 15px;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(10px);
  padding: 15px 20px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.swot-score-icon {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: white;
}

.swot-strengths-icon {
  background: linear-gradient(135deg, #48bb78, #38a169);
}

.swot-opportunities-icon {
  background: linear-gradient(135deg, #4299e1, #3182ce);
}

.swot-score-label {
  font-size: 12px;
  opacity: 0.9;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.swot-score-value {
  font-size: 24px;
  font-weight: 700;
}

.swot-position-badge {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
}

.swot-position-offensive {
  border-color: #48bb78;
  background: linear-gradient(135deg, rgba(72, 187, 120, 0.3), rgba(56, 161, 105, 0.3));
}

.swot-position-defensive {
  border-color: #ed8936;
  background: linear-gradient(135deg, rgba(237, 137, 54, 0.3), rgba(221, 107, 32, 0.3));
}

.swot-position-reorientation {
  border-color: #4299e1;
  background: linear-gradient(135deg, rgba(66, 153, 225, 0.3), rgba(49, 130, 206, 0.3));
}

.swot-position-survival {
  border-color: #fc8181;
  background: linear-gradient(135deg, rgba(252, 129, 129, 0.3), rgba(245, 101, 101, 0.3));
}

.swot-summary {
  font-size: 16px;
  line-height: 1.6;
  opacity: 0.95;
}

/* SWOT Matrix */
.swot-matrix {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-bottom: 40px;
}

.swot-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.swot-quadrant {
  background: white;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  border: 2px solid;
  min-height: 300px;
}

.swot-quadrant-strengths {
  border-color: #48bb78;
}

.swot-quadrant-weaknesses {
  border-color: #ed8936;
}

.swot-quadrant-opportunities {
  border-color: #4299e1;
}

.swot-quadrant-threats {
  border-color: #e53e3e;
}

.swot-quadrant-header {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 2px solid #e8e8e8;
}

.swot-quadrant-header i {
  font-size: 24px;
  margin-bottom: 5px;
}

.swot-quadrant-strengths .swot-quadrant-header i {
  color: #48bb78;
}

.swot-quadrant-weaknesses .swot-quadrant-header i {
  color: #ed8936;
}

.swot-quadrant-opportunities .swot-quadrant-header i {
  color: #4299e1;
}

.swot-quadrant-threats .swot-quadrant-header i {
  color: #e53e3e;
}

.swot-quadrant-header h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #333;
}

.swot-quadrant-subtitle {
  font-size: 12px;
  color: #999;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.swot-items-container {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.swot-item {
  padding: 15px;
  border-radius: 8px;
  background: #f9f9f9;
  border-left: 4px solid;
  transition: all 0.3s ease;
}

.swot-item:hover {
  transform: translateX(5px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.swot-item-strength {
  border-left-color: #48bb78;
  background: linear-gradient(135deg, rgba(72, 187, 120, 0.05), rgba(56, 161, 105, 0.05));
}

.swot-item-weakness {
  border-left-color: #ed8936;
  background: linear-gradient(135deg, rgba(237, 137, 54, 0.05), rgba(221, 107, 32, 0.05));
}

.swot-item-opportunity {
  border-left-color: #4299e1;
  background: linear-gradient(135deg, rgba(66, 153, 225, 0.05), rgba(49, 130, 206, 0.05));
}

.swot-item-threat {
  border-left-color: #e53e3e;
  background: linear-gradient(135deg, rgba(229, 62, 62, 0.05), rgba(197, 48, 48, 0.05));
}

.swot-item-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
}

.swot-item-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.swot-item-title {
  font-weight: 600;
  font-size: 15px;
  color: #333;
  flex: 1;
}

.swot-item-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

/* Badges */
.swot-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  white-space: nowrap;
}

.swot-impact-badge.swot-impact-high {
  background: #e53e3e;
  color: white;
}

.swot-impact-badge.swot-impact-medium {
  background: #ed8936;
  color: white;
}

.swot-impact-badge.swot-impact-low {
  background: #ecc94b;
  color: #744210;
}

.swot-category-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 500;
  background: #e8e8e8;
  color: #666;
}

.swot-timeframe-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  background: #4299e1;
  color: white;
}

.swot-likelihood-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  color: white;
}

.swot-likelihood-high {
  background: #e53e3e;
}

.swot-likelihood-medium {
  background: #ed8936;
}

.swot-likelihood-low {
  background: #48bb78;
}

/* Strategic Recommendations */
.swot-recommendations-section {
  margin-top: 40px;
}

.swot-recommendations-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.swot-recommendation-card {
  background: white;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  border: 2px solid #e8e8e8;
  transition: all 0.3s ease;
}

.swot-recommendation-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.swot-rec-priority-high {
  border-color: #e53e3e;
}

.swot-rec-priority-medium {
  border-color: #ed8936;
}

.swot-rec-priority-low {
  border-color: #4299e1;
}

.swot-rec-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
  gap: 10px;
}

.swot-rec-type-badge {
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  color: white;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.swot-rec-type-SO {
  background: linear-gradient(135deg, #48bb78, #38a169);
}

.swot-rec-type-WO {
  background: linear-gradient(135deg, #4299e1, #3182ce);
}

.swot-rec-type-ST {
  background: linear-gradient(135deg, #ed8936, #dd6b20);
}

.swot-rec-type-WT {
  background: linear-gradient(135deg, #e53e3e, #c53030);
}

.swot-priority-badge.swot-priority-high {
  background: #e53e3e;
  color: white;
}

.swot-priority-badge.swot-priority-medium {
  background: #ed8936;
  color: white;
}

.swot-priority-badge.swot-priority-low {
  background: #4299e1;
  color: white;
}

.swot-rec-title {
  font-size: 16px;
  font-weight: 700;
  color: #333;
  margin: 0 0 10px 0;
}

.swot-rec-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

/* Responsive */
@media (max-width: 768px) {
  .swot-row {
    grid-template-columns: 1fr;
  }

  .swot-scores-container {
    flex-direction: column;
    align-items: stretch;
  }

  .swot-score-card {
    width: 100%;
  }

  .swot-recommendations-grid {
    grid-template-columns: 1fr;
  }
}

/* ============================================ */
/* LEGAL CONSTRAINTS STYLES */
/* ============================================ */

/* Summary Section */
.lc-summary-section {
  margin-bottom: 30px;
  padding: 25px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 12px;
  color: white;
  font-size: 15px;
  line-height: 1.6;
}

/* Critical Alerts */
.lc-alerts-section {
  margin-bottom: 40px;
}

.lc-alerts-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.lc-alert-card {
  padding: 20px;
  border-radius: 10px;
  border-left: 4px solid;
  background: white;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.lc-alert-high {
  border-left-color: #e74c3c;
  background: linear-gradient(135deg, rgba(231, 76, 60, 0.05), rgba(231, 76, 60, 0.02));
}

.lc-alert-medium {
  border-left-color: #f39c12;
  background: linear-gradient(135deg, rgba(243, 156, 18, 0.05), rgba(243, 156, 18, 0.02));
}

.lc-alert-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.lc-alert-header i {
  font-size: 20px;
  color: #e74c3c;
}

.lc-alert-medium .lc-alert-header i {
  color: #f39c12;
}

.lc-alert-header h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: #333;
  flex: 1;
}

.lc-alert-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
  margin-bottom: 10px;
}

.lc-alert-deadline {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #555;
  padding-top: 10px;
  border-top: 1px solid #eee;
}

.lc-alert-deadline i {
  color: #3498db;
}

/* Licenses & Permits */
.lc-section-margin {
  margin-top: 40px;
}

.lc-permits-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.lc-permit-card {
  background: white;
  border-radius: 10px;
  border: 1px solid #e0e0e0;
  overflow: hidden;
  transition: all 0.3s ease;
}

.lc-permit-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.lc-permit-header {
  background: linear-gradient(135deg, #3498db, #2980b9);
  color: white;
  padding: 15px;
}

.lc-permit-header h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
}

.lc-permit-body {
  padding: 15px;
}

.lc-permit-info {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  font-size: 14px;
  color: #555;
}

.lc-permit-info i {
  color: #3498db;
  font-size: 16px;
}

.lc-permit-description {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #eee;
  font-size: 13px;
  line-height: 1.6;
  color: #666;
}

/* Recommendations */
.lc-recommendations-list {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.lc-recommendation-item {
  background: white;
  border-radius: 10px;
  padding: 18px;
  border-left: 4px solid #3498db;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
}

.lc-recommendation-item:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.lc-priority-high {
  border-left-color: #e74c3c;
}

.lc-priority-medium {
  border-left-color: #f39c12;
}

.lc-priority-low {
  border-left-color: #27ae60;
}

.lc-rec-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 15px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.lc-rec-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
}

.lc-rec-title-row i {
  color: #3498db;
  font-size: 16px;
}

.lc-rec-title-row h4 {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  color: #333;
}

.lc-rec-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.lc-timeline-badge {
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  background: #ecf0f1;
  color: #555;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.lc-rec-description {
  font-size: 14px;
  line-height: 1.6;
  color: #666;
}

/* Responsive */
@media (max-width: 768px) {
  .lc-alerts-grid,
  .lc-permits-grid {
    grid-template-columns: 1fr;
  }

  .lc-rec-header {
    flex-direction: column;
    align-items: flex-start;
  }
}
