/* Kompass Digital Readiness Index: styles. Uses the colors and fonts defined in styles.css. */

#dri-app{padding-block:clamp(2.5rem,6vw,4.5rem) clamp(3rem,7vw,5.5rem);min-height:60vh}
#dri-app h2{font-size:clamp(1.9rem,3.4vw,2.6rem)}
#dri-app h3{font-size:1.5rem}
#dri-app h4{font-family:var(--display);font-size:1.25rem;font-weight:500}
#dri-app .lede{font-size:1.1rem}
#dri-app [data-focus]:focus{outline:none}
.dri-link{font:inherit;font-size:.9rem;background:none;border:0;padding:.3rem 0;color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dri-sub{font-size:.88rem;color:var(--stone)}
.dri-who{font-size:.9rem;color:var(--stone)}
.dri-home{display:flex;flex-direction:column;gap:2.4rem}
.dri-intro{max-width:62ch}

/* offering cards */
.dri-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.dri-card{background:var(--paper);padding:1.6rem 1.5rem;display:flex;flex-direction:column;justify-content:space-between;gap:1.4rem;min-width:0}
.dri-card.primary{background:var(--card)}
.dri-card p{font-size:.95rem;color:var(--stone)}
.dri-chip{display:inline-block;align-self:flex-start;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .6rem;border:1px solid var(--rule);color:var(--stone);border-radius:2px}
.dri-chip.done{color:var(--ink);border-color:var(--ink)}
@media (max-width:760px){.dri-cards{grid-template-columns:1fr}}

.dri-banner{display:flex;gap:1.2rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--card);padding:1.1rem 1.4rem;border:1px solid var(--rule)}
.dri-banner div{display:flex;flex-direction:column;gap:.15rem;min-width:0;flex:1 1 20rem}
.dri-banner span{font-size:.9rem;color:var(--stone)}

.dri-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;border-top:1px solid var(--ink);padding-top:1.2rem}
.dri-trust b{font-family:var(--display);font-size:1.25rem;font-weight:500}
.dri-trust p{font-size:.9rem;color:var(--stone);margin-top:.3rem}
@media (max-width:760px){.dri-trust{grid-template-columns:1fr;gap:1.2rem}}

.dri-caveat{background:var(--card);border:1px solid var(--rule);padding:1.1rem 1.3rem}
.dri-caveat p{font-size:.86rem;color:var(--stone);max-width:none}
.dri-caveat b{color:var(--ink);font-weight:500}
.dri-dev{font-size:.8rem;color:var(--note-fg);background:var(--note);padding:.6rem .9rem}

/* form */
.dri-register{max-width:760px}
.dri-form{display:grid;gap:1rem}
.dri-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dri-consent{flex-direction:row;align-items:flex-start;gap:.7rem;font-size:.88rem;letter-spacing:0;line-height:1.5}
.dri-consent input{width:auto;margin-top:.25rem;flex:none}
.dri-error{font-size:.9rem;padding:.7rem .9rem;background:var(--card);border:1px solid var(--accent)}

/* quiz */
.dri-quiz{max-width:820px}
.dri-top{display:flex;flex-direction:column;gap:.5rem}
.dri-prog{height:4px;background:var(--rule);overflow:hidden}
.dri-prog i{display:block;height:100%;background:var(--ink);transition:width .25s}
.dri-count{font-size:.82rem;color:var(--stone)}
.dri-q{border:0;margin:0;padding:0;min-width:0}
.dri-q legend{padding:0;display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.2rem;align-items:flex-start}
.dri-dom{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone)}
.dri-qt{font-family:var(--display);font-size:clamp(1.5rem,3vw,2rem);line-height:1.2;font-weight:500}
.dri-opts{display:grid;gap:.6rem}
.dri-opt{flex-direction:row;align-items:flex-start;gap:.8rem;padding:.9rem 1rem;border:1px solid var(--rule);background:var(--paper);color:var(--ink);font-size:1rem;letter-spacing:0;cursor:pointer;line-height:1.5}
.dri-opt:hover{border-color:var(--stone)}
.dri-opt input{width:auto;margin-top:.3rem;flex:none;accent-color:var(--ink)}
.dri-opt:has(input:checked){border-color:var(--ink);background:var(--card)}
.dri-opt.ns{color:var(--stone);font-size:.92rem}
.dri-ev small{display:block;font-size:.8rem;letter-spacing:0;margin-bottom:.3rem}
.dri-ev textarea{min-height:0}

