/* ===========================================================
   BAU TEAM — Rechner / Tool pages
   Shared styles for the landing-page shell + the calculator widget.
   Loaded after bau.css. No external dependencies.
   =========================================================== */

/* ---- Landing-page shell (shared with location/service LPs) ---- */
.lp-hero{padding:48px 0 56px;border-top:0}
.lp-hero h1{font-size:clamp(40px,6vw,92px);line-height:.95;margin:0 0 22px;letter-spacing:-.02em}
.lp-hero h1 .acc{color:var(--accent)}
.lp-hero .lead{font-size:clamp(16px,1.4vw,20px);max-width:64ch;line-height:1.55;margin:0 0 28px;color:var(--ink-2)}
.lp-hero .actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
.lp-hero .actions .pill.solid{background:#000;color:#fff;border-color:#000}
.lp-hero .actions .pill.solid:hover{background:#fff;color:#000}
.lp-hero .meta-row{margin-top:40px;display:flex;flex-wrap:wrap;gap:20px;font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);border-top:1px solid var(--ink);padding-top:22px}
.lp-hero .meta-row strong{color:var(--ink)}

.lp-body{padding:60px 0;border-top:1px solid var(--ink)}
.lp-body h2{font-size:clamp(28px,3.2vw,44px);margin:0 0 22px;letter-spacing:-.02em}
.lp-body h3{font-size:22px;margin:30px 0 12px;letter-spacing:-.01em}
.lp-body p,.lp-body li{font-size:16px;line-height:1.7;color:var(--ink-2);max-width:78ch}
.lp-body ul,.lp-body ol{padding-left:22px}
.lp-body li{margin:.4em 0}
.lp-body strong{color:var(--ink)}
.lp-body .dt{font-family:var(--mono);font-size:14px;letter-spacing:.06em;background:var(--mute-2);padding:2px 6px;border-radius:3px;color:var(--ink-2)}
.lp-body table{width:100%;max-width:680px;border-collapse:collapse;font-size:15px;margin:14px 0}
.lp-body table td{padding:10px 0;border-bottom:1px solid var(--line-2);color:var(--ink-2)}
.lp-body table td:last-child{text-align:right;white-space:nowrap}
.lp-body table tr:last-child td{border-bottom:0}

.lp-faq{padding:60px 0;border-top:1px solid var(--ink)}
.lp-faq h2{font-size:clamp(28px,3.4vw,52px);margin:0 0 28px;letter-spacing:-.02em}
.lp-faq details{border-top:1px solid var(--line-2);padding:18px 0}
.lp-faq details:last-of-type{border-bottom:1px solid var(--line-2)}
.lp-faq summary{cursor:pointer;font-family:var(--display);font-size:18px;display:flex;justify-content:space-between;align-items:center;list-style:none}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary .plus{font-family:var(--mono);font-size:18px;color:var(--accent)}
.lp-faq details[open] summary .plus{transform:rotate(45deg)}
.lp-faq .a{margin-top:14px;font-size:15px;line-height:1.6;color:var(--ink-2);max-width:72ch}

.lp-cta{padding:72px 0;border-top:1px solid var(--ink);background:#000;color:#fff}
.lp-cta .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:end}
.lp-cta h2{font-size:clamp(34px,4.4vw,68px);margin:0;letter-spacing:-.02em;line-height:.95}
.lp-cta h2 .acc{color:var(--accent)}
.lp-cta p{margin:22px 0 0;color:#aaa;font-size:16px;line-height:1.6;max-width:54ch}
.lp-cta .actions{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.lp-cta .pill{border-color:#fff;color:#fff}
.lp-cta .pill:hover{background:#fff;color:#000}
.lp-cta .pill.solid{background:var(--accent);border-color:var(--accent);color:#000}
.lp-cta .pill.solid:hover{background:#fff;border-color:#fff;color:#000}
@media(max-width:760px){.lp-cta .wrap{grid-template-columns:1fr;gap:24px}}

.lp-related{padding:60px 0;border-top:1px solid var(--ink)}
.lp-related h2{font-size:clamp(24px,2.8vw,40px);margin:0 0 28px}
.lp-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.lp-related-grid a{display:block;padding:26px;border-right:1px solid var(--line-2);color:inherit;text-decoration:none;transition:background .25s}
.lp-related-grid a:last-child{border-right:0}
.lp-related-grid a:hover{background:#000;color:#fff}
.lp-related-grid .num{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin-bottom:8px}
.lp-related-grid h3{font-size:18px;line-height:1.1;margin:0 0 6px;letter-spacing:-.01em}
.lp-related-grid p{margin:0;font-size:14px;color:var(--ink-2)}
.lp-related-grid a:hover .num,.lp-related-grid a:hover p{color:#aaa}
@media(max-width:760px){.lp-related-grid{grid-template-columns:1fr}.lp-related-grid a{border-right:0;border-bottom:1px solid var(--line-2)}.lp-related-grid a:last-child{border-bottom:0}}

/* ---- Calculator widget ---- */
.tool-section{padding:8px 0 60px;border-top:0}
.tool-card{border:1px solid var(--ink)}
.tool-grid{display:grid;grid-template-columns:1fr 1fr}
.tool-inputs{padding:30px;border-right:1px solid var(--ink)}
.tool-inputs h2{font-size:20px;margin:0 0 22px;letter-spacing:-.01em}
.tool-field{margin:0 0 18px}
.tool-field > label{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin:0 0 7px}
.tool-field input[type=number],.tool-field select{width:100%;padding:12px 13px;border:1px solid var(--ink);background:#fff;font-family:var(--display-2,inherit);font-size:16px;border-radius:0;-webkit-appearance:none;appearance:none}
.tool-field input[type=number]:focus,.tool-field select:focus{outline:2px solid var(--accent);outline-offset:-2px}
.tool-field select{background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 18px) center,calc(100% - 13px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:36px}
.tool-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tool-row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.tool-check{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2);cursor:pointer}
.tool-check input{width:18px;height:18px;accent-color:var(--accent)}
.tool-hint{font-size:12px;color:var(--mute);margin:6px 0 0;line-height:1.5}

.tool-result{padding:30px;background:#000;color:#fff;display:flex;flex-direction:column}
.tool-result .eyebrow{color:var(--accent)}
.tool-out{margin:10px 0 4px}
.tool-out .big{font-family:var(--display);font-size:clamp(46px,7vw,82px);line-height:.95;letter-spacing:-.02em;display:block}
.tool-out .unit{font-family:var(--mono);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:#aaa;margin-top:8px;display:block}
.tool-breakdown{margin-top:24px;border-top:1px solid #2a2a2a;padding-top:14px}
.tool-breakdown div{display:flex;justify-content:space-between;gap:16px;padding:7px 0;font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:#9a9a9a;border-bottom:1px solid #1c1c1c}
.tool-breakdown div:last-child{border-bottom:0}
.tool-breakdown div strong{color:#fff;font-weight:400}
.tool-note{margin-top:auto;padding-top:22px}
.tool-note p{font-size:12px;color:#8a8a8a;line-height:1.55;border-left:2px solid var(--accent);padding-left:12px;margin:14px 0 0}
.tool-actions{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.tool-actions .pill{border-color:#fff;color:#fff}
.tool-actions .pill:hover{background:#fff;color:#000}
.tool-actions .pill.solid{background:var(--accent);border-color:var(--accent);color:#000}
.tool-actions .pill.solid:hover{background:#fff;border-color:#fff;color:#000}

@media(max-width:760px){
  .tool-grid{grid-template-columns:1fr}
  .tool-inputs{border-right:0;border-bottom:1px solid var(--ink)}
}
@media(max-width:540px){
  .tool-inputs,.tool-result{padding:24px 18px}
  .tool-row,.tool-row3{grid-template-columns:1fr;gap:0}
  .tool-out .big{font-size:clamp(40px,13vw,64px)}
  .tool-actions{flex-direction:column;align-items:stretch}
  .tool-actions .pill{justify-content:center}
}

/* ---- Print: just the result, clean ---- */
@media print{
  .status,header.wrap,.lp-cta,.lp-related,.lp-faq,footer,.floating-cta,.tool-actions,.cookie-banner{display:none !important}
  .tool-result{background:#fff;color:#000;border:1px solid #000}
  .tool-out .unit,.tool-breakdown div{color:#000}
  .tool-breakdown div strong{color:#000}
}

/* ---- Location-page USP strip (shared by location pages) ---- */
.lp-usps{padding:60px 0;border-top:1px solid var(--ink)}
.lp-usps h2{font-size:clamp(28px,3.4vw,52px);margin:0 0 32px;letter-spacing:-.02em}
.lp-usps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.lp-usps-grid .lp-usp{padding:28px;border-right:1px solid var(--line-2)}
.lp-usps-grid .lp-usp:last-child{border-right:0}
.lp-usps-grid .num{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
.lp-usps-grid h3{font-size:22px;line-height:1.05;margin:8px 0}
.lp-usps-grid p{margin:0;font-size:14px;line-height:1.6;color:var(--ink-2)}
@media(max-width:760px){.lp-usps-grid{grid-template-columns:1fr}.lp-usps-grid .lp-usp{border-right:0;border-bottom:1px solid var(--line-2)}.lp-usps-grid .lp-usp:last-child{border-bottom:0}}

/* ---- Embed mode (assets/embed.js, ?embed in an iframe) ---- */
html.bt-embed,html.bt-embed body{background:#fff}
html.bt-embed > body > div.wrap,
html.bt-embed header,
html.bt-embed footer,
html.bt-embed .floating-cta,
html.bt-embed .lp-hero,
html.bt-embed .lp-body,
html.bt-embed .lp-faq,
html.bt-embed .lp-cta,
html.bt-embed .lp-related{display:none !important}
html.bt-embed .tool-section{padding:14px 0 0}
html.bt-embed .wrap{padding:0 14px;max-width:760px}
.bt-embed-credit{text-align:center;padding:16px 0 18px;font-family:var(--mono,ui-monospace,monospace);font-size:12px;letter-spacing:.06em;color:#666}
.bt-embed-credit a{color:#000;text-decoration:underline;text-underline-offset:2px}
/* Embed snippet box on the hub */
.embed-box{margin:14px 0 0;border:1px solid var(--ink);background:#0d0d0d;color:#eaeaea;padding:16px 18px;overflow:auto}
.embed-box code{font-family:var(--mono,ui-monospace,monospace);font-size:12.5px;line-height:1.6;white-space:pre;color:#eaeaea}

/* ---- Tool icons ---- */
.tico{width:22px;height:22px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.tool-result .eyebrow{display:inline-flex;align-items:center;gap:9px}
.tool-field > label .tico{width:15px;height:15px;stroke-width:1.6;margin-right:7px;vertical-align:-2px;color:var(--mute)}
.lp-related-grid a .card-ico{display:block;width:34px;height:34px;margin:0 0 16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--accent);transition:color .25s}
.lp-related-grid a:hover .card-ico{color:#fff}
.tool-badge{display:inline-grid;place-items:center;width:54px;height:54px;border:1px solid var(--ink);margin:0 0 22px;color:var(--accent)}
.tool-badge svg{width:28px;height:28px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}