/* roulang page: index */
:root{
      --bg:#080b1d;
      --bg-2:#0d1230;
      --surface:rgba(14, 20, 49, .78);
      --surface-2:rgba(19, 26, 58, .88);
      --line:rgba(167, 179, 255, .14);
      --text:#eef2ff;
      --muted:#b7c0e6;
      --muted-2:#93a0ce;
      --brand:#7b8cff;
      --brand-2:#41d6ff;
      --brand-3:#b76dff;
      --success:#4ade80;
      --warn:#fbbf24;
      --danger:#fb7185;
      --shadow:0 20px 60px rgba(3, 8, 25, .36);
      --shadow-soft:0 10px 30px rgba(3, 8, 25, .2);
      --radius:1.5rem;
      --radius-sm:1rem;
      --container:1180px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background:
        radial-gradient(circle at top left, rgba(123,140,255,.18), transparent 35%),
        radial-gradient(circle at 85% 15%, rgba(65,214,255,.14), transparent 28%),
        radial-gradient(circle at 60% 75%, rgba(183,109,255,.10), transparent 30%),
        linear-gradient(180deg, #060915 0%, #0a1024 45%, #070a17 100%);
      color:var(--text);
      line-height:1.7;
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,textarea,select{font:inherit}
    ::selection{background:rgba(123,140,255,.35);color:#fff}
    .site-shell{
      position:relative;
      isolation:isolate;
    }
    .site-shell::before,
    .site-shell::after{
      content:"";
      position:fixed;
      inset:auto;
      pointer-events:none;
      z-index:-1;
      filter:blur(60px);
      opacity:.55;
    }
    .site-shell::before{
      width:28rem;height:28rem;left:-8rem;top:10rem;
      background:rgba(65,214,255,.12);
      border-radius:999px;
    }
    .site-shell::after{
      width:24rem;height:24rem;right:-6rem;top:30rem;
      background:rgba(183,109,255,.12);
      border-radius:999px;
    }
    .container-max{
      width:min(var(--container), calc(100% - 2rem));
      margin-inline:auto;
    }
    .glass{
      background:var(--surface);
      border:1px solid var(--line);
      box-shadow:var(--shadow-soft);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
    }
    .glass-strong{
      background:var(--surface-2);
      border:1px solid rgba(167,179,255,.18);
      box-shadow:var(--shadow);
      backdrop-filter:blur(20px);
      -webkit-backdrop-filter:blur(20px);
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:.45rem;
      padding:.42rem .78rem;
      border-radius:999px;
      border:1px solid rgba(167,179,255,.18);
      background:rgba(255,255,255,.04);
      color:#dfe5ff;
      font-size:.86rem;
      letter-spacing:.01em;
      white-space:nowrap;
    }
    .chip-dot{
      width:.55rem;height:.55rem;border-radius:999px;background:var(--brand-2);
      box-shadow:0 0 0 .25rem rgba(65,214,255,.14);
    }
    .btn-primary,
    .btn-secondary,
    .btn-ghost{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.55rem;
      border-radius:999px;
      padding:.95rem 1.35rem;
      font-weight:700;
      transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, opacity .2s ease;
      border:1px solid transparent;
      cursor:pointer;
      user-select:none;
    }
    .btn-primary{
      background:linear-gradient(135deg, var(--brand) 0%, var(--brand-3) 100%);
      color:#fff;
      box-shadow:0 18px 40px rgba(123,140,255,.22);
    }
    .btn-primary:hover{transform:translateY(-1px);box-shadow:0 22px 48px rgba(123,140,255,.3)}
    .btn-secondary{
      background:rgba(255,255,255,.05);
      color:#f4f7ff;
      border-color:rgba(167,179,255,.18);
    }
    .btn-secondary:hover{transform:translateY(-1px);background:rgba(255,255,255,.08)}
    .btn-ghost{
      color:#dce4ff;
      background:transparent;
      border-color:rgba(167,179,255,.16);
    }
    .btn-ghost:hover{background:rgba(255,255,255,.05);transform:translateY(-1px)}
    .btn-primary:focus-visible,
    .btn-secondary:focus-visible,
    .btn-ghost:focus-visible,
    a:focus-visible,
    input:focus-visible,
    textarea:focus-visible{
      outline:none;
      box-shadow:0 0 0 3px rgba(65,214,255,.22), 0 0 0 6px rgba(123,140,255,.14);
    }
    .section-pad{padding:5rem 0}
    .section-head{display:flex;flex-direction:column;gap:.9rem;margin-bottom:1.75rem}
    .section-title{
      font-size:clamp(1.55rem, 2.3vw, 2.45rem);
      line-height:1.14;
      margin:0;
      letter-spacing:-.03em;
    }
    .section-desc{
      margin:0;
      color:var(--muted);
      max-width:68ch;
      font-size:1rem;
    }
    .grid-balance{
      display:grid;
      grid-template-columns:1.12fr .88fr;
      gap:1.5rem;
    }
    .card{
      border-radius:var(--radius);
      border:1px solid var(--line);
      background:rgba(255,255,255,.035);
      box-shadow:var(--shadow-soft);
    }
    .card-hover{
      transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
    }
    .card-hover:hover{
      transform:translateY(-3px);
      border-color:rgba(123,140,255,.28);
      box-shadow:0 20px 48px rgba(2,7,25,.28);
      background:rgba(255,255,255,.055);
    }
    .nav-link{
      position:relative;
      padding:.45rem .1rem;
      color:#d7defa;
      opacity:.92;
      transition:opacity .2s ease,color .2s ease;
    }
    .nav-link:hover,.nav-link.active{color:#fff;opacity:1}
    .nav-link::after{
      content:"";
      position:absolute;
      left:0;bottom:-.25rem;
      width:100%;height:2px;
      transform:scaleX(0);
      transform-origin:left;
      transition:transform .25s ease;
      border-radius:999px;
      background:linear-gradient(90deg, var(--brand), var(--brand-2));
    }
    .nav-link.active::after,.nav-link:hover::after{transform:scaleX(1)}
    .hero-badge{
      display:inline-flex;
      align-items:center;
      gap:.5rem;
      padding:.48rem .85rem;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(167,179,255,.18);
      color:#f0f4ff;
      font-size:.88rem;
    }
    .hero-title{
      font-size:clamp(2.35rem, 5vw, 4.65rem);
      line-height:1.02;
      letter-spacing:-.05em;
      margin:0;
    }
    .hero-copy{
      color:var(--muted);
      font-size:1.05rem;
      max-width:40rem;
    }
    .mini-dot{
      width:.55rem;height:.55rem;border-radius:999px;background:var(--brand-2);
      box-shadow:0 0 0 .22rem rgba(65,214,255,.12);
      flex:0 0 auto;
    }
    .metric{
      padding:1rem 1.1rem;
      border-radius:1.1rem;
      background:rgba(255,255,255,.045);
      border:1px solid rgba(167,179,255,.14);
    }
    .metric-num{
      display:block;
      font-size:1.45rem;
      font-weight:800;
      letter-spacing:-.03em;
      color:#fff;
    }
    .metric-label{display:block;color:var(--muted-2);font-size:.9rem}
    .ring-wrap{
      position:relative;
      display:grid;
      place-items:center;
      aspect-ratio:1/1;
      width:min(290px, 100%);
      margin-inline:auto;
    }
    .ring{
      width:100%;
      height:100%;
      border-radius:999px;
      background:
        radial-gradient(circle at center, rgba(13,18,48,.96) 0 50%, transparent 51%),
        conic-gradient(from 120deg, var(--brand-2), var(--brand), var(--brand-3), var(--brand-2));
      box-shadow:inset 0 0 0 12px rgba(255,255,255,.03), 0 16px 44px rgba(123,140,255,.18);
      position:absolute;
      inset:0;
      mask:radial-gradient(circle, transparent 0 59%, #000 60% 100%);
      -webkit-mask:radial-gradient(circle, transparent 0 59%, #000 60% 100%);
      animation:spin 12s linear infinite;
    }
    .ring-core{
      position:relative;
      z-index:1;
      width:68%;
      aspect-ratio:1/1;
      border-radius:999px;
      display:grid;
      place-items:center;
      text-align:center;
      background:rgba(8,11,29,.94);
      border:1px solid rgba(167,179,255,.18);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
      padding:1rem;
    }
    @keyframes spin{to{transform:rotate(360deg)}}
    .countdown{
      display:grid;
      grid-template-columns:repeat(4, minmax(0,1fr));
      gap:.65rem;
      width:100%;
      margin-top:1rem;
    }
    .countdown-item{
      text-align:center;
      padding:.72rem .5rem;
      border-radius:1rem;
      background:rgba(255,255,255,.045);
      border:1px solid rgba(167,179,255,.14);
    }
    .countdown-item strong{
      display:block;
      font-size:1.15rem;
      color:#fff;
      line-height:1.1;
    }
    .countdown-item span{display:block;color:var(--muted-2);font-size:.78rem;margin-top:.25rem}
    .tick{
      position:relative;
      padding-left:1.5rem;
    }
    .tick::before{
      content:"";
      position:absolute;
      left:0;top:.55rem;
      width:.78rem;height:.78rem;border-radius:999px;
      background:linear-gradient(135deg, var(--brand-2), var(--brand));
      box-shadow:0 0 0 .25rem rgba(65,214,255,.12);
    }
    .frost-table{
      width:100%;
      border-collapse:separate;
      border-spacing:0;
      overflow:hidden;
      border-radius:1.2rem;
      border:1px solid rgba(167,179,255,.14);
      background:rgba(255,255,255,.03);
    }
    .frost-table th,
    .frost-table td{
      padding:1rem .95rem;
      text-align:left;
      border-bottom:1px solid rgba(167,179,255,.12);
      vertical-align:top;
    }
    .frost-table th{
      color:#f3f6ff;
      background:rgba(255,255,255,.04);
      font-weight:700;
      font-size:.94rem;
    }
    .frost-table tr:last-child td{border-bottom:none}
    .badge-soft{
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      padding:.28rem .62rem;
      border-radius:999px;
      background:rgba(123,140,255,.12);
      border:1px solid rgba(123,140,255,.18);
      color:#dfe4ff;
      font-size:.8rem;
    }
    .news-list li{
      display:flex;
      gap:.9rem;
      padding:1rem 0;
      border-bottom:1px solid rgba(167,179,255,.12);
    }
    .news-list li:last-child{border-bottom:none}
    .news-time{
      min-width:4.2rem;
      font-size:.82rem;
      color:var(--muted-2);
      padding-top:.18rem;
    }
    .news-link{
      display:block;
      color:#f5f7ff;
      font-weight:650;
      margin-bottom:.25rem;
    }
    .news-link:hover{color:#9ad9ff}
    .news-copy{color:var(--muted);font-size:.92rem;line-height:1.65}
    .step-card{
      position:relative;
      padding:1.25rem 1.2rem 1.2rem;
    }
    .step-index{
      width:2.5rem;height:2.5rem;border-radius:999px;
      display:grid;place-items:center;
      background:linear-gradient(135deg, rgba(123,140,255,.24), rgba(65,214,255,.2));
      border:1px solid rgba(167,179,255,.18);
      color:#fff;
      font-weight:800;
      margin-bottom:.85rem;
    }
    .pill-row{
      display:flex;
      flex-wrap:wrap;
      gap:.55rem;
      margin-top:1rem;
    }
    .form-field{
      display:flex;flex-direction:column;gap:.45rem;
    }
    .form-field label{
      font-size:.92rem;color:#dfe4ff;font-weight:600;
    }
    .form-field input,
    .form-field textarea{
      width:100%;
      border:none;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(167,179,255,.16);
      color:#fff;
      border-radius:1rem;
      padding:.95rem 1rem;
      outline:none;
      transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .form-field input::placeholder,
    .form-field textarea::placeholder{color:#8b95c3}
    .form-field input:focus,
    .form-field textarea:focus{
      border-color:rgba(65,214,255,.52);
      background:rgba(255,255,255,.07);
      box-shadow:0 0 0 3px rgba(65,214,255,.12);
    }
    .faq-item{
      border-radius:1.15rem;
      border:1px solid rgba(167,179,255,.14);
      background:rgba(255,255,255,.035);
      padding:1rem 1rem 1.05rem;
    }
    .faq-item summary{
      list-style:none;
      cursor:pointer;
      font-weight:700;
      color:#f5f7ff;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:1rem;
    }
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary::after{
      content:"+";
      width:2rem;height:2rem;border-radius:999px;
      display:grid;place-items:center;
      background:rgba(255,255,255,.05);
      border:1px solid rgba(167,179,255,.16);
      flex:0 0 auto;
      color:#f5f7ff;
    }
    .faq-item[open] summary::after{content:"−"}
    .faq-answer{color:var(--muted);margin-top:.85rem}
    .footer-link{color:#c7d0f2;transition:color .2s ease}
    .footer-link:hover{color:#fff}
    .divider{
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(167,179,255,.18), transparent);
    }
    .mobile-panel{
      display:none;
    }
    .menu-btn{
      display:none;
      width:2.75rem;
      height:2.75rem;
      border-radius:999px;
      border:1px solid rgba(167,179,255,.18);
      background:rgba(255,255,255,.05);
      color:#fff;
    }
    @media (max-width: 1024px){
      .grid-balance{grid-template-columns:1fr}
      .section-pad{padding:4.25rem 0}
    }
    @media (max-width: 768px){
      .menu-btn{display:inline-grid;place-items:center}
      .desktop-nav{display:none}
      .mobile-panel{
        display:none;
      }
      .mobile-panel.open{display:block}
      .hero-title{max-width:12ch}
      .section-head{margin-bottom:1.25rem}
      .countdown{grid-template-columns:repeat(2, minmax(0,1fr))}
      .frost-table th,.frost-table td{padding:.85rem .75rem}
    }
    @media (max-width: 520px){
      .container-max{width:min(calc(100% - 1rem), var(--container))}
      .section-pad{padding:3.5rem 0}
      .btn-primary,.btn-secondary,.btn-ghost{width:100%}
      .hero-copy{font-size:.98rem}
      .metric-num{font-size:1.2rem}
      .frost-table{display:block;overflow-x:auto;white-space:nowrap}
      .news-time{min-width:3.4rem}
    }

/* roulang page: category1 */
:root{
      --bg: #f6f8fc;
      --bg-soft: #eef2ff;
      --surface: rgba(255,255,255,.86);
      --surface-strong: rgba(255,255,255,.96);
      --surface-dark: #08111f;
      --text: #0f172a;
      --muted: #475569;
      --soft: #64748b;
      --line: rgba(148,163,184,.24);
      --line-strong: rgba(148,163,184,.38);
      --primary: #5b5df6;
      --primary-2: #c026d3;
      --accent: #14b8a6;
      --warning: #f59e0b;
      --shadow-lg: 0 24px 60px rgba(15,23,42,.12);
      --shadow-md: 0 16px 40px rgba(15,23,42,.09);
      --shadow-sm: 0 10px 28px rgba(15,23,42,.07);
      --radius-xl: 28px;
      --radius-lg: 22px;
      --radius-md: 16px;
      --radius-sm: 12px;
      --container: 1200px;
    }
    *,*::before,*::after{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family: Inter, PingFang SC, Hiragino Sans GB, Microsoft YaHei, sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at 15% 20%, rgba(99,102,241,.10), transparent 20%),
        radial-gradient(circle at 80% 0%, rgba(192,38,211,.12), transparent 22%),
        radial-gradient(circle at 88% 82%, rgba(20,184,166,.10), transparent 18%),
        linear-gradient(180deg, #f9fbff 0%, #f6f8fc 52%, #edf2ff 100%);
      overflow-x:hidden;
      line-height:1.7;
    }
    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background-image: linear-gradient(rgba(148,163,184,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(148,163,184,.04) 1px, transparent 1px);
      background-size: 54px 54px;
      mask-image: linear-gradient(180deg, rgba(0,0,0,.16), transparent 78%);
      z-index:-1;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,textarea,select{font:inherit}
    ::selection{background:rgba(99,102,241,.2)}
    .container-max{
      width:min(100% - 32px, var(--container));
      margin-inline:auto;
    }
    .glass{
      background:var(--surface);
      border:1px solid var(--line);
      box-shadow:var(--shadow-sm);
      backdrop-filter: blur(16px);
    }
    .shadow-glow{
      box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 18px 60px rgba(91,93,246,.28);
    }
    .nav-link{
      position:relative;
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      color:#dbeafe;
      padding:.45rem .2rem;
      transition:color .22s ease, transform .22s ease, opacity .22s ease;
      opacity:.84;
    }
    .nav-link::after{
      content:"";
      position:absolute;
      left:0;
      bottom:-4px;
      width:100%;
      height:2px;
      transform:scaleX(0);
      transform-origin:left;
      background:linear-gradient(90deg, var(--primary), var(--primary-2));
      transition:transform .22s ease;
      border-radius:999px;
    }
    .nav-link:hover,
    .nav-link:focus-visible{
      color:#fff;
      opacity:1;
      transform:translateY(-1px);
      outline:none;
    }
    .nav-link:hover::after,
    .nav-link:focus-visible::after,
    .nav-link.active::after{
      transform:scaleX(1);
    }
    .nav-link.active{
      color:#fff;
      opacity:1;
    }
    .footer-link{
      color:#cbd5e1;
      transition:color .2s ease, padding-left .2s ease;
    }
    .footer-link:hover,
    .footer-link:focus-visible{
      color:#fff;
      padding-left:4px;
      outline:none;
    }
    .btn-primary,
    .btn-secondary,
    .menu-btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:.5rem;
      border-radius:999px;
      transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease;
      outline:none;
    }
    .btn-primary{
      padding:.9rem 1.25rem;
      color:#fff;
      background:linear-gradient(135deg, var(--primary) 0%, var(--primary-2) 100%);
      box-shadow: 0 16px 30px rgba(91,93,246,.28);
      border:1px solid rgba(255,255,255,.12);
    }
    .btn-primary:hover,
    .btn-primary:focus-visible{
      transform:translateY(-1px);
      box-shadow: 0 20px 38px rgba(91,93,246,.34);
    }
    .btn-secondary{
      padding:.85rem 1.15rem;
      background:rgba(255,255,255,.72);
      border:1px solid var(--line-strong);
      color:var(--text);
    }
    .btn-secondary:hover,
    .btn-secondary:focus-visible{
      transform:translateY(-1px);
      background:#fff;
      box-shadow:var(--shadow-sm);
    }
    .menu-btn{
      width:44px;
      height:44px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.06);
      color:#fff;
    }
    .menu-btn:hover,
    .menu-btn:focus-visible{
      transform:translateY(-1px);
      background:rgba(255,255,255,.12);
    }
    .chip{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      padding:.42rem .8rem;
      border-radius:999px;
      background:rgba(255,255,255,.72);
      border:1px solid var(--line);
      color:#334155;
      font-size:.875rem;
      box-shadow: 0 8px 20px rgba(15,23,42,.05);
    }
    .badge{
      display:inline-flex;
      align-items:center;
      gap:.35rem;
      border-radius:999px;
      padding:.35rem .72rem;
      font-size:.78rem;
      font-weight:700;
      letter-spacing:.01em;
      background:rgba(91,93,246,.1);
      color:var(--primary);
      border:1px solid rgba(91,93,246,.14);
    }
    .badge-soft{
      background:rgba(20,184,166,.12);
      color:#0f766e;
      border-color:rgba(20,184,166,.14);
    }
    .panel{
      background:var(--surface-strong);
      border:1px solid var(--line);
      border-radius:var(--radius-xl);
      box-shadow:var(--shadow-md);
    }
    .panel-soft{
      background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.82));
      border:1px solid rgba(148,163,184,.20);
      border-radius:var(--radius-xl);
      box-shadow:var(--shadow-sm);
    }
    .section{
      padding:76px 0;
      position:relative;
    }
    .section-tight{
      padding:56px 0;
    }
    .section-title{
      font-size:clamp(1.5rem, 1.1rem + 1.8vw, 2.5rem);
      line-height:1.15;
      font-weight:800;
      letter-spacing:-.03em;
      color:#0f172a;
    }
    .section-lead{
      color:var(--muted);
      font-size:1.02rem;
      max-width:56rem;
    }
    .divider{
      height:1px;
      background:linear-gradient(90deg, transparent, rgba(148,163,184,.55), transparent);
    }
    .steps-grid{
      display:grid;
      gap:18px;
      grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .step-card{
      position:relative;
      overflow:hidden;
      padding:24px;
      border-radius:24px;
      background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.92));
      border:1px solid rgba(148,163,184,.2);
      box-shadow:var(--shadow-sm);
      transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .step-card:hover{
      transform:translateY(-3px);
      box-shadow:var(--shadow-md);
      border-color:rgba(91,93,246,.22);
    }
    .step-num{
      display:inline-grid;
      place-items:center;
      width:44px;
      height:44px;
      border-radius:14px;
      font-weight:800;
      color:#fff;
      background:linear-gradient(135deg, var(--primary), var(--primary-2));
      box-shadow:0 12px 26px rgba(91,93,246,.22);
    }
    .package-grid{
      display:grid;
      gap:18px;
      grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .package-card{
      display:flex;
      flex-direction:column;
      gap:18px;
      padding:24px;
      border-radius:26px;
      background:#fff;
      border:1px solid rgba(148,163,184,.2);
      box-shadow:var(--shadow-sm);
      transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .package-card.featured{
      border-color:rgba(91,93,246,.24);
      box-shadow: 0 18px 40px rgba(91,93,246,.12), var(--shadow-sm);
      transform:translateY(-6px);
      background:linear-gradient(180deg, rgba(238,242,255,.9), rgba(255,255,255,.98));
    }
    .package-card:hover{
      transform:translateY(-4px);
      box-shadow:var(--shadow-md);
    }
    .price-line{
      display:flex;
      align-items:end;
      gap:10px;
    }
    .price{
      font-size:2rem;
      font-weight:900;
      letter-spacing:-.04em;
      color:#0f172a;
    }
    .price small{
      font-size:1rem;
      color:var(--soft);
      font-weight:600;
    }
    .check-list{
      display:grid;
      gap:12px;
      margin:0;
      padding:0;
      list-style:none;
    }
    .check-list li{
      display:flex;
      gap:.75rem;
      align-items:flex-start;
      color:#334155;
    }
    .check-icon{
      flex:0 0 auto;
      width:22px;
      height:22px;
      border-radius:999px;
      background:rgba(20,184,166,.14);
      color:#0f766e;
      display:grid;
      place-items:center;
      font-size:.78rem;
      margin-top:.1rem;
    }
    .info-grid{
      display:grid;
      gap:18px;
      grid-template-columns:1.2fr .8fr;
      align-items:stretch;
    }
    .feature-stack{
      display:grid;
      gap:16px;
    }
    .feature-row{
      display:flex;
      gap:14px;
      align-items:flex-start;
      padding:18px;
      border-radius:20px;
      background:rgba(255,255,255,.86);
      border:1px solid rgba(148,163,184,.18);
    }
    .feature-row .icon-box{
      width:44px;
      height:44px;
      border-radius:16px;
      display:grid;
      place-items:center;
      background:linear-gradient(135deg, rgba(91,93,246,.14), rgba(192,38,211,.12));
      color:var(--primary);
      flex:0 0 auto;
    }
    .content-grid{
      display:grid;
      gap:18px;
      grid-template-columns:repeat(4,minmax(0,1fr));
    }
    .content-card{
      padding:20px;
      border-radius:24px;
      background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,250,255,.92));
      border:1px solid rgba(148,163,184,.18);
      box-shadow:var(--shadow-sm);
      transition:transform .2s ease, box-shadow .2s ease;
    }
    .content-card:hover{
      transform:translateY(-3px);
      box-shadow:var(--shadow-md);
    }
    .content-card .line{
      width:48px;
      height:4px;
      border-radius:999px;
      background:linear-gradient(90deg, var(--primary), var(--primary-2));
    }
    .stat-grid{
      display:grid;
      gap:16px;
      grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .stat-card{
      padding:22px;
      border-radius:24px;
      background:#fff;
      border:1px solid rgba(148,163,184,.18);
      box-shadow:var(--shadow-sm);
    }
    .stat-num{
      font-size:2rem;
      font-weight:900;
      letter-spacing:-.04em;
      color:#0f172a;
    }
    .quote-grid{
      display:grid;
      gap:18px;
      grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .quote-card{
      padding:22px;
      border-radius:24px;
      background:#fff;
      border:1px solid rgba(148,163,184,.2);
      box-shadow:var(--shadow-sm);
    }
    .quote-card p{
      color:#334155;
    }
    .faq-grid{
      display:grid;
      gap:16px;
      grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .faq-item{
      padding:20px 22px;
      border-radius:22px;
      background:rgba(255,255,255,.92);
      border:1px solid rgba(148,163,184,.18);
      box-shadow:var(--shadow-sm);
    }
    .faq-item h3{
      font-size:1.05rem;
      font-weight:800;
      margin:0 0 10px;
      color:#0f172a;
    }
    .cta-grid{
      display:grid;
      gap:18px;
      grid-template-columns:1fr .92fr;
    }
    .form-grid{
      display:grid;
      gap:14px;
      grid-template-columns:1fr 1fr;
    }
    .input{
      width:100%;
      padding:14px 16px;
      border-radius:16px;
      border:1px solid rgba(148,163,184,.24);
      background:rgba(255,255,255,.92);
      color:#0f172a;
      outline:none;
      transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    }
    .input:focus{
      border-color:rgba(91,93,246,.48);
      box-shadow:0 0 0 4px rgba(91,93,246,.12);
    }
    .textarea{
      min-height:120px;
      resize:vertical;
    }
    .mobile-panel{
      display:none;
    }
    .hero-orb{
      position:absolute;
      inset:auto -80px -120px auto;
      width:320px;
      height:320px;
      border-radius:50%;
      filter:blur(12px);
      background:radial-gradient(circle, rgba(192,38,211,.22), transparent 68%);
      pointer-events:none;
    }
    .hero-card{
      position:relative;
      overflow:hidden;
      border-radius:32px;
      background:
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(238,242,255,.94));
      border:1px solid rgba(148,163,184,.18);
      box-shadow:0 24px 70px rgba(15,23,42,.10);
    }
    .video-frame{
      aspect-ratio: 9 / 16;
      min-height: 420px;
      border-radius:28px;
      position:relative;
      overflow:hidden;
      background:
        radial-gradient(circle at 35% 20%, rgba(255,255,255,.88), transparent 22%),
        linear-gradient(160deg, #0f172a 0%, #1e293b 45%, #4f46e5 100%);
    }
    .video-frame::before{
      content:"";
      position:absolute;
      inset:14px;
      border-radius:22px;
      border:1px solid rgba(255,255,255,.12);
      pointer-events:none;
    }
    .video-chip{
      position:absolute;
      left:16px;
      right:16px;
      padding:12px 14px;
      border-radius:18px;
      background:rgba(255,255,255,.12);
      border:1px solid rgba(255,255,255,.15);
      backdrop-filter: blur(14px);
      color:#fff;
    }
    .video-chip.top{top:16px}
    .video-chip.bottom{bottom:16px}
    .mini-bars{
      display:flex;
      gap:6px;
      align-items:end;
      height:24px;
    }
    .mini-bars span{
      width:6px;
      border-radius:999px;
      background:linear-gradient(180deg, #f8fafc, rgba(248,250,252,.3));
      animation:pulse 1.5s infinite ease-in-out;
    }
    .mini-bars span:nth-child(2){height:15px;animation-delay:.15s}
    .mini-bars span:nth-child(3){height:22px;animation-delay:.3s}
    .mini-bars span:nth-child(4){height:10px;animation-delay:.45s}
    .mini-bars span:nth-child(5){height:18px;animation-delay:.6s}
    @keyframes pulse{
      0%,100%{opacity:.58;transform:translateY(0)}
      50%{opacity:1;transform:translateY(-2px)}
    }
    .bento{
      position:absolute;
      left:16px;
      right:16px;
      top:84px;
      bottom:84px;
      display:grid;
      grid-template-rows:1fr auto auto;
      gap:12px;
    }
    .bento-card{
      border-radius:22px;
      background:rgba(255,255,255,.1);
      border:1px solid rgba(255,255,255,.13);
      backdrop-filter: blur(12px);
      padding:16px;
      color:#fff;
    }
    .bento-grid{
      display:grid;
      gap:12px;
      grid-template-columns:1fr 1fr;
    }
    .bento-mini{
      padding:14px;
      border-radius:18px;
      background:rgba(255,255,255,.12);
      border:1px solid rgba(255,255,255,.13);
      min-height:92px;
    }
    .hero-copy{
      max-width: 42rem;
    }
    .hero-actions{
      display:flex;
      flex-wrap:wrap;
      gap:12px;
      margin-top:28px;
    }
    .hero-stats{
      display:flex;
      flex-wrap:wrap;
      gap:10px;
      margin-top:24px;
    }
    .hero-pill{
      padding:10px 14px;
      border-radius:999px;
      background:rgba(255,255,255,.72);
      border:1px solid rgba(148,163,184,.18);
      color:#334155;
      box-shadow:var(--shadow-sm);
    }
    .soft-note{
      color:var(--soft);
      font-size:.95rem;
    }
    @media (max-width: 1024px){
      .steps-grid,
      .package-grid,
      .content-grid,
      .stat-grid,
      .quote-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
      }
      .info-grid,
      .cta-grid{
        grid-template-columns:1fr;
      }
      .hero-layout{
        grid-template-columns:1fr;
      }
      .video-frame{
        min-height:360px;
      }
    }
    @media (max-width: 768px){
      .section{
        padding:60px 0;
      }
      .section-tight{
        padding:46px 0;
      }
      .desktop-nav{
        display:none;
      }
      .menu-btn{
        display:inline-flex;
      }
      .mobile-panel.open{
        display:block;
      }
      .steps-grid,
      .package-grid,
      .content-grid,
      .stat-grid,
      .quote-grid,
      .faq-grid,
      .form-grid{
        grid-template-columns:1fr;
      }
      .hero-actions{
        flex-direction:column;
        align-items:stretch;
      }
      .hero-stats{
        gap:8px;
      }
      .hero-pill{
        width:100%;
      }
    }
    @media (max-width: 520px){
      .container-max{
        width:min(100% - 22px, var(--container));
      }
      .section{
        padding:48px 0;
      }
      .section-title{
        font-size:1.5rem;
      }
      .btn-primary,
      .btn-secondary{
        width:100%;
      }
      .chip,
      .badge{
        font-size:.74rem;
      }
      .panel,
      .panel-soft,
      .step-card,
      .package-card,
      .content-card,
      .stat-card,
      .quote-card,
      .faq-item{
        border-radius:20px;
      }
    }