/* E · AWiT DNS-Landingpage · Stil „Konsole“ (D/3 Site Template 0.1.2 – lokale Abweichung, siehe TEMPLATE-OVERRIDES.md)
 * Generiert aus templates/style.css durch scripts/build.py – nicht direkt bearbeiten.
 * Themes: html[data-theme] wird von site.js gesetzt (auto → dark|light). Ohne JS gilt prefers-color-scheme. */
:root,html[data-theme="dark"]{color-scheme:dark;--bg:#0f1110;--footer:#141615;--surface:#161918;--surface-2:#0b0d0c;--text:#e4e6df;--muted:#9da29a;--hover:#e4e6df;--line:#2c312e;--soft:#3a3f3b;--grid:#2c312e;--term-bg:#070908;--term-bar:#121513;--term-line:#232825;--dns-a:#ec6a55;--dns-b:#6aa0f2;--dns-c:#3cc6ad;--dns-d:#b393ec;--dns-e:#e5a83b}
html[data-theme="light"]{color-scheme:light;--bg:#eef0ec;--footer:#e6e9e4;--surface:#fbfcfa;--surface-2:#f2f4f0;--text:#1d211f;--muted:#565c57;--hover:#1d211f;--line:#d3d8d2;--soft:#bfc5be;--grid:#d3d8d2;--dns-a:#b8402b;--dns-b:#2b62b8;--dns-c:#127d6b;--dns-d:#6d4bb3;--dns-e:#8f6200}
@media(prefers-color-scheme:light){html:not([data-theme]){color-scheme:light;--bg:#eef0ec;--footer:#e6e9e4;--surface:#fbfcfa;--surface-2:#f2f4f0;--text:#1d211f;--muted:#565c57;--hover:#1d211f;--line:#d3d8d2;--soft:#bfc5be;--grid:#d3d8d2;--dns-a:#b8402b;--dns-b:#2b62b8;--dns-c:#127d6b;--dns-d:#6d4bb3;--dns-e:#8f6200}}
html[data-theme="contrast"]{color-scheme:dark;--bg:#000;--footer:#000;--surface:#000;--surface-2:#000;--text:#fff;--muted:#fff;--hover:#fff;--line:#fff;--soft:#fff;--grid:transparent;--term-bg:#000;--term-bar:#000;--term-line:#fff;--dns-a:#ff8a73;--dns-b:#8ec0ff;--dns-c:#3ff5d2;--dns-d:#d8b8ff;--dns-e:#ffd166}
html[data-font="large"]{font-size:112.5%}html[data-font="xlarge"]{font-size:125%}
/* Seitenakzent = Serverfarbe; --srv-term = Variante für das (immer dunkle) Terminal */
:root{--srv:var(--dns-e);--srv-term:#e5a83b}
html[data-theme="contrast"]{--srv-term:var(--dns-e)}
.srv-a{color:var(--dns-a)}.srv-b{color:var(--dns-b)}.srv-c{color:var(--dns-c)}.srv-d{color:var(--dns-d)}.srv-e{color:var(--dns-e)}
[hidden]{display:none!important}
*{box-sizing:border-box}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;top:-10rem;left:1rem;z-index:100;background:var(--surface);color:var(--text);padding:.7rem}.skip:focus{top:1rem}
:focus-visible{outline:2px solid var(--srv);outline-offset:4px}
code,pre,kbd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace}
.tbd{font-style:normal;opacity:.65}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

body{margin:0;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg);color:var(--text);font:1rem/1.6 system-ui,'Segoe UI',Arial,sans-serif;
 background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:48px 48px;background-attachment:fixed}
body>main{flex:1}
.container{width:min(1160px,calc(100% - 3rem));margin-inline:auto}
a{color:var(--srv);text-underline-offset:.25em}a:hover{color:var(--text)}
h2{font-size:1.15rem;margin:0 0 .7rem;font-weight:650;letter-spacing:-.01em}p{margin:0 0 .9rem}p:last-child{margin-bottom:0}

/* Kopfleiste (statisch, ohne Anker-Links) */
.bar{background:color-mix(in srgb,var(--bg) 88%,transparent);border-bottom:1px solid var(--soft)}
.bar-inner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:60px;font:500 .85rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace}
.brand{display:flex;align-items:center;gap:.7rem;color:var(--text);text-decoration:none;font-weight:700;font-size:.95rem}
.brand-logo{display:block;width:44px;height:44px;object-fit:contain}.dim{color:var(--muted);font-weight:400}
.ports{list-style:none;display:flex;gap:.5rem;margin:0;padding:0}
.ports li{border:1px solid var(--soft);border-radius:4px;padding:.15rem .5rem;color:var(--muted)}.ports b{color:var(--srv)}

/* Hero */
.hero{display:grid;grid-template-columns:1.35fr 1fr;gap:3rem;align-items:end;padding:5rem 0 3rem}
.eyebrow{font:600 .8rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;color:var(--srv);letter-spacing:.06em;margin-bottom:1.2rem}
h1{margin:0;display:flex;align-items:stretch;font-size:clamp(4rem,11vw,8.5rem);line-height:.9;letter-spacing:-.06em;font-weight:800}
h1 .block{background:var(--srv);color:var(--bg);padding:0 .12em;margin-left:.06em;border-radius:6px;letter-spacing:0}
.lead{margin-top:1.8rem;max-width:58ch;color:var(--muted);font-size:1.08rem}.lead strong{color:var(--text)}
.hero-panel{margin:0;border:1px solid var(--soft);border-top:3px solid var(--srv);border-radius:6px;background:var(--surface);font:.88rem/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace}
.hero-panel div{display:grid;grid-template-columns:8.5rem 1fr;gap:1rem;padding:.75rem 1.1rem;border-bottom:1px solid var(--line)}.hero-panel div:last-child{border-bottom:0}
.hero-panel dt{color:var(--muted)}.hero-panel dt::after{content:":"}.hero-panel dd{margin:0}.hero-panel .hl{color:var(--srv);font-weight:700}

/* Raster */
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem;padding-bottom:4rem}
.span-12{grid-column:span 12}.span-7{grid-column:span 7}.span-6{grid-column:span 6}.span-5{grid-column:span 5}
.card{background:var(--surface);border:1px solid var(--soft);border-radius:6px;padding:1.4rem 1.5rem;position:relative}
.card::before{content:"";position:absolute;left:-1px;top:-1px;width:42px;height:3px;background:var(--srv);border-radius:6px 0 0 0}
.card p{color:var(--muted)}
.label{font:600 .76rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)!important;margin-bottom:.6rem!important}
.label b{color:var(--srv);margin-right:.5rem}
.warn{border-color:color-mix(in srgb,var(--srv) 55%,var(--soft));background:color-mix(in srgb,var(--srv) 7%,var(--surface))}

