/* ============================================================
   ASV BERG – Stylesheet (Aussehen der ganzen Website)

   Diese eine Datei bestimmt Farben, Schrift und Abstaende ALLER
   Seiten. Aenderst du hier etwas, aendert es sich ueberall.

   SCHNELL ANPASSEN – nur die Werte hinter den Variablen unten:
     --green      Hauptfarbe (Buttons, Links, Akzente)
     --red        zweite Akzentfarbe (aus dem Wappen)
     --ink        Textfarbe (fast schwarz)
     --muted      graue Nebentexte
     --soft       heller Hintergrund fuer abgesetzte Bereiche
   Farbe = ein Hex-Code wie #2f9e44. Neue Farbe z. B. auf
   https://www.google.com/search?q=color+picker aussuchen.

   Weiter unten stehen die einzelnen Bausteine (Header, Karten,
   Footer ...), jeweils mit einem Kommentar beschriftet.
   ============================================================ */
:root{
  --green:#2f9e44;      /* Hauptfarbe */
  --green-dark:#1f7a33; /* Hauptfarbe, dunkler (Hover) */
  --red:#e03131;        /* Akzentfarbe aus dem Wappen */
  --ink:#14181d;        /* Textfarbe */
  --muted:#5b6670;      /* graue Nebentexte */
  --paper:#ffffff;      /* Seitenhintergrund */
  --soft:#f4f6f4;       /* heller Block-Hintergrund */
  --line:#e4e8e4;       /* Linien / Rahmen */
  --shadow:0 1px 3px rgba(20,24,29,.08),0 8px 24px rgba(20,24,29,.06);
  --radius:14px;        /* Rundung der Ecken */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--paper);line-height:1.6;-webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.btn{
  display:inline-block;background:var(--green);color:#fff;font-weight:600;
  padding:13px 24px;border-radius:10px;transition:background .18s;font-size:.98rem;
}
.btn:hover{background:var(--green-dark)}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn.ghost:hover{border-color:var(--green);color:var(--green-dark)}
.eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--green)}
h2.section{font-size:1.9rem;letter-spacing:-.02em;margin:.35rem 0 1.4rem}

/* Header */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;height:74px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:46px;height:46px;display:block;border-radius:6px}
.brand .name{font-weight:800;letter-spacing:-.01em;line-height:1.1}
.brand .name small{display:block;font-weight:500;color:var(--muted);font-size:.72rem;letter-spacing:.02em}
nav.main{display:flex;gap:6px;align-items:center}
nav.main a{padding:9px 14px;border-radius:8px;font-weight:500;color:var(--muted);font-size:.95rem}
nav.main a:hover{background:var(--soft);color:var(--ink)}
nav.main a.active{color:var(--green-dark)}
nav.main a.cta{background:var(--green);color:#fff;margin-left:8px}
nav.main a.cta:hover{background:var(--green-dark)}
nav.main a.cta.active{color:#fff}
.navtoggle{display:none}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px}
.burger span{display:block;width:24px;height:2px;background:var(--ink);border-radius:2px}

/* Hero (home) */
.hero{position:relative;overflow:hidden;background:
  radial-gradient(1200px 500px at 78% -10%,rgba(47,158,68,.12),transparent 60%),
  radial-gradient(900px 480px at 8% 120%,rgba(224,49,49,.10),transparent 55%),var(--soft)}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;
  padding-top:72px;padding-bottom:72px}
