/* Amazstock Tools — общий дизайн-система (Apple/Stripe-стиль, шрифт LENS) */
:root{
  --blue:#2f6bff;--blue2:#4d8dff;--blueSoft:#eaf1ff;
  --ink:#0f1626;--ink2:#3a4a63;--mut:#7688a3;--faint:#aeb9ca;
  --bg:#f5f8fc;--surface:#ffffff;--line:#e7edf5;--line2:#f0f4fa;
  --green:#12b76a;--greenSoft:#e7f8f0;--amber:#f59e0b;--amberSoft:#fef4e5;--red:#ef4444;--redSoft:#fdeded;
  --radius:18px;--sh:0 1px 2px rgba(16,40,80,.04),0 10px 30px rgba(16,40,80,.06);
  --sh2:0 2px 6px rgba(16,40,80,.06),0 24px 60px rgba(16,40,80,.12);--tr:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 "Space Grotesk",Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:920px;margin:0 auto;padding:0 20px}
.wrap-wide{max-width:1120px}

/* header injected by lens.js */
.t-hdr{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.82);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.t-hdr .in{max-width:1120px;margin:0 auto;padding:0 20px;height:60px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.t-logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:17px;letter-spacing:-.02em}
.t-logo .dot{width:26px;height:26px;border-radius:9px;background:linear-gradient(135deg,var(--blue2),var(--blue));display:grid;place-items:center;color:#fff;font-size:14px;box-shadow:0 5px 14px rgba(47,107,255,.4)}
.t-logo small{color:var(--faint);font-weight:500;font-size:12px}

.btn{display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;font:inherit;font-weight:600;font-size:15px;border-radius:13px;padding:12px 20px;transition:.2s var(--tr);white-space:nowrap}
.btn-blue{background:linear-gradient(135deg,var(--blue2),var(--blue));color:#fff;box-shadow:0 8px 22px -8px rgba(47,107,255,.6)}
.btn-ghost{background:var(--surface);border:1px solid var(--line);color:var(--ink2)}
.btn-soft{background:var(--blueSoft);color:var(--blue)}
.btn:hover{transform:translateY(-1px);box-shadow:var(--sh2)}
.btn-lg{padding:15px 26px;font-size:16px}

h1{font-size:clamp(30px,5vw,50px);font-weight:700;letter-spacing:-.03em;line-height:1.05;margin:0}
h2{font-size:clamp(22px,3vw,30px);font-weight:700;letter-spacing:-.02em;margin:0}
.sub{color:var(--ink2);font-size:clamp(16px,2vw,19px);line-height:1.55;margin:16px 0 0;max-width:44em}
.kick{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);background:var(--blueSoft);padding:7px 13px;border-radius:999px}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--sh);padding:24px}
.hero{padding:clamp(40px,7vw,80px) 0 30px;text-align:center}
.hero .sub{margin-left:auto;margin-right:auto}

