/* laua.ch — gemeinsame Basis (CI: Laua Brand Manual) */

/* Das hidden-Attribut wirkt nur über display:none im Browser-Standard — JEDE eigene
   display-Regel schlägt es. Ein <div class="bz-neucode" hidden> stand darum sichtbar da,
   weil .bz-neucode{display:flex} gewinnt (moreno 16.07.: sah aus wie ein fehlendes Feld).
   Betraf 12 Stellen quer durch die Module: leere Favoritenbox im Hub, Aktionszeilen der
   Verlaufs-Module, Diagramm-Container. Statt zwölf Einzelpflaster hier die Regel, die den
   Standard wiederherstellt — Muster wie normalize.css. Geprüft: keine [hidden]-Regel im
   Projekt setzt etwas anderes als none, das !important überstimmt also nichts Gewolltes. */
[hidden]{display:none !important}

:root{
  --creme:#F7ECE0;
  --creme-dunkel:#E9DCC9;
  --petrol:#002D40;
  --petrol-75:rgba(0,45,64,.75);
  --petrol-tint:#1A4A61;
  --weiss:#ffffff;
  --radius:14px;
  --font-head:'Sora',system-ui,sans-serif;
  --font-text:'Inter',system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--font-text);background:var(--creme);color:var(--petrol);line-height:1.65;font-size:16px}
.wrap{max-width:840px;margin:0 auto;padding:0 24px}

/* Header */
.site-header{position:sticky;top:0;background:var(--creme);border-bottom:1px solid var(--creme-dunkel);z-index:10}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}
.logo{display:flex;align-items:center;gap:10px;color:var(--petrol);text-decoration:none}
.logo svg{width:64px;height:auto;display:block}
.back{font-size:14px;font-weight:600;color:var(--petrol);text-decoration:none;border:1.5px solid var(--petrol);border-radius:999px;padding:8px 18px;transition:background .15s,color .15s}
.back:hover,.back:focus-visible{background:var(--petrol);color:var(--creme)}

/* Inhalt */
main{padding:56px 0 80px}
h1{font-family:var(--font-head);font-size:clamp(30px,4.5vw,42px);line-height:1.15;margin-bottom:8px}
.updated{font-size:13px;color:var(--petrol-75);margin-bottom:40px}
h2{font-family:var(--font-head);font-size:21px;margin:40px 0 12px}
h3{font-family:var(--font-head);font-size:17px;margin:24px 0 8px}
p{margin-bottom:14px}
ul{margin:0 0 14px 22px}
li{margin-bottom:6px}
a{color:var(--petrol);text-decoration:underline;text-underline-offset:2px}
a:hover{opacity:.75}

.card{background:var(--weiss);border:1px solid var(--creme-dunkel);border-radius:var(--radius);padding:28px 32px;margin:24px 0}
.card p{margin-bottom:6px}
.card p:last-child{margin-bottom:0}
.muted{color:var(--petrol-75);font-size:14px}

/* Footer */
.site-footer{background:var(--petrol);color:var(--creme);padding:40px 0}
.site-footer .wrap{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.site-footer a{color:var(--creme)}
.site-footer .logo{color:var(--creme)}
.site-footer .logo svg{width:52px}
.site-footer nav{display:flex;gap:20px;flex-wrap:wrap;font-size:14px}
.site-footer .adr{font-size:14px;line-height:1.5;opacity:.9}

@media (max-width:600px){
  main{padding:40px 0 60px}
  .card{padding:22px 20px}
}

/* Tools-Knopf im Header (Variante A «Stille Pille», 13.07.2026) — base.css laden nur Unterseiten
   mit hellem Header, darum Petrol als Standard; die Startseite (dunkler Header) stylt inline. */
.tools-knopf{display:inline-flex;align-items:center;gap:.45rem;border:1.5px solid rgba(0,45,64,.35);color:var(--petrol,#002D40);border-radius:999px;padding:.45rem 1rem;font-size:.9rem;font-weight:600;text-decoration:none;white-space:nowrap}
.tools-knopf:hover,.tools-knopf:focus-visible{border-color:var(--petrol,#002D40);opacity:1}
.tools-knopf svg{width:16px;height:16px;flex:none}
.site-header .wrap:not(.header-inner){justify-content:flex-start}
.site-header .wrap:not(.header-inner) .tools-knopf{margin-left:auto;margin-right:12px}
@media(max-width:760px){.tools-knopf span{display:none}.tools-knopf{padding:.5rem;border-radius:50%}}

/* COR⁺: deutlich sichtbares, rotes Plus (moreno 13.07.) */
.tools-knopf .cor-plus,.cor-name .cor-plus{color:#DA291C;font-weight:800;font-size:.8em;vertical-align:super;line-height:0;margin-left:1px;font-style:normal}