/* Balcony decking area and quote calculator. Everything is scoped to deck-calc classes. */
.deck-calc[hidden],.deck-calc [hidden]{display:none!important}
.art .deck-calc-formula{font-size:15.5px;line-height:1.65;border-left:3px solid var(--red);padding-left:14px}
.art .deck-calc{background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:24px;margin:24px 0 28px}
.art .deck-calc-set{border:0;min-width:0;margin:0 0 22px}
.art .deck-calc-set legend{font-size:17px;font-weight:700;color:var(--ink);margin-bottom:6px}
.art .deck-calc-hint{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:0 0 14px}
.art .deck-calc-grid{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
.art .deck-calc-grid-floor{grid-template-columns:repeat(3,minmax(0,1fr))}
.art .deck-calc-field label{display:block;font-size:14.5px;font-weight:600;color:var(--ink);margin-bottom:6px}
.art .deck-calc-field input,.art .deck-calc-field select{display:block;width:100%;min-height:48px;padding:11px 13px;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1.5px solid var(--ink-soft);border-radius:10px}
.art .deck-calc-field input[aria-invalid="true"]{border:2px solid var(--red-deep)}
.art .deck-calc-error{font-size:14.5px;line-height:1.45;font-weight:600;color:var(--red-deep);margin:6px 0 0}
.art .deck-calc-actions{display:flex;flex-wrap:wrap;gap:12px}
.art .deck-calc .btn{min-height:48px;justify-content:center;text-align:center;white-space:normal}
.art .deck-calc-privacy{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:14px 0 0}
.art .deck-calc-status{font-size:15px;line-height:1.5;font-weight:600;color:var(--ink);margin:14px 0 0}
.art .deck-calc-status:empty{margin:0}
.art .deck-calc-status-error{color:var(--red-deep)}
.art .deck-calc-results{border-top:1px solid var(--line);margin-top:22px;padding-top:6px}
.art .deck-calc-results h3{margin:14px 0 12px;scroll-margin-top:96px}
.art .deck-calc-results h4{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:6px}
.art .deck-calc-area{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:10px}
.art .deck-calc-area>div{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.art .deck-calc-area dt{font-size:14px;color:var(--ink-soft)}
.art .deck-calc-area dd{font-family:var(--serif);font-size:clamp(24px,3vw,30px);line-height:1.2;color:var(--ink);overflow-wrap:anywhere}
.art .deck-calc-basis,.art .deck-calc-note{font-size:14.5px;line-height:1.55;margin-bottom:14px}
.art .deck-calc-cards{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:14px}
.art .deck-calc-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.art .deck-calc-card dl>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--line)}
.art .deck-calc-card dt{font-size:14px;color:var(--ink-soft)}
.art .deck-calc-card dd{font-size:15px;font-weight:700;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.art .deck-calc-difference{font-size:15.5px;line-height:1.6;margin-bottom:14px}
.art .deck-calc-reminder{font-size:14.5px;line-height:1.6;background:var(--paper);border-left:3px solid var(--red);border-radius:0 10px 10px 0;padding:12px 14px;margin-bottom:16px}
.art .deck-calc-file{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:10px 0 0}
.deck-calc input:focus-visible,.deck-calc select:focus-visible,.deck-calc .btn:focus-visible,.deck-calc h3:focus-visible{outline:3px solid var(--red-deep);outline-offset:2px}
@media(max-width:640px){
  .art .deck-calc{padding:18px 16px}
  .art .deck-calc-grid,.art .deck-calc-grid-floor,.art .deck-calc-cards{grid-template-columns:minmax(0,1fr)}
  .art .deck-calc-actions .btn,.art .deck-calc-results .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .deck-calc .btn,.deck-calc .btn:hover{transition:none;transform:none}
}

.art .deck-calc-diagram{margin:20px 0}.art .deck-calc-diagram img{display:block;width:100%;height:auto}.art .deck-calc-diagram figcaption{font-size:14px;line-height:1.5;margin-top:8px;color:var(--ink-soft)}
