/* ============================================================
   Aufsperrdienst Linz — main.css
   Design system: "Stahl & Papier" — pure monochrome, no radii
   except pills, no shadows, no motion. Giant grotesque display.
   Fonts: Schibsted Grotesk (all) · JetBrains Mono (labels)
   Prefix: al-
   ============================================================ */

:root{
  /* surfaces */
  --paper:#f8f8f8;
  --tile:#f1f1f1;
  --ink:#000000;
  --ink-2:#2b2b2b;
  --ink-3:#545454;
  /* lines */
  --line:#e2e2e2;
  --line-d:#545454;
  /* text on dark */
  --on-dark:#f8f8f8;
  --on-dark-2:rgba(248,248,248,.72);
  /* gradient band: black → steel → paper */
  --steel:#1c4159;
  --grad:linear-gradient(180deg,#000 0%,#06131c 26%,var(--steel) 58%,#7d96a6 82%,var(--paper) 100%);
  --grad-up:linear-gradient(180deg,#000 0%,#0b2333 34%,var(--steel) 62%,#8ea3b2 85%,var(--paper) 100%);
  /* type */
  --f:"Schibsted Grotesk","Helvetica Neue",Arial,sans-serif;
  --fm:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --t-display:clamp(30px,9.2vw,146px);
  --t-h1:clamp(27px,3.7vw,54px);
  --t-h2:clamp(20px,2.05vw,27px);
  --t-lead:clamp(16px,1.42vw,20px);
  --t-lead2:clamp(15px,1.25vw,18px);
  --t-body:clamp(14px,1.1vw,16px);
  --t-label:12px;
  /* metrics */
  --wrap:1386px;
  --gut:27px;
  --pad:108px;
  --gap:9px;
  --pill:9999px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0 auto;
  max-width:1920px;
  min-width:375px;
  background:var(--paper);
  color:var(--ink-2);
  font-family:var(--f);
  font-size:var(--t-body);
  line-height:1.5;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none;margin:0;padding:0}
h1,h2,h3,h4{font-family:var(--f);color:var(--ink);margin:0;font-weight:400;letter-spacing:-.01em}
h1{font-size:var(--t-h1);line-height:1}
h2{font-size:var(--t-h2);line-height:1.3}
h3{font-size:var(--t-lead2);line-height:1.3}
h4{font-size:var(--t-lead2);line-height:1.3}
p{margin:0}
b,strong{font-weight:600}
button{font-family:inherit;cursor:pointer;border:0;background:none}
input,select,textarea{font-family:inherit;font-size:inherit}
main{display:block}
section{scroll-margin-top:90px}

.al-wrap{width:min(var(--wrap),100% - var(--gut) * 2);margin-inline:auto}
.al-sec{padding:var(--pad) 0}

/* ---------- shared atoms ---------- */
.al-label{
  display:block;font-family:var(--fm);font-size:var(--t-label);font-weight:400;
  letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);
}
.al-label--light{color:var(--on-dark-2)}
/* a plain .al-label carries its own colour, so it inherits nothing from a dark
   parent — name every dark ground it can land on */
.al-hd--light .al-label,
.al-drawer .al-label,
.al-preis__sur .al-label,
.al-kon__info .al-label{color:var(--on-dark-2)}

.al-hd{max-width:760px;margin-bottom:52px}
.al-hd .al-label{margin-bottom:14px}
.al-hd h2{margin-bottom:15px}
.al-hd p{font-size:var(--t-lead2);color:var(--ink-3)}
.al-hd--light h2{color:var(--on-dark)}
.al-hd--light p{color:var(--on-dark-2)}
.al-hd--split{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:35px;align-items:end;max-width:none;
}
.al-hd--split p{padding-bottom:2px}

/* pill button — the one rounded shape in the whole system */
.al-pill{
  display:inline-flex;align-items:center;gap:12px;
  padding:9px 25px 9px 9px;border-radius:var(--pill);
  font-size:var(--t-lead2);line-height:1.3;white-space:nowrap;
}
.al-pill__ico{
  display:grid;place-items:center;width:36px;height:36px;flex:none;
  border-radius:var(--pill);
}
.al-pill--light{background:var(--paper);color:var(--ink)}
.al-pill--light .al-pill__ico{background:var(--ink)}
.al-pill--light .al-pill__ico img{filter:invert(1)}
.al-pill--light:hover{text-decoration:underline}
.al-pill--dark{background:var(--ink);color:var(--on-dark)}
.al-pill--dark .al-pill__ico{background:var(--paper)}
.al-pill--dark:hover{text-decoration:underline}

/* ============================================================
   HEADER
   ============================================================ */
.al-bar{position:sticky;top:0;z-index:900;background:var(--ink)}
.al-bar__in{
  width:min(var(--wrap),100% - var(--gut) * 2);margin-inline:auto;
  height:79px;display:flex;align-items:center;gap:30px;
}
.al-bar__brand{display:flex;align-items:center;gap:12px;color:var(--on-dark);flex:none}
.al-bar__brand img{filter:invert(1)}
.al-bar__brand span{font-size:var(--t-lead2);letter-spacing:-.01em}
.al-bar__nav{display:flex;align-items:center;gap:27px;margin-left:auto}
.al-bar__nav a{color:var(--on-dark);font-size:var(--t-body)}
.al-bar__nav a:hover{text-decoration:underline}
.al-bar__tel{
  display:inline-flex;align-items:center;gap:10px;flex:none;
  padding:7px 20px 7px 7px;border-radius:var(--pill);
  background:var(--paper);color:var(--ink);font-size:var(--t-body);white-space:nowrap;
}
.al-bar__tel-ico{
  display:grid;place-items:center;width:30px;height:30px;flex:none;
  border-radius:var(--pill);background:var(--ink);
}
.al-bar__tel-ico img{filter:invert(1)}
.al-bar__tel:hover{text-decoration:underline}
.al-bar__burger{display:none;width:34px;height:26px;padding:0;margin-left:auto;position:relative}
.al-bar__burger span{position:absolute;left:0;width:100%;height:2px;background:var(--on-dark)}
.al-bar__burger span:nth-child(1){top:2px}
.al-bar__burger span:nth-child(2){top:12px}
.al-bar__burger span:nth-child(3){top:22px}

/* drawer */
.al-drawer{
  position:fixed;top:0;right:0;z-index:1000;
  width:min(360px,86vw);height:100dvh;
  background:var(--ink);color:var(--on-dark);
  transform:translateX(102%);
  display:flex;flex-direction:column;
  padding:22px var(--gut) 27px;overflow-y:auto;overflow-x:clip;
}
.al-drawer{transition:transform .22s linear}
.al-drawer.is-open{transform:translateX(0)}
.al-drawer__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}
.al-drawer__x{width:34px;height:34px;display:grid;place-items:center;padding:0}
.al-drawer__x img{filter:invert(1)}
.al-drawer__nav{display:flex;flex-direction:column;gap:2px}
.al-drawer__nav a{
  padding:13px 0;border-bottom:1px solid var(--line-d);
  color:var(--on-dark);font-size:var(--t-lead2);
}
.al-drawer__foot{margin-top:auto;padding-top:27px}
.al-drawer__foot .al-pill{width:100%;justify-content:flex-start}
.al-backdrop{
  position:fixed;inset:0;z-index:990;background:rgba(0,0,0,.55);
  opacity:0;visibility:hidden;
}
.al-backdrop{transition:opacity .22s linear}
.al-backdrop.is-open{opacity:1;visibility:visible}

