:root{--navy:#0b1f33;--blue:#0e7490;--teal:#0f9f8f;--green:#16a34a;--bg:#f5f8fb;--card:#fff;--text:#172033;--muted:#667085;--border:#d9e1ea;--soft:#edf7f6;--warn:#fff7ed;--danger:#b42318;--shadow:0 14px 36px rgba(11,31,51,.08)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);line-height:1.5}.wrap{max-width:1180px;margin:auto;padding:24px 16px 48px}.hero{background:linear-gradient(135deg,var(--navy),#123b5d 60%,var(--blue));color:#fff;border-radius:22px;padding:30px 24px;box-shadow:var(--shadow)}.kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:6px 10px;margin-bottom:10px}.hero h1{margin:0 0 10px;font-size:clamp(2rem,5vw,3.25rem);line-height:1.06}.hero p{margin:0;max-width:820px;color:rgba(255,255,255,.88)}.grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);gap:22px;margin-top:22px}.card{background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}.head{padding:20px 22px 14px;border-bottom:1px solid var(--border)}.head h2{margin:0}.body{padding:22px}.section{border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:16px}.section:last-child{margin-bottom:0}.section h3{margin:0 0 4px;font-size:1rem}.hint{margin:0 0 14px;color:var(--muted);font-size:.88rem}.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field label{display:block;font-size:.87rem;font-weight:700;margin-bottom:6px}.field small{display:block;margin-top:5px;color:var(--muted);font-size:.76rem}.iw{position:relative}.iw span{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:.88rem;pointer-events:none}.iw.suffix span{left:auto;right:12px}.iw.prefix input{padding-left:28px}.iw.suffix input{padding-right:34px}input{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:11px 12px;font:inherit;color:var(--text);background:#fff;outline:none}input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(14,116,144,.12)}.toolbar{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}button{border:0;border-radius:10px;padding:11px 15px;font:inherit;font-weight:800;cursor:pointer}.primary{background:var(--blue);color:#fff}.secondary{background:#e9eff5;color:var(--navy)}.outline{background:#fff;border:1px solid var(--border);color:var(--navy)}.toggles{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.pill{padding:9px 13px;border-radius:999px;background:#eff3f7;color:var(--navy);border:1px solid transparent;font-size:.86rem}.pill.active{background:var(--soft);border-color:#9fd7cf;color:#0d665d}.hidden{display:none!important}.summary{position:sticky;top:14px}.results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stat{border:1px solid var(--border);background:#fff;border-radius:14px;padding:14px}.stat.big{grid-column:1/-1;background:linear-gradient(135deg,#ecfdf5,#f0fdfa);border-color:#a7f3d0}.label{color:var(--muted);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.value{margin-top:4px;font-size:1.55rem;font-weight:900;line-height:1.1}.big .value{font-size:2rem;color:#087443}.meter{height:10px;background:#edf2f7;border-radius:999px;overflow:hidden;margin-top:8px}.meter div{height:100%;width:0;background:var(--teal);border-radius:999px}.breakdown{margin-top:18px;border-top:1px solid var(--border);padding-top:16px}.row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:8px 0;font-size:.9rem}.row+.row{border-top:1px dashed #e2e8f0}.scenarios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.scenario{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fafcff}.scenario .title{font-size:.78rem;font-weight:800;color:var(--muted)}.scenario .profit{font-size:1.05rem;font-weight:900;margin-top:4px}.note{margin-top:18px;background:var(--warn);border:1px solid #fed7aa;border-radius:12px;padding:12px 14px;font-size:.82rem;color:#7c2d12}.method{margin-top:22px;padding:20px;background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow)}.method h2{margin-top:0}.method p{color:#475467}.footer{margin-top:18px;text-align:center;color:var(--muted);font-size:.78rem}.alert{display:none;margin-bottom:14px;border-radius:10px;padding:10px 12px;background:#fef3f2;border:1px solid #fecdca;color:var(--danger);font-size:.84rem}.alert.show{display:block}.copied{display:none;color:#087443;font-size:.82rem;font-weight:800;align-self:center}.copied.show{display:inline}@media(max-width:900px){.grid{grid-template-columns:1fr}.summary{position:static}}@media(max-width:640px){.wrap{padding:12px 10px 32px}.hero{padding:22px 18px;border-radius:16px}.card{border-radius:14px}.head,.body{padding:16px}.fields{grid-template-columns:1fr}.results{grid-template-columns:1fr 1fr}.scenarios{grid-template-columns:1fr}.stat.big{grid-column:1/-1}}@media print{body{background:#fff}.wrap{max-width:none;padding:0}.hero{box-shadow:none}.grid{grid-template-columns:1fr}.card{box-shadow:none}.card:first-child,.method,.toolbar,.toggles{display:none!important}.summary{position:static}.footer{margin-top:8px}}
.vbl-calculator-shell{width:100%;max-width:100%;margin:0 auto}


/* =========================================================
   VBL PRODUCTION READABILITY OVERRIDES
   ========================================================= */

/* Keep the Estimated Monthly Profit card's teal/green VBL scheme,
   but increase contrast substantially. */
.vbl-calculator-shell .vbl-stat.primary {
  background: #147d96 !important;
  border-color: #147d96 !important;
}

.vbl-calculator-shell .vbl-stat.primary .label {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.18);
}

