/* ============================================================
   LTPCalc — Main Stylesheet
   ltpcalculator.net
   ============================================================ */

:root {
  --bg:#0d0f0e; --bg2:#121614; --bg3:#181c1a;
  --card:#1a1e1c; --card2:#1f2421;
  --border:#2a3030; --border2:#334040;
  --gold:#f0a500; --gold2:#ffc93c; --gold3:#ffe082;
  --emerald:#00c896; --red:#ff5252; --sky:#38bdf8; --amber:#fb923c;
  --text:#eef2f0; --text2:#8fa89a; --text3:#4a6055;
  --radius:12px; --radius2:8px;
  --shadow:0 4px 24px rgba(0,0,0,.5);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  font-family:'Outfit',sans-serif;
  background:var(--bg); color:var(--text);
  min-height:100vh; overflow-x:hidden; line-height:1.6;
}
a { text-decoration:none; }
button { font-family:inherit; }

/* ── NAVBAR ── */
#navbar {
  position:fixed; top:0; left:0; right:0; z-index:9000; height:62px;
  background:rgba(13,15,14,.96);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between; padding:0 20px;
}
.logo-wrap { display:flex; align-items:center; gap:10px; cursor:pointer; flex-shrink:0; text-decoration:none; }
.logo-icon {
  width:36px; height:36px;
  background:linear-gradient(135deg,var(--gold),var(--amber));
  border-radius:10px; display:flex; align-items:center; justify-content:center;
  font-size:1rem; box-shadow:0 0 16px rgba(240,165,0,.4); flex-shrink:0;
}
.logo-text { font-size:1.2rem; font-weight:800; letter-spacing:-.5px; color:var(--text); }
.logo-text span { color:var(--gold); }

/* Desktop nav links */
.nav-links { display:flex; gap:2px; list-style:none; }
.nav-links a {
  display:block; padding:7px 14px; border-radius:var(--radius2);
  font-size:.875rem; font-weight:500; color:var(--text2);
  transition:all .2s; white-space:nowrap;
}
.nav-links a:hover { color:var(--text); background:var(--bg3); }
.nav-links a.active { color:var(--gold); background:rgba(240,165,0,.1); }
.nav-links .cta-link a {
  color:#0d0f0e; background:linear-gradient(135deg,var(--gold),var(--amber));
  font-weight:700; padding:7px 16px;
}
.nav-links .cta-link a:hover { opacity:.85; }

/* Hamburger */
.ham {
  display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  width:42px; height:42px; cursor:pointer; border-radius:9px;
  background:var(--card); border:1px solid var(--border); flex-shrink:0;
}
.ham .b { width:18px; height:2px; background:var(--text2); border-radius:2px; transition:all .3s; display:block; }
.ham.open .b:nth-child(1) { transform:translateY(7px) rotate(45deg); background:var(--gold); }
.ham.open .b:nth-child(2) { opacity:0; transform:scaleX(0); }
.ham.open .b:nth-child(3) { transform:translateY(-7px) rotate(-45deg); background:var(--gold); }

/* Mobile Drawer */
.drawer {
  display:none; position:fixed; top:62px; left:0; right:0; z-index:8999;
  background:var(--bg2); border-bottom:1px solid var(--border);
  padding:10px 14px 18px;
}
.drawer a {
  display:flex; align-items:center; gap:10px; padding:13px 12px;
  color:var(--text2); font-size:.93rem; font-weight:500;
  border-radius:var(--radius2); transition:all .2s;
  border-bottom:1px solid rgba(42,48,48,.35);
}
.drawer a:last-child { border-bottom:none; }
.drawer a:hover, .drawer a.mactive { color:var(--gold); background:rgba(240,165,0,.07); }
.drawer .di { font-size:1rem; width:22px; text-align:center; }

/* ── PAGE WRAPPER ── */
.page-wrap { padding-top:62px; min-height:100vh; }

