/* Free trading tools (/tools/): calculator layout on top of funnel.css. */
.tool-hero{padding:clamp(34px,6vw,64px) 0 18px;text-align:center}
.tool-hero h1{font-size:clamp(32px,5.4vw,52px)}
.tool-hero .lead{max-width:640px;margin:14px auto 0}
.tool{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media(max-width:820px){.tool{grid-template-columns:1fr}}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:22px}
.panel h2{font-size:17px;margin-bottom:14px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tool label.field{display:block;margin-bottom:12px}
.tool label.field span{display:block;font-size:12.5px;color:var(--muted);margin-bottom:6px;letter-spacing:.02em}
.tool input,.tool select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--ink);font:500 16px 'IBM Plex Mono',monospace}
.tool select{font-family:'Space Grotesk',sans-serif}
.seg{display:flex;gap:6px;margin-bottom:12px}
.seg button{flex:1;padding:9px;border-radius:10px;border:1px solid var(--line);background:none;color:var(--muted);font:600 13px 'Space Grotesk',sans-serif;cursor:pointer}
.seg button.on{background:var(--foil);color:#0A0A0C;border-color:transparent}
.out{display:grid;gap:10px}
.out .big{font:500 44px 'IBM Plex Mono',monospace;color:var(--gold);line-height:1.1}
.out .big small{font-size:16px;color:var(--muted)}
.kv{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line-soft);padding-top:10px;font-size:14.5px}
.kv b{font-family:'IBM Plex Mono',monospace;font-weight:500}
.note{font-size:13px;color:var(--muted);margin-top:8px}
.pos{color:var(--pos)}.neg{color:var(--live)}
.cta-band{margin:34px auto 10px;max-width:860px;text-align:center;border:1px solid rgba(232,199,102,.3);background:rgba(232,199,102,.05);border-radius:20px;padding:26px 22px}
.cta-band h3{font-family:'Playfair Display',serif;font-size:clamp(22px,3vw,30px);margin-bottom:8px}
.cta-band p{color:var(--muted);max-width:560px;margin:0 auto 16px}
.cta-band .cta-row{justify-content:center}
.toolgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:860px){.toolgrid{grid-template-columns:1fr}}
.toolgrid a{display:block;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:22px;transition:transform .2s,border-color .2s}
.toolgrid a:hover{transform:translateY(-3px);border-color:rgba(232,199,102,.45)}
.toolgrid .ic{font-size:28px}
.toolgrid h3{font-size:18px;margin:10px 0 6px}
.toolgrid p{color:var(--muted);font-size:14px}
.sess{display:grid;gap:10px}
.sess .s{display:grid;grid-template-columns:1fr auto;gap:6px;align-items:center;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.sess .s.open{border-color:rgba(126,226,154,.45);background:rgba(126,226,154,.05)}
.sess .s b{font-size:16px}
.sess .s small{color:var(--muted);font-size:13px;display:block;margin-top:2px}
.sess .st{font:600 12px 'Space Grotesk',sans-serif;letter-spacing:.08em;padding:5px 10px;border-radius:20px;border:1px solid var(--line);color:var(--muted)}
.sess .open .st{color:var(--pos);border-color:rgba(126,226,154,.5)}
.clock{font:500 clamp(36px,7vw,56px) 'IBM Plex Mono',monospace;text-align:center;color:var(--gold)}
.howto{max-width:760px;margin:30px auto 0;color:#cfccc4;font-size:15px}
.howto h2{font-size:20px;margin:22px 0 8px;color:var(--ink)}
.howto p,.howto li{margin-bottom:8px}
.howto ul{padding-left:20px}
