.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:70px 28px} .blog-image{height:440px;display:block;background-size:cover;background-position:center} .blog-card>p{font-size:12px;color:#81878c} .blog-card h2{font-size:39px} .article-shell{padding:70px 0 110px} .article-meta{color:#838a90;font-size:12px;margin-bottom:24px} .article-feature{height:620px;background-size:cover;background-position:center} .article-prose{max-width:820px;margin:60px auto 0} .article-prose blockquote{font-family:'Playfair Display',serif;font-size:30px;color:#243846;border-left:3px solid var(--gold);padding-left:26px;margin:45px 0} @media(max-width:1080px){.blog-image{height:360px}} @media(max-width:720px){.blog-card h2{font-size:31px}.article-feature{height:350px}} .article-prose img{height: auto;} @media (max-width: 720px){.blog-image, .article-feature{height: 330px;}} .blog-card{min-width: 0;} .blog-image{position: relative;overflow: hidden;background-color: #18384b;background-size: cover;transition: transform 0.4s;} .blog-image:after{content: "";position: absolute;inset: 0;background: linear-gradient(180deg, transparent, rgba(5, 24, 35, 0.25));transition: background 0.3s;} .blog-card:hover .blog-image:after{background: rgba(5, 24, 35, 0.12);} .blog-card-arrow{position: absolute;right: 22px;bottom: 22px;z-index: 2;width: 48px;height: 48px;border-radius: 50%;display: grid;place-items: center;background: #fff;color: var(--brand-navy);transform: translateY(8px);opacity: 0;transition: 0.3s;} .blog-card:hover .blog-card-arrow{transform: none;opacity: 1;} .blog-card h2{font-size: clamp(30px, 3vw, 43px);} body.ff-luxury .blog-grid{gap: 70px 25px;} body.ff-luxury .blog-card{overflow: hidden;border: 1px solid var(--ff-border);border-radius: 12px;background: var(--ff-white);padding-bottom: 24px;} body.ff-luxury .blog-image{height: 410px;border-radius: 0;filter: saturate(.88);} body.ff-luxury .blog-card > p, body.ff-luxury .blog-card > h2{margin-left: 24px;margin-right: 24px;} body.ff-luxury .blog-card h2{font-size: clamp(31px,2.8vw,42px);line-height: 1.08;} body.ff-luxury .article-shell{padding-top: 85px;} body.ff-luxury .article-feature{height: min(65vw,680px);border-radius: 12px;filter: saturate(.9);} body.ff-luxury .article-prose{font-size: 17px;line-height: 1.9;} @media (max-width: 760px){body.ff-luxury .blog-image{height: 350px;}body.ff-luxury .article-feature{height: 410px;}}
