/* Varianten C und D: gemeinsamer Footer in Anthrazit mit farbigem Instagram-Logo */
.dfoot { background: #2a2e2f; color: #e6ebea; margin-top: clamp(56px, 8vw, 110px); padding-top: clamp(48px, 6vw, 84px); }
.dfoot-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(3, minmax(0, 1fr)); gap: 36px 28px; align-items: start; }
.df-brand { display: grid; gap: 16px; justify-items: start; text-decoration: none; }
.df-brand .logo-mark { width: 88px; }
.df-brand .logo-type { height: 15px; filter: brightness(0) invert(1); opacity: .92; }
.df-h { display: block; font: 500 11px/1 var(--mono); letter-spacing: .18em; text-transform: uppercase; color: #74c9d0; margin-bottom: 16px; }
.df-col p { margin: 0; line-height: 1.85; font-size: 15.5px; color: #cfd7d6; max-width: none; }
.df-col a { color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .25); transition: border-color .2s, color .2s; }
.df-col a:hover { color: #9fe0e5; border-color: #9fe0e5; }
.df-col a.df-ig { display: inline-flex; align-items: center; gap: 14px; border: 0; }
.ig-logo { width: 46px; height: 46px; flex: none; transition: transform .3s cubic-bezier(.3, 1.6, .5, 1); }
.df-ig:hover .ig-logo { transform: scale(1.08) rotate(-4deg); }
.df-small { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; margin-top: clamp(40px, 5vw, 64px); border-top: 1px solid rgba(255, 255, 255, .12); padding-block: 20px calc(24px + env(safe-area-inset-bottom, 0px)); font-size: 13px; color: #98a5a4; }
.df-links { display: flex; flex-wrap: wrap; gap: 20px; }
.df-links a { color: #c8d1d0; text-decoration: none; }
.df-links a:hover { color: #fff; }
@media (max-width: 860px) { .dfoot-grid { grid-template-columns: 1fr 1fr; } .df-brand { grid-column: 1 / -1; } }
@media (max-width: 480px) { .dfoot-grid { grid-template-columns: 1fr; } }
/* Startbild nicht mehr unter den Leitsatz schieben */
.hero-media { margin-top: clamp(20px, 2.4vw, 32px); }