:root{
      --bg:#f6f8ff;
      --panel:rgba(255,255,255,.78);
      --text:#0b1020;
      --muted:#475569;
      --line:rgba(15,23,42,.12);
      --shadow: 0 22px 80px rgba(15,23,42,.12);
      --shadow2: 0 10px 30px rgba(15,23,42,.10);
      --r: 22px;
      --r2: 32px;
      --accent1:#2f6bff;
      --accent2:#ff3db8;
      --accent3:#ffb000;
      --ok:#10b981;
      --bad:#ef4444;
      --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
    }
    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0;
      font-family:var(--font);
      color:var(--text);
      background:
        radial-gradient(900px 500px at 15% 12%, rgba(47,107,255,.16), transparent 60%),
        radial-gradient(800px 520px at 85% 18%, rgba(255,61,184,.14), transparent 60%),
        radial-gradient(700px 520px at 55% 92%, rgba(255,176,0,.12), transparent 60%),
        linear-gradient(180deg, #f7f9ff 0%, #f3f6ff 55%, #f7f9ff 100%);
      overflow-x:hidden;
    }
    a{color:inherit;text-decoration:none}
    button,input,select,textarea{font-family:inherit}
    img{max-width:100%;display:block}
    .noise{
      pointer-events:none;
      position:fixed; inset:0;
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
      mix-blend-mode:soft-light;
      opacity:.38;
      z-index:0;
    }
    .glow{
      pointer-events:none;
      position:fixed;
      width:520px;height:520px;
      border-radius:50%;
      background:radial-gradient(circle at 30% 30%, rgba(47,107,255,.18), transparent 55%),
               radial-gradient(circle at 70% 70%, rgba(255,61,184,.14), transparent 55%),
               radial-gradient(circle at 40% 80%, rgba(255,176,0,.12), transparent 60%);
      filter: blur(14px);
      transform: translate(-50%,-50%);
      z-index:1;
      opacity:.75;
    }
    .wrap{position:relative; z-index:2}
    .topbar{
      position:fixed; top:14px; left:50%;
      transform:translateX(-50%);
      width:min(1120px, calc(100% - 22px));
      background:var(--panel);
      border:1px solid var(--line);
      box-shadow:var(--shadow2);
      border-radius:999px;
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding:10px 12px;
      z-index:40;
    }
    .brand{display:flex; align-items:center; gap:10px; padding:4px 10px; border-radius:999px}
    .brand svg{width:30px;height:30px}
    .brand .name{font-weight:900; letter-spacing:.2px}
    .brand .tag{font-size:12px; color:var(--muted); margin-top:1px}
    .nav{display:flex; align-items:center; gap:6px; padding:0 8px}
    .nav a{
      font-size:13px;
      color:rgba(2,6,23,.86);
      padding:8px 10px;
      border-radius:999px;
      border:1px solid transparent;
      transition:transform .15s ease, background .15s ease, border-color .15s ease, opacity .15s ease;
      opacity:.92;
      white-space:nowrap;
    }
    .nav a:hover{
      background:rgba(47,107,255,.07);
      border-color:rgba(47,107,255,.20);
      transform:translateY(-1px);
      opacity:1;
    }
    .actions{display:flex; align-items:center; gap:8px}
    .pill{
      display:flex; align-items:center; gap:8px;
      padding:10px 12px;
      border-radius:999px;
      border:1px solid var(--line);
      background:linear-gradient(180deg, rgba(255,255,255,.80), rgba(255,255,255,.55));
      box-shadow:0 8px 26px rgba(15,23,42,.08);
      transition:transform .15s ease, box-shadow .15s ease;
    }
    .pill:hover{transform:translateY(-1px); box-shadow:0 14px 34px rgba(15,23,42,.12)}
    .pill .dot{
      width:10px;height:10px;border-radius:50%;
      background: radial-gradient(circle at 30% 30%, #fff, rgba(255,255,255,.25) 55%), linear-gradient(135deg, var(--accent1), var(--accent2));
      box-shadow:0 0 0 5px rgba(47,107,255,.10);
    }
    .pill .txt{font-size:13px; font-weight:1000}
    .btn{
      cursor:pointer;
      border:none;
      border-radius:999px;
      padding:12px 14px;
      font-weight:1000;
      font-size:13px;
      color:#06102a;
      background:
        radial-gradient(120px 120px at 20% 20%, rgba(255,255,255,.8), transparent 55%),
        linear-gradient(135deg, rgba(47,107,255,.22), rgba(255,61,184,.18), rgba(255,176,0,.18));
      border:1px solid rgba(15,23,42,.10);
      box-shadow:0 10px 30px rgba(15,23,42,.10);
      transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
      white-space:nowrap;
    }
    .btn:hover{transform:translateY(-1px); box-shadow:0 16px 44px rgba(15,23,42,.14); filter:saturate(1.1)}
    .btn:active{transform:translateY(0px); box-shadow:0 10px 30px rgba(15,23,42,.10)}
    .btn.secondary{background:rgba(255,255,255,.68); border:1px solid var(--line)}
    .hamburger{display:none; border:none; background:transparent; cursor:pointer; padding:8px 10px; border-radius:999px; border:1px solid transparent}
    .hamburger:hover{background:rgba(47,107,255,.06); border-color:rgba(47,107,255,.20)}
    .hamburger svg{width:20px;height:20px}
    .drawer{position:fixed; inset:0; z-index:60; background:rgba(2,6,23,.42); backdrop-filter: blur(12px); display:none}
    .drawer.open{display:block}
    .drawer-panel{
      position:absolute; top:14px; right:14px;
      width:min(360px, calc(100% - 28px));
      background:rgba(255,255,255,.86);
      border:1px solid rgba(15,23,42,.14);
      border-radius:28px;
      box-shadow:var(--shadow);
      overflow:hidden;
    }
    .drawer-head{display:flex; align-items:center; justify-content:space-between; padding:14px 14px 10px 14px; border-bottom:1px solid var(--line)}
    .drawer-head .t{font-weight:1000}
    .drawer-close{border:none; cursor:pointer; background:rgba(2,6,23,.04); border:1px solid rgba(15,23,42,.10); border-radius:12px; padding:8px 10px}
    .drawer-close:hover{background:rgba(47,107,255,.08); border-color:rgba(47,107,255,.20)}
    .drawer-nav{display:flex; flex-direction:column; gap:6px; padding:12px}
    .drawer-nav a{padding:12px 12px; border-radius:16px; border:1px solid rgba(15,23,42,.10); background:rgba(255,255,255,.55); font-weight:1000; font-size:14px}
    .drawer-nav a:hover{background:rgba(47,107,255,.08); border-color:rgba(47,107,255,.20)}
    .drawer-actions{display:flex; gap:10px; padding:12px; border-top:1px solid var(--line)}
    .drawer-actions .btn{flex:1}
    main{width:min(1120px, calc(100% - 22px)); margin:0 auto; padding:108px 0 80px}
    .hero{display:grid; grid-template-columns: 1.1fr .9fr; gap:26px; align-items:start; padding-top:16px}
    .card{
      background:var(--panel);
      border:1px solid var(--line);
      border-radius:var(--r2);
      box-shadow:var(--shadow2);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      overflow:hidden;
      position:relative;
    }
    .hero-left{padding:26px 24px 22px}
    .kicker{
      display:inline-flex; align-items:center; gap:10px;
      padding:8px 12px;
      border-radius:999px;
      border:1px solid rgba(47,107,255,.20);
      background:linear-gradient(135deg, rgba(47,107,255,.10), rgba(255,61,184,.06));
      font-size:12px;
      font-weight:1000;
      letter-spacing:.2px;
    }
    .kicker .spark{
      width:10px;height:10px;border-radius:50%;
      background:linear-gradient(135deg, var(--accent1), var(--accent2));
      box-shadow:0 0 0 5px rgba(47,107,255,.10);
    }
    h1{margin:14px 0 10px; font-size: clamp(34px, 4.6vw, 56px); line-height:1.02; letter-spacing:-.8px}
    .sub{color:rgba(2,6,23,.72); font-size:16px; line-height:1.45; margin:0 0 18px; max-width: 62ch}
    .hero-cta{display:flex; gap:10px; align-items:center; flex-wrap:wrap}
    .hero-meta{display:flex; gap:10px; flex-wrap:wrap; margin-top:16px}
    .chip{
      display:flex; align-items:center; gap:10px;
      padding:12px 12px;
      border-radius:18px;
      border:1px solid rgba(15,23,42,.12);
      background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.52));
      box-shadow:0 10px 30px rgba(15,23,42,.07);
      min-width: 180px;
    }
    .chip .ico{
      width:36px;height:36px;border-radius:14px;
      background:linear-gradient(135deg, rgba(47,107,255,.16), rgba(255,61,184,.10), rgba(255,176,0,.10));
      border:1px solid rgba(15,23,42,.10);
      display:grid; place-items:center;
    }
    .chip .ico svg{width:18px;height:18px}
    .chip .t{font-weight:1000; font-size:13px}
    .chip .d{color:var(--muted); font-size:12px; margin-top:2px}
    .hero-right{padding:0; min-height: 540px}
    .scene{
      position:relative;
      height: 540px;
      border-radius:var(--r2);
      overflow:hidden;
      background:
        radial-gradient(520px 420px at 35% 20%, rgba(47,107,255,.20), transparent 60%),
        radial-gradient(520px 420px at 70% 60%, rgba(255,61,184,.14), transparent 60%),
        radial-gradient(520px 420px at 60% 95%, rgba(255,176,0,.13), transparent 65%),
        linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.30));
      border:1px solid rgba(15,23,42,.12);
    }
    .scene .bg{position:absolute; inset:-40px; background-image:
        radial-gradient(circle at 20% 15%, rgba(255,255,255,.85), rgba(255,255,255,0) 42%),
        radial-gradient(circle at 85% 25%, rgba(255,255,255,.65), rgba(255,255,255,0) 42%),
        radial-gradient(circle at 55% 92%, rgba(255,255,255,.45), rgba(255,255,255,0) 42%); opacity:.75; transform: translate3d(0,0,0)}
    .bottle-float{
      position:absolute;
      left:50%;
      top:56%;
      transform:translate(-50%,-50%);
      width:min(340px, 72%);
      filter: drop-shadow(0 28px 40px rgba(15,23,42,.18));
      will-change: transform;
      user-select:none;
      pointer-events:none;
    }
    .orb{
      position:absolute;
      width: 160px; height: 160px;
      border-radius: 40px;
      background:linear-gradient(135deg, rgba(47,107,255,.22), rgba(255,61,184,.18), rgba(255,176,0,.18));
      border:1px solid rgba(15,23,42,.10);
      backdrop-filter: blur(12px);
      box-shadow:0 20px 70px rgba(15,23,42,.10);
      transform: rotate(12deg);
      opacity:.85;
    }
    .orb.o1{left:24px; top:32px}
    .orb.o2{right:22px; top:120px; width:120px; height:120px; border-radius:34px; transform: rotate(-10deg)}
    .orb.o3{left:46px; bottom:34px; width:140px; height:140px; border-radius:36px; transform: rotate(-6deg)}
    .scene .badge{
      position:absolute;
      left:18px; bottom:16px;
      display:flex; gap:10px; align-items:center;
      background:rgba(255,255,255,.72);
      border:1px solid rgba(15,23,42,.12);
      border-radius: 18px;
      padding:10px 12px;
      box-shadow:0 10px 30px rgba(15,23,42,.08);
      max-width: 92%;
    }
    .badge .b{
      width:40px; height:40px; border-radius:16px;
      background:rgba(47,107,255,.10);
      border:1px solid rgba(47,107,255,.22);
      display:grid; place-items:center;
      flex:0 0 auto;
    }
    .badge .b svg{width:18px;height:18px}
    .badge .text .t{font-weight:1000;font-size:13px}
    .badge .text .d{color:var(--muted);font-size:12px;margin-top:2px; line-height:1.25}
    section{margin-top:26px}
    .grid2{display:grid; grid-template-columns: 1fr 1fr; gap:18px}
    .grid3{display:grid; grid-template-columns: 1fr 1fr 1fr; gap:14px}
    .sec-head{
      padding:22px 22px 18px;
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:14px;
      border-bottom:1px solid rgba(15,23,42,.10);
      background:linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,.50));
    }
    .sec-head h2{margin:0; font-size:22px; letter-spacing:-.3px}
    .sec-head p{margin:0; color:var(--muted); font-size:13px; max-width: 70ch; line-height:1.4}
    .sec-body{padding:18px 22px 22px}
    .feature{
      border:1px solid rgba(15,23,42,.10);
      background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.50));
      border-radius:20px;
      padding:16px 16px;
      box-shadow:0 10px 30px rgba(15,23,42,.06);
      position:relative;
      overflow:hidden;
      min-height: 140px;
    }
    .feature:before{
      content:"";
      position:absolute; inset:-40px;
      background: radial-gradient(240px 160px at 20% 20%, rgba(47,107,255,.16), transparent 60%),
                  radial-gradient(240px 160px at 80% 60%, rgba(255,61,184,.12), transparent 65%);
      opacity:.65;
      transform: translate3d(0,0,0);
    }
    .feature > *{position:relative}
    .feature .top{display:flex; gap:10px; align-items:center; margin-bottom:10px}
    .feature .ic{
      width:40px;height:40px;border-radius:16px;
      display:grid; place-items:center;
      border:1px solid rgba(15,23,42,.10);
      background:linear-gradient(135deg, rgba(47,107,255,.14), rgba(255,61,184,.10), rgba(255,176,0,.10));
    }
    .feature .ic svg{width:18px;height:18px}
    .feature .t{font-weight:1000}
    .feature .d{color:var(--muted); font-size:13px; line-height:1.4}
    .split{display:grid; grid-template-columns: 1.05fr .95fr; gap:18px; align-items:stretch}
    .media{
      border:1px solid rgba(15,23,42,.12);
      border-radius: 22px;
      overflow:hidden;
      background:rgba(255,255,255,.55);
      position:relative;
      min-height: 380px;
      box-shadow:0 20px 70px rgba(15,23,42,.10);
    }
    .media .img{position:absolute; inset:0; background-size:cover; background-position:center; transform: scale(1.02); filter:saturate(1.05) contrast(1.05)}
    .media .overlay{
      position:absolute; inset:0;
      background:
        linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.10) 40%, rgba(246,248,255,.92) 100%),
        radial-gradient(520px 420px at 25% 20%, rgba(47,107,255,.18), transparent 60%),
        radial-gradient(520px 420px at 75% 60%, rgba(255,61,184,.14), transparent 62%);
    }
    .media .panel{
      position:absolute; left:16px; right:16px; bottom:14px;
      background:rgba(255,255,255,.78);
      border:1px solid rgba(15,23,42,.12);
      border-radius: 20px;
      padding:14px 14px;
      box-shadow:0 20px 60px rgba(15,23,42,.12);
      display:flex; gap:10px; align-items:flex-start;
    }
    .media .panel .mini{
      width:44px; height:44px; border-radius:18px;
      border:1px solid rgba(15,23,42,.12);
      background:linear-gradient(135deg, rgba(47,107,255,.14), rgba(255,61,184,.10), rgba(255,176,0,.10));
      display:grid; place-items:center;
      flex:0 0 auto;
    }
    .media .panel .mini svg{width:18px;height:18px}
    .media .panel .p1{font-weight:1000}
    .media .panel .p2{color:var(--muted); font-size:13px; margin-top:2px; line-height:1.35}
    .steps{display:flex; flex-direction:column; gap:10px}
    .step{
      border:1px solid rgba(15,23,42,.10);
      border-radius: 20px;
      background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.50));
      padding:14px 14px;
      display:flex; gap:12px; align-items:flex-start;
      box-shadow:0 10px 30px rgba(15,23,42,.06);
    }
    .step .n{
      width:38px; height:38px; border-radius:16px;
      display:grid; place-items:center;
      font-weight:1000;
      border:1px solid rgba(15,23,42,.10);
      background:rgba(47,107,255,.08);
      flex:0 0 auto;
    }
    .step .t{font-weight:1000}
    .step .d{color:var(--muted); font-size:13px; margin-top:2px; line-height:1.35}
    .table{
      width:100%;
      border-collapse:separate;
      border-spacing:0;
      overflow:hidden;
      border:1px solid rgba(15,23,42,.12);
      border-radius: 22px;
      background:rgba(255,255,255,.62);
      box-shadow:0 20px 70px rgba(15,23,42,.08);
    }
    .table th, .table td{
      padding:14px 14px;
      border-bottom:1px solid rgba(15,23,42,.10);
      vertical-align:top;
      font-size:13px;
      line-height:1.35;
    }
    .table th{
      text-align:left;
      font-weight:1000;
      background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.60));
    }
    .table tr:last-child td{border-bottom:none}
    .badge-row{
      display:flex; gap:10px; flex-wrap:wrap; align-items:center;
      margin-top:12px;
    }
    .mini-pill{
      display:inline-flex; align-items:center; gap:10px;
      padding:10px 12px;
      border-radius: 999px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.70);
      font-weight:1000;
      font-size:12px;
      box-shadow:0 10px 30px rgba(15,23,42,.06);
    }
    .mini-pill b{font-weight:1000}
    .notice{
      border:1px solid rgba(239,68,68,.20);
      background:linear-gradient(180deg, rgba(239,68,68,.06), rgba(255,255,255,.56));
      border-radius: 26px;
      padding:16px 16px;
      box-shadow:0 20px 70px rgba(15,23,42,.08);
    }
    .notice .t{font-weight:1000; display:flex; gap:10px; align-items:center}
    .notice .t .ic{
      width:40px;height:40px;border-radius:16px;
      border:1px solid rgba(239,68,68,.18);
      background:rgba(239,68,68,.08);
      display:grid; place-items:center;
      flex:0 0 auto;
    }
    .notice .t svg{width:18px;height:18px}
    .notice .d{color:rgba(2,6,23,.76); font-size:13px; margin-top:8px; line-height:1.5}
    .faq{
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.62);
      border-radius: 26px;
      overflow:hidden;
      box-shadow:0 20px 70px rgba(15,23,42,.08);
    }
    .faq-item{border-bottom:1px solid rgba(15,23,42,.10)}
    .faq-item:last-child{border-bottom:none}
    .faq-q{
      width:100%;
      text-align:left;
      border:none;
      background:transparent;
      cursor:pointer;
      padding:16px 16px;
      font-weight:1000;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:12px;
      font-size:14px;
    }
    .faq-q:hover{background:rgba(47,107,255,.06)}
    .faq-a{
      padding:0 16px 16px 16px;
      color:rgba(2,6,23,.75);
      font-size:13px;
      line-height:1.55;
      display:none;
    }
    .faq-item.open .faq-a{display:block}
    .faq-caret{
      width:34px;height:34px;border-radius:14px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.70);
      display:grid; place-items:center;
      flex:0 0 auto;
      transition: transform .18s ease;
    }
    .faq-item.open .faq-caret{transform: rotate(180deg)}
    .faq-caret svg{width:16px;height:16px}
    .order{display:grid; grid-template-columns: 1fr 1fr; gap:14px; align-items:stretch}
    .form{padding:18px 18px 18px}
    .form h3{margin:0 0 6px; font-size:18px}
    .form p{margin:0 0 14px; color:var(--muted); font-size:13px; line-height:1.4}
    .fields{display:grid; grid-template-columns: 1fr 1fr; gap:10px}
    .field{display:flex; flex-direction:column; gap:6px}
    .field.full{grid-column:1 / -1}
    label{font-size:12px; font-weight:1000; color:rgba(2,6,23,.78)}
    input,select,textarea{
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.70);
      border-radius:16px;
      padding:12px 12px;
      font-size:14px;
      outline:none;
      transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
    }
    input:focus,select:focus,textarea:focus{
      border-color: rgba(47,107,255,.34);
      box-shadow:0 0 0 5px rgba(47,107,255,.12);
      background:rgba(255,255,255,.82);
    }
    textarea{min-height: 92px; resize:vertical}
    .hint{font-size:12px; color:var(--muted)}
    .row-actions{display:flex; gap:10px; align-items:center; margin-top:12px; flex-wrap:wrap}
    .toast{
      margin-top:12px;
      border-radius:18px;
      border:1px solid rgba(15,23,42,.12);
      padding:12px 12px;
      background:rgba(255,255,255,.72);
      display:none;
    }
    .toast.ok{border-color: rgba(16,185,129,.28); background:rgba(16,185,129,.10)}
    .toast.bad{border-color: rgba(239,68,68,.26); background:rgba(239,68,68,.08)}
    .toast .t{font-weight:1000}
    .toast .d{color:rgba(2,6,23,.70); font-size:13px; margin-top:2px; line-height:1.35}
    .mini-card{padding:18px; display:flex; flex-direction:column; justify-content:space-between; min-height: 340px}
    .mini-card .top{display:flex; flex-direction:column; gap:8px}
    .mini-card .badge2{
      display:flex; align-items:center; gap:10px;
      padding:10px 12px;
      border-radius:18px;
      border:1px solid rgba(47,107,255,.20);
      background:linear-gradient(135deg, rgba(47,107,255,.10), rgba(255,61,184,.06));
      width:fit-content;
    }
    .badge2 .ico{
      width:34px;height:34px;border-radius:14px;
      border:1px solid rgba(15,23,42,.10);
      background:rgba(255,255,255,.64);
      display:grid; place-items:center;
    }
    .badge2 .ico svg{width:16px;height:16px}
    .badge2 .t{font-weight:1000; font-size:13px}
    .mini-card h3{margin:6px 0 0; font-size:18px}
    .mini-card .list{margin-top:10px; display:flex; flex-direction:column; gap:10px}
    .li{
      display:flex; gap:10px; align-items:flex-start;
      padding:12px 12px;
      border-radius:18px;
      border:1px solid rgba(15,23,42,.10);
      background:rgba(255,255,255,.60);
    }
    .li .b{
      width:36px;height:36px;border-radius:16px;
      border:1px solid rgba(15,23,42,.10);
      background:linear-gradient(135deg, rgba(47,107,255,.14), rgba(255,61,184,.10), rgba(255,176,0,.10));
      display:grid; place-items:center;
      flex:0 0 auto;
    }
    .li .b svg{width:16px;height:16px}
    .li .t{font-weight:1000; font-size:13px}
    .li .d{color:var(--muted); font-size:12px; margin-top:2px; line-height:1.3}
    .pricebox{
      border:1px solid rgba(15,23,42,.10);
      border-radius:22px;
      background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.52));
      box-shadow:0 20px 70px rgba(15,23,42,.08);
      padding:14px 14px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      flex-wrap:wrap;
    }
    .pricebox .left{display:flex; gap:10px; align-items:center}
    .pricebox .icon{
      width:44px;height:44px;border-radius:18px;
      border:1px solid rgba(15,23,42,.12);
      background:linear-gradient(135deg, rgba(47,107,255,.14), rgba(255,61,184,.10), rgba(255,176,0,.10));
      display:grid; place-items:center;
      flex:0 0 auto;
    }
    .pricebox .icon svg{width:18px;height:18px}
    .pricebox .t{font-weight:1000}
    .pricebox .d{color:var(--muted); font-size:12px; margin-top:2px}
    .pricebox .sum{
      display:flex; gap:10px; align-items:baseline; justify-content:flex-end;
      padding:10px 12px;
      border-radius:18px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.70);
      box-shadow:0 10px 30px rgba(15,23,42,.06);
    }
    .pricebox .sum .n{font-size:20px; font-weight:1000; letter-spacing:-.2px}
    .pricebox .sum .s{color:var(--muted); font-size:12px; font-weight:1000}
    .radios{display:flex; flex-direction:column; gap:10px; margin:12px 0 2px}
    .radio{
      display:flex; gap:12px; align-items:flex-start;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.66);
      border-radius:20px;
      padding:12px 12px;
      box-shadow:0 10px 30px rgba(15,23,42,.06);
      cursor:pointer;
      transition: transform .15s ease, border-color .15s ease, background .15s ease;
    }
    .radio:hover{transform:translateY(-1px); border-color:rgba(47,107,255,.20); background:rgba(255,255,255,.76)}
    .radio input{margin-top:3px}
    .radio .rt{font-weight:1000; font-size:13px}
    .radio .rd{color:var(--muted); font-size:12px; margin-top:3px; line-height:1.35}
    .inline2{display:grid; grid-template-columns: 1fr 1fr; gap:10px}
    .inline2 .field{margin-top:10px}
    footer{
      width:min(1120px, calc(100% - 22px));
      margin:22px auto 26px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.64);
      border-radius: 28px;
      box-shadow:0 20px 70px rgba(15,23,42,.08);
      backdrop-filter: blur(14px);
      padding:16px 16px;
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:12px;
      flex-wrap:wrap;
    }
    .foot-left{display:flex; align-items:center; gap:10px}
    .hash{
      font-weight:1000;
      padding:10px 12px;
      border-radius:999px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.72);
    }
    .social{display:flex; gap:8px; align-items:center}
    .social a{
      width:42px;height:42px;border-radius:18px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.70);
      display:grid; place-items:center;
      transition: transform .15s ease, background .15s ease, border-color .15s ease;
    }
    .social a:hover{transform:translateY(-1px); background:rgba(47,107,255,.08); border-color:rgba(47,107,255,.20)}
    .social svg{width:18px;height:18px}
    .copy{color:var(--muted); font-size:12px}
    .modal{
      position:fixed; inset:0; z-index:100;
      display:none;
      background:rgba(2,6,23,.56);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      padding:18px;
    }
    .modal.open{display:grid; place-items:center}
    .modal-card{
      width:min(980px, 100%);
      border-radius: 30px;
      border:1px solid rgba(255,255,255,.18);
      background:rgba(255,255,255,.90);
      box-shadow:0 30px 120px rgba(0,0,0,.28);
      overflow:hidden;
      position:relative;
    }
    .modal-head{
      display:flex; align-items:center; justify-content:space-between;
      padding:12px 12px;
      border-bottom:1px solid rgba(15,23,42,.10);
      background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.82));
    }
    .modal-head .t{font-weight:1000}
    .modal-x{
      border:none; cursor:pointer;
      padding:10px 12px;
      border-radius:16px;
      border:1px solid rgba(15,23,42,.12);
      background:rgba(255,255,255,.78);
    }
    .modal-x:hover{background:rgba(47,107,255,.08); border-color:rgba(47,107,255,.20)}
    .modal-body{padding:16px 16px 18px; background:#fff}
    .reveal{opacity:0; transform: translateY(16px) scale(.985); transition: opacity .7s ease, transform .7s ease}
    .reveal.on{opacity:1; transform: translateY(0) scale(1)}
    @media (max-width: 980px){
      .hero{grid-template-columns:1fr; gap:14px}
      .hero-right{min-height: 520px}
      .scene{height: 520px}
      .split{grid-template-columns:1fr; gap:14px}
      .grid2{grid-template-columns:1fr}
      .grid3{grid-template-columns:1fr}
      .order{grid-template-columns: 1fr}
    }
    @media (max-width: 720px){
      .nav{display:none}
      .hamburger{display:inline-flex}
      .hero-left{padding:22px 18px 18px}
      .sec-body{padding:16px 16px 18px}
      .sec-head{padding:18px 16px 14px; flex-direction:column; align-items:flex-start}
      .fields{grid-template-columns:1fr}
      .inline2{grid-template-columns:1fr}
    }
    @media (prefers-reduced-motion: reduce){
      .reveal{transition:none}
      .btn,.pill,.nav a,.social a,.radio{transition:none}
    }