/* ═══════════════════════════════════════════════
   Federal Tax Calculator USA — Styles v1.0
   All classes prefixed .ftc- to avoid conflicts
═══════════════════════════════════════════════ */

:root {
  --ftc-navy:   #0a2e5c;
  --ftc-blue:   #1a56db;
  --ftc-green:  #059669;
  --ftc-gold:   #d97706;
  --ftc-red:    #dc2626;
  --ftc-bg:     #f0f5fb;
  --ftc-bg2:    #e8eef7;
  --ftc-border: #d1dce8;
  --ftc-text:   #1a2332;
  --ftc-text2:  #4a5a6e;
  --ftc-text3:  #8a9bb0;
  --ftc-radius: 10px;
  --ftc-shadow: 0 6px 32px rgba(10,46,92,0.13);
  --ftc-b1: #dbeafe; --ftc-b2: #bfdbfe; --ftc-b3: #93c5fd;
  --ftc-b4: #60a5fa; --ftc-b5: #3b82f6; --ftc-b6: #2563eb; --ftc-b7: #1d4ed8;
}

/* ── Outer ── */
.ftc-outer {
  font-family: -apple-system,'Segoe UI',Roboto,sans-serif;
  background: #fff;
  border-radius: var(--ftc-radius);
  box-shadow: var(--ftc-shadow);
  border: 1.5px solid var(--ftc-border);
  overflow: hidden;
  margin: 1.5rem 0;
}

/* ── Header — white text guaranteed ── */
.ftc-header {
  background: linear-gradient(135deg, var(--ftc-navy), var(--ftc-blue));
  padding: 1.4rem 1.8rem;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
.ftc-header-icon {
  width: 48px; height: 48px;
  background: rgba(255,255,255,.12);
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.45rem; flex-shrink: 0;
}
/* ── H2 TITLE — WHITE (explicitly enforced) ── */
.ftc-header-title {
  font-size: 1.18rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 .2rem !important;
  line-height: 1.3 !important;
}
.ftc-header-sub {
  font-size: .72rem;
  color: rgba(255,255,255,.55);
  margin: 0 0 .5rem;
}
.ftc-badges  { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .4rem; }
.ftc-badge   { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25);
               color: rgba(255,255,255,.85); font-size: .57rem; font-weight: 700;
               letter-spacing: .1em; text-transform: uppercase; padding: .15rem .45rem; border-radius: 3px; }

/* ── Internal Links Bar ── */
.ftc-links-bar {
  display: flex; flex-wrap: wrap; gap: .4rem;
  align-items: center;
  padding: .6rem 1.4rem;
  background: var(--ftc-bg);
  border-bottom: 1.5px solid var(--ftc-border);
}
.ftc-links-bar-label { font-size: .67rem; font-weight: 700; color: var(--ftc-text3); text-transform: uppercase; letter-spacing: .1em; margin-right: .2rem; }
.ftc-ilink {
  font-size: .73rem; font-weight: 600;
  color: var(--ftc-navy);
  background: #fff;
  border: 1.5px solid var(--ftc-border);
  border-radius: 99px;
  padding: .22rem .75rem;
  text-decoration: none;
  transition: all .14s;
  white-space: nowrap;
}
.ftc-ilink:hover { border-color: var(--ftc-blue); color: var(--ftc-blue); background: var(--ftc-bg2); text-decoration: none; }

/* ── Body Layout ── */
.ftc-body {
  display: grid;
  grid-template-columns: 1fr 370px;
}
.ftc-form-col {
  padding: 1.6rem 1.8rem;
  border-right: 1.5px solid var(--ftc-border);
}
.ftc-results-col {
  padding: 1.4rem;
  background: var(--ftc-bg);
  position: sticky;
  top: 60px;
  align-self: start;
}

/* ── Cards ── */
.ftc-card {
  background: #fff;
  border: 1.5px solid var(--ftc-border);
  border-radius: var(--ftc-radius);
  overflow: hidden;
  margin-bottom: 1.1rem;
}
.ftc-card-head {
  background: var(--ftc-bg);
  padding: .62rem 1.1rem;
  font-size: .78rem; font-weight: 700; color: var(--ftc-navy);
  border-bottom: 1.5px solid var(--ftc-border);
  display: flex; align-items: center; gap: .4rem;
}
.ftc-card-n {
  width: 20px; height: 20px;
  background: var(--ftc-navy); color: #fff;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .65rem; font-weight: 800; flex-shrink: 0;
}
.ftc-card-body { padding: 1.1rem; }