.list{list-style:none;margin:.6rem 0 0;padding:0;border:1px solid var(--line);border-radius:4px}
.list li{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center;padding:.75rem .9rem;border-bottom:1px solid var(--line);background:var(--surface-2)}.list li:last-child{border-bottom:0}
.list strong{display:block;font-size:.92rem}.list span{font-size:.82rem;color:var(--muted)}
.list code{font-size:.82rem;color:var(--srv);white-space:nowrap}

/* Resolver-Übersicht – jede Zeile ist ein Link */
.res-head,.res{display:grid;grid-template-columns:9.5rem minmax(0,1.5fr) minmax(0,1.2fr) 9rem 1.5rem;gap:1rem;align-items:start}
.res-head{padding:.4rem 1rem .6rem;margin-top:.5rem;font:600 .72rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);border-bottom:1px solid var(--line)}
.res-list{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.5rem}
.res{padding:.9rem 1rem;color:var(--muted);text-decoration:none;font-size:.9rem;background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--row);border-radius:4px;
 transition:transform .18s ease,border-color .18s ease,background-color .18s ease,box-shadow .18s ease}
.res:hover,.res:focus-visible{color:var(--text);transform:translateX(4px);border-color:var(--row);background:color-mix(in srgb,var(--row) 12%,var(--surface-2));box-shadow:0 0 0 1px var(--row),0 10px 28px -14px var(--row)}
.res:focus-visible{outline:2px solid var(--row);outline-offset:3px}
.res.is-self{background:color-mix(in srgb,var(--row) 7%,var(--surface-2))}
.res-name{display:flex;align-items:center;font-weight:750;letter-spacing:.04em;color:var(--text);white-space:nowrap}
.res .tag{display:inline-grid;place-items:center;width:1.5rem;height:1.5rem;margin-right:.6rem;border-radius:4px;background:var(--row);color:var(--bg);font:700 .8rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace}
.res small{display:block;font-size:.8rem;color:var(--muted)}
.res-time strong{color:var(--text);font-weight:600}.res.is-self .res-time strong{color:var(--srv)}
.res-go{color:var(--row);font-weight:700;opacity:.35;transition:opacity .18s ease,transform .18s ease}
.res:hover .res-go,.res:focus-visible .res-go{opacity:1;transform:translateX(3px)}

.specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.5rem;margin:.4rem 0 0;font-size:.92rem}
.specs div{padding:.6rem 0;border-bottom:1px dashed var(--soft)}
.specs dt{font:.74rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;color:var(--srv)}.specs dd{margin:0}
.ips{margin:1rem 0 0;font:.88rem/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;background:var(--surface-2);border:1px solid var(--line);border-radius:4px;padding:.8rem 1rem}
.ips div{display:grid;grid-template-columns:3.5rem 1fr;gap:.8rem}.ips dt{color:var(--srv)}.ips dd{margin:0;overflow-wrap:anywhere}

