:root {
    --accent: #ffc90e;
    --accentWhite: #ffc90e40;
    --textColor: #000;
    --gray: #777;
    --bg: #fff;
    --borderColor: #E8E8E8;
    
}


.btnheaderbut {
 text-align: center;
 position: relative;
 overflow: hidden;
 cursor: pointer;
 border: none;
 color: #000;
 padding: 12px 20px;
 min-width: 120px;
 display: inline-block;
 background: var(--accent);
 border-radius: 60px;
 transition: .3s;
 font-size: 20px;
 font-weight: 700;
}

.btnheaderbut::after {
 top: -32px;
 content: "";
 display: block;
 transform: rotate(25deg);
 position: absolute;
 width: 20px;
 height: 130px;
 z-index: 1;
 opacity: .55;
 background: #fff;
 animation: 2.8s ease-out infinite btn-effect;
}

.btnheaderbut:hover {
 transform: translateY(-3px);
 box-shadow: 0 20px 70px rgba(231,178,42,.3);
}
.btnheader {
    display:flex;
}

@media (max-width:1500px){
.btnheader {
    margin-left:-42px;
}}
@media (max-width:1023px){
.btnheader {
    margin-left:0px;
}}

@media (max-width:768px){
.btnheader {
    margin-top:40px;
}}

.bcalc{
  --bg:#f6f8fb; --panel:#ffffff; --ink:#0f1116; --muted:#6b7280; --stroke:#e5e7eb;
  --accent:#ffc90e; --accent-ink:#0b0d10; --shadow:0 10px 28px rgba(0,0,0,.06);
}
.bcalc *{box-sizing:border-box}
.bcalc html,.bcalc body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial}

.bcalc .bcalc-wrap{max-width:1200px;margin:70px auto;padding:20px}

.bcalc .calc{display:block}
@media (min-width:900px){
  .bcalc .calc{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch}
}

.bcalc .card{
  background:var(--panel);border:1px solid var(--stroke);border-radius:16px;
  padding:22px;box-shadow:var(--shadow);
  display:flex;flex-direction:column
}

.bcalc .labels .row{
  display:flex;justify-content:space-between;gap:12px;
  padding:10px 0;border-bottom:1px dashed #eef1f5
}
.bcalc .labels .name{color:var(--muted)}

.bcalc .grid{display:grid;grid-template-columns:1fr 200px;gap:12px;align-items:center}
.bcalc input[type="number"],.bcalc select{
  width:100%;height:42px;border:1px solid var(--stroke);border-radius:10px;
  padding:0 12px;background:#fff;font-size:15px;outline:none
}

.bcalc .btns{display:flex;gap:16px;margin-top:20px;flex-wrap:wrap}
.bcalc .btn{
  appearance:none;border:none;border-radius:30px;padding:12px 20px;font-weight:700;cursor:pointer;
  background:var(--accent);color:var(--accent-ink);box-shadow:0 6px 14px rgba(187,235,0,.35)
}

.bcalc .results table,.bcalc .params table{width:100%;border-collapse:collapse}
.bcalc .results td,.bcalc .params td{padding:8px 12px;border-bottom:1px solid var(--stroke)}

.bcalc .modal-back{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;padding:20px;z-index:60}
.bcalc .modal{width:100%;max-width:460px;background:#fff;border-radius:16px;padding:20px;border:1px solid var(--stroke);box-shadow:var(--shadow)}

@media (max-width:900px){
  .bcalc .grid{grid-template-columns:1fr}
  .bcalc .card{margin-bottom:20px}
}


/* ===== ТИПОГРАФИКА ТОЛЬКО ДЛЯ КАЛЬКУЛЯТОРА ===== */
.bcalc h1,
.bcalc h2,
.bcalc h3,
.bcalc p,
.bcalc span,
.bcalc td,
.bcalc th,
.bcalc i,
.bcalc label {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial;
    color: var(--ink);
    line-height: 1.45;
}

.bcalc h1{
    font-size: 26px;
    font-weight: 700;
    margin: 0 0 18px;
}

.bcalc h2{
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 14px;
}

.bcalc h3{
    font-size: 18px;
    font-weight: 600;
    margin: 14px 0;
}

.bcalc p{ 
    margin: 0 0 10px; 
    font-size: 15px;
}

.bcalc span{
    font-size: 15px;
}

.bcalc td, .bcalc th{
    font-size: 15px;
}

.bcalc i{
    font-style: italic;
    color: var(--muted);
}

.bcalc label{
    font-size: 15px;
    font-weight: 600;
}