:root{--bg:#F1F5F9;--surface:#FFFFFF;--border:rgba(0,0,0,0.08);--text:#0F172A;--muted:#617188;--dim:#94A3B8;--accent:#1D4ED8;--cta:#1D4ED8;--cta-text:#fff;--r:8px;}
    *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);font-size:16px;line-height:1.6}
    a{color:var(--accent);text-decoration:none}
    a:hover{text-decoration:underline}
    img{max-width:100%;display:block}

    /* layout */
    .w{width:100%;max-width:1080px;margin:0 auto;padding:0 20px}
    .s{padding:64px 0}
    .s-alt{background:var(--surface)}

    /* age bar */
    .ab{background:var(--accent);color:var(--cta-text);text-align:center;font-size:12px;font-weight:600;padding:6px 16px;letter-spacing:.04em}

    /* nav */
    .nav{position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:1px solid var(--border);transition:box-shadow .2s}
    .nav.scrolled{box-shadow:0 2px 12px rgba(0,0,0,.3)}
    .nav-in{display:flex;align-items:center;gap:24px;height:60px}
    .nav-logo{font-size:18px;font-weight:700;color:var(--text);white-space:nowrap;margin-right:auto}
    .nav-links{display:flex;gap:20px}
    .nav-links a{font-size:14px;color:var(--muted);transition:color .15s}
    .nav-links a:hover{color:var(--text);text-decoration:none}
    .hbg{display:none;background:none;border:none;color:var(--text);font-size:22px;cursor:pointer;padding:4px}
    .mob-menu{display:none;flex-direction:column;gap:0;background:var(--surface);border-top:1px solid var(--border)}
    .mob-menu a{display:block;padding:14px 20px;font-size:15px;color:var(--text);border-bottom:1px solid var(--border)}

    /* buttons */
    .btn{display:inline-block;padding:10px 22px;border-radius:var(--r);font-weight:600;font-size:14px;cursor:pointer;transition:opacity .15s;border:none;text-align:center}
    .btn:hover{opacity:.85;text-decoration:none}
    .btn-p{background:var(--cta);color:var(--cta-text)}
    .btn-o{background:transparent;color:var(--accent);border:1px solid var(--accent)}
    .btn-sm{padding:7px 16px;font-size:13px}
    .btn-lg{padding:14px 32px;font-size:16px}

    /* hero */
    .hero{padding:80px 0 64px;text-align:center}
    .hero h1{font-size:clamp(28px,5vw,52px);font-weight:800;line-height:1.15;margin-bottom:20px;letter-spacing:-.02em}
    .hero p{font-size:18px;color:var(--muted);max-width:600px;margin:0 auto 32px}
    .hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

    /* table */
    .tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r);border:1px solid var(--border)}
    table{width:100%;border-collapse:collapse;font-size:14px}
    thead th{background:var(--surface);padding:12px 14px;text-align:left;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);border-bottom:1px solid var(--border)}
    tbody tr{border-bottom:1px solid var(--border);transition:background .15s}
    tbody tr:last-child{border-bottom:none}
    tbody tr:hover{background:var(--dim)}
    tbody td{padding:14px;vertical-align:middle}
    .ni{display:inline-block;background:var(--dim);color:var(--accent);font-weight:700;font-size:13px;padding:3px 9px;border-radius:4px}
    .nl{display:flex;align-items:center;gap:10px}
    .nl-img{width:36px;height:36px;object-fit:contain;border-radius:4px}
    .lc{font-size:12px;font-weight:600;color:#4ade80}

    /* reviews */
    .rv{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);padding:28px;margin-bottom:20px}
    .rv-top{display:flex;align-items:center;gap:14px;margin-bottom:16px}
    .rv-img{width:48px;height:48px;object-fit:contain;border-radius:6px}
    .rv-head h3{font-size:18px;font-weight:700;margin-bottom:4px}
    .rv-bonus{font-size:13px;color:var(--accent);font-weight:600}
    .rv-text{color:var(--muted);margin-bottom:20px;line-height:1.7}

    /* faq */
    .fq{border-bottom:1px solid var(--border)}
    .fq:first-child{border-top:1px solid var(--border)}
    .fq-q{width:100%;background:none;border:none;text-align:left;padding:18px 0;font-size:15px;font-weight:600;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}
    .fq-ic{font-size:20px;color:var(--accent);flex-shrink:0;line-height:1}
    .fq-a{padding:0 0 18px}
    .fq-a p{color:var(--muted);line-height:1.7}

    /* footer */
    .ft{padding:40px 0;border-top:1px solid var(--border);text-align:center}
    .ft p{font-size:12px;color:var(--muted);max-width:640px;margin:0 auto 8px}

    /* section headings */
    .sh{font-size:clamp(22px,3vw,32px);font-weight:800;margin-bottom:8px;letter-spacing:-.02em}
    .sh-sub{color:var(--muted);margin-bottom:36px}

    /* responsive table → stacked cards at <=640px */
    @media(max-width:640px){
      .tbl-wrap{border:none}
      table thead{display:none}
      table,tbody,tr,td{display:block;width:100%}
      tbody tr{background:var(--surface);border:1px solid var(--border);border-radius:var(--r);margin-bottom:12px;padding:12px}
      tbody td{padding:6px 0;border:none;display:flex;justify-content:space-between;align-items:center;font-size:14px}
      tbody td::before{content:attr(data-label);font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
    }
    @media(max-width:768px){
      .nav-links,.nav .btn-sm{display:none}
      .hbg{display:block}
      .s{padding:44px 0}
    }
    @media(max-width:480px){
      .hero{padding:48px 0 40px}
      .rv{padding:20px}
    }