/* 3aART Akustikbedarfsrechner */
.aart-ak{display:grid;grid-template-columns:2fr 1fr;gap:24px;align-items:start;max-width:980px;margin:0 auto;font-family:inherit;color:#1a2520}
.aart-ak__form{background:#fff;border:1px solid #e3e8e5;border-radius:14px;padding:24px}
.aart-ak__h{font-size:15px;font-weight:700;margin:20px 0 10px;color:#001d18;letter-spacing:.02em}
.aart-ak__h:first-child{margin-top:0}
.aart-ak__grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.aart-ak__grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:14px}
.aart-ak__field{display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600}
.aart-ak__field span{color:#5a6b64}
.aart-ak__field input,.aart-ak__field select{padding:10px 12px;border:1px solid #ccd6d1;border-radius:9px;font-size:15px;background:#fff;color:#1a2520}
.aart-ak__field input:focus,.aart-ak__field select:focus{outline:none;border-color:#001d18;box-shadow:0 0 0 3px rgba(0,29,24,.08)}
.aart-ak__stepper-wrap{display:flex;flex-direction:column;gap:8px}
.aart-ak__step-label{font-size:13px;font-weight:600;color:#5a6b64;display:flex;align-items:center;gap:6px}
.aart-ak__info{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:#8f000a;color:#fff;font-size:10px;font-weight:700;font-style:normal;cursor:help;line-height:1}
.aart-ak__stepper{display:flex;align-items:center;gap:8px}
.aart-ak__stepper input{width:60px;text-align:center;padding:9px 4px;border:1px solid #ccd6d1;border-radius:9px;font-size:15px;font-weight:700;background:#f7f9f8}
/* +/- verhalten sich wie die uebrigen Buttons: CD-Rot, Hover gefuellt, Klick dunkelrot.
   Vorher rund und dunkelgruen mit gruenem Hover — als einzige Buttons aus der Reihe gefallen. */
.aart-ak .aart-ak__stepper button{width:38px;height:38px;flex:0 0 38px;border:2px solid #8f000a;background:#fff;font-size:20px;line-height:1;cursor:pointer;color:#8f000a !important;font-weight:700;transition:background .15s,color .15s,border-color .15s}
.aart-ak .aart-ak__stepper button:hover,
.aart-ak .aart-ak__stepper button:focus-visible{background:#8f000a !important;color:#fff !important;transform:none !important}
.aart-ak .aart-ak__stepper button:active{background:#720008 !important;border-color:#720008;color:#fff !important}
/* Am Anschlag (0 bzw. Maximum) nicht mehr klickbar aussehen — wie auf der alten Seite. */
.aart-ak .aart-ak__stepper button.is-disabled,
.aart-ak .aart-ak__stepper button.is-disabled:hover{border-color:#d8d5cf;background:#fff !important;color:#b6b3ac !important;cursor:not-allowed}
.aart-ak__check{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#5a6b64;margin-top:6px}
.aart-ak__note{font-size:12px;color:#8a9690;margin:6px 0 0}
.aart-ak__result{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid #e3e8e5}
.aart-ak__result-label{font-size:15px;font-weight:700;color:#001d18}
.aart-ak__result-val{font-size:30px;font-weight:800;color:#001d18;line-height:1}
.aart-ak__result-val small{font-size:15px;font-weight:600;color:#5a6b64}
/* Primaerbutton wie im Rest der Seite: CD-Rot, Hover DUNKELROT (nicht gruen).
   .aart-ak-Prefix + !important schlagen die aart-configurator-branding.css (Footer),
   die sonst :hover auf Brand-Green setzt. */
.aart-ak .aart-ak__calc{margin-left:auto;padding:12px 22px;border:none;border-radius:10px;background:#8f000a !important;color:#fff !important;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s}
.aart-ak .aart-ak__calc:hover,.aart-ak .aart-ak__calc:focus-visible{background:#720008 !important;transform:none !important}
.aart-ak__error{margin-top:14px;padding:12px 14px;border-radius:9px;background:#fdeaec;color:#8f000a;font-size:13px;font-weight:600;border:1px solid #f3c4c9}
/* Seitenleiste HELL (statt dunkelgruen) — Codex-Branding setzt sonst dunkelgruenen Grund */
.aart-ak .aart-ak__aside{background:#faf9f7 !important;color:#252525 !important;border:1px solid #e3e8e5 !important;border-radius:14px;padding:24px;font-size:14px;line-height:1.55}
.aart-ak .aart-ak__aside strong{color:#001d18 !important}
.aart-ak .aart-ak__cta{display:block;text-align:center;margin-top:18px;padding:13px 18px;background:#8f000a !important;color:#fff !important;border-radius:10px;font-weight:700;text-decoration:none;transition:background .15s}
.aart-ak .aart-ak__cta:hover,.aart-ak .aart-ak__cta:focus-visible{background:#720008 !important;color:#fff !important;transform:none !important}
.aart-ak .aart-ak__contact{margin-top:18px;padding-top:16px;border-top:1px solid #e3e8e5}
.aart-ak .aart-ak__contact-label{font-size:12px;color:#696966 !important;margin-bottom:3px}
.aart-ak .aart-ak__phone{color:#8f000a !important;font-size:19px;font-weight:800;text-decoration:none}
.aart-ak__foamnote{margin-top:14px;padding:10px 12px;background:#faf9f7;border-left:3px solid #8f000a;color:#5a6b64;font-size:12.5px}
@media(max-width:760px){.aart-ak{grid-template-columns:1fr}.aart-ak__grid3{grid-template-columns:1fr 1fr}.aart-ak__calc{margin-left:0;width:100%}}

/* 19.07.2026 — CD-konform eckig + Abstand zu Header/Footer wie andere Seiten.
   .aart-ak-Prefix schlaegt Basis + aart-configurator-branding.css. */
.aart-ak { padding: 40px 0 70px; }
.aart-ak .aart-ak__form,
.aart-ak .aart-ak__aside,
.aart-ak .aart-ak__field input,
.aart-ak .aart-ak__field select,
.aart-ak .aart-ak__stepper input,
.aart-ak .aart-ak__stepper button,
.aart-ak .aart-ak__calc,
.aart-ak .aart-ak__cta,
.aart-ak .aart-ak__error,
.aart-ak .aart-ak__quality { border-radius: 0 !important; }

/* Klick-Zustand auch bei den Primaerbuttons, damit sich alle Buttons gleich anfuehlen. */
.aart-ak .aart-ak__calc:active,
.aart-ak .aart-ak__cta:active { background: #5c0006 !important; color: #fff !important; }
@media (max-width:760px){ .aart-ak { padding: 24px 0 48px; } }