/* ============================================================
   1. HERO
   ============================================================ */
.al-hero{position:relative;background:var(--grad);overflow:hidden;padding-bottom:0}
.al-hero__mark{
  position:absolute;top:.12em;left:50%;transform:translateX(-50%);
  margin:0;white-space:nowrap;pointer-events:none;
  font-size:var(--t-display);line-height:1;letter-spacing:-.03em;
  color:var(--on-dark);
}
.al-hero__art{
  position:relative;z-index:1;
  display:grid;place-items:center;
  padding:calc(var(--t-display) * .96) 0 0;
}
.al-hero__art img{width:min(340px,42vw);height:auto}
.al-hero__grid{
  position:relative;z-index:2;
  width:min(var(--wrap),100% - var(--gut) * 2);margin:-64px auto 0;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:35px;align-items:end;
}
.al-hero__lead h1{color:var(--on-dark);margin-bottom:27px}
.al-hero__lead h1 span{
  display:block;margin-top:17px;
  font-size:var(--t-lead);line-height:1.4;letter-spacing:0;
  color:var(--on-dark-2);max-width:32ch;
}
.al-hero__note{justify-self:end;max-width:44ch}
.al-hero__note p{color:var(--on-dark);font-size:var(--t-body)}
.al-hero__facts{position:relative;z-index:2;margin-top:70px;background:var(--paper);padding:35px 0 0}
.al-hero__facts-row{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);
}
.al-fact{border-top:1px solid var(--ink);padding:17px 0 0;min-width:0}
.al-fact b{display:block;font-size:var(--t-lead);font-weight:400;color:var(--ink);margin-bottom:8px}
.al-fact span{display:block;font-size:var(--t-body);color:var(--ink-3)}

/* ============================================================
   2. TRIAGE
   ============================================================ */