/* results */
.dri-result{max-width:1000px}
.dri-res-head{display:flex;gap:2rem;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}
.dri-res-head .stack{flex:1 1 24rem;min-width:0}
.dri-score{display:flex;flex-direction:column;align-items:flex-start;border-top:1px solid var(--ink);padding-top:.7rem;min-width:9rem}
.dri-score b{font-family:var(--display);font-size:4.4rem;line-height:1.1;font-weight:500;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;margin-bottom:.35rem}
.dri-score span{font-size:.82rem;color:var(--stone)}
.dri-score em{font-family:var(--display);font-size:1.5rem;margin-top:.2rem}
.dri-split{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
@media (max-width:820px){.dri-split{grid-template-columns:1fr}}
.dri-modhead{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;border-top:1px solid var(--ink);padding-top:.7rem}
.dri-modhead span{font-size:.9rem;color:var(--stone);white-space:nowrap}
.dri-bars{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.dri-bl{display:flex;justify-content:space-between;gap:1rem;font-size:.92rem;margin-bottom:.25rem}
.dri-bl span:last-child{color:var(--stone);white-space:nowrap}
.dri-bar{position:relative;height:10px;background:var(--rule)}
.dri-bar i{position:absolute;left:0;top:0;bottom:0;background:var(--ink)}
.dri-bar u{position:absolute;top:-2px;bottom:-2px;width:1px;background:var(--paper)}
.dri-bar u:nth-of-type(1){left:25%}.dri-bar u:nth-of-type(2){left:50%}.dri-bar u:nth-of-type(3){left:75%}
.dri-chart{margin:0;max-width:340px;color:var(--ink)}
.dri-chart svg{width:100%;height:auto;display:block}
.dri-chart text{fill:var(--stone);font-family:var(--body)}
.dri-chart .q{font-size:9.5px;letter-spacing:.06em;text-transform:uppercase}
.dri-chart .ax{font-size:10px}
.dri-chart .dot{fill:var(--accent)}
.dri-flags{margin:0;padding-left:1.1rem;display:grid;gap:.4rem;font-size:.93rem;color:var(--stone)}
.dri-gaps{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--ink);counter-reset:g}
.dri-gaps li{counter-increment:g;padding:1.1rem 0;border-bottom:1px solid var(--rule);display:grid;gap:.35rem}
.dri-gaps .gq{font-family:var(--display);font-size:1.3rem;line-height:1.25;color:var(--ink)}
.dri-gaps p{font-size:.93rem;color:var(--stone);max-width:none}
.dri-gaps .nx{color:var(--ink)}
.dri-road{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.4rem}
.dri-road section{border-top:1px solid var(--ink);padding-top:.8rem;display:grid;gap:.7rem}
.dri-road dl{margin:0;display:grid;gap:.7rem}
.dri-road dt{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--stone)}
.dri-road dd{margin:0;font-size:.93rem}
.dri-cta{display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:1.5rem;align-items:center;background:var(--band);color:var(--band-fg);padding:1.6rem 1.8rem}
.dri-cta p{color:var(--band-muted);font-size:.95rem}
.dri-cta h3{color:var(--band-fg)}
.dri-cta .btn{border-color:var(--band-fg);color:var(--band-fg)}
.dri-cta .btn.solid{background:var(--band-fg);color:var(--band)}
@media (max-width:760px){.dri-cta{grid-template-columns:1fr}}
button:disabled{opacity:.45;cursor:not-allowed}

/* printable report: hidden on screen, the only thing shown when printing */
#dri-print{display:none}
@media print{
  @page{size:A4;margin:16mm 16mm 22mm;@bottom-center{content:"Self-reported and indicative. Not an audit, certification, or legal or regulatory advice. Kompass | Private and confidential";font:8pt Jost,Arial,sans-serif;color:#6B625A}}
  header.site,footer,.skip,.hero,#dri-wrap,noscript{display:none!important}
  .page{animation:none!important;opacity:1!important}
  body{background:#fff;color:#27221D;font-size:11pt}
  #dri-print{display:block!important;color:#27221D}
  #dri-print h1{font-family:var(--display);font-size:34pt;margin:.2em 0 0}
  #dri-print h2{font-family:var(--display);font-size:20pt;margin:0 0 .6em}
  #dri-print h3{font-family:var(--display);font-size:16pt;margin:1.4em 0 .4em;break-after:avoid}
  #dri-print h4{font-size:12pt;margin:1em 0 .3em;break-after:avoid}
  #dri-print .rp-eyebrow{letter-spacing:.3em;font-size:10pt;margin:0 0 3em}
  #dri-print .rp-meta{margin:1em 0 1.4em;color:#6B625A}
  #dri-print .rp-box{border:1px solid #D8D0C2;padding:.7em .9em;font-size:9pt;color:#6B625A;margin-bottom:1em}
  #dri-print .rp-sub{font-size:9pt;color:#6B625A}
  #dri-print .rp-refs{font-size:9pt;color:#6B625A}
  #dri-print .dri-bars{gap:.6em}
  #dri-print .dri-bar,#dri-print .dri-bar i{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #dri-print .dri-chart{max-width:300px}
  #dri-print .dri-roadwrap{break-inside:avoid}
  #dri-print .rp-logo{height:44px;width:auto;display:block;margin-bottom:3em}
  #dri-print .dri-gaps li,#dri-print .dri-road section{break-inside:avoid}
  #dri-print .rp-foot{margin-top:2em;font-size:8pt;color:#6B625A;border-top:1px solid #D8D0C2;padding-top:4pt}
  #dri-print .stack{display:block}
  #dri-print h3{break-after:avoid-page}
  #dri-print .dri-gaps{break-before:avoid-page}
  #dri-print .dri-gaps li:first-child{break-before:avoid-page}
  #dri-print .stack > * + *{margin-top:.8em}
}

.dri-learn{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.dri-learn a{font-size:.95rem;text-underline-offset:3px}
