/*
 * Readiness assessment legibility repair, 2026-11-06.
 * A photographic background combined with inherited light-mode text colors
 * made the intro and pillar headers illegible on mobile. The document image is
 * deliberately not used behind interactive text.
 */
body[data-hero-page="readiness"] #rq-embed {
  background-color:#11100d!important;
  background-image:linear-gradient(180deg,#191610 0%,#11100d 50%,#11100d 100%)!important;
  background-position:center!important;
  background-size:cover!important;
  --bg:#11100d;
  --bg2:#211c14;
  --ink:#f9f3e8;
  --mut:#e1d6c3;
  --gold:#e6c982;
  --gold-b:#f3d99a;
  --line:rgba(230,201,130,.33);
  --recorded:#aed4a0;
  --missing:#f1a69a;
  color:var(--ink)!important;
}
body[data-hero-page="readiness"] #rq-embed .rq-h1,
body[data-hero-page="readiness"] #rq-embed .rq-pillartitle,
body[data-hero-page="readiness"] #rq-embed .rq-pillarlist .name,
body[data-hero-page="readiness"] #rq-embed .rq-item .iname {
  color:var(--ink)!important;
  text-shadow:none!important;
}
body[data-hero-page="readiness"] #rq-embed .rq-sub,
body[data-hero-page="readiness"] #rq-embed .rq-pillardesc,
body[data-hero-page="readiness"] #rq-embed .rq-footnote,
body[data-hero-page="readiness"] #rq-embed .rq-counter,
body[data-hero-page="readiness"] #rq-embed .rq-item .idesc,
body[data-hero-page="readiness"] #rq-embed .rq-item .why {
  color:var(--mut)!important;
  opacity:1!important;
  text-shadow:none!important;
}
body[data-hero-page="readiness"] #rq-embed .rq-item {
  background:var(--bg2)!important;
  color:var(--ink)!important;
  border:1px solid var(--line)!important;
  border-radius:3px;
}
body[data-hero-page="readiness"] #rq-embed .rq-instructions {
  background:transparent!important;
  border:0!important;
  border-top:1px solid var(--line)!important;
  border-radius:0!important;
  padding:22px 0 0!important;
}
body[data-hero-page="readiness"] #rq-embed .rq-instructions p {
  color:var(--mut)!important;
  background:transparent!important;
  font-family:'Crimson Pro',Georgia,serif;
  font-size:clamp(18px,4.5vw,21px);
  line-height:1.55;
}
body[data-hero-page="readiness"] #rq-embed .rq-instructions p:first-child {
  color:var(--gold)!important;
  font-family:Inter,Arial,sans-serif;
  font-size:13px;
  font-weight:700;
}
body[data-hero-page="readiness"] #rq-embed .rq-pillarlist li {
  border-bottom:1px solid var(--line)!important;
}
/* The final pillar completes the list, so there is no extra separator beneath it. */
body[data-hero-page="readiness"] #rq-embed .rq-pillarlist li:last-child {
  border-bottom:0!important;
}
body[data-hero-page="readiness"] #rq-embed .rq-pillarlist .name {
  font-size:clamp(18px,4.6vw,21px)!important;
  line-height:1.45!important;
}
body[data-hero-page="readiness"] #rq-embed .rq-opt {
  min-height:48px;
}
body[data-hero-page="readiness"] #rq-embed .rq-submit-status:not(:empty) {
  color:var(--mut)!important;
  font:500 14px/1.5 Inter,Arial,sans-serif;
}
body[data-hero-page="readiness"] #rq-embed #s7btn[aria-busy="true"] {
  opacity:.9!important;
  cursor:progress;
}
html.lightmode body[data-hero-page="readiness"] #rq-embed {
  background-color:#faf6ed!important;
  background-image:linear-gradient(180deg,#fffaf0,#f5efdf)!important;
  --bg:#faf6ed;
  --bg2:#fffdf9;
  --ink:#201a12;
  --mut:#433b2f;
  --gold:#745516;
  --gold-b:#745516;
  --line:rgba(88,66,28,.3);
  --recorded:#35682e;
  --missing:#902d25;
  color:var(--ink)!important;
}
html.lightmode body[data-hero-page="readiness"] #rq-embed .rq-item {
  background:#fffdf9!important;
}
html.lightmode body[data-hero-page="readiness"] #rq-embed .rq-instructions .r {color:#35682e!important}
html.lightmode body[data-hero-page="readiness"] #rq-embed .rq-instructions .u {color:#902d25!important}
html.lightmode body[data-hero-page="readiness"] #rq-embed .rq-instructions .n {color:#745516!important}
body[data-hero-page="readiness"] #rq-embed .rq-instructions .r {color:var(--recorded)!important}
body[data-hero-page="readiness"] #rq-embed .rq-instructions .u {color:var(--missing)!important}
body[data-hero-page="readiness"] #rq-embed .rq-instructions .n {color:var(--gold)!important}
@media(max-width:620px) {
  body[data-hero-page="readiness"] #rq-embed { margin:12px 10px 32px!important; }
  body[data-hero-page="readiness"] #rq-embed .rq-wrap { padding:26px 18px 38px!important; }
  body[data-hero-page="readiness"] #rq-embed .rq-h1 {font-size:clamp(30px,8vw,38px)!important}
  body[data-hero-page="readiness"] #rq-embed .rq-pillarhead {padding-top:12px}
  body[data-hero-page="readiness"] #rq-embed .rq-instructions p {max-width:none}
}