.al-tri{background:var(--ink);padding:var(--pad) 0}
.al-tri__grid{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);
}
.al-tri__item{
  min-width:0;background:transparent;border-top:1px solid var(--line-d);
  padding:20px 0 0;display:flex;flex-direction:column;
}
.al-tri__no{
  display:block;font-family:var(--fm);font-size:var(--t-label);
  color:var(--on-dark-2);margin-bottom:20px;
}
.al-tri__item h3{color:var(--on-dark);margin-bottom:12px}
.al-tri__item p{color:var(--on-dark-2);margin-bottom:20px}
.al-tri__tag{
  margin-top:auto;align-self:flex-start;
  font-family:var(--fm);font-size:var(--t-label);letter-spacing:.04em;
  color:var(--on-dark);border:1px solid var(--line-d);padding:5px 12px;
}

/* ============================================================
   3. KONTEXT
   ============================================================ */
.al-ctx__in{
  display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.6fr);gap:70px;
}
.al-ctx__side{position:sticky;top:110px;align-self:start}
.al-ctx__side .al-label{margin-bottom:14px}
.al-ctx__body p{margin-bottom:20px;font-size:var(--t-lead2);color:var(--ink-2)}
.al-ctx__body p:last-child{margin-bottom:0}

/* ============================================================
   4. LEISTUNGEN — MOSAIK
   ============================================================ */
.al-lst{padding:var(--pad) 0}
.al-mos{
  width:min(var(--wrap),100% - var(--gut) * 2);margin-inline:auto;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);
}
.al-mos__t{
  min-width:0;background:var(--paper);border:1px solid var(--line);
  padding:27px 25px;display:flex;flex-direction:column;min-height:330px;
}
.al-mos__t h3{margin-bottom:14px}
.al-mos__tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:auto}
.al-mos__tags li{
  font-family:var(--fm);font-size:11px;letter-spacing:.03em;
  color:var(--ink-3);border:1px solid var(--line);padding:4px 9px;
}
.al-mos__t p{margin-top:25px;color:var(--ink-3)}
.al-mos__i{min-width:0;background:var(--tile);display:grid;place-items:center;padding:30px}
.al-mos__i img{width:100%;height:auto}
/* dark tile variant — declared after the base rule so it wins */
.al-mos__i--dark{background:var(--ink)}
.al-mos__t--hi{background:var(--ink);border-color:var(--ink)}
.al-mos__t--hi h3{color:var(--on-dark)}
.al-mos__t--hi p{color:var(--on-dark-2)}
.al-mos__t--hi .al-mos__tags li{color:var(--on-dark);border-color:var(--line-d)}

/* ============================================================
   5 / 14. SPLIT BANDS — black panel + bleeding photo
   ============================================================ */
.al-split{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);background:var(--ink)}
.al-split__panel{display:flex;align-items:center;padding:var(--pad) 0;min-width:0}
.al-split__body{
  width:100%;max-width:calc(var(--wrap) * .55);
  margin-left:max(var(--gut),calc((100vw - var(--wrap)) / 2));
  padding-right:35px;
}
.al-split__body .al-label{margin-bottom:17px}
.al-split__body h2{color:var(--on-dark);font-size:var(--t-h1);line-height:1.05;margin-bottom:25px}
.al-split__body p{color:var(--on-dark-2);margin-bottom:18px;font-size:var(--t-lead2)}
.al-split__body .al-pill{margin-top:17px}
.al-split__media{position:relative;min-height:520px;min-width:0}
.al-split__media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* reversed variant — photo left, panel right */
.al-split--rev{grid-template-columns:minmax(0,1fr) minmax(0,1.62fr)}
.al-split--rev .al-split__body{
  margin-left:0;margin-right:max(var(--gut),calc((100vw - var(--wrap)) / 2));
  padding-right:0;padding-left:35px;
}

/* ============================================================
   6. RECHT
   ============================================================ */
.al-recht__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.al-recht__item{
  min-width:0;position:relative;background:var(--tile);padding:30px 27px;
  display:flex;flex-direction:column;
}
.al-recht__no{
  display:block;font-family:var(--fm);font-size:var(--t-label);
  color:var(--ink-3);margin-bottom:22px;
}
.al-recht__item h3{margin-bottom:12px}
.al-recht__item p{color:var(--ink-3)}
.al-recht__item--note{background:var(--ink)}
.al-recht__item--note h3{color:var(--on-dark)}
.al-recht__item--note p{color:var(--on-dark-2)}

/* ============================================================
   7. SCHLIESSTECHNIK
   ============================================================ */
.al-tech__in{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:70px}
.al-tech__text .al-label{margin-bottom:14px}
.al-tech__text h2{margin-bottom:22px}
.al-tech__text p{margin-bottom:18px;font-size:var(--t-lead2);color:var(--ink-2)}
.al-tech__text p:last-child{margin-bottom:0}
.al-tech__specs{display:flex;flex-direction:column;gap:var(--gap)}
.al-tech__specs li{border-top:1px solid var(--ink);padding:14px 0 17px;min-width:0}
.al-tech__specs .al-label{margin-bottom:7px}
.al-tech__specs b{display:block;font-size:var(--t-lead2);font-weight:400;color:var(--ink);margin-bottom:5px}
.al-tech__specs small{display:block;font-size:var(--t-body);color:var(--ink-3);line-height:1.45}

