/* assets/css/autarkie-rechner.css – Autarkie-Rechner (dunkel und hell) */
.ar{
    --ar-bg:#141414; --ar-panel:#1C1C1A; --ar-tile:#232320; --ar-line:#2E2E2A; --ar-line-2:#4A4A43;
    --ar-ink:#FFFFFF; --ar-muted:#A8A69C; --ar-soft:#C9C7BD; --ar-faint:#8E8C83;
    --ar-accent:#F2B705; --ar-accent-text:#F2B705; --ar-sel:#2A2410; --ar-best:#221F12; --ar-track:#262622;
    --ar-water:#6FA8DC;
    padding:96px 0; background:var(--ar-bg); color:var(--ar-ink);
}
.ar--light{
    --ar-bg:#F7F6F3; --ar-panel:#FFFFFF; --ar-tile:#F7F6F3; --ar-line:#E4E2DC; --ar-line-2:#C9C6BD;
    --ar-ink:#1E1E1C; --ar-muted:#5F6763; --ar-soft:#4A504C; --ar-faint:#6B706C;
    --ar-accent-text:#8A6600; --ar-sel:#FBF0CC; --ar-best:#FFF8E1; --ar-track:#E9E7E1;
    --ar-water:#2F6DA3;
}
.ar *{box-sizing:border-box}
.ar__container{display:flex;flex-direction:column;gap:40px}
.ar__head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.ar__head-copy{display:flex;flex-direction:column;gap:16px;max-width:760px}
.ar__badge{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:var(--ar-sel);color:var(--ar-accent-text);font-size:.75rem;font-weight:700;letter-spacing:.16em}
.ar__badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ar-accent)}
.ar__title{margin:0;color:var(--ar-ink);font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:.98;font-weight:800;letter-spacing:-.03em}
.ar__title span{color:var(--ar-accent-text)}
.ar__intro{margin:0;color:var(--ar-soft);font-size:1.05rem;line-height:1.6}
.ar__equip{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.ar__label{font-size:.78rem;font-weight:700;letter-spacing:.12em;color:var(--ar-muted)}
.ar__switch{display:flex;gap:6px;padding:4px;border-radius:999px;background:var(--ar-panel);border:1px solid var(--ar-line)}
.ar-switch{min-height:40px;padding:0 18px;border-radius:999px;border:0;background:transparent;color:var(--ar-soft);font:inherit;font-size:.82rem;font-weight:700;cursor:pointer}
.ar-switch.is-on{background:var(--ar-accent);color:#141414}

.ar__grid{display:grid;grid-template-columns:440px minmax(0,1fr);gap:40px;align-items:start}
.ar__panel{display:flex;flex-direction:column;gap:22px;padding:28px;border-radius:28px;background:var(--ar-panel);border:1px solid var(--ar-line)}
.ar-field{display:flex;flex-direction:column;gap:10px}
.ar-segs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ar-seg{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 14px;border-radius:16px;text-align:left;cursor:pointer;font:inherit;background:var(--ar-tile);color:var(--ar-ink);border:2px solid var(--ar-line)}
.ar-seg.is-on{background:var(--ar-sel);border-color:var(--ar-accent)}
.ar-seg__label{font-size:.95rem;font-weight:700}
.ar-seg__sub{font-size:.75rem;color:var(--ar-muted)}
.ar-stepper{display:flex;align-items:center;gap:14px}
.ar-step{width:48px;height:48px;border-radius:999px;border:1.5px solid var(--ar-line-2);background:transparent;color:var(--ar-ink);font:inherit;font-size:1.4rem;font-weight:700;cursor:pointer}
.ar-stepper__value{min-width:40px;text-align:center;font-size:2.6rem;font-weight:800;color:var(--ar-accent-text)}
.ar-chips{display:flex;flex-wrap:wrap;gap:8px}
.ar-chip{min-height:44px;padding:0 16px;border-radius:999px;font:inherit;font-size:.88rem;font-weight:700;cursor:pointer;background:transparent;color:var(--ar-ink);border:1.5px solid var(--ar-line-2)}
.ar-chip.is-on{background:var(--ar-accent);border-color:var(--ar-accent);color:#141414}
.ar__note{font-size:.8rem;color:var(--ar-faint)}

.ar__results{display:flex;flex-direction:column;gap:14px}
.ar [data-ar-rows]{display:flex;flex-direction:column;gap:12px}
.ar__row{display:grid;grid-template-columns:150px minmax(0,1fr) 170px;gap:20px;align-items:center;padding:18px 24px;border-radius:22px;background:var(--ar-panel);border:1.5px solid var(--ar-line)}
.ar__row.is-best{background:var(--ar-best);border-color:var(--ar-accent)}
.ar__row--head{padding:0 24px;background:none;border:0;font-size:.74rem;font-weight:700;letter-spacing:.12em;color:var(--ar-faint)}
.ar__right{text-align:right}
.ar__model{display:flex;flex-direction:column;gap:4px}
.ar__model-name{font-size:1.5rem;line-height:1;font-weight:800;letter-spacing:-.01em}
.ar__model-spec{font-size:.78rem;color:var(--ar-muted)}
.ar__bars{display:flex;flex-direction:column;gap:10px}
.ar-bar{display:grid;grid-template-columns:64px minmax(0,1fr) 44px;gap:10px;align-items:center;font-size:.82rem}
.ar-bar__label{color:var(--ar-soft)}
.ar-bar__track{position:relative;height:12px;border-radius:6px;background:var(--ar-track)}
.ar-bar__fill{position:absolute;top:0;left:0;height:12px;border-radius:6px;transition:width .35s ease}
.ar-bar__fill--water{background:var(--ar-water)}
.ar-bar__fill--power{background:var(--ar-accent)}
.ar-bar__fill.is-empty{background:var(--ar-line-2)}
.ar-bar__val{font-weight:700;text-align:right}
.ar__days{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right}
.ar__days-value{font-size:2rem;line-height:1;font-weight:800;white-space:nowrap}
.ar__row.is-best .ar__days-value{color:var(--ar-accent-text)}
.ar__days-limit{font-size:.74rem;font-weight:600;color:var(--ar-muted)}
.ar__foot{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:8px;flex-wrap:wrap}
.ar__disclaimer{margin:0;max-width:560px;font-size:.78rem;line-height:1.55;color:var(--ar-faint)}
.ar__actions{display:flex;gap:10px;flex-wrap:wrap}
.ar .ar-btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:999px;font-size:.85rem;font-weight:700;letter-spacing:.06em;text-decoration:none;border:1.5px solid transparent;transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.ar .ar-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ar .ar-btn--primary{background:var(--ar-accent);color:#141414}
.ar .ar-btn--primary:hover{background:var(--ar-ink);color:var(--ar-bg)}
.ar .ar-btn--ghost{border-color:var(--ar-line-2);color:var(--ar-ink)}
.ar .ar-btn--ghost:hover{border-color:var(--ar-accent-text);color:var(--ar-accent-text)}
.ar button:focus-visible,.ar a:focus-visible{outline:2px solid var(--ar-accent);outline-offset:3px}

@media (max-width:1099.98px){
    .ar__grid{grid-template-columns:minmax(0,1fr)}
    .ar__equip{align-items:flex-start}
}
@media (max-width:767.98px){
    .ar{padding:56px 0}
    .ar__panel{padding:18px}
    .ar__row--head{display:none}
    .ar__row{grid-template-columns:minmax(0,1fr);grid-template-areas:"model" "days" "bars";gap:12px;padding:16px}
    .ar__model{grid-area:model;flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px}
    .ar__model-spec{text-align:right}
    .ar__days{grid-area:days;flex-direction:row;align-items:baseline;justify-content:space-between;gap:12px;text-align:left}
    .ar__bars{grid-area:bars}
    .ar__days-value{font-size:1.6rem}
    .ar__days-limit{text-align:right}
    .ar__actions .ar-btn{flex:1 1 auto;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.ar-bar__fill{transition:none}}