diff --git a/index.html b/index.html
index 5122490..ced62e0 100644
--- a/index.html
+++ b/index.html
@@ -202,8 +202,9 @@
diff --git a/styles.css b/styles.css
index 93c7d39..14aa9d6 100644
--- a/styles.css
+++ b/styles.css
@@ -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 {