/* ============================================================
   8. ABLAUF
   ============================================================ */
.al-abl__steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap) 35px}
.al-abl__steps li{display:flex;gap:18px;border-top:1px solid var(--line);padding-top:18px;min-width:0}
.al-abl__no{
  font-family:var(--fm);font-size:var(--t-label);color:var(--ink-3);flex:none;
  width:26px;padding-top:3px;
}
.al-abl__steps h3{margin-bottom:9px}
.al-abl__steps h3 em{
  display:block;font-style:normal;font-family:var(--fm);
  font-size:var(--t-label);letter-spacing:.04em;color:var(--ink-3);margin-top:5px;
}
.al-abl__steps p{color:var(--ink-3)}

/* ============================================================
   9. PREISE
   ============================================================ */
.al-preis__tbl{border-top:1px solid var(--ink)}
.al-preis__row{
  display:grid;grid-template-columns:minmax(0,1fr) 150px 150px;
  gap:20px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line);
}
.al-preis__row span{min-width:0}
.al-preis__row--head span{
  font-family:var(--fm);font-size:var(--t-label);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);
}
.al-preis__row b{font-weight:400;color:var(--ink);font-family:var(--fm);font-size:var(--t-body)}
.al-preis__row span:nth-child(2){font-family:var(--fm);font-size:var(--t-label);color:var(--ink-3)}
.al-preis__sur{margin-top:52px;background:var(--ink);padding:35px}
.al-preis__sur h3{color:var(--on-dark);margin-bottom:25px}
.al-preis__sur-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-bottom:27px}
.al-preis__sur-row > div{border-top:1px solid var(--line-d);padding-top:14px;min-width:0}
.al-preis__sur-row .al-label{margin-bottom:8px}
.al-preis__sur-row b{
  display:block;font-family:var(--fm);font-size:var(--t-lead);
  font-weight:400;color:var(--on-dark);
}
.al-preis__sur p{color:var(--on-dark-2);max-width:88ch}

/* ============================================================
   10. KOSTENFAKTOREN
   ============================================================ */
.al-kf__list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.al-kf__list article{border-top:1px solid var(--ink);padding:16px 0 0;min-width:0}
.al-kf__list .al-label{margin-bottom:14px;color:var(--ink)}
.al-kf__list p{color:var(--ink-3)}

/* ============================================================
   11. KOSTENRECHNER
   ============================================================ */
.al-calc__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap)}
.al-calc__text{background:var(--tile);padding:45px 40px;min-width:0}
.al-calc__text .al-label{margin-bottom:14px}
.al-calc__text h2{margin-bottom:17px}
.al-calc__text p{color:var(--ink-3);margin-bottom:27px;font-size:var(--t-lead2)}
.al-calc__hints{display:flex;flex-direction:column;gap:10px}
.al-calc__hints li{
  position:relative;padding-left:20px;font-family:var(--fm);
  font-size:var(--t-label);color:var(--ink-3);line-height:1.5;
}
.al-calc__hints li::before{
  content:"";position:absolute;left:0;top:7px;width:7px;height:7px;background:var(--ink);
}
.al-calc__panel{background:var(--ink);padding:45px 40px;min-width:0}
.al-calc__field{margin-bottom:20px;min-width:0}
.al-calc__field label{
  display:block;font-family:var(--fm);font-size:var(--t-label);
  letter-spacing:.06em;text-transform:uppercase;color:var(--on-dark-2);margin-bottom:9px;
}
.al-calc__input{
  width:100%;min-width:0;padding:13px 14px;border:1px solid var(--line-d);
  background:transparent;color:var(--on-dark);font-size:var(--t-body);border-radius:0;
}
.al-calc__input option{background:#111;color:var(--on-dark)}
.al-calc__out{border-top:1px solid var(--line-d);margin-top:30px;padding-top:20px}
.al-calc__out-line{display:flex;justify-content:space-between;gap:20px;padding:9px 0}
.al-calc__out-line span{color:var(--on-dark-2);font-size:var(--t-body)}
.al-calc__out-line strong{font-family:var(--fm);font-weight:400;color:var(--on-dark)}
.al-calc__out-line--tot{border-top:1px solid var(--line-d);margin-top:10px;padding-top:17px}
.al-calc__out-line--tot span{color:var(--on-dark)}
.al-calc__out-line--tot strong{font-size:var(--t-lead)}
.al-calc__cta{margin-top:27px;width:100%;justify-content:flex-start}

/* ============================================================
   12. HÄUFIGE FEHLER
   ============================================================ */
.al-err__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.al-err__item{border:1px solid var(--line);padding:27px 25px;min-width:0}
.al-err__bad{
  position:relative;padding-left:26px;margin-bottom:14px;
  font-size:var(--t-lead2);color:var(--ink);
}
.al-err__bad::before{
  content:"";position:absolute;left:0;top:.42em;width:13px;height:2px;
  background:var(--ink);
}
.al-err__good{color:var(--ink-3)}

/* ============================================================
   13. OBJEKT-SZENARIEN
   ============================================================ */
.al-obj__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.al-obj__card{background:var(--tile);padding:30px 27px;min-width:0}
.al-obj__card h3{margin-bottom:14px}
.al-obj__card p{color:var(--ink-3)}

/* ============================================================
   15. WARUM WIR
   ============================================================ */
.al-why{background:var(--ink);padding:var(--pad) 0}
.al-why__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:70px}
.al-why__side h2{color:var(--on-dark);font-size:var(--t-h1);line-height:1.05;margin-bottom:20px}
.al-why__side p{color:var(--on-dark-2)}
.al-why__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 35px}
.al-why__grid article{border-top:1px solid var(--line-d);padding-top:18px;min-width:0}
.al-why__grid h3{color:var(--on-dark);margin-bottom:11px}
.al-why__grid p{color:var(--on-dark-2)}

