/* Shared styles for Leaditio free tools (calculators). Same design system as the main site. */
:root{--black:#080A0F;--navy:#0D1421;--card:#141C2E;--border:rgba(255,255,255,0.07);--gold:#E8B84B;--gold-light:#F5D07A;--gold-dim:rgba(232,184,75,0.15);--teal:#00D4AA;--red:#FF4757;--white:#F0F4FF;--muted:#8892A4;--font-display:'Bebas Neue',sans-serif;--font-serif:'DM Serif Display',serif;--font-body:'DM Sans',sans-serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:var(--black);color:var(--white);font-family:var(--font-body);font-size:16px;line-height:1.6;overflow-x:hidden}
a{color:var(--gold)}
nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 60px;border-bottom:1px solid var(--border)}
.nav-logo{font-family:var(--font-display);font-size:28px;letter-spacing:3px;color:var(--white);text-decoration:none}.nav-logo span{color:var(--gold)}
.nav-links{display:flex;gap:20px;font-size:13px}.nav-links a{color:var(--muted);text-decoration:none;text-transform:uppercase;letter-spacing:1px}.nav-links a:hover{color:var(--white)}
.wrap{max-width:1100px;margin:0 auto;padding:0 60px}
.crumbs{font-size:13px;color:var(--muted);padding-top:28px}.crumbs a{color:var(--muted);text-decoration:none}
.hero{padding:28px 0 32px}
.label{font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
h1{font-family:var(--font-display);font-size:clamp(40px,6vw,76px);line-height:.95;letter-spacing:1.5px}
h1 em{font-style:normal;color:var(--gold)}
.lead{font-size:18px;color:var(--muted);max-width:680px;margin-top:18px}
h2{font-family:var(--font-serif);font-weight:400;font-size:clamp(24px,3vw,34px);margin:0 0 16px}
.tool{display:grid;grid-template-columns:1.1fr 1fr;gap:24px;align-items:start;margin-bottom:48px}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:24px}
.row{display:grid;grid-template-columns:1fr 150px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}
.row:last-child{border-bottom:none}
.row label{font-size:14px}.row small{display:block;color:var(--muted);font-size:12px}
.row input,.row select{width:100%;background:var(--navy);border:1px solid var(--border);border-radius:6px;padding:9px 10px;color:var(--white);font:inherit;font-size:15px;text-align:right}
.row select{text-align:left}
.row input:focus,.row select:focus{outline:none;border-color:var(--gold)}
.result{position:sticky;top:16px}
.big{font-family:var(--font-display);font-size:56px;line-height:1;color:var(--gold);letter-spacing:1px}
.big-label{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px}
.kv span:first-child{color:var(--muted)}.kv:last-child{border-bottom:none}
.note{font-size:12px;color:var(--muted);margin-top:14px;line-height:1.5}
.bar{height:10px;border-radius:5px;background:var(--navy);overflow:hidden;margin:6px 0 14px}.bar > i{display:block;height:100%;background:var(--gold)}
.capture{margin-bottom:56px}
.faq{margin-bottom:56px}
.faq details{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:16px 20px;margin-bottom:10px}
.faq summary{cursor:pointer;font-weight:600}
.faq details p{color:var(--muted);margin-top:10px;font-size:15px}
.sources{font-size:13px;color:var(--muted);margin-bottom:56px}.sources li{margin:4px 0 4px 18px}
.other-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:56px}
.other-tools a{display:block;background:var(--card);border:1px solid var(--border);border-radius:10px;padding:18px;text-decoration:none;color:var(--white)}
.other-tools a:hover{border-color:var(--gold)}.other-tools small{display:block;color:var(--muted);margin-top:4px}
footer{border-top:1px solid var(--border);padding:28px 60px;color:var(--muted);font-size:13px}footer a{color:var(--muted)}
@media(max-width:900px){
  nav,footer{padding-left:16px;padding-right:16px}
  .nav-links{display:none}
  .wrap{padding:0 16px}
  .tool{grid-template-columns:1fr}
  .result{position:static}
  .row{grid-template-columns:1fr 120px}
  .other-tools{grid-template-columns:1fr}
}
