html, body {
      margin: 0;
      padding: 0;
      background-color: #e5e5e5;
      font-family: "Times New Roman", Times, serif;
      color: #333;
      overflow-x: hidden;
      font-size: 18px;

    }
    
    .logo-header {
      width: 100%;
      text-align: center;
      padding: 40px 0;
      transition: all 1s ease;
    }
    
    .logo-header img {
      max-width: 500px;
      transition: all 1s ease;
    }
    
    .logo-header.shrink {
      padding: 10px 0;
    }
    
    .logo-header.shrink img {
      max-width: 150px;
    }


    .terms-layout {
      opacity: 0;
      transition: opacity 1s ease;
      display: flex;
      align-items: stretch;
      justify-content: center;
      gap: 2rem;
      padding: 40px;
      max-width: 1400px;
      margin: 150px auto 0;
    }

    .terms-layout.visible {
      opacity: 1;
    }

    .terms-book {
      position: relative;
      width: 400px;
      flex: 1;
      height: 100%;
      min-height: 650px;
    }

    .plan-content {
      background-color: white;
      border-radius: 12px;
      padding: 20px;
      box-shadow: 0 8px 20px rgba(0,0,0,0.1);
    }

    .tabs {
      display: flex;
      justify-content: space-around;
      margin-bottom: 1rem;
    }

    .tab-button {
      padding: 10px 20px;
      background-color: #ccc;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      font-weight: bold;
    }

    .tab-button.active {
      background-color: #999;
      color: white;
    }

    .terms-calculator {
      max-width: 500px;
      background: white;
      padding: 20px;
      border-radius: 12px;
      box-shadow: 0 8px 20px rgba(0,0,0,0.1);
      flex: 1;
      height: 100%;
    }

    .terms-calculator h3 {
      margin-bottom: 16px;
      text-align: center;
    }

    .terms-calculator .buttons {
      margin-bottom: 20px;
      display: flex;
      justify-content: center;
      gap: 20px;
    }

    .terms-calculator button {
      font-size: 1.6rem;
      padding: 24px 48px;
      background-color: #3b82f6;
      color: white;
      border: none;
      border-radius: 12px;
      cursor: pointer;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
      transition: background 0.3s;
    }

    .terms-calculator input[type="range"] {
      width: 100%;
    }

    .terms-calculator #calcResult {
      margin-top: 30px;
      padding: 20px;
      background: #f0f4ff;
      border-radius: 8px;
      text-align: left;
    }

/* Общий стиль для всех секций */
section {
  background-color: #ffffff;
  border: 1px solid #ffffff;
  border-radius: 12px;
  padding: 20px;
  margin: 20px auto;
  max-width: 1000px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  
}

/* Заголовки чуть темнее */
h1, h2, h3, h4, h5, h6 {
  color: #222222;
  font-family: "Times New Roman", Times, serif;
  text-align: left;
}