/* ============================================================
   16. EINSATZGEBIET
   ============================================================ */
.al-geo__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.al-geo__col{border-top:1px solid var(--ink);padding-top:16px;min-width:0}
.al-geo__col > summary{
  display:flex;align-items:center;gap:10px;list-style:none;cursor:default;
  pointer-events:none;margin-bottom:16px;
}
.al-geo__col > summary::-webkit-details-marker{display:none}
.al-geo__col > summary > span:first-child{font-size:var(--t-lead2);color:var(--ink)}
.al-geo__plz{
  margin-left:auto;font-family:var(--fm);font-size:var(--t-label);
  color:var(--ink-3);border:1px solid var(--line);padding:3px 9px;
}
.al-geo__chev{display:none}
.al-geo__col ul{display:flex;flex-direction:column;gap:7px}
.al-geo__col li{font-family:var(--fm);font-size:var(--t-label);color:var(--ink-3);line-height:1.5}
.al-geo__note{margin-top:35px;color:var(--ink-3);max-width:96ch}

/* ============================================================
   17. ÜBER UNS
   ============================================================ */
.al-about__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--gap)}
.al-about__media{position:relative;min-height:440px;min-width:0}
.al-about__media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.al-about__text{background:var(--tile);padding:45px 40px;min-width:0}
.al-about__text .al-label{margin-bottom:14px}
.al-about__text h2{margin-bottom:20px}
.al-about__text p{color:var(--ink-3);margin-bottom:17px}
.al-about__facts{margin-top:27px;display:flex;flex-direction:column;gap:var(--gap)}
.al-about__facts li{border-top:1px solid var(--ink);padding-top:12px;min-width:0}
.al-about__facts b{display:block;font-size:var(--t-body);font-weight:600;color:var(--ink);margin-bottom:4px}
.al-about__facts span{display:block;font-size:var(--t-body);color:var(--ink-3)}

/* ============================================================
   18. TEAM
   ============================================================ */
.al-team__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.al-team__card{min-width:0}
.al-team__ph{background:var(--tile);aspect-ratio:1/1;max-width:100%;margin-bottom:20px}
.al-team__ph > img{width:100%;height:100%;object-fit:cover}
.al-team__card h3{margin-bottom:6px}
.al-team__card .al-label{margin-bottom:12px}
.al-team__card p{color:var(--ink-3)}

/* ============================================================
   19. BEWERTUNGEN
   ============================================================ */
.al-rev{background:var(--grad-up);padding:var(--pad) 0 calc(var(--pad) * .7)}
.al-rev__head{display:flex;align-items:baseline;justify-content:space-between;gap:27px;margin-bottom:45px}
.al-rev__score{font-family:var(--fm);font-size:var(--t-body);color:var(--on-dark-2)}
.al-rev__score b{font-weight:400;color:var(--on-dark)}
.al-rev__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px}
.al-rev__card{background:var(--tile);padding:45px 35px;display:flex;flex-direction:column;min-width:0}
.al-rev__stars{font-size:15px;letter-spacing:.14em;color:var(--ink);margin-bottom:22px}
.al-rev__body{color:var(--ink-2);margin-bottom:27px;font-size:var(--t-lead2);line-height:1.55}
.al-rev__who{margin-top:auto;font-size:var(--t-body);color:var(--ink);text-transform:uppercase;letter-spacing:.04em}
.al-rev__meta{font-family:var(--fm);font-size:var(--t-label);color:var(--ink-3);margin-top:6px}
.al-rev__more{
  display:inline-block;margin-top:45px;color:var(--paper);
  font-size:var(--t-lead2);border-bottom:1px solid var(--paper);padding-bottom:3px;
}

