/* Graphican — search landing pages for the free tools (/tools/<slug>/) */
.lp-page { background:var(--bg); color:var(--text); }
.lp { max-width:980px; margin:0 auto; padding:118px var(--gutter) 40px; font-family:var(--body); }
.lp a { color:inherit; }
.lp-crumbs { display:flex; flex-wrap:wrap; gap:8px; font-size:13px; color:var(--dim); margin-bottom:28px; }
.lp-crumbs a { color:var(--muted); text-decoration:none; }
.lp-crumbs a:hover { color:#fff; }

.lp-hero { text-align:center; padding-bottom:18px; }
.lp-kicker { font-size:12px; letter-spacing:.14em; color:var(--v2); margin:0 0 14px; font-weight:600; }
.lp-hero h1 { font-family:var(--display); font-weight:700; font-size:clamp(34px, 6vw, 64px); line-height:1.03; letter-spacing:-.02em; margin:0 0 18px; }
.lp-lead { max-width:680px; margin:0 auto 30px; color:var(--muted); font-size:clamp(15px, 1.6vw, 18px); line-height:1.6; }

.lp-drop { display:flex; flex-direction:column; align-items:center; gap:12px; max-width:680px; margin:0 auto; padding:44px 20px;
  border:1.5px dashed rgba(164,151,255,.45); border-radius:22px; cursor:pointer;
  background:radial-gradient(120% 140% at 50% 0%, rgba(109,86,250,.16), rgba(22,22,31,.6) 60%); transition:border-color .2s, background .2s, transform .2s; }
.lp-drop:hover, .lp-drop.over { border-color:var(--v2); background:radial-gradient(120% 140% at 50% 0%, rgba(109,86,250,.28), rgba(22,22,31,.7) 60%); }
.lp-drop.over { transform:scale(1.01); }
.lp-drop.busy { pointer-events:none; opacity:.7; }
.lp-drop-ic { width:46px; height:46px; border-radius:14px; display:grid; place-items:center; background:rgba(164,151,255,.14); color:var(--v1); }
.lp-drop-ic svg { width:24px; height:24px; }
.lp-btn { display:inline-flex; align-items:center; height:50px; padding:0 30px; border-radius:999px; background:var(--v3); color:#fff; font-weight:600; font-size:16px;
  box-shadow:0 10px 30px -10px rgba(109,86,250,.8); }
.lp-drop:hover .lp-btn { background:#7d68ff; }
.lp-drop-s { font-size:13px; color:var(--dim); }
.lp-trust { list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:8px 18px; padding:0; margin:20px 0 0; font-size:13px; color:var(--muted); }
.lp-trust li::before { content:"✓"; color:var(--v2); margin-right:6px; font-weight:700; }

.lp-sec { margin-top:72px; }
.lp-sec h2 { font-family:var(--display); font-size:clamp(22px, 2.6vw, 30px); letter-spacing:-.01em; margin:0 0 22px; font-weight:700; }
.lp-steps { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.lp-steps li { background:var(--panel); border:1px solid var(--line-soft); border-radius:18px; padding:22px; }
.lp-steps p { margin:12px 0 0; color:var(--muted); line-height:1.55; font-size:15px; }
.lp-n { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:rgba(164,151,255,.16); color:var(--v1); font-weight:700; font-size:14px; }
.lp-feats { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 28px; }
.lp-feats li { display:flex; flex-direction:column; gap:4px; padding:16px 0; border-top:1px solid var(--line-soft); }
.lp-feats b { font-size:16px; }
.lp-feats span { color:var(--muted); font-size:14.5px; line-height:1.5; }
.lp-faq { border-top:1px solid var(--line-soft); }
.lp-q { border-bottom:1px solid var(--line-soft); }
.lp-q summary { cursor:pointer; list-style:none; padding:18px 36px 18px 0; font-weight:600; font-size:16px; position:relative; }
.lp-q summary::-webkit-details-marker { display:none; }
.lp-q summary::after { content:"+"; position:absolute; right:4px; top:14px; font-size:22px; color:var(--v2); transition:transform .2s; }
.lp-q[open] summary::after { transform:rotate(45deg); }
.lp-q p { margin:0 0 18px; color:var(--muted); line-height:1.6; max-width:760px; }
.lp-q a { color:var(--v2); }
.lp-cards { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; }
.lp-card { display:flex; flex-direction:column; gap:8px; padding:18px; border-radius:16px; background:var(--panel); border:1px solid var(--line-soft); text-decoration:none; transition:border-color .2s, transform .2s; }
.lp-card:hover { border-color:rgba(164,151,255,.5); transform:translateY(-2px); }
.lp-card b { font-size:15px; }
.lp-card span { font-size:13px; color:var(--muted); line-height:1.45; }
.lp-links { display:flex; flex-wrap:wrap; gap:8px; }
.lp-links a { padding:8px 14px; border-radius:999px; border:1px solid var(--line); font-size:14px; text-decoration:none; color:var(--muted); transition:color .2s, border-color .2s; }
.lp-links a:hover { color:#fff; border-color:var(--v2); }
.lp-foot { max-width:980px; margin:40px auto 0; padding:28px var(--gutter) 48px; border-top:1px solid var(--line-soft); color:var(--dim); font-size:14px; line-height:1.6; }
.lp-foot a { color:var(--muted); }
.lp-foot a:hover { color:#fff; }

@media (max-width:820px) {
  .lp { padding-top:96px; }
  .lp-steps { grid-template-columns:1fr; }
  .lp-feats { grid-template-columns:1fr; }
  .lp-cards { grid-template-columns:1fr 1fr; }
  .lp-drop { padding:32px 16px; }
  .lp-sec { margin-top:56px; }
}
@media (max-width:420px) { .lp-cards { grid-template-columns:1fr; } }