/* PDC100 Placement Preference — scoped CSS so site template/footer stays intact */
:root{
  --bg: #f6f7f9;
  --surface: #ffffff;
  --text: #111111;
  --muted: rgba(0,0,0,.65);
  --border: rgba(0,0,0,.12);
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --radius: 16px;

  --btn-bg: #111111;
  --btn-text: #ffffff;

  --focus: rgba(17,17,17,.18);
  --danger: #b00020;
  --max: 980px;
}

.placement-form,
.placement-form *{box-sizing:border-box}

.placement-form{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
}

.placement-form.wrap{padding: clamp(24px,4vw,56px) 16px;}

.placement-form .card{
  max-width: var(--max);
  margin: 0 auto;
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(16px,3vw,32px);
}

.placement-form .header{margin-bottom:16px}
.placement-form h1{margin:0 0 10px;font-size: clamp(22px,2.4vw,30px);}
.placement-form .lead{margin:0 0 10px;color:var(--muted);line-height:1.5}
.placement-form .org{margin:0;color:var(--muted);line-height:1.55}

.placement-form .form{display:grid;gap:14px;margin-top:10px}
.placement-form .row{display:grid;gap:8px}
.placement-form .grid2{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:720px){ .placement-form .grid2{grid-template-columns:1fr 1fr} }

.placement-form label{font-weight:650;font-size:14px}
.placement-form .req{color:var(--danger);font-weight:900;margin-left:4px}
.placement-form .hint{font-size:12px;color:var(--muted)}
.placement-form .fine{font-size:12px;color:var(--muted);margin:0}

.placement-form input,
.placement-form textarea{
  width:100%;
  padding:12px 12px;
  border:1px solid var(--border);
  border-radius: 12px;
  font-size:16px;
  background:#fff;
  outline:none;
}
.placement-form textarea{min-height:110px;resize:vertical}

.placement-form input:focus,
.placement-form textarea:focus{
  box-shadow: 0 0 0 4px var(--focus);
  border-color: rgba(0,0,0,.22);
}

.placement-form .box{
  border:1px solid var(--border);
  border-radius: 12px;
  padding: 14px;
  background:#fff;
}
.placement-form .legend{
  font-weight:750;
  padding:0 6px;
}

.placement-form .check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin: 10px 0;
  line-height:1.35;
}
.placement-form .check input{
  width:auto;
  margin-top:3px
}

.placement-form .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 16px;
  border-radius:12px;
  border:0;
  background: var(--btn-bg);
  color: var(--btn-text);
  font-weight:800;
  font-size:16px;
  cursor:pointer;
  width: fit-content;
}

.placement-form .btn:focus{box-shadow: 0 0 0 4px var(--focus);}
.placement-form .btn:hover{filter: brightness(.95);}

.placement-form a{color:inherit}

.placement-form .hp{
  position:absolute;
  left:-9999px;
  top:auto;
  width:1px;height:1px;
  overflow:hidden;
}