/* ===== Find a Lawyer – v2 clean sheet (professional, conflict-free) ===== */

/* Center page content like Contact */
.find-wrap{
  width: min(1100px, 100%);
  margin: 0 auto;
}

/* Form centered and same right edge for all fields */
.find-form{
  width: min(980px, 100%);
  margin: 10px auto 0;
}

/* Results align exactly with the form width */
#flResults,
#flStatus{
  width: min(980px, 100%);
  margin-left: auto;
  margin-right: auto;
}

#flResults{ margin-top: 16px; }
#flStatus{ margin-top: 10px; }

/* IMPORTANT: HTML uses grid (.ns-grid-4), so DO NOT use flex on #flForm */
#flForm{
  display:block;
}

/* Scoped grid for Find-Lawyer only (prevents conflicts with other pages) */
#flForm .ns-grid-4{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr auto; /* last auto for button */
  gap:12px;
  align-items:end;
}

@media (max-width: 980px){
  #flForm .ns-grid-4{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 560px){
  #flForm .ns-grid-4{
    grid-template-columns: 1fr;
  }
}

/* Inputs: label on top, input full width */
#flForm .ns-input{
  min-width:0;
}

/* Labels (your HTML keeps label separate from input) */
#flForm label{
  display:block;
  font-size:14px;
  color:#374151;
  margin-bottom:6px;
}

/* Same size inputs */
#flForm input[type="text"],
#flForm input[type="search"],
#flForm input[type="email"],
#flForm input[type="tel"],
#flForm select,
#flForm textarea{
  height:44px;
  padding:10px 12px;
  font-size:16px;
  line-height:1.4;
  width:100%;
  min-width:0;
  box-sizing:border-box;
  border:1px solid #c8d3e0;
  border-radius:8px;
  background:#fff;
}

/* Native select polish */
#flForm select{
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, #5b6b7b 50%),
    linear-gradient(135deg, #5b6b7b 50%, transparent 50%),
    linear-gradient(to right, #e5e7eb, #e5e7eb);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 13px) calc(50% - 3px),
    calc(100% - 42px) 50%;
  background-size: 5px 5px, 5px 5px, 1px 24px;
  background-repeat:no-repeat;
  padding-right:42px;
}

/* Button same height as fields */
#flForm button[type="submit"]{
  height:44px;
  padding:10px 16px;
  font-size:16px;
  font-weight:700;
  border:0;
  border-radius:8px;
  cursor:pointer;
  background:#FFD700;
  color:#043a6b;
  transition: background .2s;
  white-space:nowrap;
}
#flForm button[type="submit"]:hover{ background:#FFC107; }

/* align button at bottom */
.ns-flex-end{
  display:flex;
  align-items:end;
}

/* Status text spacing */
.form-status{ min-height:20px; }

/* Pager (inline style removed from HTML) */
.fl-pager{
  display:flex;
  gap:10px;
  align-items:center;
}

/* ===== Results grid ===== */
.ns-lawyers{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:14px;
}
@media (max-width: 920px){
  .ns-lawyers{ grid-template-columns: 1fr; }
}

/* ===== Card styles for rendered markup (.ns-lawyer) ===== */
.ns-lawyer{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px;
  border:1px solid #e6ebf5;
  border-radius:12px;
  background:#fff;
}

.ns-lawyer__head{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.ns-lawyer__name{
  margin:0;
  font-size:1.05rem;
}

.ns-lawyer__meta{
  color:var(--text-muted,#667085);
  font-size:.95rem;
}

.ns-lawyer__about{
  margin:0;
  color:var(--text-muted,#667085);
  font-size:.95rem;
}

/* Button placement: bottom-right on desktop */
.ns-lawyer__actions{
  display:flex;
  justify-content:flex-end;
  margin-top:8px;
}

.ns-lawyer__actions .ns-btn{
  min-width:180px;
  text-align:center;
}

/* Mobile: full-width button */
@media (max-width: 640px){
  .ns-lawyer__actions{
    justify-content:stretch;
  }
  .ns-lawyer__actions .ns-btn{
    width:100%;
    min-width:0;
  }
}