:root{
  --ob-accent:#c4b27d;       /* dorado suave */
  --ob-ink:#1f2937;
  --ob-muted:#6b7280;
  --ob-bg:#ffffff;
  --ob-soft:#f7f7f5;
}

.ob-calc{max-width:860px;margin:1rem auto;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
.ob-calc-card{
  background:var(--ob-bg);
  border-radius:18px;
  padding:24px;
  position:relative;
  overflow:hidden;
  box-shadow:0 10px 40px rgba(0,0,0,.08);
}
.ob-calc-card:before{
  content:"";
  position:absolute;inset:-30% -40% auto auto;
  width:360px;height:360px;border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(196,178,125,.18), transparent 60%);
  transform:translateY(-40px);
}

.ob-calc-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.ob-calc-title{font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--ob-ink)}
.ob-calc-spot{font-size:.95rem;color:var(--ob-muted)}
.ob-calc .ob-unit{color:var(--ob-muted)}

.ob-calc-field{display:flex;gap:12px;align-items:center;margin:14px 0}
.ob-calc-field label{width:140px;font-weight:600;color:var(--ob-ink)}
.ob-input{flex:1;border:1px solid #e5e7eb;border-radius:12px;padding:12px 14px;font-size:1rem;background:#fff;transition:.2s border,.2s box-shadow}
.ob-input:focus{border-color:var(--ob-accent);box-shadow:0 0 0 4px rgba(196,178,125,.18);outline:none}

.ob-calc-summary{margin-top:12px;border-top:1px dashed #e6e6e1;padding-top:10px}
.ob-row{display:flex;justify-content:space-between;padding:8px 0;color:#444}
.ob-row + .ob-row{border-top:1px dotted #eee}

/* Tarjetas de totales */
.ob-totals{display:grid;grid-template-columns:1fr;gap:12px;margin-top:14px}
.ob-card{
  border:1px solid #ecebe6;border-radius:16px;background:linear-gradient(180deg,#ffffff, #fbfbf8);
  padding:16px 18px;display:flex;justify-content:space-between;align-items:center;
  transform:translateY(0); transition:.25s transform, .25s box-shadow;
}
.ob-card:hover{transform:translateY(-2px); box-shadow:0 14px 28px rgba(0,0,0,.08)}
.ob-card .ob-label{font-weight:700;color:#2b2b2b}
.ob-card .ob-amount{font-weight:900;font-size:1.35rem}

.ob-card-secondary .ob-amount{font-size:1.1rem;color:#2d2d2d}
.ob-card-secondary .ob-label{color:var(--ob-muted)}

.ob-card-primary{
  border-color:rgba(196,178,125,.55);
  background:linear-gradient(180deg, #fffdf8, #fffaf1);
}
.ob-card-primary .ob-amount{font-size:1.6rem}
.ob-card-primary .ob-chip{
  background:rgba(196,178,125,.18); color:#6b5a2b; font-weight:800;
  border-radius:999px; padding:4px 10px; margin-left:10px; font-size:.85rem;
}

@media (min-width:720px){
  .ob-totals{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){
  .ob-calc-field{flex-direction:column;align-items:stretch}
  .ob-calc-field label{width:auto}
}
