.instagram-section { max-width: 1200px; margin: 0 auto; padding: 5rem 6%; }.instagram-heading { display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem; margin-bottom: 2rem; }.instagram-heading h2 { max-width: 600px; margin: 0; font-family: 'Baloo 2', Poppins, sans-serif; font-size: clamp(2.3rem, 5vw, 3.5rem); line-height: .98; letter-spacing: -.04em; }.instagram-heading h2 em { color: var(--purple); font-style: normal; }.instagram-heading p:not(.eyebrow) { max-width: 560px; color: var(--muted); font-size: .86rem; line-height: 1.75; }.instagram-follow { display: inline-flex; align-items: center; gap: .55rem; padding: .75rem 1rem; border-radius: 99px; background: var(--ink); color: #fff; font-size: .75rem; font-weight: 700; transition: transform .2s ease, background .2s ease; }.instagram-follow:hover { transform: translateY(-3px); background: var(--purple); }.instagram-follow i { font-size: 1rem; }.instagram-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }.instagram-post { position: relative; display: block; aspect-ratio: 1; overflow: hidden; border-radius: 15px; background: #eeeaff; }.instagram-post img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }.post-dog img { object-position: 38% center; }.post-care img { object-position: 35% center; }.post-cat img { object-position: 86% center; }.post-team img { object-position: 65% center; }.instagram-post span { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 1.45rem; background: rgba(80, 71, 230, .55); opacity: 0; transition: opacity .25s ease; }.instagram-post:hover img { transform: scale(1.08); }.instagram-post:hover span,.instagram-post:focus-visible span { opacity: 1; }.instagram-post:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }@media (min-width: 700px) { .instagram-section { padding: 6rem 3%; }.instagram-heading { flex-direction: row; align-items: center; justify-content: space-between; }.instagram-follow { flex-shrink: 0; }.instagram-grid { grid-template-columns: repeat(4, 1fr); gap: 1rem; } }