/* ── TICKER ── */
.ticker-bar {
  background:var(--bg2); border-bottom:1px solid var(--border);
  overflow:hidden; height:34px; display:flex; align-items:center;
}
.ticker-track { display:flex; animation:ticker 28s linear infinite; white-space:nowrap; }
@keyframes ticker { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.tick-item {
  display:inline-flex; align-items:center; gap:6px; padding:0 20px;
  font-family:'IBM Plex Mono',monospace; font-size:.7rem;
  border-right:1px solid var(--border);
}
.tick-item .sym { color:var(--text2); font-weight:600; }
.tick-item .prc { color:var(--text); }
.tick-item .up  { color:var(--emerald); }
.tick-item .dn  { color:var(--red); }

/* ── HERO ── */
.hero { position:relative; overflow:hidden; padding:60px 20px 48px; text-align:center; }
.h-glow {
  position:absolute; top:-60px; left:50%; transform:translateX(-50%);
  width:560px; height:360px;
  background:radial-gradient(ellipse,rgba(240,165,0,.12) 0%,transparent 65%);
  pointer-events:none;
}
.h-grid {
  position:absolute; inset:0;
  background-image:linear-gradient(var(--border) 1px,transparent 1px),
    linear-gradient(90deg,var(--border) 1px,transparent 1px);
  background-size:36px 36px; opacity:.22;
  mask-image:radial-gradient(ellipse 70% 70% at 50% 0%,black 0%,transparent 72%);
}
.h-badge {
  display:inline-flex; align-items:center; gap:8px; padding:5px 14px;
  background:rgba(240,165,0,.1); border:1px solid rgba(240,165,0,.25);
  border-radius:50px; color:var(--gold); font-size:.7rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.8px; margin-bottom:20px; position:relative;
}
.pdot { width:7px; height:7px; background:var(--gold); border-radius:50%; animation:pdot 2s infinite; }
@keyframes pdot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.3;transform:scale(1.5)} }
.hero h1 {
  font-size:clamp(1.85rem,7vw,3.4rem); font-weight:800; line-height:1.15;
  letter-spacing:-1px; margin-bottom:16px; position:relative;
}
.gold-text {
  background:linear-gradient(90deg,var(--gold),var(--gold2),var(--amber));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}
.hero p { font-size:.98rem; color:var(--text2); max-width:540px; margin:0 auto 32px; position:relative; }
.cta-row { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; position:relative; }
.btn-p {
  display:inline-flex; align-items:center; gap:8px; padding:12px 24px;
  background:linear-gradient(135deg,var(--gold),var(--amber)); color:#0d0f0e;
  font-size:.9rem; font-weight:700; border:none; border-radius:var(--radius2);
  cursor:pointer; transition:all .2s;
}
.btn-p:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(240,165,0,.35); }
.btn-s {
  display:inline-flex; align-items:center; gap:8px; padding:12px 24px;
  background:var(--card); color:var(--text2); font-size:.9rem; font-weight:600;
  border:1px solid var(--border2); border-radius:var(--radius2); cursor:pointer; transition:all .2s;
}
.btn-s:hover { color:var(--text); border-color:var(--gold); }

.stats-strip {
  display:flex; justify-content:center; gap:36px; flex-wrap:wrap;
  margin-top:48px; padding-top:28px; border-top:1px solid var(--border); position:relative;
}
.stat-n { font-family:'IBM Plex Mono',monospace; font-size:1.55rem; font-weight:600; color:var(--gold); }
.stat-l { font-size:.73rem; color:var(--text3); margin-top:2px; }

/* ── CALCULATOR SECTION ── */
.calc-sec { padding:0 16px 56px; max-width:1060px; margin:0 auto; }
.disc {
  background:rgba(255,82,82,.06); border:1px solid rgba(255,82,82,.2);
  border-radius:var(--radius2); padding:11px 15px; margin-bottom:18px;
  font-size:.79rem; color:var(--text2); line-height:1.5;
}
.disc strong { color:var(--red); }

/* Tab bar */
.tab-bar {
  display:flex; gap:5px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:none; margin-bottom:18px; padding-bottom:2px;
}
.tab-bar::-webkit-scrollbar { display:none; }
.tab-btn {
  display:inline-flex; align-items:center; gap:5px; padding:8px 14px;
  background:var(--card); border:1px solid var(--border); border-radius:var(--radius2);
  color:var(--text2); font-size:.82rem; font-weight:600; cursor:pointer;
  white-space:nowrap; transition:all .2s; flex-shrink:0;
}
.tab-btn:hover { color:var(--text); border-color:var(--border2); }
.tab-btn.active { color:var(--gold); background:rgba(240,165,0,.1); border-color:rgba(240,165,0,.3); }

