/* Contractor Control Self-Check
   Uses only the custom properties already defined in site.css.
   No new hex values, no new fonts. */

/* The hidden attribute must beat any display rule we or site.css set.
   .btnrow sets display:flex, which otherwise overrides [hidden]. */
[hidden]{display:none!important;}

/* ---- six-area grid, readable without colour ---- */
.sc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px;max-width:900px;}
.sc-grid .sc-tile{border:1.5px solid var(--purple);border-radius:8px;padding:20px 18px;background:#fff;}
.sc-grid .sc-tile .n{font-family:'Libre Caslon Text',Georgia,serif;font-size:26px;color:var(--gold-deep);display:block;line-height:1;}
.sc-grid .sc-tile b{display:block;font-size:16px;color:var(--violet);margin-top:8px;}
.sc-grid .sc-tile span.d{display:block;font-size:14px;color:var(--grey);margin-top:8px;line-height:1.5;}
.sc-grid .sc-tile span.d em{display:block;font-style:normal;font-weight:600;color:var(--violet);
  font-size:13.5px;margin-bottom:8px;}
.sc-grid .sc-tile span.d br{display:none;}

/* ---- notices ---- */
.sc-notice{border-left:4px solid var(--gold);background:var(--cream-2);padding:18px 20px;margin-top:26px;max-width:660px;}
.sc-notice p{margin:0;font-size:15.5px;color:var(--ink);}

/* ---- progress ---- */
.sc-progresswrap{margin-top:30px;max-width:660px;}
.sc-progress{font-size:14px;font-weight:600;color:var(--purple);margin:0 0 10px;}
#progressBar{width:100%;height:6px;appearance:none;border:0;background:var(--line-soft);border-radius:3px;}
#progressBar::-webkit-progress-bar{background:var(--line-soft);border-radius:3px;}
#progressBar::-webkit-progress-value{background:var(--gold);border-radius:3px;}
#progressBar::-moz-progress-bar{background:var(--gold);border-radius:3px;}

/* ---- question ---- */
.sc-fieldset{border:0;margin:26px 0 0;padding:0;max-width:660px;}
.sc-legend{font-family:'Libre Caslon Text',Georgia,serif;font-size:25px;line-height:1.35;color:var(--ink);padding:0;margin:0 0 6px;}
.sc-legend:focus-visible{outline:3px solid var(--gold);outline-offset:4px;}
.sc-area{font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--purple);margin:0 0 20px;}
.sc-options{display:flex;flex-direction:column;gap:10px;}

/* whole row is the target, minimum 44px tall */
.sc-opt{display:flex;align-items:flex-start;gap:14px;min-height:44px;padding:16px 18px;border:1.5px solid var(--line-soft);
  border-radius:8px;background:#fff;cursor:pointer;transition:border-color .2s var(--ease),background .2s var(--ease);}
.sc-opt:hover{border-color:var(--purple);}
.sc-opt input{width:22px;height:22px;margin:1px 0 0;flex:0 0 auto;accent-color:var(--purple);}
.sc-opt span{font-size:16px;line-height:1.5;color:var(--ink);}
.sc-opt:has(input:checked){border-color:var(--purple);background:var(--purple-tint);}
.sc-opt:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px;}
.sc-opt.is-unsure span{color:var(--grey);font-style:italic;}

.sc-boundary{font-size:14px;color:var(--grey);margin:18px 0 0;padding-left:14px;border-left:3px solid var(--line-soft);max-width:640px;}
.sc-error{font-size:15px;color:var(--purple-deep);font-weight:600;margin:16px 0 0;}

/* ---- notes ---- */
.sc-noteblock{margin-top:26px;max-width:660px;}
.sc-notetoggle{background:none;border:1.5px dashed var(--purple);border-radius:6px;
  padding:11px 16px;font-family:'Inter',sans-serif;font-size:14.5px;font-weight:600;
  color:var(--purple);cursor:pointer;min-height:44px;width:100%;text-align:left;
  transition:background .2s var(--ease),border-color .2s var(--ease);}
.sc-notetoggle::before{content:"+";margin-right:9px;font-weight:700;}
.sc-notetoggle[aria-expanded="true"]{border-style:solid;background:var(--purple-tint);}
.sc-notetoggle[aria-expanded="true"]::before{content:"\2212";}
.sc-notetoggle:hover{background:var(--purple-tint);}
.sc-notetoggle:focus-visible{outline:3px solid var(--gold);outline-offset:2px;}
.sc-notepanel{margin-top:14px;}
.sc-notepanel label{display:block;font-size:15px;color:var(--ink);margin-bottom:8px;}
.sc-notepanel textarea{width:100%;font-family:'Inter',sans-serif;font-size:16px;padding:12px;
  border:1.5px solid var(--line-soft);border-radius:6px;color:var(--ink);background:#fff;resize:vertical;}
.sc-notepanel textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-color:var(--purple);}
.sc-notehelp{font-size:13px;color:var(--grey);margin-top:8px;line-height:1.55;}

