/*!
 * blog-highlight.css — styling for the homepage "From the Blog" section.
 * Tokens and breakpoints copied from warehouse-contacts.css so the section is
 * indistinguishable from the rest of the site.
 *
 *   dark green  #1a3a2f
 *   gold        #c9a227
 *   off-white   #fafaf8
 *
 * Upload to:  public_html/assets/blog-highlight.css
 */

.fe-bl-section{padding:48px 0;background:#fff}
.fe-bl-container{max-width:80rem;margin:0 auto;padding:0 16px}

.fe-bl-header{text-align:center;max-width:42rem;margin:0 auto 40px}
.fe-bl-eyebrow{color:#c9a227;font-size:.75rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase}
.fe-bl-heading{font-size:1.875rem;font-weight:300;color:#1a3a2f;margin-top:12px;line-height:1.2}
.fe-bl-heading strong{font-weight:600}
.fe-bl-desc{color:#4b5563;margin-top:16px;font-size:1rem;line-height:1.6}

.fe-bl-grid{display:grid;grid-template-columns:1fr;gap:24px}

.fe-bl-card{display:flex;flex-direction:column;background:#fff;border-radius:1rem;border:1px solid #f3f4f6;overflow:hidden;text-decoration:none;transition:border-color .2s,box-shadow .2s,transform .2s}
.fe-bl-card:hover{border-color:#c9a227;box-shadow:0 10px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);transform:translateY(-2px)}

.fe-bl-media{aspect-ratio:16/9;overflow:hidden;background:#f3f4f6;flex-shrink:0}
.fe-bl-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.fe-bl-card:hover .fe-bl-media img{transform:scale(1.04)}
.fe-bl-media-empty{background:linear-gradient(135deg,#1a3a2f,#2d5443)}

.fe-bl-body{padding:20px;display:flex;flex-direction:column;flex:1}
.fe-bl-date{font-size:.75rem;color:#9ca3af;letter-spacing:.05em;text-transform:uppercase}
.fe-bl-title{font-size:1.125rem;font-weight:500;color:#1a3a2f;margin-top:8px;line-height:1.35}
.fe-bl-excerpt{color:#4b5563;font-size:.9375rem;line-height:1.6;margin-top:10px;flex:1}

.fe-bl-more{display:inline-flex;align-items:center;gap:6px;margin-top:16px;color:#c9a227;font-size:.875rem;font-weight:600}
.fe-bl-more svg{width:15px;height:15px;transition:transform .2s}
.fe-bl-card:hover .fe-bl-more svg{transform:translateX(3px)}

.fe-bl-footer{text-align:center;margin-top:40px}
.fe-bl-cta{display:inline-flex;align-items:center;gap:8px;padding:16px 32px;border-radius:9999px;background:#c9a227;color:#1a3a2f;font-weight:600;font-size:1rem;text-decoration:none;transition:background-color .2s,transform .2s}
.fe-bl-cta:hover{background:#b8931f;transform:translateY(-1px)}
.fe-bl-cta svg{width:16px;height:16px;transition:transform .2s}
.fe-bl-cta:hover svg{transform:translateX(3px)}

@media(min-width:640px){
  .fe-bl-section{padding:64px 0}
  .fe-bl-container{padding:0 24px}
  .fe-bl-heading{font-size:2.25rem}
  .fe-bl-grid{grid-template-columns:1fr 1fr}
  /* A lone post shouldn't stretch across the full width. */
  .fe-bl-count-1{grid-template-columns:minmax(0,32rem);justify-content:center}
}

@media(min-width:768px){
  .fe-bl-container{padding:0 48px}
}

@media(min-width:1024px){
  .fe-bl-section{padding:96px 0}
  .fe-bl-heading{font-size:3rem}
  .fe-bl-grid{grid-template-columns:1fr 1fr 1fr}
  .fe-bl-count-1{grid-template-columns:minmax(0,34rem)}
  .fe-bl-count-2{grid-template-columns:repeat(2,minmax(0,28rem));justify-content:center}
}