.vbl-calculator-shell .vbl-stat.primary .value {
  color: #16a34a !important;
  opacity: 1 !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.16);
}

/* Make every calculator text element fully opaque and high-contrast. */
.vbl-calculator-shell,
.vbl-calculator-shell p,
.vbl-calculator-shell h1,
.vbl-calculator-shell h2,
.vbl-calculator-shell h3,
.vbl-calculator-shell label,
.vbl-calculator-shell small,
.vbl-calculator-shell .hint,
.vbl-calculator-shell .label,
.vbl-calculator-shell .value,
.vbl-calculator-shell .vbl-break-row,
.vbl-calculator-shell .vbl-scenario,
.vbl-calculator-shell .vbl-footer {
  opacity: 1 !important;
}

.vbl-calculator-shell .hint,
.vbl-calculator-shell small {
  color: #475467 !important;
}

.vbl-calculator-shell .vbl-stat .label {
  color: #475467 !important;
}

.vbl-calculator-shell .vbl-stat .value {
  color: #172033 !important;
}

.vbl-calculator-shell .vbl-break-row {
  color: #344054 !important;
}

.vbl-calculator-shell .vbl-break-row strong,
.vbl-calculator-shell .vbl-scenario .profit {
  color: #172033 !important;
  font-weight: 900 !important;
}

.vbl-calculator-shell .vbl-method p,
.vbl-calculator-shell .vbl-method li {
  color: #475467 !important;
}

.vbl-calculator-shell input,
.vbl-calculator-shell select {
  color: #172033 !important;
  background: #ffffff !important;
  opacity: 1 !important;
}

/* Buttons and status text should never inherit a faded theme color. */
.vbl-calculator-shell button,
.vbl-calculator-shell .vbl-copy-ok {
  opacity: 1 !important;
}

.vbl-calculator-shell .vbl-copy-ok {
  color: #087443 !important;
}

/* =========================================================
   ASTRA / WORDPRESS FOOTER CONTRAST
   The screenshots show a very light footer background with
   white/light text. Force readable dark text and full opacity.
   ========================================================= */
.site-footer,
.site-footer p,
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6,
.site-footer li,
.site-footer a,
.ast-footer-copyright,
.ast-footer-copyright *,
.footer-widget-area,
.footer-widget-area *,
.ast-builder-footer-grid-columns,
.ast-builder-footer-grid-columns * {
  color: #111827 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.site-footer a:hover,
.footer-widget-area a:hover {
  color: #0e7490 !important;
}

.site-footer a {
  text-decoration-color: rgba(17,24,39,.35);
}

/* Preserve readable footer logos/images rather than applying text rules to images. */
.site-footer img,
.footer-widget-area img {
  opacity: 1 !important;
  filter: none !important;
}


/* =========================================================
   VBL v1.0.2 — INPUT SYMBOL POSITIONING
   Keep $ and % INSIDE the input field, matching the
   standalone HTML calculator.
   ========================================================= */
.vbl-calculator-shell .vbl-input-wrap {
  position: relative !important;
  display: block !important;
  width: 100% !important;
}

.vbl-calculator-shell .vbl-input-wrap > span {
  position: absolute !important;
  top: 50% !important;
  left: 12px !important;
  right: auto !important;
  transform: translateY(-50%) !important;
  z-index: 3 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #475467 !important;
  font-size: .88rem !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  pointer-events: none !important;
  text-align: left !important;
}

.vbl-calculator-shell .vbl-input-wrap.prefix > input {
  padding-left: 28px !important;
}

.vbl-calculator-shell .vbl-input-wrap.suffix > span {
  left: auto !important;
  right: 12px !important;
  text-align: right !important;
}

.vbl-calculator-shell .vbl-input-wrap.suffix > input {
  padding-right: 34px !important;
}

/* Prevent WordPress/theme rules from turning the adornments into
   separate inline elements or adding unwanted vertical spacing. */
.vbl-calculator-shell .vbl-input-wrap > span::before,
.vbl-calculator-shell .vbl-input-wrap > span::after {
  content: none !important;
}