﻿/*!
 * Blog homepage bundle — loaded only on the front page.
 *
 * Carries the styles for the "Explore the Latest at FXIFY" section
 * (.blog-section + .blog-card). Splitting these out of the main blog
 * bundle keeps the homepage payload small (~162 lines vs ~7,700).
 *
 * _blog-card is wrapped in .v2 { } to match how it was imported in the
 * old main bundle (sass/components/_components.scss). The cards rely
 * on CSS custom properties (--spacing-*) that live in the .v2 scope.
 *
 * Build:
 *   npm run build:blog    (one-off compile)
 *   npm run watch:blog    (rebuild on change)
 */section.blog-section{padding-top:var(--spacing-10);padding-left:1.5rem;padding-right:1.5rem}@media(max-width: 1200px){section.blog-section{padding-top:var(--spacing-9)}}.v2 .blog-card{flex:1 1 0;border-radius:10px;border:1px solid rgba(255,255,255,.05);background:rgba(255,255,255,.03);display:flex;padding:var(--spacing-3);flex-direction:column;gap:var(--spacing-3);transition:all .8s ease}@media(max-width: 1200px){.v2 .blog-card{flex:1 1 45%}}@media(max-width: 576px){.v2 .blog-card{flex:1 1 100%}}.v2 .blog-card .bc__image{flex:0 1 150px;position:relative;border-radius:var(--spacing-3);overflow:hidden}.v2 .blog-card .bc__image img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}.v2 .blog-card .bc__meta{display:flex;align-items:center;gap:6px;opacity:.4}.v2 .blog-card .bc__meta .bc__date,.v2 .blog-card .bc__meta .bc__rt{color:#fff;font-size:12px;font-style:normal;font-weight:500;line-height:120%}.v2 .blog-card .bc__meta .vertical{height:100%;width:1px;background:#fff}.v2 .blog-card .bc__title a{color:#fff;font-size:16px;font-style:normal;font-weight:600;line-height:110%;text-decoration:none}.v2 .blog-card .bc__title a:focus{outline:none}.v2 .blog-card .bc__rm{margin-top:auto;display:flex;align-items:center;gap:2px;transition:all .8s ease}.v2 .blog-card .bc__rm a{color:var(--accent);font-size:12px;font-style:normal;font-weight:700;line-height:1;text-decoration:none;transition:inherit}.v2 .blog-card .bc__rm svg{width:12px;height:auto;transition:inherit}.v2 .blog-card .bc__rm svg path{transition:inherit}.v2 .blog-card .bc__rm:hover a{color:var(--accent-soft)}.v2 .blog-card .bc__rm:hover svg{transform:translateX(5px)}.v2 .blog-card .bc__rm:hover svg path{stroke:var(--accent-soft)}.v2 .blog-card:hover{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15)}section.blog-section .content{display:flex;flex-flow:column nowrap;align-items:center;gap:var(--spacing-2)}section.blog-section .content .top-heading,section.blog-section .content .h3-heading,section.blog-section .content .paragraph{text-align:center}section.blog-section .content .paragraph{max-width:40%}@media(max-width: 768px){section.blog-section .content .paragraph{max-width:100%}}section.blog-section .content .blog__posts{margin:var(--spacing-5) auto 0;display:flex;flex-flow:row wrap;gap:var(--spacing-3);max-width:85%}@media(max-width: 992px){section.blog-section .content .blog__posts{max-width:100%}}section.blog-section .content .blog__cta{margin:var(--spacing-5) auto 0}
