body{
  margin:0;
  font-family:Arial, sans-serif;
  background:#f2f4f7;
}

*{
  box-sizing: border-box;
}

.container{
  display:flex;
  gap:20px;
  padding:20px;
}

.form{
  width:35%;
  background:#fff;
  padding:20px;
  border-radius:8px;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.form input,
.form textarea{
  width:100%;
  padding:10px;
  margin-bottom:10px;
  border:1px solid #ccc;
  border-radius:6px;
  transition:0.2s ease;
}

.form input:focus,
.form textarea:focus{
  border-color:#1f3c88;
  outline:none;
  box-shadow:0 0 0 4px rgba(31,60,136,0.1);
}

.form input:hover,
.form textarea:hover{
  border-color:#1f3c88;
}
button{
  width:100%;
  padding:12px;
  background:#1f3c88;
  color:#fff;
  border:none;
  border-radius:8px;
  box-shadow:0 6px 15px rgba(0,0,0,0.08);
  margin:10px 0;
  cursor:pointer;
  font-size:15px;
  font-weight:500;
  transition:0.2s ease;
}

button:hover{
  opacity:0.95;
  transform:translateY(-1px);
}

.download{
  background:#27ae60;
}

.download:hover{
  background:#239b56;
}


/* ===== RESUME ===== */
.resume{
  width:794px;
  min-height:auto;
  height:auto;
    background:#fff;
  padding:24px;
  border-radius:8px;
  box-sizing:border-box;
  box-shadow:0 8px 20px rgba(0,0,0,0.08);
  color:#333;
  page-break-inside: avoid;
}

.resume a{
  color:#333;
  text-decoration:none;
}

.resume p,
.resume li{
  line-height:1.6;
}

.header{
  display:flex;
  align-items:center;
  gap:16px;              /* 🔥 ye line add karo */
  border-bottom:1px solid #ddd;
  padding-bottom:12px;
}

.header-text h1{
  margin:0;
}

.header-text h3{
  margin:4px 0;
}

.header-text p{
  margin:2px 0;
}

.photo-box{
  width:120px;
  height:150px;
  border:2px solid #1f3c88;
  border-radius:6px;
  box-shadow:0 4px 10px rgba(0,0,0,0.08);
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f9fafb;
}

.photo-box img{
  width:100%;
  height:100%;
  object-fit:contain;
  overflow:hidden;
  background:#fff;
}

h4{
  color:#1f3c88;
  font-weight:600px;
  border-bottom:1px solid #ddd;
  padding-bottom:4px;
  margin-top:20px;
  page-break-after: avoid;
}

#r-summary{
  page-break-inside: avoid;
}

.site-footer{
  text-align:center;
  font-size:13px;
  color:#666;
  margin:20px 0;
}

/* ===== MOBILE ===== */
@media (max-width:768px){
  .container{
    flex-direction:column;
    align-items:center;
  }

  .form, .resume{
    width:100%;
    max-width:500px;
  }

  .header{
    flex-direction:column;
    text-align:center;
  }
}

/* Desktop look for mobile image download */
.capture-desktop{
  width: 794px !important;
  max-width: none !important;
}
.capture-desktop .header{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  text-align:left !important;
}

}