/* Only the introductory Readiness landing view gets the approved photo.
   Once assessment questions or results replace the intro, the solid
   legible backgrounds above remain in place in both theme modes. */
body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions),
html.lightmode body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions) {
  background-color:#11100d!important;
  background-image:linear-gradient(180deg,rgba(15,12,8,.51) 0,rgba(15,12,8,.74) 340px,#11100d 800px),url("/cdn-cgi/image/width=1600,quality=74,format=webp,onerror=redirect/assets/readiness-hero-first-edit.png")!important;
  background-position:center top,center top!important;
  background-size:100% 800px,100% auto!important;
  background-repeat:no-repeat!important;
  --bg:#11100d;
  --bg2:#211c14;
  --ink:#f9f3e8;
  --mut:#e1d6c3;
  --gold:#e6c982;
  --gold-b:#f3d99a;
  --line:rgba(230,201,130,.33);
  --recorded:#aed4a0;
  --missing:#f1a69a;
  color:var(--ink)!important;
}
html.lightmode body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions) .rq-instructions .r {color:#aed4a0!important}
html.lightmode body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions) .rq-instructions .u {color:#f1a69a!important}
html.lightmode body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions) .rq-instructions .n {color:#e6c982!important}
@media(max-width:700px){
  body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions),
  html.lightmode body[data-hero-page="readiness"] #rq-embed:has(.rq-instructions) {
    background-image:linear-gradient(180deg,rgba(15,12,8,.61) 0,rgba(15,12,8,.82) 320px,#11100d 680px),url("/cdn-cgi/image/width=960,quality=70,format=webp,onerror=redirect/assets/readiness-hero-first-edit.png")!important;
    background-size:100% 680px,auto 530px!important;
    background-position:center top,66% top!important;
  }
}


/* Assessment answer targets need full-size readable labels on phones.
   Earlier 10.5–12px three-column buttons were difficult to read/tap. */
@media(max-width:640px){
 body[data-hero-page="readiness"] #rq-embed .rq-opts{
   display:grid!important;
   grid-template-columns:repeat(2,minmax(0,1fr));
   gap:10px!important;
   width:100%;
 }
 body[data-hero-page="readiness"] #rq-embed .rq-opt{
   box-sizing:border-box;
   width:100%!important;
   min-width:0!important;
   min-height:56px!important;
   padding:13px 12px!important;
   font-size:15px!important;
   line-height:1.45!important;
   font-weight:600;
   letter-spacing:0!important;
   text-transform:none!important;
   white-space:normal!important;
   overflow-wrap:break-word;
 }
 body[data-hero-page="readiness"] #rq-embed .rq-opts>.rq-opt:last-child:nth-child(odd){
   grid-column:1/-1;
 }
 body[data-hero-page="readiness"] #rq-embed .rq-qtext{
   font-size:clamp(19px,5.2vw,23px)!important;
   line-height:1.44!important;
 }
 body[data-hero-page="readiness"] #rq-embed .rq-instructions p{
   font-size:16px!important;
   line-height:1.65!important;
 }
}