:root{
    --font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --font-display:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --font-mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
    --bg:#FFFFFF;
    --bg-soft:#F5F8FE;
    --blue:#2E90FA;
    --blue-press:#1B7CE8;
    --blue-ink:#1366D6;
    --blue-tint:#EAF3FF;
    --blue-tint2:#DCEBFF;
    --ink:#0B1220;
    --ink-2:#475067;
    --muted:#8A93A6;
    --line:#E7ECF3;
    --paper:#FCFCFA;
    --paper-ink:#1B1A16;
    --paper-line:#D9D6CC;
    --maxw:1140px;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    margin:0;background:var(--bg);color:var(--ink);
    font-family:var(--font-sans);font-size:17px;line-height:1.6;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;
  }
  h1,h2,h3{font-family:var(--font-display);font-weight:700;letter-spacing:-0.025em;line-height:1.04;margin:0}
  a{color:inherit}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 26px}
  .mono{font-family:var(--font-mono)}
  .eyebrow{display:inline-block;font-family:var(--font-mono);font-size:12px;font-weight:700;
    letter-spacing:0.16em;text-transform:uppercase;color:var(--blue-ink);
    background:var(--blue-tint);padding:6px 13px;border-radius:100px}

  .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-display);font-weight:600;
    font-size:16px;padding:15px 27px;border-radius:100px;border:none;cursor:pointer;
    background:var(--blue);color:#fff;text-decoration:none;
    transition:transform .15s ease,background .15s ease,box-shadow .15s ease;
    box-shadow:0 8px 22px -10px rgba(46,144,250,0.7);}
  .btn:hover{background:var(--blue-press);transform:translateY(-2px);box-shadow:0 14px 30px -10px rgba(46,144,250,0.75)}
  .btn:active{transform:translateY(0)}
  .btn .arrow{transition:transform .2s ease}
  .btn:hover .arrow{transform:translateX(4px)}
  .btn-ghost{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:none;padding:14px 24px}
  .btn-ghost:hover{background:var(--bg-soft);border-color:#cdd6e4;box-shadow:none}

  
  header.nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,0.82);
    backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
  header.nav.scrolled{border-color:var(--line)}
  .nav-in{display:flex;align-items:center;justify-content:space-between;height:74px}
  .logo{font-family:var(--font-display);font-weight:800;font-size:22px;letter-spacing:-0.04em;display:flex;align-items:center;gap:9px}
  .logo .mk{width:26px;height:26px;border-radius:8px;background:var(--blue);display:flex;align-items:center;justify-content:center}
  .logo .mk::after{content:"";width:11px;height:11px;border-radius:3px;background:#fff}
  .nav-links{display:flex;align-items:center;gap:30px}
  .nav-links a.link{font-size:15px;color:var(--ink-2);text-decoration:none;font-weight:500;transition:color .15s}
  .nav-links a.link:hover{color:var(--ink)}
  .btn-sm{padding:11px 21px;font-size:15px}

  
  .hero{position:relative;padding:78px 0 104px;overflow:hidden;
    background:#0A0E18;color:#EAF0FB;border-radius:0 0 36px 36px}
  .hero::before{content:"";position:absolute;top:-160px;right:-150px;width:640px;height:640px;border-radius:50%;
    background:radial-gradient(circle,rgba(46,144,250,0.30),transparent 62%);z-index:0}
  .hero::after{content:"";position:absolute;bottom:-220px;left:-180px;width:580px;height:580px;border-radius:50%;
    background:radial-gradient(circle,rgba(108,181,255,0.18),transparent 62%);z-index:0}
  .hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr 0.9fr;gap:54px;align-items:center}
  .hero .eyebrow{background:rgba(46,144,250,0.16);color:#8FC2FF}
  .hero h1{font-size:clamp(42px,6.2vw,72px);margin:22px 0 0;color:#FFFFFF}
  .hero h1 .ln{display:block;overflow:hidden}
  .hero h1 .ln span{display:inline-block;transform:translateY(110%);animation:riseIn .7s cubic-bezier(.2,.7,.2,1) forwards}
  .hero h1 .ln:nth-child(2) span{animation-delay:.08s}
  .hero h1 .ln:nth-child(3) span{animation-delay:.16s;color:#6BB5FF}
  @keyframes riseIn{to{transform:translateY(0)}}
  .hero .sub{font-size:19px;color:#A9B3C6;max-width:32ch;margin:26px 0 34px;line-height:1.55;
    opacity:0;animation:fadeUp .7s ease .4s forwards}
  .hero .btn-ghost{background:transparent;color:#EAF0FB;border-color:rgba(255,255,255,0.22)}
  .hero .btn-ghost:hover{background:rgba(255,255,255,0.07);border-color:rgba(255,255,255,0.5)}
  @keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  .hero-cta{display:flex;flex-wrap:wrap;gap:14px;opacity:0;animation:fadeUp .7s ease .52s forwards}
  .hero-trust{margin-top:30px;display:flex;gap:22px;flex-wrap:wrap;font-family:var(--font-mono);
    font-size:13px;color:var(--muted);opacity:0;animation:fadeUp .7s ease .62s forwards}
  .hero-trust span{display:flex;align-items:center;gap:8px}
  .hero-trust .ok{color:var(--blue)}
  .hero-right{position:relative;display:flex;justify-content:center}

  
  .receipt{background:var(--paper);color:var(--paper-ink);font-family:var(--font-mono);
    font-size:12.5px;line-height:1.55;width:340px;padding:24px 24px 20px;border-radius:3px;
    box-shadow:0 30px 60px -24px rgba(11,18,32,0.35),0 2px 0 rgba(0,0,0,0.04);position:relative}
  .receipt.float{animation:floaty 6s ease-in-out infinite}
  @keyframes floaty{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-12px) rotate(-1.2deg)}}
  .receipt::before,.receipt::after{content:"";position:absolute;left:0;right:0;height:10px;
    background-repeat:repeat-x;background-size:14px 10px}
  .receipt::before{top:-9px;
    background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='14'%20height='10'%3E%3Cpath%20d='M0,10L7,0L14,10Z'%20fill='%23FCFCFA'/%3E%3C/svg%3E")}
  .receipt::after{bottom:-9px;
    background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='14'%20height='10'%3E%3Cpath%20d='M0,0L7,10L14,0Z'%20fill='%23FCFCFA'/%3E%3C/svg%3E")}
  .rc-center{text-align:center}
  .rc-logo{font-weight:700;font-size:18px;letter-spacing:0.14em}
  .rc-small{color:#6b6a62;font-size:10.5px;line-height:1.5}
  .rc-sep{border:0;border-top:1px dashed var(--paper-line);margin:11px 0}
  .rc-meta{display:flex;justify-content:space-between;color:#6b6a62;font-size:10.5px}
  .rc-col{font-size:10.5px;color:#6b6a62;display:flex;justify-content:space-between;letter-spacing:0.04em}
  .rc-item{display:flex;justify-content:space-between;gap:10px;padding:3px 0}
  .rc-item .nm{display:flex;gap:8px}
  .rc-item .nm .n{color:#9a988e}
  .rc-item .amt{white-space:nowrap}
  .rc-note{color:#8a887e;font-size:10.5px;padding:0 0 4px 22px}
  .rc-sum{display:flex;justify-content:space-between;font-weight:700;font-size:15px;padding:4px 0}
  .rc-sum .v{color:var(--blue-ink)}
  .rc-pay{display:flex;justify-content:space-between;font-size:11.5px}
  .rc-tax{font-size:10px;color:#6b6a62}
  .rc-tax .row{display:flex;justify-content:space-between}
  .rc-tse{font-size:9.5px;color:#8a887e;word-break:break-all;line-height:1.5}
  .rc-thanks{text-align:center;font-weight:700;font-size:11.5px;letter-spacing:0.1em;margin-top:4px}
  .barcode{height:42px;margin:12px auto 6px;width:80%;
    background:repeating-linear-gradient(90deg,#1b1a16 0 2px,transparent 2px 4px,#1b1a16 4px 5px,transparent 5px 9px,#1b1a16 9px 12px,transparent 12px 14px,#1b1a16 14px 15px,transparent 15px 19px);}
  .barcode-num{text-align:center;font-size:9.5px;letter-spacing:0.3em;color:#6b6a62}

  
  section{padding:96px 0}
  .sec-head{max-width:660px;margin-bottom:52px}
  .sec-head h2{font-size:clamp(31px,4.4vw,46px);margin-top:16px}
  .sec-head p{color:var(--ink-2);font-size:18px;margin:16px 0 0}
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease}
  .reveal.in{opacity:1;transform:none}

  
  .process{background:var(--bg-soft)}
  .proc-grid{display:grid;grid-template-columns:0.95fr 1.05fr;gap:64px;align-items:center}
  .proc-intro h2{font-size:clamp(31px,4.4vw,48px);margin-top:16px}
  .proc-intro p{color:var(--ink-2);font-size:18px;margin:18px 0 26px;max-width:34ch}
  .proc-chip{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
    border-radius:100px;padding:10px 18px;font-family:var(--font-mono);font-size:13px;color:var(--ink)}
  .proc-chip b{color:var(--blue-ink)}
  .proc-receipt-wrap{display:flex;justify-content:center}
  .proc-receipt{width:380px}
  .rc-step{display:flex;justify-content:space-between;gap:10px;padding:9px 0;align-items:flex-start;
    opacity:0;transform:translateY(8px)}
  .rc-step.in{opacity:1;transform:none;transition:opacity .5s ease,transform .5s ease}
  .rc-step .l{display:flex;gap:9px}
  .rc-step .l .num{color:var(--blue-ink);font-weight:700}
  .rc-step .l .tt{font-weight:700;color:var(--paper-ink)}
  .rc-step .l .dd{color:#8a887e;font-size:10.5px;margin-top:2px}
  .rc-step .tag{font-size:10px;font-weight:700;letter-spacing:0.08em;white-space:nowrap}
  .rc-step .tag.du{color:var(--blue-ink)}
  .rc-step .tag.wir{color:#5a8a5a}

  
  .aud-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
  .aud-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:32px 30px;
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
  .aud-card:hover{transform:translateY(-6px);box-shadow:0 24px 44px -26px rgba(11,18,32,0.28);border-color:var(--blue-tint2)}
  .aud-ic{width:52px;height:52px;border-radius:15px;background:var(--blue-tint);display:flex;align-items:center;justify-content:center;margin-bottom:22px}
  .aud-ic svg{width:26px;height:26px;stroke:var(--blue-ink);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .aud-card h3{font-size:22px}
  .aud-card p{color:var(--ink-2);font-size:15.5px;margin:12px 0 0;line-height:1.55}

  
  .value{background:var(--bg-soft)}
  .value-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
  .vcard{background:#fff;border:1px solid var(--line);border-radius:22px;padding:40px 38px}
  .vcard .tag{font-family:var(--font-mono);font-size:12px;letter-spacing:0.13em;text-transform:uppercase;color:var(--muted)}
  .vcard .big{font-family:var(--font-display);font-weight:800;font-size:50px;color:var(--blue);letter-spacing:-0.04em;line-height:1;margin-top:14px}
  .vcard h3{font-size:23px;margin:16px 0 0}
  .vcard p{color:var(--ink-2);font-size:16px;margin:12px 0 0}

  
  .quiz-sec{padding:104px 0}
  .quiz-head{text-align:center;max-width:620px;margin:0 auto 40px}
  .quiz-head h2{font-size:clamp(34px,4.8vw,54px);margin-top:16px}
  .quiz-head p{color:var(--ink-2);font-size:18px;margin:16px 0 0}
  .quiz-card{max-width:680px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:28px;
    box-shadow:0 30px 70px -40px rgba(11,18,32,0.4);padding:38px 40px 34px;position:relative;overflow:hidden}
  .quiz-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}
  .quiz-count{font-family:var(--font-mono);font-size:13px;color:var(--muted);letter-spacing:0.08em}
  .quiz-back{font-family:var(--font-display);font-size:14px;font-weight:600;color:var(--ink-2);background:none;border:none;
    cursor:pointer;display:none;align-items:center;gap:6px;padding:6px 8px;border-radius:8px}
  .quiz-back:hover{color:var(--ink);background:var(--bg-soft)}
  .quiz-back.show{display:inline-flex}
  .progress{height:7px;background:var(--blue-tint);border-radius:100px;overflow:hidden;margin-bottom:30px}
  .progress .bar{height:100%;width:20%;background:var(--blue);border-radius:100px;transition:width .45s cubic-bezier(.2,.7,.2,1)}

  .steps{position:relative}
  .step{display:none}
  .step.active{display:block;animation:stepIn .42s cubic-bezier(.2,.7,.2,1)}
  @keyframes stepIn{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
  .step.back.active{animation:stepInBack .42s cubic-bezier(.2,.7,.2,1)}
  @keyframes stepInBack{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
  .q-title{font-family:var(--font-display);font-weight:700;font-size:25px;letter-spacing:-0.02em;margin-bottom:6px}
  .q-sub{color:var(--ink-2);font-size:15.5px;margin-bottom:24px}
  .opts{display:grid;gap:12px}
  .opts.two{grid-template-columns:1fr 1fr}
  .opt{display:flex;align-items:center;gap:14px;text-align:left;width:100%;background:#fff;border:1.5px solid var(--line);
    border-radius:16px;padding:18px 20px;cursor:pointer;font-family:var(--font-sans);font-size:16px;color:var(--ink);
    transition:border-color .15s,background .15s,transform .12s}
  .opt:hover{border-color:var(--blue);background:var(--blue-tint)}
  .opt:active{transform:scale(.99)}
  .opt.sel{border-color:var(--blue);background:var(--blue-tint);box-shadow:0 0 0 3px rgba(46,144,250,0.15)}
  .opt .oic{width:42px;height:42px;border-radius:12px;background:var(--blue-tint);display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .opt:hover .oic,.opt.sel .oic{background:#fff}
  .opt .oic svg{width:22px;height:22px;stroke:var(--blue-ink);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
  .opt .otxt{display:flex;flex-direction:column}
  .opt .otxt b{font-family:var(--font-display);font-weight:600;font-size:16px;letter-spacing:-0.01em}
  .opt .otxt small{color:var(--muted);font-size:13px;margin-top:1px}

  
  .fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .field{display:flex;flex-direction:column}
  .field.full{grid-column:1/-1}
  .field label{font-family:var(--font-mono);font-size:11px;letter-spacing:0.09em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
  .field input{padding:14px 15px;border:1.5px solid var(--line);border-radius:13px;font-family:var(--font-sans);font-size:15.5px;color:var(--ink);transition:border-color .15s,box-shadow .15s}
  .field input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(46,144,250,0.15)}
  .field input.err{border-color:#E5484D}
  .quiz-submit{width:100%;justify-content:center;margin-top:22px}
  .quiz-fine{text-align:center;font-size:12.5px;color:var(--muted);margin-top:14px;line-height:1.5}
  .privacy-consent{display:flex;align-items:flex-start;gap:10px;margin-top:18px;font-size:13.5px;color:var(--ink-2);line-height:1.45}
  .privacy-consent input{width:18px;height:18px;margin-top:2px;accent-color:var(--blue);flex-shrink:0}
  .privacy-consent a{color:var(--blue-ink);font-weight:600;text-decoration:none}
  .privacy-consent a:hover{text-decoration:underline}
  .privacy-consent.err{color:#E5484D}
  .summary-chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 20px}
  .summary-chips .c{font-family:var(--font-mono);font-size:11.5px;background:var(--bg-soft);border:1px solid var(--line);border-radius:100px;padding:6px 12px;color:var(--ink-2)}
  .summary-chips .c b{color:var(--blue-ink);font-weight:700}

  
  .done{display:none;text-align:center;animation:stepIn .5s ease}
  .done.show{display:block}
  .done-rec{width:320px;margin:0 auto 24px}
  .done h3{font-size:26px;margin-bottom:10px}
  .done p{color:var(--ink-2);font-size:16px;max-width:42ch;margin:0 auto}
  .check-pop{width:64px;height:64px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;animation:pop .5s cubic-bezier(.2,1.4,.5,1)}
  @keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
  .check-pop svg{width:30px;height:30px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

  
  footer{padding:56px 0 64px}
  .foot-in{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;border-top:1px solid var(--line);padding-top:34px}
  .foot-links{display:flex;gap:26px;font-size:14.5px}
  .foot-links a{text-decoration:none;color:var(--ink-2)}
  .foot-links a:hover{color:var(--ink)}
  .foot-cr{font-family:var(--font-mono);font-size:12.5px;color:var(--muted)}

  @media (max-width:900px){
    .hero-grid,.proc-grid,.value-grid{grid-template-columns:1fr;gap:46px}
    .aud-grid{grid-template-columns:1fr}
    .nav-links a.link{display:none}
    section,.quiz-sec{padding:74px 0}
    .quiz-card{padding:30px 24px 28px}
    .fields,.opts.two{grid-template-columns:1fr}
  }
  @media (prefers-reduced-motion:reduce){
    *{animation:none!important;scroll-behavior:auto;transition:none!important}
    .hero h1 .ln span{transform:none}
    .hero .sub,.hero-cta,.hero-trust{opacity:1}
    .reveal{opacity:1;transform:none}
    .rc-step{opacity:1;transform:none}
  }

.legal-hero{padding:72px 0 42px;background:var(--bg-soft)}
.legal-hero h1{font-size:clamp(36px,5vw,58px);margin-top:14px}
.legal-main{padding:56px 0 84px}
.legal-content{max-width:860px}
.legal-content h2{font-size:28px;margin:34px 0 12px}
.legal-content h3{font-family:var(--font-display);font-size:20px;margin:26px 0 8px}
.legal-content p,.legal-content li{color:var(--ink-2);font-size:16px;line-height:1.7}
.legal-content ul{padding-left:22px}
.legal-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;margin:22px 0}
.skip-link{position:absolute;left:-999px;top:12px;background:#fff;color:var(--ink);padding:10px 14px;border-radius:10px;z-index:100}
.skip-link:focus{left:12px}