/* ── Fields ── */
.ftc-field     { margin-bottom: .85rem; }
.ftc-field:last-child { margin-bottom: 0; }
.ftc-field label { display: block; font-size: .73rem; font-weight: 700; color: var(--ftc-text); margin-bottom: .3rem; }
.ftc-req  { color: var(--ftc-red); }
.ftc-hint { display: block; font-size: .62rem; color: var(--ftc-text3); margin-top: .17rem; }
.ftc-g2   { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }

.ftc-inp { position: relative; }
.ftc-pre\$::before { content:'$'; position:absolute; left:.75rem; top:50%; transform:translateY(-50%); color:var(--ftc-navy); font-weight:700; font-size:.9rem; z-index:1; pointer-events:none; }
.ftc-inp input[type=number] {
  width: 100%; padding: .62rem .75rem .62rem 1.65rem;
  border: 1.5px solid var(--ftc-border); border-radius: 8px;
  font-size: .9rem; color: var(--ftc-text); background: var(--ftc-bg);
  transition: border .15s,box-shadow .15s; box-sizing: border-box;
}
.ftc-inp input:focus { outline: none; border-color: var(--ftc-navy); background: #fff; box-shadow: 0 0 0 3px rgba(10,46,92,.1); }
.ftc-plain-inp {
  width: 100%; padding: .62rem .75rem;
  border: 1.5px solid var(--ftc-border); border-radius: 8px;
  font-size: .9rem; background: var(--ftc-bg); box-sizing: border-box;
}
.ftc-plain-inp:focus { outline:none; border-color:var(--ftc-navy); background:#fff; box-shadow:0 0 0 3px rgba(10,46,92,.1); }
.ftc-sel select {
  width: 100%; padding: .62rem .75rem;
  border: 1.5px solid var(--ftc-border); border-radius: 8px;
  font-size: .88rem; background: var(--ftc-bg); appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7'%3E%3Cpath fill='%230a2e5c' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .8rem center;
}
.ftc-sel select:focus { outline:none; border-color:var(--ftc-navy); background-color:#fff; }

/* ── Info boxes ── */
.ftc-info-box  { background:#eff6ff; border:1px solid #bfdbfe; border-radius:6px; padding:.65rem .85rem; font-size:.73rem; color:#1e40af; line-height:1.6; margin-bottom:.8rem; }
.ftc-obbba-box { background:linear-gradient(135deg,rgba(5,150,105,.05),rgba(10,46,92,.04)); border:1.5px solid rgba(5,150,105,.3); border-radius:8px; padding:1rem 1.1rem; margin-top:.8rem; }
.ftc-obbba-title{ font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--ftc-green); margin-bottom:.3rem; }
.ftc-obbba-desc { font-size:.73rem; color:var(--ftc-text2); line-height:1.55; margin-bottom:.75rem; }

/* ── Calc button ── */
.ftc-btn-calc {
  width:100%; padding:.95rem;
  background:linear-gradient(135deg,var(--ftc-navy),var(--ftc-blue));
  color:#fff; border:none; border-radius:10px;
  font-size:1.05rem; font-weight:700; cursor:pointer;
  transition:transform .12s,box-shadow .15s;
  box-shadow:0 4px 18px rgba(10,46,92,.28);
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  margin-top:.6rem;
}
.ftc-btn-calc:hover { transform:translateY(-1px); box-shadow:0 6px 24px rgba(10,46,92,.38); }

/* ── Results ── */
.ftc-empty { text-align:center; padding:2rem 1rem; }
.ftc-empty-icon { font-size:2.5rem; opacity:.2; margin-bottom:.8rem; }
.ftc-empty p { font-size:.78rem; color:var(--ftc-text3); line-height:1.65; }

.ftc-res-hero {
  background:linear-gradient(160deg,var(--ftc-navy),#0d4a9e);
  border-radius:var(--ftc-radius); padding:1.3rem;
  margin-bottom:.8rem; position:relative; overflow:hidden;
}
.ftc-res-hero::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(45deg,transparent,transparent 14px,rgba(255,255,255,.025) 14px,rgba(255,255,255,.025) 15px); }
.ftc-res-hero-lbl { font-size:.58rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:rgba(5,206,145,.8); margin-bottom:.3rem; position:relative; z-index:1; }
.ftc-res-hero-amt { font-size:2.45rem; font-weight:800; color:#fff; line-height:1; position:relative; z-index:1; }
.ftc-res-hero-sub { font-size:.67rem; color:rgba(255,255,255,.42); margin-top:.28rem; position:relative; z-index:1; }

.ftc-balance-banner { border:1.5px solid; border-radius:8px; padding:.7rem .9rem; margin-bottom:.8rem; font-size:.78rem; font-weight:600; display:flex; gap:.6rem; align-items:center; line-height:1.5; }

.ftc-res-grid { display:grid; grid-template-columns:1fr 1fr; gap:.45rem; margin-bottom:.8rem; }
.ftc-res-cell { background:#fff; border:1px solid var(--ftc-border); border-radius:7px; padding:.65rem; text-align:center; }
.ftc-res-val  { font-size:1.05rem; font-weight:700; display:block; }
.ftc-res-val.green { color:var(--ftc-green); }
.ftc-res-val.red   { color:var(--ftc-red); }
.ftc-res-lbl  { font-size:.56rem; color:var(--ftc-text3); text-transform:uppercase; letter-spacing:.07em; margin-top:.1rem; display:block; }

/* ── AMT warning ── */
.ftc-amt-warning { background:#fef3c7; border:1px solid #fbbf24; border-radius:7px; padding:.65rem .85rem; font-size:.76rem; color:#78350f; margin-bottom:.7rem; line-height:1.55; }
.ftc-obbba-result { background:#f0fdf4; border:1.5px solid #a7f3d0; border-radius:7px; padding:.65rem .85rem; font-size:.76rem; color:#065f46; margin-bottom:.7rem; line-height:1.5; }

/* ── Bracket visual bars ── */
.ftc-brk-visual { margin-bottom: .8rem; }
.ftc-brk-visual-title { font-size:.62rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ftc-navy); margin-bottom:.45rem; }
.ftc-brk-bar-row { display:flex; align-items:center; gap:.5rem; margin-bottom:.32rem; }
.ftc-brk-bar-lbl { width:28px; font-size:.68rem; font-weight:700; color:var(--ftc-navy); text-align:right; flex-shrink:0; }
.ftc-brk-bar-track { flex:1; background:var(--ftc-bg2); border-radius:4px; overflow:hidden; height:22px; }
.ftc-brk-bar-fill { height:100%; border-radius:4px; display:flex; align-items:center; padding:0 .4rem; font-size:.63rem; font-weight:700; min-width:2%; transition:width .5s cubic-bezier(.4,0,.2,1); white-space:nowrap; }
.ftc-brk-bar-tax { font-size:.63rem; color:var(--ftc-text3); width:68px; text-align:right; flex-shrink:0; }

/* ── Rate bar ── */
.ftc-rate-wrap { margin-bottom:.75rem; }
.ftc-rate-lbl { display:flex; justify-content:space-between; font-size:.72rem; color:var(--ftc-text2); margin-bottom:.28rem; }
.ftc-rate-lbl strong { color:var(--ftc-navy); font-weight:700; }
.ftc-rate-track { height:7px; background:var(--ftc-bg2); border-radius:99px; overflow:hidden; }
.ftc-rate-fill { height:100%; background:linear-gradient(90deg,var(--ftc-green),var(--ftc-blue)); border-radius:99px; transition:width .7s cubic-bezier(.4,0,.2,1); }

/* ── View tabs ── */
.ftc-vtabs { display:flex; border:1.5px solid var(--ftc-border); border-radius:7px; overflow:hidden; margin-bottom:.7rem; }
.ftc-vtab { flex:1; padding:.38rem; background:var(--ftc-bg); border:none; font-size:.65rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ftc-text3); cursor:pointer; transition:all .13s; }
.ftc-vtab:last-child { border-left:1px solid var(--ftc-border); }
.ftc-vtab.active { background:var(--ftc-navy); color:#fff; }

/* ── Breakdown table ── */
.ftc-bk-table { width:100%; border-collapse:collapse; font-size:.78rem; }
.ftc-bk-table th { background:var(--ftc-navy); color:#fff; font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; padding:.42rem .75rem; text-align:left; }
.ftc-bk-table th:last-child { text-align:right; }
.ftc-bk-table td { padding:.5rem .75rem; border-bottom:1px solid var(--ftc-bg2); }
.ftc-bk-table td:last-child { text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
.ftc-bk-table tr:hover td { background:#f8fafc; }
.ftc-sec-row td { background:var(--ftc-bg)!important; font-size:.58rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ftc-navy); padding:.28rem .75rem; }
.ftc-total-row td { background:#f0fdf4!important; font-weight:700; }
.ftc-sub-text { font-size:.6rem; color:var(--ftc-text3); margin-top:.05rem; }
.ftc-neg  { color:var(--ftc-red)!important; }
.ftc-pos  { color:var(--ftc-green)!important; }

/* ── Print / Reset ── */
.ftc-print-row { display:flex; gap:.5rem; padding-top:.55rem; border-top:1px solid var(--ftc-border); margin-top:.4rem; }
.ftc-btn-sm { flex:1; padding:.4rem; border:1.5px solid var(--ftc-border); border-radius:7px; background:#fff; font-size:.65rem; font-weight:600; color:var(--ftc-text2); cursor:pointer; transition:all .13s; }
.ftc-btn-sm:hover { border-color:var(--ftc-navy); color:var(--ftc-navy); }

/* ── Section headings ── */
.ftc-section-h { font-size:1.25rem; font-weight:700; color:var(--ftc-navy); margin:2rem 0 .4rem; }
.ftc-table-sub  { font-size:.82rem; color:var(--ftc-text2); margin-bottom:1rem; }

/* ── Reference table ── */
.ftc-ref-table { width:100%; border-collapse:collapse; font-size:.79rem; box-shadow:var(--ftc-shadow); border-radius:var(--ftc-radius); overflow:hidden; }
.ftc-ref-table thead th { background:var(--ftc-navy); color:#fff; padding:.55rem .85rem; font-size:.62rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; white-space:nowrap; }
.ftc-ref-table tbody td { padding:.52rem .85rem; border-bottom:1px solid var(--ftc-bg2); white-space:nowrap; }
.ftc-ref-table tbody tr:hover td { background:#eff6ff; }
.ftc-ref-table tbody tr:last-child td { border-bottom:none; }
.ftc-table-section { margin:2rem 0; }

/* ── Brackets section ── */
.ftc-brackets-section { margin:2rem 0; }
.ftc-tabs { display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:1rem; }
.ftc-tab { padding:.42rem 1rem; background:#fff; border:1.5px solid var(--ftc-border); border-radius:7px; font-size:.75rem; font-weight:700; color:var(--ftc-text2); cursor:pointer; transition:all .13s; }
.ftc-tab.active { background:var(--ftc-navy); color:#fff; border-color:var(--ftc-navy); }
.ftc-brk-pane { display:none; }
.ftc-brk-pane.active { display:block; }
.ftc-brk-std { font-size:.82rem; color:var(--ftc-text2); margin-bottom:.75rem; }
.ftc-brk-table { width:100%; border-collapse:collapse; font-size:.82rem; }
.ftc-brk-table thead th { background:var(--ftc-navy); color:#fff; padding:.5rem .9rem; text-align:left; font-size:.65rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.ftc-brk-table tbody td { padding:.55rem .9rem; border-bottom:1px solid var(--ftc-bg2); }
.ftc-brk-table tbody tr { border-left:4px solid var(--ftc-bcolor,var(--ftc-bg2)); }
.ftc-brk-table tbody tr:hover td { background:#f8fafc; }
.ftc-brk-rate { display:inline-block; background:var(--ftc-bcolor,var(--ftc-bg2)); color:var(--ftc-navy); font-weight:800; font-size:.78rem; padding:.1rem .4rem; border-radius:4px; }

/* ── Comparison tool ── */
.ftc-comp-section { margin:2rem 0; }
.ftc-comp-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-bottom:1rem; }
.ftc-comp-card { background:#fff; border:1.5px solid var(--ftc-border); border-radius:var(--ftc-radius); overflow:hidden; }
.ftc-comp-head { background:linear-gradient(135deg,var(--ftc-navy),var(--ftc-blue)); color:#fff; font-weight:700; font-size:.88rem; padding:.65rem 1rem; }
.ftc-comp-body { padding:1rem; }
.ftc-comp-result { padding:.75rem 1rem; background:var(--ftc-bg); border-top:1.5px solid var(--ftc-border); min-height:40px; }
.ftc-comp-res-inner { display:grid; grid-template-columns:1fr 1fr; gap:.3rem; font-size:.75rem; }
.ftc-comp-res-row { display:flex; justify-content:space-between; align-items:center; }
.ftc-btn-comp { padding:.8rem 2rem; background:linear-gradient(135deg,var(--ftc-navy),var(--ftc-blue)); color:#fff; border:none; border-radius:8px; font-size:.95rem; font-weight:700; cursor:pointer; transition:transform .12s,box-shadow .15s; box-shadow:0 3px 14px rgba(10,46,92,.25); }
.ftc-btn-comp:hover { transform:translateY(-1px); box-shadow:0 5px 20px rgba(10,46,92,.35); }
.ftc-comp-diff { margin-top:1rem; padding:.75rem 1rem; background:var(--ftc-bg2); border:1.5px solid var(--ftc-border); border-radius:8px; font-size:.84rem; }

/* ── Guide ── */
.ftc-guide-section { margin:2.5rem 0; }
.ftc-guide-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1rem; margin-bottom:1.5rem; }
.ftc-guide-card { background:#fff; border:1.5px solid var(--ftc-border); border-radius:var(--ftc-radius); padding:1.1rem; }
.ftc-guide-icon { font-size:1.5rem; margin-bottom:.4rem; display:block; }
.ftc-guide-card h4 { font-size:.88rem; font-weight:700; color:var(--ftc-navy); margin:0 0 .4rem; }
.ftc-guide-card p  { font-size:.8rem; color:var(--ftc-text2); line-height:1.7; margin:0; }
.ftc-cta-bar { background:linear-gradient(135deg,rgba(10,46,92,.05),rgba(26,86,219,.05)); border:1.5px solid var(--ftc-border); border-radius:var(--ftc-radius); padding:1rem 1.2rem; margin:1.5rem 0; display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.ftc-cta-label { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--ftc-text3); margin-right:.3rem; }
.ftc-cta-link { font-size:.78rem; font-weight:600; color:var(--ftc-navy); background:#fff; border:1.5px solid var(--ftc-border); border-radius:99px; padding:.28rem .85rem; text-decoration:none; transition:all .14s; }
.ftc-cta-link:hover { border-color:var(--ftc-blue); color:var(--ftc-blue); background:var(--ftc-bg2); text-decoration:none; }
.ftc-faq-section { background:var(--ftc-bg); border-radius:var(--ftc-radius); padding:1.4rem; margin-top:1.5rem; }
.ftc-faq-section h4 { font-size:1rem; font-weight:700; color:var(--ftc-navy); margin:0 0 1rem; }
.ftc-faq-item { margin-bottom:.9rem; padding-bottom:.9rem; border-bottom:1px solid var(--ftc-border); }
.ftc-faq-item:last-child { margin-bottom:0; padding-bottom:0; border-bottom:none; }
.ftc-faq-q { font-size:.84rem; font-weight:700; color:var(--ftc-navy); margin-bottom:.3rem; }
.ftc-faq-a { font-size:.81rem; color:var(--ftc-text2); line-height:1.65; }

/* ── Ad slot ── */
.ftc-ad-slot { margin:1.5rem 0; text-align:center; }

/* ── Print ── */
@media print {
  .ftc-btn-calc,.ftc-print-row,.ftc-form-col,.ftc-links-bar { display:none!important; }
  .ftc-body { grid-template-columns:1fr!important; }
  .ftc-results-col { position:static!important; background:#fff!important; }
}

/* ── Responsive ── */
@media (max-width:880px) {
  .ftc-body { grid-template-columns:1fr; }
  .ftc-form-col { border-right:none; border-bottom:1.5px solid var(--ftc-border); }
  .ftc-results-col { position:static; }
  .ftc-comp-grid { grid-template-columns:1fr; }
}
@media (max-width:540px) {
  .ftc-g2 { grid-template-columns:1fr; }
  .ftc-res-grid { grid-template-columns:1fr 1fr; }
  .ftc-header { padding:1rem; flex-direction:column; }
  .ftc-form-col { padding:1.1rem; }
  .ftc-guide-grid { grid-template-columns:1fr; }
}
