:root {
      --brand:#1a73e8;
      --brand-2:#0ea5e9;
    }
    .badge-live{background: #16a34a;}
    .badge-soon{background: #f59e0b;}
    .hero-gradient{
      background: radial-gradient(1200px 600px at 10% 0%, rgba(14,165,233,.12), transparent 60%),
                  radial-gradient(900px 600px at 90% 0%, rgba(26,115,232,.12), transparent 60%);
    }
    .icon-32{width: 32px;height:32px;}
    .checklist li{padding-left:1.75rem; position:relative; margin-bottom:.5rem;}
    .checklist li::before{
      content:""; position:absolute; left:0; top:.2rem; width:1.1rem; height:1.1rem;
      border-radius:50%; background:var(--brand);
      -webkit-mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 16 16"><path d="M13.485 1.929a1 1 0 0 1 .086 1.414l-7 8a1 1 0 0 1-1.45.064l-3-3a1 1 0 0 1 1.414-1.414l2.26 2.26 6.293-7.193a1 1 0 0 1 1.397-.131z"/></svg>') center/90% 90% no-repeat;
      mask:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="white" viewBox="0 0 16 16"><path d="M13.485 1.929a1 1 0 0 1 .086 1.414l-7 8a1 1 0 0 1-1.45.064l-3-3a1 1 0 0 1 1.414-1.414l2.26 2.26 6.293-7.193a1 1 0 0 1 1.397-.131z"/></svg>') center/90% 90% no-repeat;
      background-color: var(--brand);
    }
    .table thead th{background:#f8fafc;}
    .btn-brand{background:var(--brand); color:#fff;}
    .btn-brand:hover{background:#1456b8; color:#fff;}
    .section{padding: 3.5rem 0;}
    .breadcrumb a{text-decoration:none;}
    .method-card:hover{box-shadow:0 1rem 2rem rgba(0,0,0,.08); transform: translateY(-2px); transition: all .2s ease;}
    .anchor-offset{scroll-margin-top: 6rem;}