:root{
    --primary-blue-dark:#1e3c72;
    --primary-blue-light:#2a5298;
    --accent-blue:#4f9dff;
    --text-dark:#1a1a2e;
    --text-muted:#6b7280;
    --border-light:#e5e9f2;
    --overlay-bg:rgba(0,0,0,0.6);
    --radius-lg:18px;
    --radius-md:12px;
    --shadow-soft:0 20px 60px rgba(30,60,114,0.25), 0 4px 12px rgba(0,0,0,0.08);
  }
 
  *{box-sizing:border-box;}
 
  
 

  /* ------------------ Overlay ------------------ */
  .popup-overlay{
    position:fixed;
    inset:0;
    background:var(--overlay-bg);
    display:none;
    align-items:center;
    justify-content:center;
    z-index:9999;
    padding:16px;
    opacity:0;
    transition:opacity .3s ease;
    backdrop-filter:blur(2px);
  }
 
  .popup-overlay.active{
    display:flex;
    opacity:1;
  }
 
  .popup-overlay.closing{
    opacity:0;
  }
 
  /* ------------------ Card ------------------ */
  .popup-card{
    position:relative;
    width:500px;
    max-width:500px;
    background:rgba(255,255,255,0.92);
    backdrop-filter:blur(18px) saturate(180%);
    -webkit-backdrop-filter:blur(18px) saturate(180%);
    border:1px solid rgba(255,255,255,0.6);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-soft);
    padding:40px 36px 32px;
    transform:scale(0.85) translateY(10px);
    opacity:0;
    animation:popupIn .38s cubic-bezier(.34,1.56,.64,1) forwards;
    max-height:92vh;
    overflow-y:auto;
  }
 
  .popup-card.closing{
    animation:popupOut .25s ease forwards;
  }
 
  @keyframes popupIn{
    0%{opacity:0; transform:scale(0.85) translateY(10px);}
    100%{opacity:1; transform:scale(1) translateY(0);}
  }
 
  @keyframes popupOut{
    0%{opacity:1; transform:scale(1) translateY(0);}
    100%{opacity:0; transform:scale(0.9) translateY(8px);}
  }
 
  /* ------------------ Close button ------------------ */
  .popup-close{
    position:absolute;
    top: 0px;
  right: 5px;
    width:36px;
    height:36px;
    border:none;
    border-radius:50%;
    background:#f1f3f9;
    color:var(--text-muted);
    font-size:20px;
    line-height:1;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .2s ease;
  }
 
  .popup-close:hover{
    background:linear-gradient(135deg,#ff5f6d,#ff8a8a);
    color:#fff;
    transform:rotate(90deg);
  }
 
  /* ------------------ Header text ------------------ */
  .popup-header{
    text-align:center;
    margin-bottom:24px;
  }
 
  .popup-header h2{
    margin:0 0 6px;
    font-size:24px;
    font-weight:700;
    letter-spacing:-0.3px;
    background:linear-gradient(135deg,var(--primary-blue-dark),var(--accent-blue));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
 
  .popup-header p{
    margin:0;
    font-size:14px;
    color:var(--text-muted);
  }
 
  /* ------------------ Form ------------------ */
  .form-group{
    margin-bottom:16px;
  }
 
  input[type="text"],
  input[type="email"],
  textarea{
    width:100%;
    padding:13px 16px;
    font-size:15px;
    font-family:inherit;
    border:1.5px solid var(--border-light);
    border-radius:var(--radius-md);
    background:#fbfcff;
    color:var(--text-dark);
    transition:border-color .25s ease, box-shadow .25s ease, background .25s ease;
    outline:none;
    resize:vertical;
  }
 
  input::placeholder,
  textarea::placeholder{
    color:#9aa3b5;
  }
 
  input:focus,
  textarea:focus{
    border-color:var(--accent-blue);
    background:#fff;
    box-shadow:0 0 0 4px rgba(79,157,255,0.18);
  }
 
  textarea{
    min-height:100px;
  }
 
  /* ------------------ Submit button ------------------ */
  .btn-submit{
    width:100%;
    padding:14px 20px;
    font-size:16px;
    font-weight:600;
    letter-spacing:.3px;
    color:#fff;
    border:none;
    border-radius:var(--radius-md);
    cursor:pointer;
    background:linear-gradient(135deg,var(--primary-blue-dark) 0%,var(--primary-blue-light) 50%,var(--accent-blue) 100%);
    background-size:200% auto;
    box-shadow:0 10px 24px rgba(42,82,152,0.35);
    transition:background-position .4s ease, transform .15s ease, box-shadow .25s ease;
    margin-top:4px;
  }
 
  .btn-submit:hover{
    background-position:right center;
    transform:translateY(-2px);
    box-shadow:0 14px 30px rgba(42,82,152,0.45);
  }
 
  .btn-submit:active{
    transform:translateY(0);
  }
 
  /* reCAPTCHA scaling for small screens */
  .g-recaptcha{
    transform-origin:0 0;
  }
 
  /* ------------------ Responsive breakpoints ------------------ */
 
  /* Laptop */
  @media (max-width:1024px){
    .popup-card{
      width:480px;
    }
  }
 
  /* Tablet */
  @media (max-width:768px){
    .popup-card{
      width:90%;
      padding:34px 26px 26px;
    }
    .popup-close {
  top: -14px;
  right: 0px;
}
  }
 
  /* Mobile */
  @media (max-width:480px){
    .popup-card{
      width:95%;
      padding:28px 18px 20px;
      border-radius:16px;
    }
 
    .popup-header h2{
      font-size:20px;
    }
 
    input[type="text"],
    input[type="email"],
    textarea{
      padding:12px 14px;
      font-size:14px;
    }
 
    .btn-submit{
      padding:13px 16px;
      font-size:15px;
    }
 
    .g-recaptcha{
      transform:scale(0.85);
    }
  }
 
  @media (max-width:340px){
    .g-recaptcha{
      transform:scale(0.77);
    }
  }