/* V2.7 UX polish: footer mark contrast, verification progressive disclosure,
   and a clearer inline attestation control. */

/* The colored kids mark has navy linework that can disappear into the dark footer.
   A small light brand tile preserves the illustration without recoloring the asset. */
.site-footer .brand-kids{
  box-sizing:border-box;
  width:80px;
  height:62px;
  padding:5px 6px;
  border-radius:15px;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(243,249,255,.92));
  border:1px solid rgba(255,255,255,.7);
  box-shadow:0 6px 18px rgba(0,0,0,.16);
}
.site-footer .brand-kids img{width:100%;height:100%;object-fit:contain}

/* Checkbox controls should remain checkbox-sized even though ordinary field inputs
   are full-width. The text and control read as one required question. */
.attestation-field{margin-top:2px}
.attestation-title{
  font-size:.84rem;
  font-weight:780;
  color:var(--navy-deep);
  margin-bottom:8px;
}
.field label.checkbox,
.field label.checkbox-card{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin:0;
  padding:13px 14px;
  border:1px solid #cbd9e4;
  border-radius:12px;
  background:#fff;
  color:#425a70;
  font-size:.9rem;
  line-height:1.45;
  font-weight:600;
  cursor:pointer;
}
.field label.checkbox input[type="checkbox"],
.field label.checkbox-card input[type="checkbox"]{
  width:18px;
  height:18px;
  min-width:18px;
  flex:0 0 18px;
  margin:1px 0 0;
  padding:0;
  accent-color:var(--blue);
  box-shadow:none;
}
.field label.checkbox-card:focus-within{
  border-color:#6aa9d9;
  box-shadow:0 0 0 3px rgba(100,181,246,.17);
}
.required-marker{color:#a5443c}
[data-requester-conditional][hidden]{display:none!important}

@media (max-width:620px){
  .site-footer .brand-kids{width:68px;height:54px;padding:4px 5px;border-radius:13px}
  .field label.checkbox-card{padding:12px;gap:10px}
}
