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

    :root{
      --teal:#0f978d;
      --teal-dark:#0b7d74;
      --text:#243043;
      --muted:#7a8597;
      --border:#dfe5ec;
      --bg:#f4f6f8;
      --white:#ffffff;
    }


    /* Demo Buttons */
    .modal-trigger{

    }

    .modal-trigger:hover{
      
    }

    /* Overlay */
    .modal-overlay{
      position:fixed;
      inset:0;
      background:rgba(0,0,0,0.55);
      backdrop-filter:blur(3px);
      display:flex;
      align-items:center;
      justify-content:center;
      padding:18px;
      opacity:0;
      visibility:hidden;
      transition:0.35s ease;
      z-index: 99999;
    }

    .modal-overlay.active{
      opacity:1;
      visibility:visible;
    }

    /* Modal */
    .quote-modal{
      width:100%;
      width: 650px;
      background:var(--white);
      border-radius:24px;
      overflow:hidden;
      box-shadow:
        0 30px 80px rgba(0,0,0,0.35),
        0 5px 20px rgba(0,0,0,0.08);
      transform:translateY(40px) scale(.96);
      transition:0.35s ease;
      height: 650px;
      overflow-y: scroll;
    }

    .modal-overlay.active .quote-modal{
      transform:translateY(0) scale(1);
    }

    /* Header */
    .modal-header{
      background:var(--teal);
      padding:34px 32px 30px;
      position:relative;
    }

    .close-btn{
      position:absolute;
      top:18px;
      right:18px;
      width:34px;
      height:34px;
      border:none;
      background:transparent;
      color:#083b38;
      font-size:28px;
      cursor:pointer;
      line-height:1;
      transition:0.25s ease;
    }

    .close-btn:hover{
      transform:rotate(90deg);
      color:#fff;
    }

    .header-content{
      display:flex;
      align-items:flex-start;
      gap:16px;
    }

    .icon-box{
      width:42px;
      height:42px;
      min-width:42px;
      border-radius:12px;
      background:rgba(255,255,255,0.18);
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .icon-box svg{
      width:22px;
      height:22px;
      stroke:#fff;
    }

    .header-text h2{
      color:#fff;
      font-size:22px;
      font-weight:800;
      line-height:1.2;
      margin-bottom:6px;
    }

    .header-text p{
      color:rgba(255,255,255,0.92);
      font-size:15px;
      font-weight:500;
    }

    /* Body */
    .modal-body{
      padding:30px 30px 28px;
      background:#fff;
    }

    .form-group{
      margin-bottom:22px;
    }

    .form-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:16px;
    }

    label{
      display:block;
      margin-bottom: 5px;
      color:#475467;
      font-size:15px;
      font-weight:700;
    }

    input,
    select,
    textarea{
      width:100%;
      border:2px solid var(--border);
      border-radius:16px;
      padding: 9px 18px;
      font-size:16px;
      font-family:inherit;
      color:var(--text);
      background:#fff;
      outline:none;
      transition:0.25s ease;
    }

    input::placeholder,
    textarea::placeholder{
      color:#9aa5b5;
    }

    input:focus,
    select:focus,
    textarea:focus{
      border-color:var(--teal);
      box-shadow:0 0 0 4px rgba(15,151,141,0.12);
    }

    select{
      appearance:none;
      background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23758595' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 8 10 12 14 8'/%3E%3C/svg%3E");
      background-repeat:no-repeat;
      background-position:right 16px center;
      padding-right:48px;
    }

    textarea{
      min-height: 80px;
      resize:none;
    }

    .submit-btn{
      width:100%;
      border:none;
      border-radius:999px;
      background:var(--teal);
      color:#fff;
      font-size:17px;
      font-weight:800;
      padding:18px 22px;
      cursor:pointer;
      transition:0.3s ease;
      box-shadow:0 14px 28px rgba(15,151,141,0.25);
    }

    .submit-btn:hover{
      background:var(--teal-dark);
      transform:translateY(-1px);
    }

    /* Footer Note */
    .privacy-note{
      margin-top:16px;
      text-align:center;
      color:#8b94a6;
      font-size:12px;
      line-height:1.5;
    }

    /* Responsive */
    @media (max-width:640px){

      .quote-modal{
        border-radius:20px;
      }

      .modal-header{
        padding:28px 22px 24px;
      }

      .modal-body{
        padding:24px 20px 24px;
      }

      .form-grid{
        grid-template-columns:1fr;
        gap:0;
      }

      .header-text h2{
        font-size:20px;
      }

      input,
      select,
      textarea{
        padding:15px 16px;
        border-radius:14px;
      }

      .submit-btn{
        padding:17px;
      }
    }
 
/* Note: Design for a width of 320px */

@media only screen and (min-width: 300px) and (max-width: 767px) {
.center_contanier{
	width: 100%; margin:0 auto;
}
.smallcenter_contanier{
	width: 100%; margin:0 auto;
}
.small_net_center_contanier{
	width: 100%; margin:0 auto;
}
.center_big_contanier{
	width: 100%; margin:0 auto;
}
.center_smallbig_contanier{
	width: 100%; margin:0 auto;
}


    .quote-modal {
    width: 100%;
    height: 620px;
    background: var(--white);
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35), 0 5px 20px rgba(0, 0, 0, 0.08);
    transform: translateY(40px) scale(.96);
    transition: 0.35s ease;
    overflow-y: scroll;
}












	
}