.terminal{margin-top:.6rem;border-radius:4px;overflow:hidden;background:var(--term-bg,#070908);border:1px solid var(--term-line,#232825)}
.terminal-bar{display:flex;justify-content:space-between;padding:.5rem 1rem;background:var(--term-bar,#121513);color:#9da29a;font:.75rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;border-bottom:1px solid var(--term-line,#232825)}
pre{margin:0;padding:1.1rem 1.2rem;overflow-x:auto;color:#e4e6df;font-size:.86rem;line-height:1.75}
.prompt{color:var(--srv-term)}.comment{color:#7b827c}

/* Footer – unterer Teil aus D/3 v4-Basis */
.footer{background:var(--footer);border-top:1px dotted var(--soft)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.2rem 0 1.5rem;color:var(--muted);font-size:.875rem}
.credit{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;margin:0}
.credit strong{font-weight:650}.credit abbr{text-decoration:none;cursor:help}
.copyleft{width:16px;height:16px;flex-shrink:0}
.awit-link{display:inline-flex;align-items:center;text-decoration:none;color:inherit}.awit-link:hover{color:var(--hover)}
.awit-logo{display:block;width:67px;height:auto}
.external-links{display:flex;gap:1.1rem;flex-shrink:0;flex-wrap:wrap}
.external-links a{display:inline-flex;align-items:center;gap:.4rem;color:var(--muted)}.external-links a:hover{color:var(--hover)}
.platform-icon,.line-icon{width:18px;height:18px;flex-shrink:0}
.line-icon{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:980px){.footer-bottom{flex-direction:column;align-items:flex-start}}

.footer a:hover,.awit-link:hover{color:var(--srv)}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:2rem;padding-top:3rem}.span-7,.span-6,.span-5{grid-column:span 12}
 .res-head{display:none}.res{grid-template-columns:minmax(0,1fr) auto;gap:.35rem 1rem}.res-name{grid-column:1}.res-go{grid-column:2;grid-row:1}.res-profile,.res-loc,.res-time{grid-column:1/-1}}
@media(max-width:600px){.specs{grid-template-columns:1fr}.list li{grid-template-columns:1fr}.list code{white-space:normal;overflow-wrap:anywhere}.hero-panel div{grid-template-columns:7rem 1fr}.container{width:calc(100% - 2rem)}.card{padding:1.2rem}.ports li:not(:first-child){display:none}}
@media(max-width:420px){.ports{display:none}}

/* D/3-Footer-Logo (aus Vorlage) */
.department-name{cursor:help;text-decoration:none;border-bottom:0}
.d3-footer-logo{display:inline-flex;color:inherit;flex-shrink:0}.d3-footer-logo svg{width:30px;height:30px;display:block}.d3-footer-logo:hover{color:var(--srv)}
.footer-bottom{flex-wrap:wrap}.credit{min-width:0;overflow-wrap:anywhere}

/* Darstellung & Barrierefreiheit (aus D/3 Site Template, an Konsole-Stil angepasst) */
.display-toggle,.display-panel button,.display-panel select{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--soft);border-radius:6px}
.display-toggle,.display-panel button{min-height:44px;padding:.5rem .8rem;cursor:pointer;transition:border-color .2s ease}
.display-toggle:hover,.display-panel button:hover{border-color:var(--srv)}
.display-toggle{position:fixed;right:1rem;bottom:1rem;width:48px;height:48px;display:grid;place-items:center;padding:0;z-index:20;box-shadow:0 6px 20px -8px rgba(0,0,0,.5)}
.display-toggle[aria-expanded="true"]{border-color:var(--srv);color:var(--srv)}
.display-panel{position:fixed;right:1rem;bottom:4.75rem;width:min(340px,calc(100% - 2rem));max-height:calc(100dvh - 6rem);overflow:auto;padding:1.25rem;border:1px solid var(--soft);border-top:3px solid var(--srv);border-radius:6px;background:var(--surface);z-index:21;box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.panel-heading{display:flex;gap:1rem;align-items:flex-start}.panel-heading h2{flex:1;font-size:1.05rem;line-height:1.35;margin:0}.panel-heading button{min-width:44px}
.display-panel>label{display:block;margin:.9rem 0 .35rem;font:600 .76rem ui-monospace,SFMono-Regular,Menlo,Consolas,"DejaVu Sans Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.display-panel>label.check{display:flex;align-items:center;gap:.5rem;font:inherit;text-transform:none;letter-spacing:0;color:var(--text);margin-top:1rem}
.display-panel select{width:100%;min-height:44px;padding:.5rem}
.check input{width:20px;height:20px;accent-color:var(--srv)}#reset{width:100%;margin-top:1rem}
html[data-motion="reduce"] *,html[data-motion="reduce"] *::before,html[data-motion="reduce"] *::after{transition:none!important;animation:none!important}
html[data-motion="reduce"] .res:hover,html[data-motion="reduce"] .res:focus-visible{transform:none}
html[data-theme="contrast"] .res:hover,html[data-theme="contrast"] .res:focus-visible{box-shadow:0 0 0 2px var(--row)}
html[data-theme="contrast"] .card::before{height:4px}
@media(max-width:560px){.footer-bottom{padding-bottom:5rem}}