/* roulang page: index */
:root {
      --brand-primary: #0F3B68;
      --brand-accent: #D97706;
      --bg-base: #F8FAFC;
    }
    body {
      background-color: var(--bg-base);
      color: #334155;
      overflow-x: hidden;
      -webkit-font-smoothing: antialiased;
    }
    .grid-pattern {
      background-image: radial-gradient(rgba(15, 59, 104, 0.07) 1px, transparent 1px);
      background-size: 24px 24px;
    }
    .grid-pattern-dark {
      background-image: radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px);
      background-size: 24px 24px;
    }
    .coupon-ticket {
      position: relative;
      background: #FFFFFF;
      border: 1px dashed #CBD5E1;
    }
    .coupon-ticket::before, .coupon-ticket::after {
      content: '';
      position: absolute;
      top: 50%;
      width: 18px;
      height: 18px;
      background-color: var(--bg-base);
      border-radius: 50%;
      transform: translateY(-50%);
    }
    .coupon-ticket::before { left: -10px; border-right: 1px solid #CBD5E1; }
    .coupon-ticket::after { right: -10px; border-left: 1px solid #CBD5E1; }