.calc-section *{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

.calc-head{
  font-size: 36px;
  font-weight: bold;
  text-align: center;
  padding-bottom: 20px;
}

/* =========================
   SECTION
========================= */

.calc-section{
  padding:80px 20px;
  background:linear-gradient(135deg,#f8f5ef,#f1ece4);
  font-family:Arial,sans-serif;
}

/* =========================
   HEADER
========================= */

.calc-header{
  text-align:center;
  margin-bottom:50px;
}

.calc-subtitle{
  font-size:12px;
  letter-spacing:3px;
  color:#C5A021;
  text-transform:uppercase;
}

.calc-title{
  font-family:Georgia,serif;
  font-size:42px;
  color:#1A1A1A;
  margin:10px 0;
}

.calc-desc{
  color:#666;
  font-size:15px;
  max-width:700px;
  margin:auto;
  line-height:1.7;
}

/* =========================
   CONTAINER
========================= */

.calc-container{
  max-width:1150px;
  margin:auto;
}

.calc-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
}

/* =========================
   CARD
========================= */

.calc-card{
  background:#fff;
  padding:35px;
  border-radius:18px;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

/* =========================
   CARD TITLE
========================= */

.calc-card h2{
  font-size:26px;
  margin-bottom:25px;
  color:#1A1A1A;
  font-family:Georgia,serif;
}

/* =========================
   LABEL
========================= */

.calc-card label{
  display:block;
  margin-bottom:8px;
  font-size:14px;
  font-weight:600;
  color:#333;
}

/* =========================
   INPUT
========================= */

.calc-card input,
.calc-card select{
  width:100%;
  height:52px;
  padding:0 15px;
  margin-bottom:18px;

  border-radius:12px;
  border:1px solid #ddd;

  background:#fafafa;

  font-size:14px;
  color:#111;

  outline:none;
  transition:.3s;
}

.calc-card input:focus,
.calc-card select:focus{
  border-color:#C5A021;
  background:#fff;
}

/* =========================
   BUTTON
========================= */

.calc-card button{
  width:100%;
  height:52px;

  border:none;
  border-radius:12px;

  background:linear-gradient(135deg,#C8A24A,#8A6B2A);

  color:#fff;
  font-size:15px;
  font-weight:700;

  cursor:pointer;
  transition:.3s;
}

.calc-card button:hover{
  transform:translateY(-2px);
}

/* =========================
   RESULT
========================= */

.calc-results{
  margin-top:28px;
  padding-top:20px;
  border-top:1px solid #eee;
}

.calc-results p{
  display:flex;
  justify-content:space-between;
  gap:20px;

  margin-bottom:16px;

  font-size:15px;
  color:#444;
}

.calc-results p:last-child{
  margin-bottom:0;
}

.calc-results b{
  color:#1A1A1A;
}

/* =========================
   ERROR
========================= */

.calc-error{
  color:red;
  margin-top:15px;
  font-size:14px;
}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:768px){

  .calc-grid{
    grid-template-columns:1fr;
  }

  .calc-title{
    font-size:30px;
  }

  .calc-card{
    padding:25px;
  }

}