.hero h1{font-size:3.1rem;line-height:1.05;letter-spacing:-.03em;margin:.5rem 0 1rem}
.hero p.lead{font-size:1.15rem;color:var(--muted);max-width:34ch}
.hero .actions{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.crest{justify-self:center;width:min(360px,82%);filter:drop-shadow(0 18px 40px rgba(20,24,29,.18))}
.crest img{width:100%;height:auto;display:block;border-radius:14px}

/* Page banner (inner pages) */
.pagehead{background:
  radial-gradient(900px 360px at 90% -30%,rgba(47,158,68,.12),transparent 60%),var(--soft);
  border-bottom:1px solid var(--line)}
.pagehead .wrap{padding-top:56px;padding-bottom:56px}
.pagehead h1{font-size:2.6rem;letter-spacing:-.03em;line-height:1.08;margin:.4rem 0 .8rem}
.pagehead p{color:var(--muted);font-size:1.1rem;max-width:60ch}

/* Facts */
.facts{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;padding:0}
.fact{padding:26px 24px;text-align:center}
.fact b{display:block;font-size:1.7rem;letter-spacing:-.02em;color:var(--green-dark)}
.fact span{color:var(--muted);font-size:.92rem}

section{padding:70px 0}
section.tight{padding:44px 0}
section.alt{background:var(--soft)}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:12px;margin-bottom:8px}
.sec-head a.more{color:var(--green-dark);font-weight:600;font-size:.95rem}

/* Prose */
.prose{max-width:70ch}
.prose p{color:var(--muted);margin-bottom:16px}
.prose h3{font-size:1.25rem;letter-spacing:-.01em;margin:26px 0 10px}
.prose ul{color:var(--muted);margin:0 0 16px 20px}
.prose li{margin-bottom:6px}
.prose a{color:var(--green-dark);font-weight:600}