/* Grid */
.cg { display:grid; grid-template-columns:1fr 1fr; gap:18px; }

/* Card */
.card { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); }
.card-h { display:flex; align-items:center; gap:10px; margin-bottom:20px; padding-bottom:14px; border-bottom:1px solid var(--border); }
.cico { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:.95rem; flex-shrink:0; }
.ig { background:rgba(240,165,0,.12); }
.ie { background:rgba(0,200,150,.12); }
.is { background:rgba(56,189,248,.12); }
.ia { background:rgba(251,146,60,.12); }
.ct { font-size:.93rem; font-weight:700; }
.cs { font-size:.7rem; color:var(--text3); margin-top:1px; }

/* Form controls */
.fg { margin-bottom:13px; }
.fg label { display:block; font-size:.72rem; font-weight:700; color:var(--text3); text-transform:uppercase; letter-spacing:.4px; margin-bottom:5px; }
.fg input, .fg select, .fg textarea {
  width:100%; padding:10px 12px; background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--radius2); color:var(--text); font-family:inherit; font-size:.88rem;
  outline:none; transition:border .2s,box-shadow .2s; -webkit-appearance:none; appearance:none;
}
.fg input:focus, .fg select:focus, .fg textarea:focus {
  border-color:var(--gold); box-shadow:0 0 0 3px rgba(240,165,0,.12);
}
.fg select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%234a6055' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; padding-right:34px;
}
.fg select option { background:var(--bg2); }
.fg textarea { resize:vertical; min-height:110px; line-height:1.5; }
input[type=number]::-webkit-inner-spin-button { opacity:.4; }
.r2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }

/* Buttons */
.cbtn {
  width:100%; padding:12px; background:linear-gradient(135deg,var(--gold),var(--amber));
  border:none; border-radius:var(--radius2); color:#0d0f0e; font-family:inherit;
  font-size:.9rem; font-weight:700; cursor:pointer; transition:all .2s; margin-top:4px;
}
.cbtn:hover { opacity:.84; transform:translateY(-1px); }
.cbtn:active { transform:scale(.99); }
.rbtn {
  width:100%; padding:10px; background:transparent; border:1px solid var(--border2);
  border-radius:var(--radius2); color:var(--text2); font-family:inherit;
  font-size:.84rem; font-weight:600; cursor:pointer; transition:all .2s; margin-top:7px;
}
.rbtn:hover { border-color:var(--gold); color:var(--gold); }

/* Results */
.rg { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:10px; }
.rb { background:var(--bg2); border:1px solid var(--border); border-radius:var(--radius2); padding:11px 13px; transition:border-color .3s; }
.rb.hl  { border-color:rgba(240,165,0,.4); }
.rb.hg  { border-color:rgba(0,200,150,.4); }
.rb.hr  { border-color:rgba(255,82,82,.3); }
.rl { font-size:.67rem; color:var(--text3); text-transform:uppercase; letter-spacing:.4px; margin-bottom:3px; }
.rv { font-family:'IBM Plex Mono',monospace; font-size:1.05rem; font-weight:600; color:var(--text); }
.rv.g  { color:var(--gold); }
.rv.em { color:var(--emerald); }
.rv.rd { color:var(--red); }
.rv.sk { color:var(--sky); }

.plbar { height:5px; background:var(--border); border-radius:3px; margin:10px 0; overflow:hidden; }
.plfill { height:100%; border-radius:3px; transition:width .5s; background:var(--emerald); }
.tr { display:flex; flex-wrap:wrap; gap:5px; margin-top:10px; }
.tg { padding:3px 9px; border-radius:50px; font-size:.68rem; font-weight:700; background:var(--bg2); border:1px solid var(--border); color:var(--text2); }
.tg.tgg { border-color:rgba(0,200,150,.4); color:var(--emerald); }
.tg.tgr { border-color:rgba(255,82,82,.3); color:var(--red); }

