/* Kompass cost calculators. Uses the colors and fonts from styles.css. */
.crumbs{font-size:.85rem;color:var(--stone)}.crumbs a{color:var(--stone)}
.calc-wrap{padding-block:clamp(2.5rem,6vw,4.5rem) clamp(3rem,7vw,5.5rem)}
.cx-bar{display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-bottom:.8rem}
.cx-cur{display:flex;gap:.5rem;align-items:center;font-size:.85rem;color:var(--stone)}
.cx-chip{font:inherit;font-size:.85rem;background:none;color:var(--ink);border:1px solid var(--rule);padding:.35rem .9rem;border-radius:2px;cursor:pointer}
.cx-chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.cx-actions{display:flex;gap:.6rem;flex-wrap:wrap}
.cx-actions .btn{padding:.5rem 1rem;font-size:.85rem}
.cx-note{font-size:.85rem;color:var(--stone);max-width:80ch;margin-bottom:1.4rem}
.cx-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
@media (max-width:900px){.cx-grid{grid-template-columns:1fr}}
.cx-set{border:0;border-top:1px solid var(--ink);margin:0 0 1.8rem;padding:.9rem 0 0;display:grid;gap:1rem;min-width:0}
.cx-set legend{font-family:var(--display);font-size:1.5rem;padding-right:1rem}
.cx-field{display:grid;gap:.35rem}
.cx-field label{font-size:.92rem;letter-spacing:0;color:var(--ink)}
.cx-field label small{display:block;font-size:.8rem;color:var(--stone)}
.cx-in{display:flex;align-items:center;gap:.5rem}
.cx-in input{max-width:14rem}
.cx-suf{font-size:.85rem;color:var(--stone)}
.cx-results{background:var(--card);padding:1.5rem 1.4rem;position:sticky;top:90px;display:grid;gap:1rem;min-width:0}
@media (max-width:900px){.cx-results{position:static}}
.cx-results h2{font-size:1.7rem}
.cx-empty{font-size:.92rem;color:var(--stone)}
.cx-head{display:flex;flex-direction:column;border-top:1px solid var(--ink);padding-top:.6rem}
.cx-head span{font-size:.8rem;color:var(--stone)}
.cx-head b{font-family:var(--display);font-size:2.6rem;font-weight:500;line-height:1.1;font-variant-numeric:lining-nums;overflow-wrap:anywhere}
.cx-stack{display:flex;height:12px;background:var(--rule)}
.cx-stack i{display:block;height:100%}
.c1{background:var(--ink)}.c2{background:var(--stone)}.c3{background:var(--clay)}.c4{background:var(--rule);border:1px solid var(--stone)}
.cx-legend{list-style:none;margin:0;padding:0;display:grid;gap:.3rem;font-size:.85rem}
.cx-legend li{display:grid;grid-template-columns:.8rem 1fr auto;gap:.5rem;align-items:center}
.cx-legend i{width:.8rem;height:.8rem;display:block}
.cx-legend b{font-weight:500;font-variant-numeric:lining-nums}
.cx-list{margin:0;display:grid;gap:.8rem}
.cx-list>div{border-top:1px solid var(--rule);padding-top:.6rem;display:grid;gap:.1rem}
.cx-list dt{font-size:.85rem;color:var(--stone)}
.cx-list dd{margin:0;font-family:var(--display);font-size:1.45rem;line-height:1.2;font-variant-numeric:lining-nums;overflow-wrap:anywhere}
.cx-list small{font-size:.78rem;color:var(--stone)}
.cx-cta{display:grid;gap:.4rem;justify-items:start}
.cx-cta small{font-size:.78rem;color:var(--stone)}
.cx-below{display:grid;gap:1.6rem;margin-top:2.4rem;max-width:900px}
.cx-block{display:grid;gap:.7rem;border-top:1px solid var(--ink);padding-top:.9rem}
.cx-block h3{font-size:1.5rem}
.cx-block ul{margin:0;padding-left:1.1rem;display:grid;gap:.4rem;font-size:.95rem}
.cx-sub{font-size:.88rem;color:var(--stone)}
.cx-two{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.cx-two span{display:block;font-size:.82rem;color:var(--stone)}
.cx-two b{font-family:var(--display);font-size:1.9rem;font-weight:500;font-variant-numeric:lining-nums}
.cx-tab{width:100%;border-collapse:collapse;font-size:.92rem}
.cx-tab th,.cx-tab td{padding:.55rem .6rem;text-align:right;border-bottom:1px solid var(--rule);font-variant-numeric:lining-nums}
.cx-tab th:first-child,.cx-tab tbody th{text-align:left;font-weight:400}
.cx-tab thead th{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);border-bottom:1px solid var(--ink)}
@media (max-width:560px){.cx-tab{font-size:.8rem}.cx-tab th,.cx-tab td{padding:.45rem .3rem}}
.cx-warn{background:var(--note);color:var(--note-fg);padding:1rem 1.2rem;font-size:.92rem}
.cx-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);margin-bottom:2.4rem}
.cx-card{background:var(--paper);padding:1.8rem 1.6rem;display:flex;flex-direction:column;justify-content:space-between;gap:1.4rem}
.cx-card h2{font-size:1.7rem}.cx-card p{font-size:.95rem;color:var(--stone)}
.cx-card .chip{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;padding:.2rem .6rem;border:1px solid var(--rule);color:var(--stone);border-radius:2px;align-self:flex-start}
@media (max-width:760px){.cx-cards{grid-template-columns:1fr}}

