Footer Vorlage korrigieren

This commit is contained in:
2026-03-22 18:19:25 +01:00
parent d9de4ab61f
commit 031c928813
2 changed files with 49 additions and 42 deletions

View File

@@ -485,58 +485,63 @@ button {
}
.footer {
padding-bottom: clamp(4.5rem, 9vw, 8rem);
position: relative;
min-height: 320px;
border-top: 18px solid var(--bg-lime);
}
.footer__inner {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
gap: clamp(2rem, 5vw, 5rem);
align-items: end;
min-height: clamp(320px, 31vw, 420px);
padding-top: clamp(3rem, 5vw, 4.5rem);
padding-bottom: clamp(2.5rem, 4vw, 4rem);
min-height: 302px;
padding: 0 clamp(2.5rem, 6vw, 5rem);
}
.footer__brand {
position: absolute;
top: 73px;
left: clamp(2.9rem, 5vw, 5rem);
width: clamp(240px, 22vw, 290px);
}
.footer__contact {
position: absolute;
left: clamp(2.9rem, 5vw, 5rem);
bottom: 18px;
display: flex;
flex-direction: column;
gap: 1.05rem;
justify-content: end;
align-self: end;
padding: 0;
gap: 0.2rem;
}
.footer__contact a {
width: fit-content;
color: inherit;
text-decoration: none;
font-size: clamp(1.1rem, 1.75vw, 2rem);
font-size: clamp(1.05rem, 1.72vw, 1.15rem);
font-weight: var(--font-weight-black);
line-height: 1.05;
text-transform: uppercase;
}
.footer__claim {
position: absolute;
top: 38px;
right: clamp(2.5rem, 5vw, 5rem);
display: flex;
flex-direction: column;
align-items: flex-start;
justify-self: end;
align-self: start;
width: min(100%, 36rem);
gap: 0.45rem;
padding: 0;
width: clamp(490px, 47vw, 610px);
gap: 0.3rem;
}
.section-title--claim {
font-size: clamp(3.35rem, 5.7vw, 5.85rem);
max-width: 7.7ch;
font-size: clamp(4rem, 5.85vw, 5.85rem);
max-width: none;
line-height: 0.92;
}
.footer__claim p {
margin: 0;
font-size: clamp(1rem, 1.2vw, 1.15rem);
font-weight: var(--font-weight-bold);
}
@@ -544,33 +549,24 @@ button {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 1.2rem;
gap: 1rem;
width: 100%;
margin-top: 1.15rem;
margin-top: 0.9rem;
}
.footer__claim span {
font-size: 1rem;
font-size: clamp(0.95rem, 1.1vw, 1.05rem);
font-weight: var(--font-weight-bold);
}
.footer__accent {
width: clamp(220px, 22vw, 300px);
width: clamp(255px, 22vw, 300px);
margin-left: auto;
}
.footer__accent img:last-child {
width: 78%;
margin: -0.95rem 0 0 auto;
}
.footer__wave {
position: absolute;
right: 0;
bottom: 0;
width: 100%;
height: auto;
pointer-events: none;
width: 82%;
margin: -0.85rem 0 0 auto;
}
.contact-flyover {
@@ -827,7 +823,7 @@ button {
}
.footer__claim {
justify-self: start;
position: static;
width: 100%;
}
@@ -836,14 +832,25 @@ button {
}
.footer__inner {
grid-template-columns: 1fr;
align-items: start;
display: flex;
flex-direction: column;
gap: 1.8rem;
min-height: auto;
padding-top: 2.6rem;
padding-bottom: 2rem;
}
.footer__brand,
.footer__contact {
gap: 0.8rem;
position: static;
}
.footer__brand {
width: min(260px, 72vw);
}
.footer__contact {
gap: 0.5rem;
}
.footer__claim-meta {