* { box-sizing: border-box; }
:root {
  --bg: #f6f7f2;
  --paper: #ffffff;
  --ink: #1f261f;
  --muted: #6c7569;
  --line: #d7ddd2;
  --accent: #667c50;
  --accent2: #8fa36c;
  --dark: #293126;
  --max: 1380px;
}
html { scroll-behavior:smooth; }
body {
  margin:0; color:var(--ink); background:var(--bg);
  font-family:Arial,Helvetica,sans-serif; line-height:1.6;
}
a { color:inherit; text-decoration:none; }
h1,h2,h3,.brand-main {
  font-family:Georgia,"Times New Roman",serif; font-weight:400; line-height:1.03;
}
h1 { margin:0 0 1.4rem; font-size:clamp(3rem,7vw,7rem); letter-spacing:-.045em; }
h2 { margin:0 0 1.4rem; font-size:clamp(2.2rem,4.4vw,4.6rem); letter-spacing:-.035em; }
h3 { margin:0 0 .7rem; font-size:clamp(1.7rem,2.3vw,2.6rem); }
p { margin-top:0; }
.site-header {
  min-height:92px; padding:1.1rem clamp(1.25rem,4vw,4rem);
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
  background:rgba(255,255,255,.97); border-bottom:1px solid rgba(0,0,0,.06);
  position:sticky; top:0; z-index:20;
}
.brand { display:flex; flex-direction:column; }
.brand-main { font-size:clamp(1.7rem,2.7vw,3rem); letter-spacing:.02em; }
.brand-sub { margin-top:.38rem; font-size:.57rem; font-weight:700; letter-spacing:.18em; }
.main-nav { display:flex; gap:1.6rem; flex-wrap:wrap; font-size:.9rem; }
.main-nav a { padding:.3rem 0; border-bottom:1px solid transparent; }
.main-nav a:hover { border-bottom-color:var(--ink); }
.hero {
  min-height:min(78vh,820px); position:relative; display:flex; align-items:center;
  padding:clamp(5rem,9vw,9rem) clamp(1.25rem,8vw,8rem); color:white;
  background:
    linear-gradient(90deg, rgba(18,27,17,.72) 0%, rgba(18,27,17,.38) 42%, rgba(18,27,17,.08) 78%),
    url("stehaufundlauf-header.png") center/cover no-repeat,
    #55624a;
}
.hero-content { position:relative; z-index:2; width:min(900px,100%); }
.hero-text { max-width:760px; font-size:clamp(1.05rem,1.5vw,1.28rem); margin-bottom:2rem; }
.eyebrow {
  margin-bottom:1rem; color:var(--accent); font-size:.72rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
}
.eyebrow.light { color:rgba(255,255,255,.8); }
.button {
  display:inline-block; padding:.95rem 1.25rem; border:1px solid currentColor;
  font-size:.76rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
}
.button-light { background:rgba(255,255,255,.94); color:var(--ink); border-color:rgba(255,255,255,.94); }
.button-dark { background:var(--dark); color:white; border-color:var(--dark); }
.section { max-width:var(--max); margin:0 auto; padding:clamp(4.5rem,8vw,8rem) clamp(1.25rem,4vw,4rem); }
.section-soft { max-width:none; background:#e8eee2; }
.narrow { width:min(900px,100%); margin:0 auto; text-align:center; }
.narrow p { font-size:clamp(1rem,1.5vw,1.16rem); }
.section-heading { width:min(900px,100%); margin:0 auto 3rem; text-align:center; }
.card-grid { max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.card { background:var(--paper); border:1px solid var(--line); padding:2rem; min-height:250px; }
.card-number { color:var(--accent); font-size:.7rem; font-weight:700; letter-spacing:.14em; }
.statement { background:var(--dark); color:white; }
.statement-inner { width:min(950px,calc(100% - 2.5rem)); margin:0 auto; padding:clamp(5rem,9vw,8rem) 0; text-align:center; }
.statement p:not(.eyebrow) { max-width:780px; margin-left:auto; margin-right:auto; color:rgba(255,255,255,.78); }
.uelze-link { padding:clamp(4.5rem,8vw,7rem) 1.25rem; text-align:center; background:var(--paper); }
.uelze-link > div { width:min(850px,100%); margin:0 auto; }
.site-footer {
  padding:2.5rem clamp(1.25rem,4vw,4rem); background:#dfe6da;
  display:grid; grid-template-columns:1.2fr 1fr .6fr; gap:2rem; font-size:.86rem;
  border-top:1px solid var(--line);
}
.footer-links { display:flex; gap:1rem; flex-wrap:wrap; }
@media (max-width:850px) {
  .card-grid, .site-footer { grid-template-columns:1fr; }
  .site-header { position:static; align-items:flex-start; }
}
@media (max-width:560px) {
  .site-header { flex-direction:column; }
  .main-nav { gap:.8rem 1rem; }
  .hero { min-height:620px; background-position:62% center; }
}