/* ============================================
   CALCULATOR-SPECIFIC STYLES
   K-Factor Calculator page only
   ============================================ */

/* CALCULATOR FORM */
.calc-form{display:grid;gap:20px;max-width:560px}
.calc-field label{
  display:block;font-size:0.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.06em;margin-bottom:8px;color:#000;
  font-family:'Space Grotesk',sans-serif;
}
.calc-field input,.calc-field select{
  width:100%;padding:14px 16px;font-size:1rem;
  font-family:'IBM Plex Mono',monospace;
  border:3px solid #000;background:#FFF;color:#000;
  outline:none;transition:all 0.2s;
}
.calc-field input:focus,.calc-field select:focus{
  background:#FFF300;border-color:#000;
}
.calc-field .field-hint{
  font-size:0.75rem;color:#666;margin-top:6px;
  font-family:'IBM Plex Mono',monospace;
}
.calc-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.calc-row{grid-template-columns:1fr}}

.calc-btn{
  padding:18px 40px;font-size:0.85rem;font-weight:700;
  color:#000;background:#FFF300;border:3px solid #000;
  cursor:pointer;transition:all 0.2s;
  font-family:'Space Grotesk',sans-serif;
  text-transform:uppercase;letter-spacing:0.02em;
  width:100%;
}
.calc-btn:hover{background:#000;color:#FFF300}
.calc-btn:disabled{opacity:0.4;cursor:not-allowed}

/* RESULTS */
.calc-results{display:none;animation:fadeUp 0.5s ease}
.calc-results.visible{display:block}

.score-hero{
  background:#000;border:3px solid #000;
  padding:48px;text-align:center;margin-bottom:16px;
}
.score-grade{
  font-size:clamp(4rem,10vw,7rem);font-weight:700;
  color:#FFF300;line-height:1;
  font-family:'Space Grotesk',sans-serif;
  letter-spacing:-0.05em;
}
.score-label{
  font-size:0.75rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.1em;color:#FFF;margin-top:12px;
  font-family:'Space Grotesk',sans-serif;
}
.score-product{
  font-size:1.1rem;color:#FFF;margin-top:8px;
  font-family:'IBM Plex Mono',monospace;
}
.score-kvalue{
  font-size:1.8rem;font-weight:700;color:#FFF300;margin-top:16px;
  font-family:'Space Grotesk',sans-serif;
}

/* METRICS GRID */
.metrics-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:16px 0;
}
@media(max-width:640px){.metrics-grid{grid-template-columns:1fr}}
.metric-card{
  background:#FFF;border:3px solid #000;padding:24px;text-align:center;
}
.metric-card .metric-value{
  font-size:1.6rem;font-weight:700;color:#000;
  font-family:'Space Grotesk',sans-serif;
}
.metric-card .metric-label{
  font-size:0.7rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.06em;color:#000;margin-top:6px;
  font-family:'Space Grotesk',sans-serif;
}

/* PERCENTILE BAR */
.pct-bar-wrap{margin:24px 0}
.pct-bar-label{
  font-size:0.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.06em;margin-bottom:8px;color:#000;
  font-family:'Space Grotesk',sans-serif;
}
.pct-bar-track{
  height:36px;background:#FFF;border:3px solid #000;position:relative;
  overflow:hidden;
}
.pct-bar-fill{
  height:100%;background:#FFF300;transition:width 0.8s ease;
  position:relative;
}
.pct-bar-fill.good{background:#4643E8}
.pct-bar-fill.great{background:#000}
.pct-bar-marker{
  position:absolute;right:0;top:0;height:100%;width:3px;background:#000;
}
.pct-bar-value{
  font-size:0.85rem;font-weight:700;margin-top:8px;color:#000;
  font-family:'Space Grotesk',sans-serif;
}

/* PROJECTION TABLE */
.proj-table{
  width:100%;border-collapse:collapse;margin:16px 0;font-size:0.88rem;
  font-family:'IBM Plex Mono',monospace;
}
.proj-table th{
  text-align:left;font-weight:700;font-size:0.72rem;
  text-transform:uppercase;letter-spacing:0.06em;color:#000;
  padding:12px 16px;border-bottom:3px solid #000;background:#FFF;
  font-family:'Space Grotesk',sans-serif;
}
.proj-table td{
  padding:12px 16px;border-bottom:2px solid #000;color:#000;
}
.proj-table .proj-total{background:#FFF300;font-weight:700}

/* RECOMMENDATION CARDS */
.reco-card{
  background:#FFF;border:3px solid #000;padding:24px;margin-bottom:12px;
  display:flex;gap:16px;align-items:flex-start;
}
.reco-card:hover{background:#FFF300}
.reco-icon{
  width:40px;height:40px;background:#000;border:3px solid #000;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  color:#FFF300;font-weight:800;font-size:0.9rem;
  font-family:'Space Grotesk',sans-serif;
}
.reco-text{font-family:'IBM Plex Mono',monospace;font-size:0.9rem;color:#000}
.reco-text strong{color:#000}

/* SHARE BUTTONS */
.share-row{
  display:flex;gap:12px;flex-wrap:wrap;margin:24px 0;
}
.share-btn{
  padding:14px 28px;font-size:0.75rem;font-weight:700;
  border:3px solid #000;cursor:pointer;transition:all 0.2s;
  font-family:'Space Grotesk',sans-serif;
  text-transform:uppercase;letter-spacing:0.02em;
  text-decoration:none;display:inline-flex;align-items:center;gap:8px;
}
.share-btn-x{background:#000;color:#FFF}
.share-btn-x:hover{background:#FFF300;color:#000}
.share-btn-li{background:#4643E8;color:#FFF}
.share-btn-li:hover{background:#FFF300;color:#000}
.share-btn-copy{background:#FFF;color:#000}
.share-btn-copy:hover{background:#FFF300}

/* CTA BOX (calculator-specific overrides) */
.cta-box .calc-btn{
  width:auto;display:inline-block;
  background:#000;color:#FFF300;
}
.cta-box .calc-btn:hover{background:#4643E8;color:#FFF}

/* RESET BUTTON */
.calc-reset{
  padding:12px 24px;font-size:0.72rem;font-weight:700;
  color:#000;background:#FFF;border:3px solid #000;
  cursor:pointer;transition:all 0.2s;
  font-family:'Space Grotesk',sans-serif;
  text-transform:uppercase;margin-top:16px;
}
.calc-reset:hover{background:#000;color:#FFF300}