/* Blog index only. Foundations, header and footer remain in their own CSS files. */
.blog-index-hero {
  position:relative; min-height:560px; display:flex; align-items:center;
  padding:160px clamp(20px,6vw,90px) 90px; color:#fff;
  background:linear-gradient(90deg,rgba(0,0,0,.83),rgba(0,0,0,.35)),url('../images/fort-lauderdale-waterfront.jpg') center/cover no-repeat;
}
.blog-hero-copy { max-width:850px; }
.blog-index-hero .eyebrow,.blog-cta .eyebrow { color:#fff; background:var(--red); border-radius:999px; padding:7px 13px; font-size:12px; }
.blog-index-hero h1 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(42px,6vw,78px); line-height:1.03; letter-spacing:-.035em; margin:0 0 22px; }
.blog-index-hero p { font-size:18px; max-width:740px; color:#f1f1f1; margin:0; }
.featured-post { padding:82px clamp(20px,6vw,90px); }
.featured-card { display:grid; grid-template-columns:1.05fr 1fr; max-width:1180px; margin:0 auto; border:1px solid #eee; border-radius:24px; overflow:hidden; box-shadow:0 16px 44px rgba(0,0,0,.08); background:#fff; transition:transform .25s ease,box-shadow .25s ease; }
.featured-card:hover { transform:translateY(-4px); box-shadow:0 22px 55px rgba(0,0,0,.12); }
.featured-image { min-height:380px; }
.featured-image img { width:100%; height:100%; object-fit:cover; }
.featured-content { padding:42px; display:flex; flex-direction:column; justify-content:center; min-width:0; }
.featured-label { color:var(--red); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; margin-bottom:12px; }
.featured-content h2 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(32px,4vw,46px); line-height:1.07; letter-spacing:-.03em; margin:0 0 18px; }
.featured-content p { color:#555; margin:0 0 22px; }
.blog-page .read-more { color:var(--red); font-weight:800; }
.blog-intro { max-width:850px; margin:0 auto; padding:20px 20px 65px; text-align:center; }
.blog-intro h2 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(34px,4vw,54px); line-height:1.07; letter-spacing:-.03em; margin:0 0 18px; }
.blog-intro p { color:var(--muted); font-size:17px; max-width:760px; margin:0 auto; }
.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; max-width:1360px; margin:0 auto; padding:0 clamp(20px,6vw,90px) 90px; }
.blog-card { display:flex; flex-direction:column; background:#fff; border:1px solid #eee; border-radius:20px; overflow:hidden; box-shadow:0 12px 34px rgba(0,0,0,.06); transition:transform .25s ease,box-shadow .25s ease; }
.blog-card:hover { transform:translateY(-5px); box-shadow:0 20px 42px rgba(0,0,0,.11); }
.blog-card-photo { display:block; overflow:hidden; }
.blog-card img { width:100%; height:220px; object-fit:cover; transition:transform .35s ease; }
.blog-card:hover img { transform:scale(1.04); }
.blog-card-content { display:flex; flex-direction:column; flex:1; padding:24px; }
.blog-category { color:var(--red); font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:10px; }
.blog-card-content h3 { font-family:'Playfair Display',Georgia,serif; font-size:25px; line-height:1.15; letter-spacing:-.02em; margin:0 0 12px; }
.blog-card-content h3 a:hover { color:var(--red); }
.blog-card-content p { color:var(--muted); font-size:15px; margin:0 0 18px; }
.blog-card-content .read-more { display:inline-block; margin-top:auto; font-size:14px; }
.blog-cta { padding:90px clamp(20px,6vw,90px); color:#fff; text-align:center; background:linear-gradient(90deg,rgba(0,0,0,.84),rgba(0,0,0,.50)),url('../images/fort-lauderdale-yachts.jpg') center/cover no-repeat; }
.blog-cta > div { max-width:820px; margin:0 auto; }
.blog-cta h2 { font-family:'Playfair Display',Georgia,serif; font-size:clamp(36px,5vw,60px); line-height:1.06; letter-spacing:-.035em; margin:0 0 20px; }
.blog-cta p { max-width:720px; margin:0 auto 28px; color:#eee; font-size:17px; }
.blog-cta-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:14px; }
@media(max-width:980px) {
 .featured-card { grid-template-columns:1fr; }
 .featured-image { min-height:0; }
 .featured-image img { height:340px; }
 .blog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:900px) { .blog-index-hero { padding-top:80px; min-height:460px; } }
@media(max-width:700px) {
 .blog-index-hero { min-height:440px; padding:70px 20px; }
 .blog-index-hero h1 { font-size:clamp(36px,10vw,43px); }
 .blog-index-hero p { font-size:16px; }
 .featured-post { padding:56px 20px; }
 .featured-content { padding:26px; }
 .featured-image img { height:250px; }
 .blog-intro { padding:10px 20px 50px; }
 .blog-grid { grid-template-columns:1fr; padding:0 20px 70px; }
 .blog-card img { height:230px; }
 .blog-cta { padding:70px 20px; }
 .blog-cta-actions { display:grid; }
}
@media(prefers-reduced-motion:reduce) {
 .blog-page { scroll-behavior:auto; }
 .featured-card,.blog-card,.blog-card img { transition:none; transform:none; }
}