/* form controls */
.field{margin-bottom:16px}
.field label{display:block;font-size:13.5px;font-weight:600;color:var(--ink2);margin-bottom:7px}
.field .hint{color:var(--mut);font-weight:400}
.inp,select.inp{width:100%;border:1px solid var(--line);border-radius:13px;padding:13px 15px;font:inherit;font-size:16px;font-weight:600;color:var(--ink);background:var(--bg);transition:.15s}
.inp:focus{outline:0;border-color:var(--blue2);background:#fff;box-shadow:0 0 0 4px var(--blueSoft)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.row2{grid-template-columns:1fr}}
.range{width:100%;accent-color:var(--blue)}
.seg{display:flex;gap:6px;background:var(--line2);border-radius:13px;padding:4px}
.seg button{flex:1;border:0;background:transparent;padding:10px;border-radius:10px;font:inherit;font-weight:600;font-size:14px;color:var(--mut);cursor:pointer;transition:.15s}
.seg button.on{background:#fff;color:var(--ink);box-shadow:var(--sh)}

/* result */
.result{background:linear-gradient(160deg,#0e1b3a,#12245a);color:#fff;border-radius:var(--radius);padding:26px;text-align:center}
.result .big{font-size:clamp(34px,6vw,54px);font-weight:700;letter-spacing:-.03em;line-height:1}
.result .lbl{color:rgba(255,255,255,.6);font-size:13px;margin-top:6px}
.stat{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line2);font-size:15px}
.stat:last-child{border-bottom:0}.stat b{font-weight:700}
.tag{display:inline-block;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px}
.tag.ok{background:var(--greenSoft);color:var(--green)}.tag.warn{background:var(--amberSoft);color:var(--amber)}.tag.bad{background:var(--redSoft);color:var(--red)}

/* tool hub grid */
.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
@media(max-width:860px){.tools-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tools-grid{grid-template-columns:1fr}}
.tool-card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--sh);transition:.22s var(--tr);position:relative;overflow:hidden}
.tool-card:hover{transform:translateY(-4px);box-shadow:var(--sh2);border-color:#d7e2f2}
.tool-card .ic{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;font-size:26px;background:linear-gradient(135deg,var(--blueSoft),#f2f6ff);margin-bottom:14px}
.tool-card h3{font-size:17px;font-weight:700;margin:0 0 5px;letter-spacing:-.01em}
.tool-card p{font-size:13.5px;color:var(--mut);margin:0;line-height:1.5}
.tool-card .go{position:absolute;top:22px;right:22px;color:var(--faint);transition:.2s}
.tool-card:hover .go{color:var(--blue);transform:translateX(3px)}
.pillrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.pill{font-size:12.5px;font-weight:600;color:var(--ink2);background:var(--line2);border-radius:999px;padding:6px 12px}

/* LENS CTA (injected) */
.lens-cta{background:linear-gradient(135deg,#0b1226,#111f45);color:#fff;border-radius:22px;padding:clamp(26px,4vw,40px);margin:40px 0;position:relative;overflow:hidden}
.lens-cta::before{content:'';position:absolute;right:-10%;top:-30%;width:420px;height:420px;background:radial-gradient(closest-side,rgba(77,141,255,.35),transparent 70%);filter:blur(20px)}
.lens-cta .in{position:relative;max-width:640px}
.lens-cta .lk{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:#9fc2ff}
.lens-cta h2{color:#fff;margin:12px 0 10px}
.lens-cta p{color:rgba(226,233,246,.75);font-size:16px;line-height:1.6;margin:0 0 20px}
.lens-cta .acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.lens-cta .social{display:flex;gap:8px;margin-left:auto}
.lens-cta .social a{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:17px;transition:.2s}
.lens-cta .social a:hover{background:rgba(255,255,255,.16);transform:translateY(-2px)}

/* floating pill */
.lens-fab{position:fixed;right:16px;bottom:16px;z-index:60;display:inline-flex;align-items:center;gap:8px;background:#0e1b3a;color:#fff;font-weight:600;font-size:13.5px;padding:11px 15px;border-radius:999px;box-shadow:0 12px 34px -10px rgba(14,27,58,.7);transition:.2s var(--tr)}
.lens-fab:hover{transform:translateY(-2px)}
.lens-fab .dot{width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--blue2),var(--blue));display:grid;place-items:center;font-size:11px}

footer.t-ftr{border-top:1px solid var(--line);padding:30px 0;color:var(--mut);font-size:13.5px;text-align:center;margin-top:20px}
footer.t-ftr a{color:var(--blue)}
.priv{display:inline-flex;align-items:center;gap:7px;background:var(--greenSoft);color:#0a7a48;font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:999px;margin-top:10px}

/* faq / seo */
.faq{margin-top:14px}
.faq details{border:1px solid var(--line);border-radius:14px;margin-top:10px;background:var(--surface)}
.faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:600;font-size:15.5px;display:flex;gap:10px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pl{margin-left:auto;color:var(--faint);transition:.2s}
.faq details[open] summary .pl{transform:rotate(45deg)}
.faq .a{padding:0 18px 16px;color:var(--ink2);line-height:1.6;font-size:14.5px}
.prose{color:var(--ink2);line-height:1.7;font-size:16px}
.prose h2{margin:28px 0 10px;color:var(--ink)}
.hidden{display:none!important}

/* ============ premium pass (2026-07) ============ */
body::before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(58% 42% at 12% -2%, rgba(77,141,255,.12), transparent 60%),
    radial-gradient(46% 40% at 102% 6%, rgba(124,92,255,.10), transparent 62%),
    radial-gradient(42% 42% at 92% 104%, rgba(18,183,106,.07), transparent 60%);}
.grad{background:linear-gradient(100deg,#2f6bff,#7c5cff 42%,#4d8dff 78%,#2f6bff);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:tgrad 7s linear infinite}
@keyframes tgrad{to{background-position:-250% 0}}
.hero .kick{box-shadow:0 8px 22px -10px rgba(47,107,255,.45)}
.stats{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.stats .s{background:rgba(255,255,255,.6);border:1px solid var(--line);border-radius:14px;padding:12px 20px;backdrop-filter:blur(6px);min-width:120px}
.stats .s b{display:block;font-size:20px;font-weight:700;letter-spacing:-.02em}
.stats .s span{font-size:12px;color:var(--mut);font-weight:500}
.tool-card{--c:#2f6bff;position:relative;overflow:hidden;opacity:0;transform:translateY(22px);
  transition:opacity .6s var(--tr),transform .6s var(--tr),box-shadow .25s,border-color .25s;transition-delay:calc(var(--i,0)*55ms)}
.tool-card.in{opacity:1;transform:none}
.tool-card::before{content:'';position:absolute;inset:0;border-radius:var(--radius);padding:1.3px;pointer-events:none;
  background:linear-gradient(135deg,var(--c),transparent 55%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s}
.tool-card::after{content:'';position:absolute;top:0;left:-70%;width:48%;height:100%;transform:skewX(-16deg);
  background:linear-gradient(90deg,transparent,rgba(47,107,255,.08),transparent);transition:left .6s ease;pointer-events:none}
.tool-card:hover{transform:translateY(-6px);border-color:transparent;box-shadow:0 26px 60px -26px color-mix(in srgb,var(--c) 60%,transparent)}
.tool-card:hover::before{opacity:1}
.tool-card:hover::after{left:135%}
.tool-card .ic{background:linear-gradient(135deg,color-mix(in srgb,var(--c) 24%,#fff),color-mix(in srgb,var(--c) 7%,#fff));box-shadow:0 10px 24px -14px var(--c);transition:transform .32s var(--tr)}
.tool-card:hover .ic{transform:translateY(-2px) scale(1.07) rotate(-5deg)}
.tool-card .go{font-size:18px}
.c-blue{--c:#2f6bff}.c-green{--c:#12b76a}.c-amber{--c:#f59e0b}.c-violet{--c:#7c5cff}.c-pink{--c:#ec4899}.c-cyan{--c:#06b6d4}
/* result card gets a soft glow */
.result{box-shadow:0 24px 60px -28px rgba(14,27,58,.7)}
.result::after{content:'';position:absolute}
.card{position:relative}
/* buttons a touch more alive */
.btn-blue:hover{box-shadow:0 14px 34px -10px rgba(47,107,255,.75)}