:root {
         --bg: #ffffff;
         --light-bg: #f8f9fa;
         --dark: #242424;
         --accent: #ff6600;
         --accent2: #ef9836;
         --muted: #6b6b6b;
         --border-color: #e9ecef;
         --danger: #e74c3c;
     }

     .section {
         padding: 90px 0;
         text-align: center;
     }

     .plateform-section-title {
         font-size: 42px;
         font-weight: 700;
         margin-bottom: 15px;
     }

     .section-subtitle {
         font-size: 18px;
         color: var(--muted);
         max-width: 700px;
         margin: 0 auto 60px auto;
         line-height: 1.7;
     }

     .highlight {
         color: var(--accent);
     }

     @keyframes fadeInUp {
         from {
             opacity: 0;
             transform: translateY(40px);
         }

         to {
             opacity: 1;
             transform: translateY(0);
         }
     }

     .animate-on-scroll {
         opacity: 0;
         animation: fadeInUp 0.8s ease-out forwards;
         animation-play-state: paused;
     }

     .animate-on-scroll.in-view {
         animation-play-state: running;
     }

     .lifecycle-section {
         background-color: var(--light-bg);
     }

     .lifecycle-grid {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
         gap: 1.5rem;
         text-align: left;
         max-width: 100%;
         margin: 0 auto;
     }

     .lifecycle-card {
         background: linear-gradient(135deg, #fff7f0, #fde2cf);
         border-radius: 12px;
         padding: 2rem;
         transition: all 0.3s ease;
         border: 1px solid #fae5d9;
         text-align: center;
     }

     .lifecycle-card i {
         font-size: 2rem;
         color: var(--accent);
         margin-bottom: 1rem;
         transition: color 0.3s ease;
         display: block;
     }

     .lifecycle-card h3 {
         font-size: 1.2rem;
         font-weight: 700;
         margin-bottom: 0.5rem;
         color: var(--dark);
         transition: color 0.3s ease;
     }

     .lifecycle-card p {
         font-size: 0.95rem;
         color: var(--muted);
         line-height: 1.6;
         transition: color 0.3s ease;
     }

     .lifecycle-card:hover {
         background: var(--accent);
         transform: translateY(-5px);
         box-shadow: 0 10px 20px rgba(205, 102, 64, 0.2);
         border-color: var(--accent);
     }

     .lifecycle-card:hover i,
     .lifecycle-card:hover h3 {
         color: white;
     }

     .lifecycle-card:hover p {
         color: rgba(255, 255, 255, 0.9);
     }

     .solutions-header {
         text-align: center;
         max-width: 800px;
         margin: 0 auto 3rem;
     }

     .solutions-header h2 {
         font-size: 2.5rem;
         font-weight: 700;
         margin: 0 0 .25rem;
     }

     .solutions-subtitle {
         color: var(--muted);
         margin: 0 auto;
         font-size: 18px;
         line-height: 1.7;
     }

     .solution-tabs {
         display: flex;
         flex-wrap: wrap;
         gap: 12px;
         justify-content: center;
         max-width: 960px;
         margin: 0 auto 40px;
     }

     .solution-tabs .tab {
         border: 2px solid rgba(0, 0, 0, .08);
         background: #fff;
         color: var(--dark);
         font-family: 'Montserrat', sans-serif;
         font-weight: 600;
         font-size: 15px;
         padding: 12px 20px;
         border-radius: 999px;
         cursor: pointer;
         transition: all .2s ease;
         display: inline-flex;
         align-items: center;
         gap: 8px;
         box-shadow: 0 2px 6px rgba(0, 0, 0, .06);
     }

     .solution-tabs .tab:hover,
     .solution-tabs .tab:focus-visible {
         outline: none;
         border-color: var(--accent);
         background: rgba(205, 102, 64, .10);
         transform: translateY(-2px);
     }

     .solution-tabs .tab.active {
         background: linear-gradient(90deg, var(--accent), var(--accent2));
         color: #fff;
         border-color: transparent;
         box-shadow: 0 8px 18px rgba(205, 102, 64, .28);
         transform: translateY(-2px);
     }

     .solution-card-wrapper {
         position: relative;
     }

     .solution-card {
         display: none;
         gap: 40px;
         align-items: center;
         background: linear-gradient(135deg, #ffffff, #fff0e6);
         border: 1px solid rgba(0, 0, 0, .06);
         border-radius: 16px;
         box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
         padding: 40px;
         animation: sol-fade .5s ease;
         text-align: left;
     }

     @keyframes sol-fade {
         from {
             opacity: 0;
             transform: translateY(10px);
         }

         to {
             opacity: 1;
             transform: translateY(0);
         }
     }

     .solution-card.active {
         display: flex;
     }

     .solution-card .card-text {
         flex: 1;
         min-width: 280px;
     }

     .solution-card .card-text h3 {
         margin: 0 0 12px;
         font-size: 24px;
         color: var(--dark);
     }

     .solution-card .card-text p {
         margin: 0 0 16px;
         color: var(--muted);
         line-height: 1.6;
     }

     .solution-card .card-image {
         flex: 1;
         display: flex;
         justify-content: center;
     }

     .solution-card .card-image img {
         width: 100%;
         height: auto;
         max-width: 480px;
         border-radius: 12px;
         object-fit: cover;
     }

     @media (max-width: 768px) {
         .solution-card {
             flex-direction: column;
             gap: 24px;
             padding: 24px;
         }
     }

     .footer {
         background-color: var(--dark);
         color: #f8f9fa;
         padding: 40px 0;
     }

     .dashboard-layout {
         display: flex;
         min-height: 100vh;
     }

     .sidebar {
         width: 260px;
         background-color: #ffffff;
         border-right: 1px solid var(--border-color);
         padding: 24px;
         flex-shrink: 0;
     }

     .sidebar-header {
         padding: 0 12px 24px 12px;
         margin-bottom: 24px;
         border-bottom: 1px solid var(--border-color);
     }

     .sidebar-logo {
         font-family: 'Montserrat', sans-serif;
         font-size: 24px;
         font-weight: 700;
         color: var(--dark);
     }

     .sidebar-nav .nav-item {
         display: flex;
         align-items: center;
         gap: 12px;
         padding: 12px;
         border-radius: 8px;
         text-decoration: none;
         color: var(--muted);
         font-weight: 600;
         margin-bottom: 4px;
         transition: background-color 0.2s, color 0.2s;
     }

     .sidebar-nav .nav-item:hover {
         background-color: var(--light-bg);
         color: var(--dark);
     }

     .sidebar-nav .nav-item.active {
         background-color: var(--accent);
         color: white;
         box-shadow: 0 4px 12px rgba(205, 102, 64, 0.25);
     }

     .sidebar-nav .nav-item i {
         width: 20px;
         text-align: center;
     }

     .main-content {
         flex-grow: 1;
         padding: 40px;
         overflow-y: auto;
         max-width: calc(100% - 260px);
     }

     .dashboard-header {
         text-align: center;
         margin-bottom: 48px;
     }

     .dashboard-header h1 {
         font-size: 36px;
         font-weight: 700;
         margin: 0 0 12px 0;
     }

     .dashboard-header p {
         font-size: 18px;
         color: var(--muted);
         max-width: 600px;
         margin: 0 auto;
         line-height: 1.7;
     }

     .dashboard-grid {
         display: grid;
         grid-template-columns: 1fr 1.5fr;
         align-items: center;
         gap: 40px;
     }

     .dashboard-image {
         text-align: center;
     }

     .dashboard-image img {
         max-width: 100%;
         height: auto;
         border-radius: 12px;
     }

     .card {
         background-color: #ffffff;
         border-radius: 12px;
         border: 1px solid var(--border-color);
         box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
         overflow: hidden;
     }

     .card-header {
         padding: 20px 24px;
         border-bottom: 1px solid var(--border-color);
         display: flex;
         justify-content: space-between;
         align-items: center;
     }

     .card-header h3 {
         margin: 0;
         font-size: 18px;
     }

     .card-body {
         padding: 24px;
     }

     .info-grid {
         display: grid;
         grid-template-columns: 150px 1fr;
         gap: 12px 24px;
     }

     .info-grid .label {
         font-weight: 600;
         color: var(--dark);
     }

     .info-grid .value {
         color: var(--muted);
     }

     .btn {
         padding: 10px 20px;
         border-radius: 8px;
         border: none;
         font-family: 'Inter', sans-serif;
         font-weight: 600;
         font-size: 14px;
         cursor: pointer;
         transition: all 0.2s ease;
     }

     .btn-primary {
         background-color: var(--accent);
         color: white;
     }

     .btn-primary:hover {
         background-color: #b35635;
         box-shadow: 0 4px 12px rgba(205, 102, 64, 0.2);
     }

     .btn-danger {
         background-color: #ffebee;
         color: var(--danger);
     }

     .btn-danger:hover {
         background-color: var(--danger);
         color: white;
     }

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

     .data-table th,
     .data-table td {
         padding: 16px;
         text-align: left;
         border-bottom: 1px solid var(--border-color);
     }

     .data-table th {
         font-family: 'Montserrat', sans-serif;
         font-size: 13px;
         font-weight: 600;
         text-transform: uppercase;
         color: var(--muted);
         background-color: var(--light-bg);
     }

     .data-table td {
         font-size: 15px;
     }

     .data-table .action-btn {
         background: none;
         border: none;
         cursor: pointer;
         color: var(--muted);
         font-size: 18px;
         padding: 4px;
         border-radius: 50%;
     }

     .data-table .action-btn:hover {
         color: var(--accent);
         background-color: #fef5ef;
     }

     @media (max-width: 992px) {
         .dashboard-grid {
             grid-template-columns: 1fr;
         }
     }