/* wye-sicherheit.de
   Layout nach Entwurf 2a hell / 2b dunkel, folgt der Systemeinstellung.
   Neutral-kuehle Graustufen, Ausdruck immer hell.
   Schrift Source Sans 3, selbst gehostet (SIL Open Font License).
   Keine externen Dateien, keine Cookies, kein Tracking, kein JavaScript. */

@font-face{
  font-family:"Source Sans 3";
  src:url("fonts/source-sans-3-latin-400-normal.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Source Sans 3";
  src:url("fonts/source-sans-3-latin-600-normal.woff2") format("woff2");
  font-weight:600; font-style:normal; font-display:swap;
}

:root{
  --bg:#FCFCFD;
  --ink:#131519;
  --desc:#545861;
  --qual:#32353B;
  --sub:#6A6E77;
  --faint:#6E7179;
  --rule:#E3E5E9;
  --box:rgba(19,21,25,.18);

  --sans:"Source Sans 3",Calibri,Verdana,Arial,Helvetica,sans-serif;
}

/* Dunkler Modus - Palette aus Entwurf 2b, folgt der Systemeinstellung */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#101113;
    --ink:#E9EAEC;
    --desc:#9A9EA5;
    --qual:#C4C7CC;
    --sub:#8B8F96;
    --faint:#8A8E96;
    --rule:rgba(233,234,236,.10);
    --box:rgba(233,234,236,.16);
  }
}
:root[data-theme="dark"]{
  --bg:#101113;
  --ink:#E9EAEC;
  --desc:#9A9EA5;
  --qual:#C4C7CC;
  --sub:#8B8F96;
  --faint:#8A8E96;
  --rule:rgba(233,234,236,.10);
  --box:rgba(233,234,236,.16);
}

/* Ausdruck immer hell, unabhaengig vom Bildschirmmodus */
@media print{
  :root{
    --bg:#FFFFFF; --ink:#000000; --desc:#333333; --qual:#222222;
    --sub:#444444; --faint:#555555; --rule:#CCCCCC; --box:#999999;
  }
  body{background:#FFFFFF;color:#000000}
  .page{max-width:none;padding:0}
  a{text-decoration:none}
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.page{max-width:640px;margin:0 auto;padding:64px 28px 44px}
@media (max-width:560px){ .page{padding:44px 22px 36px} }

a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
a:focus-visible{outline:2px solid currentColor;outline-offset:3px}

h1,h2{margin:0;font-weight:600}
p{margin:0}

/* ---------- Kopf ---------- */

.name{font-size:29px;letter-spacing:-.012em;line-height:1.15}
.sub{font-size:15.5px;margin-top:5px;color:var(--sub)}
.reachline{font-size:15.5px;margin-top:3px;color:var(--sub)}
.pitch{margin-top:36px;font-size:20px;line-height:1.45;max-width:34ch;color:var(--ink)}

/* ---------- Leistungen ---------- */

.items{margin-top:42px;display:flex;flex-direction:column}
.item{border-top:1px solid var(--rule);padding:20px 0}
.item:last-of-type{border-bottom:1px solid var(--rule)}
.item-head{display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.item-head .t{font-size:17.5px;font-weight:600;letter-spacing:-.004em}
.item-head .p{font-size:17.5px;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.item p{margin-top:7px;font-size:16.5px;line-height:1.55;color:var(--desc)}

.note{margin-top:13px;font-size:14px;line-height:1.6;color:var(--faint)}

/* ---------- Qualifikation ---------- */

h2{font-size:17.5px;margin-top:46px}
.quals{display:flex;flex-direction:column;gap:10px;margin-top:15px;
  font-size:16.5px;line-height:1.55;color:var(--qual)}

/* ---------- Anfrage ---------- */

.contact{margin-top:46px;border:1px solid var(--box);padding:26px 26px 24px}
.contact p{font-size:17px;line-height:1.55;color:var(--ink)}
.contact .tel{display:block;margin-top:18px;font-size:29px;font-weight:600;
  letter-spacing:-.012em;font-variant-numeric:tabular-nums}
.contact .mail{display:block;margin-top:3px;font-size:18.5px;font-weight:600}
.contact .where{margin-top:10px;font-size:15.5px;color:var(--sub)}

/* ---------- Fuss ---------- */

footer{margin-top:34px;display:flex;gap:20px;font-size:14px;color:var(--faint)}

/* ---------- Rechtstexte ---------- */

.legal .name{margin-bottom:30px}
.legal h2{font-size:16.5px;margin-top:30px;margin-bottom:8px}
.legal p,.legal li{font-size:16px;line-height:1.6;color:var(--desc)}
.legal ul{margin:0 0 12px;padding-left:20px}
.legal li{margin-bottom:5px}
.legal .addr{color:var(--ink);line-height:1.8;margin-bottom:12px}
.back{display:inline-block;margin-bottom:30px;font-size:14px;color:var(--faint)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
