/* roulang page: index */
:root {
      --primary-color: #0A3641;
      --secondary-color: #00A88F;
      --bg-light: #F8FAFC;
      --bg-alt: #F1F5F9;
      --text-main: #0B1B24;
      --text-muted: #475569;
      --border-color: rgba(226, 232, 240, 0.9);
      --radius-standard: 12px;
    }
    html {
      scroll-padding-top: 86px;
    }
    body {
      color: #334155;
      background-color: #FFFFFF;
      line-height: 1.75;
      font-feature-settings: "palt";
      -webkit-font-smoothing: antialiased;
    }
    .custom-card {
      background: #FFFFFF;
      border: 1px solid var(--border-color);
      border-radius: var(--radius-standard);
      transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .custom-card:hover {
      transform: translateY(-3px);
      box-shadow: 0 20px 40px -15px rgba(10,54,65,0.08);
      border-color: rgba(0, 168, 143, 0.4);
    }
    .btn-gradient {
      background: linear-gradient(135deg, #00A88F 0%, #028090 100%);
      color: #ffffff;
      transition: all 0.25s ease;
    }
    .btn-gradient:hover {
      opacity: 0.95;
      box-shadow: 0 8px 20px rgba(0, 168, 143, 0.35);
      transform: translateY(-1px);
    }
    .badge-subtle {
      background: #E6F7F4;
      color: #008773;
    }
    .text-balance {
      text-wrap: balance;
    }