/* Breakeven table */
.bet { width:100%; border-collapse:collapse; margin-top:8px; }
.bet th { font-size:.67rem; font-weight:700; color:var(--text3); text-transform:uppercase; letter-spacing:.4px; padding:7px 9px; border-bottom:1px solid var(--border); text-align:left; }
.bet td { padding:9px; font-size:.8rem; border-bottom:1px solid rgba(42,48,48,.4); font-family:'IBM Plex Mono',monospace; }
.bet tr:hover td { background:rgba(240,165,0,.03); }

/* ── SECTION HEADER ── */
.sec-hd { text-align:center; padding:56px 20px 36px; max-width:660px; margin:0 auto; }
.stag {
  display:inline-block; padding:4px 12px; background:rgba(240,165,0,.1);
  border:1px solid rgba(240,165,0,.25); border-radius:50px; color:var(--gold);
  font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.6px; margin-bottom:12px;
}
.sec-hd h2 { font-size:clamp(1.35rem,4vw,1.9rem); font-weight:800; letter-spacing:-.5px; margin-bottom:10px; }
.sec-hd p { font-size:.88rem; color:var(--text2); }

/* ── FEATURES ── */
.feat-grid {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px; padding:0 16px 56px; max-width:1060px; margin:0 auto;
}
.fcard { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:20px; transition:border-color .3s,transform .3s; }
.fcard:hover { border-color:rgba(240,165,0,.3); transform:translateY(-2px); }
.fico { width:38px; height:38px; border-radius:10px; background:rgba(240,165,0,.1); display:flex; align-items:center; justify-content:center; font-size:1rem; margin-bottom:12px; }
.fcard h3 { font-size:.88rem; font-weight:700; margin-bottom:6px; }
.fcard p { font-size:.8rem; color:var(--text2); line-height:1.55; }

/* ── STEPS ── */
.steps-w { max-width:740px; margin:0 auto; padding:0 16px 56px; }
.step { display:flex; gap:14px; align-items:flex-start; margin-bottom:24px; }
.snum { min-width:38px; height:38px; background:linear-gradient(135deg,var(--gold),var(--amber)); border-radius:11px; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:.9rem; color:#0d0f0e; flex-shrink:0; }
.sbody h3 { font-size:.88rem; font-weight:700; margin-bottom:4px; }
.sbody p { font-size:.81rem; color:var(--text2); }

/* ── FAQ ── */
.faq-w { max-width:740px; margin:0 auto; padding:0 16px 56px; }
.fi { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); margin-bottom:7px; overflow:hidden; }
.fq { width:100%; background:none; border:none; color:var(--text); font-family:inherit; font-size:.86rem; font-weight:600; padding:15px 17px; cursor:pointer; text-align:left; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.fq:hover { background:rgba(240,165,0,.03); }
.fa-arrow { color:var(--text3); font-size:.72rem; transition:transform .3s; flex-shrink:0; }
.fq.open .fa-arrow { transform:rotate(180deg); color:var(--gold); }
.fa { max-height:0; overflow:hidden; transition:max-height .35s ease,padding .3s; font-size:.83rem; color:var(--text2); line-height:1.65; background:var(--bg2); }
.fa.open { max-height:300px; padding:13px 17px; }

/* ── DIVIDER ── */
.divider { border:none; border-top:1px solid var(--border); max-width:1060px; margin:0 auto; }

/* ── FOOTER ── */
footer { background:var(--bg2); border-top:1px solid var(--border); padding:44px 20px 22px; }
.fg-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px; max-width:1060px; margin:0 auto 32px; }
.fb p { font-size:.78rem; color:var(--text3); line-height:1.6; max-width:250px; margin-top:10px; }
.fcol h4 { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.6px; color:var(--text3); margin-bottom:12px; }
.fcol a { display:block; color:var(--text2); font-size:.81rem; margin-bottom:8px; transition:color .2s; }
.fcol a:hover { color:var(--gold); }
.fbot {
  border-top:1px solid var(--border); padding-top:18px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;
  gap:8px; max-width:1060px; margin:0 auto; font-size:.73rem; color:var(--text3);
}
.fbot a { color:var(--gold); }