/* ============================================================
   20. RATGEBER
   ============================================================ */
.al-blog__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.al-blog__card{display:flex;flex-direction:column;background:var(--tile);min-width:0}
.al-blog__media{aspect-ratio:3/2;background:var(--line);overflow:hidden}
.al-blog__media > img{width:100%;height:100%;object-fit:cover}
.al-blog__body{padding:25px 24px 27px;display:flex;flex-direction:column;flex:1}
.al-blog__tag{
  align-self:flex-start;font-family:var(--fm);font-size:11px;letter-spacing:.04em;
  color:var(--ink-3);border:1px solid var(--line);padding:4px 9px;margin-bottom:14px;
}
.al-blog__card h3{margin-bottom:10px}
.al-blog__body p{color:var(--ink-3);margin-bottom:18px}
.al-blog__more{
  margin-top:auto;font-family:var(--fm);font-size:var(--t-label);
  letter-spacing:.04em;color:var(--ink);border-bottom:1px solid var(--ink);
  align-self:flex-start;padding-bottom:2px;
}
.al-blog__all{
  display:inline-block;margin-top:45px;font-size:var(--t-lead2);
  color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;
}

/* ============================================================
   21. FAQ
   ============================================================ */
.al-faq__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.85fr);gap:70px}
.al-faq__side{position:sticky;top:110px;align-self:start}
.al-faq__side .al-label{margin-bottom:14px}
.al-faq__side h2{margin-bottom:15px}
.al-faq__side p{color:var(--ink-3);margin-bottom:27px}
.al-faq__list{border-top:1px solid var(--ink)}
.al-faq__item{border-bottom:1px solid var(--line)}
.al-faq__item > summary{
  display:flex;align-items:center;gap:20px;justify-content:space-between;
  padding:20px 0;cursor:pointer;list-style:none;
  font-size:var(--t-lead2);color:var(--ink);
}
.al-faq__item > summary::-webkit-details-marker{display:none}
.al-faq__item > summary img{flex:none}
.al-faq__item[open] > summary img{transform:rotate(180deg)}
.al-faq__item > div{padding:0 0 22px}
.al-faq__item p{color:var(--ink-3);max-width:92ch}

/* ============================================================
   22. KONTAKT
   ============================================================ */
