:root {
  --fp-orange: #ff7426;
  --fp-orange-light: #ffebdf;
  --fp-teal: #1cb59b;
  --fp-dark: #1a1a1a;
  --fp-gradient: linear-gradient(90deg, #ff7426 0%, #1cb59b 100%);
  --fp-gradient-card: linear-gradient(135deg, #ff9a5a 0%, #29d8ba 100%);
  --ricec-orange: #ff7426;
  --ricec-orange-light: #fff0e6;
  --ricec-bg-light: #f8f9fa;
  --ricec-navy: #0a2540;
  --ricec-bg-bottom: #f4f7f6;
  --ricec-dark: #1a1a1a;
}

body { 
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
  color: #333; 
  background-color: #fcfcfc; 
}

/* ==========================================
    1. UTILITY CLASSES
    ========================================== */
.transition-all { transition: all 0.4s ease-in-out; }
.text-orange { color: var(--fp-orange) !important; }
.bg-orange { background-color: var(--fp-orange) !important; }
.bg-orange-soft { background-color: var(--ricec-orange-light) !important; }
.bg-gradient-custom { background: var(--fp-gradient); }

/* Typography Utilities */
.section-title { font-weight: 800; font-size: 2rem; margin-bottom: 1rem; text-align: center; }
.letter-spacing-1 { letter-spacing: 1px; }
.letter-spacing-1-5 { letter-spacing: 1.5px; }
.text-lead-custom { font-size: 1.05rem; line-height: 1.8; }

/* Layout Utilities */
.max-w-400 { max-width: 400px; margin-left: auto; margin-right: auto; }
.max-w-600 { max-width: 600px; margin-left: auto; margin-right: auto; }
.max-w-650 { max-width: 650px; margin-left: auto; margin-right: auto; }
.max-w-900 { max-width: 900px; margin-left: auto; margin-right: auto; }
.max-w-1050 { max-width: 1050px; margin-left: auto; margin-right: auto; }

/* ==========================================
    2. COMPONENTS (Buttons & Badges)
    ========================================== */
.btn-orange { background-color: var(--fp-orange); color: white; border-radius: 25px; padding: 10px 30px; font-weight: 600; border: none; }
.btn-orange:hover { background-color: #e6661f; color: white; }

.btn-outline-white { border: 2px solid white; color: white; border-radius: 25px; padding: 8px 30px; font-weight: 600; background: transparent; }
.btn-outline-white:hover { background: white; color: var(--fp-dark); }

.btn-orange-solid { background: var(--ricec-orange); color: white; border: 2px solid var(--ricec-orange); transition: all 0.3s; }
.btn-orange-solid:hover { background: #e6661f; border-color: #e6661f; color: white; box-shadow: 0 5px 15px rgba(255, 116, 38, 0.3); }

.btn-orange-outline { background: transparent; color: var(--ricec-orange); border: 2px solid var(--ricec-orange); transition: all 0.3s; }
.btn-orange-outline:hover { background: var(--ricec-orange-light); color: var(--ricec-orange); }

.badge-custom { background: rgba(255, 116, 38, 0.1); color: var(--fp-orange); font-size: 0.75rem; }

.icon-card { background: white; border-radius: 15px; padding: 30px; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,0.05); transition: transform 0.3s; border: 1px solid #eee; height: 100%; }
.icon-card:hover { transform: translateY(-5px); border-color: var(--fp-orange); }





/* ==========================================
    16. POPUP MODAL & WHATSAPP
    ========================================== */