.sc-nav{margin-top:32px;}
.sc-clear{margin-top:20px;}
.sc-linkbtn{background:none;border:0;padding:0;font-family:'Inter',sans-serif;font-size:14px;color:var(--grey);
  cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.sc-linkbtn:hover{color:var(--purple);}

/* ---- result ---- */
.sc-card{border:1.5px solid var(--line-soft);border-radius:8px;padding:24px 26px;margin-top:22px;max-width:680px;background:#fff;}
.sc-card-gold{border-color:var(--gold);}
.sc-card-dark{background:var(--violet);border-color:var(--violet);}
.sc-q{font-family:'Libre Caslon Text',Georgia,serif;font-size:19px;line-height:1.5;color:var(--ink);margin:0;}
.sc-a{font-size:16px;color:var(--purple-deep);margin:14px 0 0;padding-left:14px;border-left:3px solid var(--purple);}
.sc-dim{font-size:13.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--grey);margin:14px 0 0;font-weight:600;}
.sc-note{font-size:13.5px;color:var(--grey);margin:16px 0 0;line-height:1.55;}

.sc-profile{margin-top:34px;max-width:680px;}
.sc-row{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid var(--line-soft);}
.sc-row .nm{flex:1 1 auto;font-size:16px;color:var(--ink);font-weight:600;}
.sc-row .st{font-size:13.5px;color:var(--grey);flex:0 0 auto;}
/* meaning never carried by colour alone: each row also carries a text label */
.sc-pips{display:flex;gap:4px;flex:0 0 auto;}
.sc-pip{width:16px;height:16px;border:1.5px solid var(--purple);border-radius:3px;}
.sc-pip.on{background:var(--purple);}
.sc-row.is-first{background:var(--cream-2);padding-left:14px;padding-right:14px;border-left:4px solid var(--gold);}
.sc-row.is-clarify{border-left:4px solid var(--purple);padding-left:14px;}

.sc-demopick{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.sc-demopick button{background:none;border:1.5px solid var(--gold);color:var(--gold);border-radius:6px;
  padding:10px 16px;font-family:'Inter',sans-serif;font-size:14px;font-weight:600;cursor:pointer;min-height:44px;}
.sc-demopick button:hover{background:var(--gold);color:var(--violet);}

.sc-compare{margin-top:34px;max-width:760px;}
.sc-cols{display:grid;grid-template-columns:1fr 1fr;gap:26px;}
.sc-cols h3{font-family:'Libre Caslon Text',Georgia,serif;font-size:19px;color:var(--violet);margin:0 0 12px;}
.sc-cols ul{list-style:none;margin:0;padding:0;}
.sc-cols li{font-size:14.5px;color:var(--grey);padding:7px 0 7px 16px;position:relative;line-height:1.5;}
.sc-cols li::before{content:"";position:absolute;left:0;top:14px;width:6px;height:6px;border-radius:50%;background:var(--gold);}

.sc-disclosure{font-size:13.5px;color:var(--grey);line-height:1.6;margin-top:30px;max-width:680px;
  padding-top:20px;border-top:1px solid var(--line-soft);}

/* ---- mobile, clean at 320 ---- */
@media (max-width:760px){
  .sc-grid{grid-template-columns:1fr 1fr;}
  .sc-cols{grid-template-columns:1fr;gap:22px;}
}
@media (max-width:560px){
  .sc-grid{grid-template-columns:1fr;gap:12px;}
  .sc-legend{font-size:21px;}
  .sc-opt{padding:14px 15px;}
  .sc-opt span{font-size:16px;}
  .sc-card{padding:20px 18px;}
  .sc-nav{flex-direction:column-reverse;}
  .sc-nav .btn{width:100%;text-align:center;}
  .sc-row{flex-wrap:wrap;gap:10px;}
  .sc-row .nm{flex:1 1 100%;}
}

/* ---- reduced motion, matching the site guard ---- */
@media (prefers-reduced-motion:reduce){
  .sc-opt{transition:none;}
}

/* ---- print ---- */
@media print{
  .rail,.sc-nav,.sc-clear,#demoBox,.btnrow,.skip-link,footer{display:none!important;}
  .sc-card,.sc-profile,.sc-compare{break-inside:avoid;border-color:#999;}
  .sc-disclosure{border-top:1px solid #999;}
  body{background:#fff;}
  .sc-pip{border-color:#333;}
  .sc-pip.on{background:#333;}

  /* Printing only makes sense from a finished result. Everything on this
     page that isn't the result itself, the marketing panels above the
     assessment, and the assessment's own instructional copy, gets dropped
     so the printout is the result summary, not the whole landing page. */
  main > .panel:not(#start){display:none!important;}
  #start .sc-intro-copy{display:none!important;}
  #start{padding-top:0!important;}

  /* Never let a heading print as the last line on a page with its content
     pushed to the next one. */
  #resultHeading,.sc-card .eyebrow,.sc-profile .eyebrow,.sc-compare .eyebrow{
    break-after:avoid;page-break-after:avoid;
  }

  /* Keep each of the six area rows inside the profile together as one unit. */
  #profileList .sc-row{break-inside:avoid;page-break-inside:avoid;}
}

/* ---- pull quote, panel 4 (unboxed, no border, no fill) ---- */
.sc-quote{margin:30px 0 0;max-width:660px;}
.sc-quote p{font-family:'Libre Caslon Text',Georgia,serif;font-size:20px;line-height:1.5;color:var(--violet);margin:0;font-style:italic;}
.sc-quote cite{display:block;margin-top:14px;font-family:'Inter',sans-serif;font-size:13.5px;font-style:normal;
  letter-spacing:.05em;text-transform:uppercase;color:var(--grey);font-weight:600;}

/* ---- benefits, panel 5 ---- */
.sc-benefits{display:grid;grid-template-columns:1fr 1fr;gap:22px 30px;margin-top:28px;max-width:840px;}
.sc-benefits > div{padding-left:16px;border-left:3px solid var(--gold);}
.sc-benefits b{display:block;font-size:16.5px;color:var(--violet);margin-bottom:6px;}
.sc-benefits span{display:block;font-size:15px;color:var(--grey);line-height:1.55;}

@media (max-width:760px){
  .sc-benefits{grid-template-columns:1fr;gap:18px;}
}
@media (max-width:560px){
  .sc-quote p{font-size:18px;}
}