/* dialog */
#calcDialog{border:1px solid var(--rule);background:var(--paper);color:var(--ink);padding:0;width:min(560px,calc(100vw - 2rem));max-height:calc(100vh - 2rem);overflow:auto;border-radius:2px}
#calcDialog::backdrop{background:rgba(20,17,14,.55)}
.cx-dlg{padding:1.8rem 1.6rem;display:grid;gap:1.1rem}
.cx-dlg h3{font-size:1.6rem}
.cx-dlg form{display:grid;gap:1rem}
.cx-dlg .f2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:520px){.cx-dlg .f2{grid-template-columns:1fr}}
.cx-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cx-consent{flex-direction:row;align-items:flex-start;gap:.7rem;font-size:.85rem;letter-spacing:0;line-height:1.5}
.cx-consent input{width:auto;margin-top:.25rem;flex:none}
.cx-err{font-size:.9rem;padding:.7rem .9rem;background:var(--card);border:1px solid var(--accent)}
.cx-x{justify-self:end;font:inherit;font-size:.85rem;background:none;border:0;color:var(--stone);cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}

/* printable report: hidden on screen, the only thing shown when printing */
#calc-print{display:none}
@media print{
  @page{size:A4;margin:16mm 16mm 22mm;@bottom-center{content:"Estimate from user-entered figures. Not a benchmark, audit or advice. Kompass | Private and confidential";font:8pt Jost,Arial,sans-serif;color:#6B625A}}
  header.site,footer,.skip,.hero,.calc-wrap,noscript,dialog{display:none!important}
  .page{animation:none!important;opacity:1!important}
  body{background:#fff;color:#27221D;font-size:10.5pt}
  #calc-print{display:block!important;color:#27221D}
  #calc-print h1{font-family:var(--display);font-size:30pt;margin:.2em 0 0}
  #calc-print h2{font-family:var(--display);font-size:18pt;margin:0 0 .6em}
  #calc-print h3{font-family:var(--display);font-size:15pt;margin:1.3em 0 .4em;break-after:avoid-page}
  #calc-print h4{font-size:11pt;margin:.9em 0 .3em;break-after:avoid-page}
  #calc-print .rp-logo{height:44px;width:auto;display:block;margin-bottom:2.4em}
  #calc-print .rp-meta{margin:1em 0 1.2em;color:#6B625A}
  #calc-print .rp-box{border:1px solid #D8D0C2;padding:.7em .9em;font-size:9pt;color:#6B625A;margin-bottom:1em}
  #calc-print .rp-sub{font-size:9pt;color:#6B625A}
  #calc-print .rp-tab{width:100%;border-collapse:collapse;margin-bottom:.8em;font-size:9.5pt}
  #calc-print .rp-tab th,#calc-print .rp-tab td{padding:.35em .4em;border-bottom:1px solid #D8D0C2;text-align:left;vertical-align:top}
  #calc-print .rp-tab td{text-align:right;white-space:nowrap}
  #calc-print .rp-tab th small{display:block;font-weight:400;color:#6B625A;font-size:8pt}
  #calc-print .rp-tab thead th:not(:first-child){text-align:right}
  #calc-print .rp-tab thead th{font-size:8pt;text-transform:uppercase;letter-spacing:.1em;color:#6B625A}
  #calc-print .rp-tab tr{break-inside:avoid}
  #calc-print .rp-foot{margin-top:2em;font-size:8pt;color:#6B625A;border-top:1px solid #D8D0C2;padding-top:4pt}
}