/* Cards grid */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cards.two-col{grid-template-columns:repeat(2,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card .top{height:6px;background:linear-gradient(90deg,var(--green),var(--red))}
.card .body{padding:22px}
.card .date{font-size:.8rem;color:var(--muted);font-weight:600}
.card h3{font-size:1.15rem;margin:.35rem 0 .5rem;letter-spacing:-.01em}
.card p{color:var(--muted);font-size:.96rem}
.card p+p{margin-top:10px}
.badge{display:inline-block;background:#eaf6ee;color:var(--green-dark);font-size:.72rem;
  font-weight:700;padding:3px 9px;border-radius:20px;margin-top:12px}

/* Split (dark) */
.split{background:var(--ink);color:#fff;border-radius:22px;overflow:hidden;
  display:grid;grid-template-columns:1.2fr .8fr}
.split .txt{padding:52px 48px}
.split h2{font-size:2rem;letter-spacing:-.02em;margin-bottom:12px}
.split p{color:#c3ccd2;max-width:46ch}
.split .card2{background:#1c222a;padding:52px 40px;display:flex;flex-direction:column;justify-content:center}
.split .card2 .k{color:#8b97a2;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}
.split .card2 .v{font-size:1.05rem;margin:2px 0 18px;font-weight:600}
.split .card2 .v:last-child{margin-bottom:0}
.split .card2 .v a{color:#7ee29a}

/* Two column */
.two{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.two.top{align-items:start}

/* Info table (Eckdaten) */
.info{border-top:1px solid var(--line)}
.info .row{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.info .row dt{font-weight:600}
.info .row dd{color:var(--muted)}
.info .row dd a{color:var(--green-dark);font-weight:600}

/* Members */
.board{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.board.wide{grid-template-columns:repeat(3,1fr)}
.member{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px}
.member .role{font-size:.78rem;color:var(--green-dark);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.member .who{font-weight:600;margin-top:2px}
.member .meta{color:var(--muted);font-size:.88rem;margin-top:4px}
.member .meta a{color:var(--green-dark)}

/* Timeline */
.timeline{border-left:2px solid var(--line);margin-left:8px;padding-left:26px}
.timeline .ev{position:relative;padding-bottom:26px}
.timeline .ev:last-child{padding-bottom:0}
.timeline .ev::before{content:"";position:absolute;left:-33px;top:4px;width:12px;height:12px;
  border-radius:50%;background:var(--green);border:3px solid #fff;box-shadow:0 0 0 1px var(--line)}
.timeline .ev .yr{font-weight:700;color:var(--green-dark)}
.timeline .ev p{color:var(--muted);margin-top:2px}

/* Link / document list */
.doclist{display:grid;gap:10px}
.doclist a{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);
  border-radius:10px;padding:14px 16px;transition:border-color .18s,transform .18s}
.doclist a:hover{border-color:var(--green);transform:translateX(2px)}
.doclist a .ic{width:34px;height:34px;flex:none;border-radius:8px;background:#eaf6ee;color:var(--green-dark);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.72rem}
.doclist a .t{font-weight:600}
.doclist a .t small{display:block;font-weight:500;color:var(--muted);font-size:.85rem}
.doclist a .arw{margin-left:auto;color:var(--muted)}

/* Figures & showcase images */
.figure{margin:0 auto;max-width:800px}
.figure img{width:100%;display:block;border-radius:18px;border:1px solid var(--line)}
.figure figcaption{color:var(--muted);font-size:.86rem;margin-top:10px;text-align:center}
.showcase{display:grid;grid-template-columns:1.05fr .95fr;gap:0;background:var(--soft);
  border-radius:22px;overflow:hidden;align-items:stretch}
.showcase>img{width:100%;height:100%;min-height:280px;object-fit:cover;display:block}
.showcase .sc-body{padding:44px}
.showcase .sc-body h2{font-size:1.7rem;letter-spacing:-.02em}
.showcase .sc-body p{color:var(--muted);margin-top:8px;max-width:46ch}
.showcase .sc-body .actions{margin-top:22px}

/* Rent teaser */
.rent{background:var(--soft);border-radius:22px;padding:48px;display:grid;
  grid-template-columns:1fr auto;gap:28px;align-items:center}
.rent.solid{background:#fff;border:1px solid var(--line)}
.rent h2{font-size:1.7rem;letter-spacing:-.02em}
.rent p{color:var(--muted);max-width:52ch;margin-top:8px}

/* Sponsors */
.sponsors{text-align:center}
.sponsors .logos{display:flex;justify-content:center;align-items:center;gap:48px;flex-wrap:wrap;margin-top:28px}
.sponsors .logos img{height:50px;width:auto;display:block;transition:transform .18s}
.sponsors .logos img.sq{height:62px}
.sponsors .logos a:hover img{transform:translateY(-2px)}

/* Footer */
footer{background:var(--ink);color:#aeb8c0;padding:56px 0 30px;margin-top:20px}
footer .grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
footer h4{color:#fff;font-size:.95rem;margin-bottom:12px}
footer a{display:block;color:#aeb8c0;padding:3px 0;font-size:.93rem}
footer a:hover{color:#fff}
footer .brand2{display:flex;gap:12px;align-items:center;margin-bottom:12px}
footer .brand2 img{width:42px;height:42px;border-radius:5px}
footer .brand2 b{color:#fff}
.foot-bottom{border-top:1px solid #2a323b;margin-top:36px;padding-top:20px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.85rem}

@media(max-width:860px){
  .burger{display:flex}
  nav.main{position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:stretch;
    gap:0;background:#fff;border-bottom:1px solid var(--line);padding:8px 16px 16px;
    box-shadow:var(--shadow);display:none}
  .navtoggle:checked ~ nav.main{display:flex}
  nav.main a{padding:12px 10px;border-radius:8px}
  nav.main a.cta{margin:8px 0 0;text-align:center}
  .hero .wrap{grid-template-columns:1fr;text-align:center;padding-top:48px;padding-bottom:48px}
  .hero p.lead{margin:0 auto}.hero .actions{justify-content:center}
  .crest{order:-1;width:200px}
  .hero h1{font-size:2.3rem}
  .pagehead h1{font-size:2rem}
  .facts .wrap{grid-template-columns:1fr 1fr}
  .cards,.cards.two-col{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .split .txt,.split .card2{padding:36px 28px}
  .two{grid-template-columns:1fr;gap:32px}
  .board,.board.wide{grid-template-columns:1fr}
  .rent{grid-template-columns:1fr;padding:32px}
  .showcase{grid-template-columns:1fr}
  .showcase>img{min-height:220px}
  .showcase .sc-body{padding:32px}
  .info .row{grid-template-columns:1fr;gap:4px}
  footer .grid{grid-template-columns:1fr 1fr}
}