diff --git a/public/index.html b/public/index.html
index 8590fb6..d75b42e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -481,47 +481,72 @@
/* IG FEED */
.ig-feed {
margin-top: 3rem;
- text-align: center;
}
- .ig-feed-header {
+ .ig-strip {
+ display: flex;
+ gap: 4px;
+ overflow: hidden;
+ }
+
+ .ig-strip a {
+ flex: 1;
+ position: relative;
+ display: block;
+ aspect-ratio: 1;
+ overflow: hidden;
+ }
+
+ .ig-strip a img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ transition: transform 0.4s ease, filter 0.4s ease;
+ filter: brightness(0.85) saturate(0.9);
+ }
+
+ .ig-strip a:hover img {
+ transform: scale(1.08);
+ filter: brightness(1) saturate(1);
+ }
+
+ .ig-strip a::after {
+ content: '';
+ position: absolute;
+ inset: 0;
+ background: rgba(10, 10, 15, 0.2);
+ transition: background 0.3s;
+ }
+
+ .ig-strip a:hover::after {
+ background: transparent;
+ }
+
+ .ig-strip-cta {
display: flex;
align-items: center;
justify-content: center;
gap: 0.8rem;
- margin-bottom: 1.5rem;
+ margin-top: 1.5rem;
}
- .ig-feed-header svg {
- width: 24px;
- height: 24px;
+ .ig-strip-cta svg {
+ width: 20px;
+ height: 20px;
fill: var(--gold-light);
}
- .ig-feed-header a {
+ .ig-strip-cta a {
color: var(--gold-light);
text-decoration: none;
- font-size: 0.85rem;
- letter-spacing: 0.1em;
+ font-size: 0.8rem;
+ letter-spacing: 0.12em;
+ text-transform: uppercase;
+ transition: color 0.3s;
}
- .ig-feed-header a:hover {
- text-decoration: underline;
- }
-
- .ig-embed-wrap {
- max-width: 540px;
- margin: 0 auto;
- border: 1px solid rgba(198, 139, 63, 0.15);
- border-radius: 4px;
- overflow: hidden;
- background: rgba(0, 0, 0, 0.3);
- }
-
- .ig-embed-wrap iframe {
- width: 100%;
- min-height: 600px;
- border: none;
+ .ig-strip-cta a:hover {
+ color: var(--sand);
}
/* CONTACT */
@@ -740,6 +765,10 @@
grid-template-columns: 1fr;
gap: 2rem;
}
+
+ .ig-strip a {
+ aspect-ratio: 1;
+ }
}
@media (max-width: 400px) {
@@ -944,12 +973,26 @@
Check Out the Collective
-
+ 
+ 
+ 
+ 
+