.al-kon{background:var(--ink);padding:var(--pad) 0}
.al-kon__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:70px}
.al-kon__info .al-label{margin-bottom:14px}
.al-kon__info h2{color:var(--on-dark);font-size:var(--t-h1);line-height:1.05;margin-bottom:20px}
.al-kon__info > p{color:var(--on-dark-2);margin-bottom:25px;font-size:var(--t-lead2)}
.al-kon__hint{
  border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);
  padding:15px 0;color:var(--on-dark);font-size:var(--t-body);margin-bottom:30px;
}
.al-kon__details{display:flex;flex-direction:column;gap:15px}
.al-kon__details li{
  display:grid;grid-template-columns:130px minmax(0,1fr);gap:18px;align-items:baseline;
  color:var(--on-dark);font-size:var(--t-body);
}
.al-kon__details a{color:var(--on-dark)}
.al-kon__details a:hover{text-decoration:underline}
/* light panel on a dark band — every colour restated, nothing inherited */
.al-kon__panel{background:var(--paper);padding:40px 35px;min-width:0;color:var(--ink-2)}
.al-kon__form-title{color:var(--ink);font-size:var(--t-lead);margin-bottom:25px}
.al-kon__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.al-kon__field{margin-bottom:var(--gap);min-width:0}
.al-kon__input,.al-kon__textarea{
  width:100%;min-width:0;padding:13px 14px;border:1px solid var(--line);
  background:#fff;color:var(--ink-2);font-size:var(--t-body);border-radius:0;
  line-height:1.45;
}
.al-kon__textarea{resize:vertical;min-height:112px}
.al-kon__input::placeholder,.al-kon__textarea::placeholder{color:#8a8a8a}
.al-kon__input:focus,.al-kon__textarea:focus{outline:none;border-color:var(--ink)}
.al-kon__input:-webkit-autofill{
  -webkit-text-fill-color:var(--ink-2);
  -webkit-box-shadow:0 0 0 40px #fff inset;
}
.al-kon__error{font-family:var(--fm);font-size:11px;color:#b00020;margin-top:5px}
.al-kon__submit{
  width:100%;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:16px 25px;background:var(--ink);color:var(--paper);
  font-size:var(--t-lead2);border-radius:var(--pill);margin-top:10px;
}
.al-kon__submit img{filter:invert(1)}
.al-kon__submit:hover{text-decoration:underline}
.al-kon__success{
  margin-top:15px;padding:14px;border:1px solid var(--ink);
  color:var(--ink);font-size:var(--t-body);
}

/* ============================================================
   23. SEO TEXT
   ============================================================ */
.al-seo{background:var(--tile)}
.al-seo__in{max-width:900px}
.al-seo__h2{font-size:var(--t-h1);line-height:1.1;margin-bottom:27px}
.al-seo__in h3{font-size:var(--t-lead);margin:35px 0 12px}
.al-seo__in > p{color:var(--ink-2);margin-bottom:15px;font-size:var(--t-lead2)}
.al-seo__box{background:var(--paper);border-left:2px solid var(--ink);padding:27px 30px;margin:30px 0}
.al-seo__box h4{margin-bottom:15px}
.al-seo__box ul{display:flex;flex-direction:column;gap:9px}
.al-seo__box li{
  position:relative;padding-left:20px;font-size:var(--t-body);color:var(--ink-3);
}
.al-seo__box li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;background:var(--ink)}
.al-seo__box p{color:var(--ink-3)}
.al-seo__box--dark{background:var(--ink);border-left-color:var(--ink)}
.al-seo__box--dark h4{color:var(--on-dark)}
.al-seo__box--dark p{color:var(--on-dark-2)}
.al-seo__box--dark a{color:var(--on-dark);border-bottom:1px solid var(--line-d)}

/* ============================================================
   FOOTER
   ============================================================ */
.al-foot{background:var(--paper);padding:var(--pad) 0 30px;overflow:hidden}
.al-foot__in{width:min(var(--wrap),100% - var(--gut) * 2);margin-inline:auto}
.al-foot__mark{
  margin:0 0 60px;white-space:nowrap;
  font-size:var(--t-display);line-height:1;letter-spacing:-.03em;color:var(--ink-2);
}
.al-foot__grid{
  display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));
  gap:35px;padding-bottom:45px;
}
.al-foot__brand{display:flex;align-items:center;gap:12px;margin-bottom:17px}
.al-foot__brand span{font-size:var(--t-lead2);color:var(--ink)}
.al-foot__about{color:var(--ink-3);max-width:46ch}
.al-foot__col h4{
  font-family:var(--fm);font-size:var(--t-label);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:17px;
}
.al-foot__col nav{display:flex;flex-direction:column;gap:10px}
.al-foot__col a,.al-foot__col span{font-size:var(--t-body);color:var(--ink-2);overflow-wrap:anywhere}
.al-foot__col a:hover{text-decoration:underline}
.al-foot__regions{border-top:1px solid var(--line);padding:22px 0;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.al-foot__regions-label{font-family:var(--fm);font-size:var(--t-label);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.al-foot__regions-row{display:flex;flex-wrap:wrap;gap:7px}
.al-foot__region{border:1px solid var(--line);padding:6px 12px;font-size:var(--t-body);color:var(--ink-2)}
.al-foot__region:hover{border-color:var(--ink)}
.al-foot__bottom{
  border-top:1px solid var(--line);padding-top:22px;
  display:flex;flex-wrap:wrap;gap:17px;justify-content:space-between;align-items:center;
}
.al-foot__copy{font-size:var(--t-body);color:var(--ink-3)}
.al-foot__legal{display:flex;gap:22px}
.al-foot__legal a{font-size:var(--t-body);color:var(--ink-3)}
.al-foot__legal a:hover{text-decoration:underline}

/* Fixed call button */
.al-fab{position:fixed;right:20px;bottom:20px;z-index:9999}
.al-fab__btn{
  position:relative;display:grid;place-items:center;width:65px;height:65px;
  border-radius:var(--pill);background:var(--ink);
}
.al-fab__btn img{filter:invert(1)}
.al-fab__btn::after{
  content:"";position:absolute;inset:0;border-radius:var(--pill);
  border:1px solid var(--ink);animation:al-pulse 2.2s ease-out infinite;
}
@keyframes al-pulse{
  0%{transform:scale(1);opacity:.6}
  100%{transform:scale(1.45);opacity:0}
}

/* ============================================================
   RESPONSIVE — 1920 … 375
   ============================================================ */
@media (max-width:1200px){
  :root{--gut:19px;--pad:80px}
  .al-ctx__in,.al-tech__in,.al-why__in,.al-faq__in,.al-kon__in{gap:45px}
  .al-mos__t{min-height:300px;padding:24px 20px}
  .al-preis__row{grid-template-columns:minmax(0,1fr) 120px 130px}
}

@media (max-width:1024px){
  :root{--pad:64px}
  /* phone + desktop nav belong to the drawer from here down */
  .al-bar__nav,.al-bar__tel{display:none}
  .al-bar__burger{display:block}
  .al-bar__in{height:64px}
  .al-hero__grid{grid-template-columns:minmax(0,1fr);gap:27px;margin-top:20px}
  .al-hero__note{justify-self:start}
  .al-tri__grid,.al-obj__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
  .al-mos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .al-ctx__in{grid-template-columns:minmax(0,1fr);gap:27px}
  .al-ctx__side{position:static}
  .al-recht__grid,.al-err__grid,.al-team__grid,.al-blog__grid,.al-abl__steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .al-tech__in{grid-template-columns:minmax(0,1fr)}
  .al-kf__list{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
  .al-geo__cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
  .al-why__in{grid-template-columns:minmax(0,1fr);gap:35px}
  .al-faq__in{grid-template-columns:minmax(0,1fr);gap:30px}
  .al-faq__side{position:static}
  .al-kon__in{grid-template-columns:minmax(0,1fr)}
  .al-split,.al-split--rev{grid-template-columns:minmax(0,1fr)}
  .al-split__media{min-height:320px;order:-1}
  .al-split--rev .al-split__media{order:-1}
  .al-split__body{margin-left:var(--gut);margin-right:var(--gut);padding-right:0;max-width:none}
  .al-split--rev .al-split__body{margin-left:var(--gut);margin-right:var(--gut);padding-left:0}
  .al-about__in,.al-calc__in{grid-template-columns:minmax(0,1fr)}
  .al-about__media{min-height:300px}
  .al-rev__grid{grid-template-columns:minmax(0,1fr);gap:var(--gap)}
  .al-foot__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
}

@media (max-width:768px){
  :root{--gut:29px;--pad:52px}
  .al-hd{margin-bottom:35px}
  .al-hd--split{grid-template-columns:minmax(0,1fr);gap:15px;align-items:start}
  .al-hero__art img{width:min(230px,52vw)}
  .al-hero__facts-row{grid-template-columns:minmax(0,1fr);gap:0}
  .al-fact{padding:14px 0;border-bottom:0}
  .al-fact + .al-fact{border-top:1px solid var(--line)}
  .al-preis__row{grid-template-columns:minmax(0,1fr);gap:5px;padding:14px 0}
  .al-preis__row--head{display:none}
  .al-preis__row span:nth-child(2)::before{content:attr(data-label) ": ";}
  .al-preis__row span:nth-child(3)::before{content:attr(data-label) ": ";font-family:var(--fm);font-size:var(--t-label);color:var(--ink-3)}
  .al-preis__sur{padding:27px 22px}
  .al-preis__sur-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
  .al-abl__steps{grid-template-columns:minmax(0,1fr);gap:20px}
  .al-why__grid{grid-template-columns:minmax(0,1fr);gap:30px}
  .al-calc__text,.al-calc__panel,.al-about__text{padding:30px 24px}
  .al-kon__panel{padding:28px 22px}
  .al-kon__details li{grid-template-columns:minmax(0,1fr);gap:3px}
  /* long coverage lists collapse on phones */
  .al-geo__cols{grid-template-columns:minmax(0,1fr);gap:0}
  .al-geo__col{border-top:1px solid var(--line);padding:0}
  .al-geo__col:first-child{border-top-color:var(--ink)}
  .al-geo__col > summary{
    pointer-events:auto;cursor:pointer;padding:15px 0;margin-bottom:0;
  }
  .al-geo__chev{display:block;margin-left:10px}
  .al-geo__col[open] > .al-geo__chev,.al-geo__col[open] > summary .al-geo__chev{transform:rotate(180deg)}
  .al-geo__col ul{padding-bottom:18px}
  .al-foot__mark{margin-bottom:35px}
}

@media (max-width:480px){
  :root{--gut:16px;--pad:44px}
  .al-tri__grid,.al-obj__grid,.al-recht__grid,.al-err__grid,
  .al-team__grid,.al-blog__grid,.al-kf__list{grid-template-columns:minmax(0,1fr)}
  .al-mos{grid-template-columns:minmax(0,1fr)}
  .al-mos__t{min-height:0}
  .al-mos__i{padding:22px}
  .al-preis__sur-row{grid-template-columns:minmax(0,1fr);gap:15px}
  /* footer never drops to one column — the two nav lists stay side by side;
     only the wide brand text and the contact block span the full width */
  .al-foot__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 20px}
  .al-foot__grid > .al-foot__col:first-child,
  .al-foot__grid > .al-foot__col:last-child{grid-column:1 / -1}
  .al-rev__head{flex-direction:column;gap:10px}
  .al-rev__card{padding:30px 24px}
  .al-pill{padding:7px 20px 7px 7px;font-size:15px;gap:10px}
  .al-pill__ico{width:32px;height:32px}
  .al-fab__btn{width:55px;height:55px}
  .al-fab{right:14px;bottom:14px}
}

@media (max-width:375px){
  .al-hero__mark{font-size:8.6vw}
  .al-foot__mark{font-size:8.6vw}
  .al-bar__brand span{font-size:14px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .al-fab__btn::after{animation:none}
}