.elementor-18076 .elementor-element.elementor-element-016e6d6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.4;--padding-top:100px;--padding-bottom:100px;--padding-left:0px;--padding-right:0px;}.elementor-18076 .elementor-element.elementor-element-016e6d6:not(.elementor-motion-effects-element-type-background), .elementor-18076 .elementor-element.elementor-element-016e6d6 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(45deg, var( --e-global-color-primary ) 0%, var( --e-global-color-accent ) 100%);}.elementor-18076 .elementor-element.elementor-element-016e6d6::before, .elementor-18076 .elementor-element.elementor-element-016e6d6 > .elementor-background-video-container::before, .elementor-18076 .elementor-element.elementor-element-016e6d6 > .e-con-inner > .elementor-background-video-container::before, .elementor-18076 .elementor-element.elementor-element-016e6d6 > .elementor-background-slideshow::before, .elementor-18076 .elementor-element.elementor-element-016e6d6 > .e-con-inner > .elementor-background-slideshow::before, .elementor-18076 .elementor-element.elementor-element-016e6d6 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-18076 .elementor-element.elementor-element-de5dcf7{text-align:center;}.elementor-18076 .elementor-element.elementor-element-de5dcf7 .elementor-heading-title{font-family:"Vazirmatn", Sans-serif;font-size:30px;font-weight:900;color:#FFFFFF;}.elementor-18076 .elementor-element.elementor-element-7c6a12c{text-align:center;font-family:"Vazirmatn", Sans-serif;font-weight:400;color:#FFFFFF;}.elementor-18076 .elementor-element.elementor-element-687dc1e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:100px;--margin-left:0px;--margin-right:0px;}.elementor-18076 .elementor-element.elementor-element-77ef095{--display:flex;--border-radius:15px 15px 15px 15px;--padding-top:3rem;--padding-bottom:3rem;--padding-left:3rem;--padding-right:3rem;}.elementor-18076 .elementor-element.elementor-element-77ef095:not(.elementor-motion-effects-element-type-background), .elementor-18076 .elementor-element.elementor-element-77ef095 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-18076 .elementor-element.elementor-element-df46ed2{font-size:17px;}.elementor-18076 .elementor-element.elementor-element-05deb09{--display:flex;--justify-content:center;--gap:30px 30px;--row-gap:30px;--column-gap:30px;border-style:solid;--border-style:solid;border-width:2px 2px 2px 2px;--border-top-width:2px;--border-right-width:2px;--border-bottom-width:2px;--border-left-width:2px;border-color:#ECECEC;--border-color:#ECECEC;--border-radius:15px 15px 15px 15px;--margin-top:0px;--margin-bottom:25px;--margin-left:0px;--margin-right:0px;--padding-top:2em;--padding-bottom:2em;--padding-left:2em;--padding-right:2em;}.elementor-18076 .elementor-element.elementor-element-05deb09.e-con{--align-self:center;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-18076 .elementor-element.elementor-element-05deb09{--width:90%;}}@media(max-width:767px){.elementor-18076 .elementor-element.elementor-element-016e6d6{--padding-top:50px;--padding-bottom:50px;--padding-left:10px;--padding-right:10px;}.elementor-18076 .elementor-element.elementor-element-de5dcf7 .elementor-heading-title{font-size:20px;line-height:1.7em;}.elementor-18076 .elementor-element.elementor-element-7c6a12c{font-size:16px;}.elementor-18076 .elementor-element.elementor-element-77ef095{--padding-top:2rem;--padding-bottom:2rem;--padding-left:0.5rem;--padding-right:0.5rem;}.elementor-18076 .elementor-element.elementor-element-05deb09{--padding-top:1.5em;--padding-bottom:1.5em;--padding-left:1.5em;--padding-right:1.5em;}}/* Start custom CSS for html, class: .elementor-element-3d4d659 */<style>

    @keyframes slideUp {
      from {
        opacity: 0;
        transform: translateY(30px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }



    .form-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 25px;
      margin-bottom: 30px;
    }

    .form-group {
      display: flex;
      flex-direction: column;
    }

    .form-group.full-width {
      grid-column: 1 / -1;
    }

    label {
      font-weight: 600;
      color: #34495e;
      margin-bottom: 8px;
      font-size: 1rem;
    }

    input, select {
      border-radius: 12px !important;
      transition: all 0.3s ease;
    }

    input:focus, select:focus {
      outline: none;
      border-color: #667eea;
    }

    input:hover, select:hover {
      border-color: #bdc3c7;
    }

    .calculate-btn {
      width: 100%;
      padding: 18px;
      background: linear-gradient(135deg, #667eea, #764ba2);
      color: white;
      border: none;
      border-radius: 12px;
      font-size: 1.2rem;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      text-transform: uppercase;
      letter-spacing: 1px;
    }

    .calculate-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3);
    }

    .calculate-btn:active {
      transform: translateY(-1px);
    }

    .result {
      margin-top: 30px;
      padding: 25px;
      background: linear-gradient(135deg, #e8f5e8, #f0f8f0);
      border-radius: 15px;
      border-right: 5px solid #28a745;
      line-height: 1.8;
      font-size: 1.1rem;
      box-shadow: 0 8px 20px rgba(0,0,0,0.08);
      animation: fadeIn 0.5s ease-out;
      display: none;
    }

    .result.show {
      display: block;
    }

    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .error {
      background: linear-gradient(135deg, #ffe8e8, #fff0f0);
      border-right-color: #e74c3c;
      color: #c0392b;
    }

    .info-cards {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 20px;
      margin-top: 30px;
    }

    .info-card {
      background: rgba(255, 255, 255, 0.7);
      padding: 20px;
      border-radius: 12px;
      border: 1px solid rgba(0,0,0,0.1);
      text-align: center;
    }

    .info-card h3 {
      color: #2c3e50;
      margin-bottom: 10px;
      font-size: 1.1rem;
    }

    .info-card p {
      color: #7f8c8d;
      font-size: 0.9rem;
      line-height: 1.5;
    }

    .conversion-table {
      margin-top: 30px;
      background: rgba(255, 255, 255, 0.9);
      border-radius: 12px;
      padding: 20px;
      overflow-x: auto;
    }

    .conversion-table h3 {
      color: #2c3e50;
      margin-bottom: 15px;
      text-align: center;
    }

    table {
      width: 100%;
      border-collapse: collapse;
      font-size: 0.9rem;
    }

    th, td {
      padding: 12px;
      text-align: center;
      border-bottom: 1px solid #e0e6ed;
    }

    th {
      background: #f8f9fa;
      font-weight: 600;
      color: #2c3e50;
    }

    .preset-buttons {
      display: flex;
      gap: 10px;
      margin-top: 15px;
      flex-wrap: wrap;
    }

    .preset-btn {
      padding: 8px 15px;
      background: #ecf0f1;
      border: 1px solid #bdc3c7;
      border-radius: 20px;
      font-size: 0.85rem;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .preset-btn:hover {
      background: #667eea;
      color: white;
      transform: translateY(-2px);
    }

    @media (max-width: 768px) {
      .form-grid {
        grid-template-columns: 1fr;
        gap: 20px;
      }
      
      .container {
        padding: 25px;
        margin: 10px;
      }
      
      h1 {
        font-size: 1.8rem;
      }
    }
  </style>/* End custom CSS */