/* ── INNER PAGES ── */
.inner { max-width:820px; margin:0 auto; padding:46px 20px 76px; }
.ibadge { display:inline-flex; align-items:center; gap:7px; padding:4px 12px; background:rgba(240,165,0,.1); border:1px solid rgba(240,165,0,.25); border-radius:50px; color:var(--gold); font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.6px; margin-bottom:14px; }
.inner h1 { font-size:clamp(1.55rem,5vw,2.15rem); font-weight:800; letter-spacing:-.5px; margin-bottom:5px; }
.imeta { font-size:.76rem; color:var(--text3); margin-bottom:32px; }
.inner h2 { font-size:1rem; font-weight:700; color:var(--gold); margin:28px 0 9px; padding-left:11px; border-left:3px solid var(--gold); }
.inner p { font-size:.87rem; color:var(--text2); line-height:1.72; margin-bottom:10px; }
.inner ul { padding-left:17px; margin-bottom:10px; }
.inner ul li { font-size:.87rem; color:var(--text2); line-height:1.72; margin-bottom:4px; }
.inner strong { color:var(--text); }
.lg { color:var(--gold); }
.wbanner { background:rgba(255,82,82,.07); border:1px solid rgba(255,82,82,.25); border-radius:var(--radius2); padding:13px 17px; margin-bottom:18px; font-size:.81rem; color:var(--text2); line-height:1.55; }
.wbanner strong { color:var(--red); }

/* Team grid */
.team-g { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-top:16px; }
.tcard { background:var(--card2); border:1px solid var(--border); border-radius:var(--radius); padding:18px 14px; text-align:center; transition:border-color .3s; }
.tcard:hover { border-color:rgba(240,165,0,.3); }
.tav { width:52px; height:52px; border-radius:50%; background:linear-gradient(135deg,var(--gold),var(--amber)); display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin:0 auto 10px; }
.tcard h4 { font-size:.86rem; font-weight:700; }
.tcard p { font-size:.72rem; color:var(--text3); margin-top:2px; }

/* Contact */
.con-g { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:32px; }
.ci { display:flex; gap:12px; align-items:flex-start; margin-bottom:18px; }
.cii { width:38px; height:38px; border-radius:9px; background:rgba(240,165,0,.1); display:flex; align-items:center; justify-content:center; font-size:.95rem; flex-shrink:0; }
.cib h4 { font-size:.84rem; font-weight:700; margin-bottom:2px; }
.cib p { font-size:.78rem; color:var(--text2); }

/* Toast */
.toast { position:fixed; bottom:18px; right:18px; z-index:99999; background:var(--emerald); color:#0d0f0e; padding:11px 18px; border-radius:var(--radius2); font-size:.84rem; font-weight:700; display:none; box-shadow:0 4px 18px rgba(0,200,150,.4); }

/* ── RESPONSIVE ── */
@media(max-width:900px) {
  .fg-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:768px) {
  .nav-links { display:none !important; }
  .ham { display:flex !important; }
  .cg { grid-template-columns:1fr; }
  .hero { padding:42px 16px 38px; }
  .h-glow { width:280px; height:200px; }
  .feat-grid { grid-template-columns:1fr; }
  .con-g { grid-template-columns:1fr; }
  .fg-grid { grid-template-columns:1fr 1fr; gap:20px; }
  .stats-strip { gap:20px; }
}
@media(max-width:480px) {
  #navbar { padding:0 12px; }
  .logo-text { font-size:1.05rem; }
  .cta-row { flex-direction:column; align-items:center; }
  .btn-p, .btn-s { width:100%; max-width:290px; justify-content:center; }
  .stats-strip { gap:14px; }
  .stat-n { font-size:1.3rem; }
  .card { padding:14px; }
  .card-h { margin-bottom:14px; padding-bottom:11px; }
  .rv { font-size:.95rem; }
  .fg-grid { grid-template-columns:1fr; gap:16px; }
  .fbot { flex-direction:column; text-align:center; }
  .inner { padding:32px 14px 56px; }
  .r2 { grid-template-columns:1fr; }
}
@media(max-width:360px) {
  .tab-btn { padding:6px 10px; font-size:.75rem; }
  .tab-btn .ti { display:none; }
}
