:root{
    --ink:#161829;
    --accent:#e6402c;
    --paper:#f3f4f7;
    --line:#e3e4ea;
    --white:#ffffff;
    --topstrip:#2b2d3d;
    --laser:#00d4ff;
  }
  *{ box-sizing:border-box; margin:0; padding:0; }
  html,body{
    background:var(--paper);
    font-family:'Vazirmatn', sans-serif;
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    min-height:100%;
  }

  .page{ min-height:100vh; display:flex; flex-direction:column; position:relative; }
  .edge-line{ position:absolute; bottom:0; width:1px; background:var(--laser);
    box-shadow:0 0 3px var(--laser), 0 0 7px rgba(0,212,255,.55); z-index:5; pointer-events:none; }
  .edge-line.left{ left:0; } .edge-line.right{ right:0; }

  .top-strip{ height:8px; background:var(--topstrip); flex:0 0 auto; }

  header{
    flex:0 0 auto;
    background:linear-gradient(180deg, #f4f5f7 0%, #e7e9ed 100%);
    border-bottom:1px solid var(--line);
  }
  .header-inner{
    max-width:900px; margin:0 auto; padding:14px 28px;
    display:flex; flex-direction:row-reverse; align-items:center; justify-content:space-between; gap:20px;
  }
  .logo img{ height:52px; width:auto; display:block; }
  .back-link{
    font-size:14px; font-weight:600; color:var(--ink); text-decoration:none;
    display:flex; align-items:center; gap:6px;
  }
  .back-link:hover{ color:var(--accent); }

  main{ flex:1 1 auto; }

  .form-wrap{
    max-width:640px;
    margin:0 auto;
    padding:48px 24px 80px;
  }

  .form-wrap h1{
    font-size:clamp(24px, 5vw, 32px);
    font-weight:800;
    margin-bottom:10px;
  }
  .form-wrap .sub{
    color:#6b6e7f;
    font-size:14.5px;
    line-height:1.8;
    margin-bottom:36px;
  }

  form{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:16px;
    padding:32px 24px;
  }

  .field{ margin-bottom:22px; }
  .field:last-of-type{ margin-bottom:0; }

  label{
    display:block;
    font-size:14px;
    font-weight:700;
    margin-bottom:8px;
  }
  label .opt{
    font-weight:400;
    color:#9698a6;
    font-size:12.5px;
  }
  label .req{ color:var(--accent); }

  input[type="text"],
  input[type="email"],
  input[type="tel"],
  textarea{
    width:100%;
    font-family:inherit;
    font-size:14.5px;
    color:var(--ink);
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:10px;
    padding:13px 14px;
    outline:none;
    transition:border-color .15s ease, background .15s ease;
  }
  input:focus, textarea:focus{
    border-color:var(--accent);
    background:var(--white);
  }
  textarea{ resize:vertical; min-height:90px; line-height:1.7; }

  .file-field{
    border:1.5px dashed var(--line);
    border-radius:10px;
    padding:18px 14px;
    text-align:center;
    background:var(--paper);
    cursor:pointer;
    position:relative;
    transition:border-color .15s ease, background .15s ease;
  }
  .file-field:hover{ border-color:var(--accent); }
  .file-field input[type="file"]{
    position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%;
  }
  .file-field .hint{ font-size:13px; color:#9698a6; margin-top:4px; }
  .file-field .file-name{ font-size:13.5px; font-weight:600; color:var(--accent); margin-top:6px; }

  .submit-btn{
    width:100%;
    margin-top:28px;
    padding:16px;
    border:none;
    border-radius:10px;
    background:var(--accent);
    color:var(--white);
    font-family:inherit;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 8px 20px -8px rgba(230,64,44,.6);
    transition:background .15s ease, transform .15s ease;
  }
  .submit-btn:hover{ background:#d2361f; transform:translateY(-1px); }
  .submit-btn:disabled{ opacity:.6; cursor:not-allowed; transform:none; }

  footer{
    background:linear-gradient(180deg, #eceef1 0%, #e3e5ea 100%);
    border-top:1px solid var(--line);
    padding:28px 28px;
    text-align:center;
    font-size:12.5px;
    color:#8a8d9c;
  }

  @media (max-width:640px){
    .header-inner{ padding:12px 16px; }
    .logo img{ height:40px; }
    form{ padding:24px 18px; }
  }

/* ===== additions for PHP forms ===== */
input[type="password"], select{
  width:100%; font-family:inherit; font-size:14.5px; color:var(--ink);
  background:var(--paper); border:1px solid var(--line); border-radius:10px;
  padding:13px 14px; outline:none; transition:border-color .15s ease, background .15s ease;
}
input[type="password"]:focus, select:focus{ border-color:var(--accent); background:var(--white); }
input:focus-visible, textarea:focus-visible, select:focus-visible, .submit-btn:focus-visible{
  outline:2px solid var(--laser); outline-offset:2px;
}
.hp{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.alert{ border-radius:10px; padding:13px 16px; font-size:14px; line-height:1.8; margin-bottom:20px; border:1px solid; }
.alert-success{ background:#eaf7ef; border-color:#bfe6cc; color:#17613a; }
.alert-error{ background:#fdeeec; border-color:#f5c7c0; color:#9b2615; }
.alert-info{ background:#eef6fb; border-color:#c9e3f2; color:#1e5572; }
.form-foot{ text-align:center; margin-top:20px; font-size:14px; color:#6b6e7f; }
.form-foot a{ color:var(--accent); font-weight:700; text-decoration:none; }
.done-box{ background:var(--white); border:1px solid var(--line); border-radius:16px; padding:36px 24px; text-align:center; }
.done-box h2{ font-size:20px; margin-bottom:10px; }
.done-box p{ color:#6b6e7f; line-height:1.8; margin-bottom:22px; }
.done-box a{ color:var(--accent); font-weight:700; text-decoration:none; }
