.vbm-blog,
.vbm-blog * { box-sizing: border-box; }

.vbm-blog {
	--vbm-content-width: 1740px;
	--vbm-navy: #09294a;
	--vbm-blue: #0b74c9;
	--vbm-cyan: #10bfc2;
	--vbm-text: #526273;
	--vbm-line: #dfe8ef;
	width: 100vw;
	max-width: none;
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	overflow: clip;
	color: var(--vbm-text);
	background: #fff;
	font-family: Arial, Helvetica, sans-serif;
}

.vbm-blog__inner {
	width: min(calc(100% - 40px), var(--vbm-content-width));
	margin: 0 auto;
}

.vbm-hero {
	position: relative;
	display: grid;
	width: 100%;
	min-height: var(--vbm-hero-height, 420px);
	place-items: center;
	color: #fff;
	background-color: var(--vbm-navy);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	text-align: center;
}

.vbm-hero::before { position:absolute; inset:0; background:var(--vbm-hero-overlay,#061f3a); content:""; opacity:var(--vbm-hero-overlay-opacity,.58); }
.vbm-hero .vbm-blog__inner { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; padding:52px 0; flex-direction:column; }
.vbm-hero h1 { max-width:900px; margin:0; color:#fff; font-size:clamp(46px,6vw,82px); font-weight:800; letter-spacing:-.045em; line-height:.98; }
.vbm-hero p { max-width:760px; margin:20px auto 0; color:rgba(255,255,255,.86); font-size:clamp(16px,1.3vw,20px); line-height:1.65; }

.vbm-blog__content { padding: clamp(56px,6vw,96px) 0 clamp(74px,8vw,126px); background:linear-gradient(180deg,#f6f9fb 0,#fff 28%); }
.vbm-blog__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }

.vbm-card {
	display:grid;
	grid-template-columns:minmax(250px,42%) minmax(0,1fr);
	min-height:285px;
	overflow:hidden;
	border:1px solid var(--vbm-line);
	border-radius:16px;
	background:#fff;
	box-shadow:0 12px 34px rgba(9,41,74,.07);
	transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}

.vbm-card:hover { border-color:color-mix(in srgb,var(--vbm-cyan) 54%,var(--vbm-line)); box-shadow:0 20px 44px rgba(9,41,74,.12); transform:translateY(-3px); }
.vbm-card__media { position:relative; display:block; min-height:100%; overflow:hidden; background:#e8f1f5; }
.vbm-card__media img { display:block; width:100%; height:100%; min-height:285px; object-fit:cover; transition:transform .45s ease; }
.vbm-card:hover .vbm-card__media img { transform:scale(1.035); }
.vbm-card__placeholder { display:flex; width:100%; height:100%; min-height:285px; align-items:center; justify-content:center; color:#fff; background:linear-gradient(145deg,#0b3158,#0aa9b4); flex-direction:column; }
.vbm-card__placeholder b { font-size:28px; letter-spacing:.08em; }
.vbm-card__placeholder small { margin-top:5px; letter-spacing:.24em; }

.vbm-card__body { display:flex; min-width:0; padding:30px 31px 26px; flex-direction:column; }
.vbm-card__category { align-self:flex-start; padding:6px 10px; border-radius:99px; color:#087f88; background:#e5fbfa; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.vbm-card h2 { margin:15px 0 0; color:var(--vbm-navy); font-size:clamp(20px,1.45vw,27px); font-weight:750; letter-spacing:-.025em; line-height:1.25; }
.vbm-card h2 a { color:inherit; text-decoration:none; }
.vbm-card h2 a:hover { color:var(--vbm-blue); }
.vbm-card__body > p { display:-webkit-box; margin:15px 0 0; overflow:hidden; color:var(--vbm-text); font-size:14px; line-height:1.65; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.vbm-card__footer { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:auto; padding-top:22px; }
.vbm-card__footer time { color:#8794a2; font-size:12px; }
.vbm-card__link { display:inline-flex; align-items:center; gap:8px; color:var(--vbm-blue); font-size:12px; font-weight:750; text-decoration:none; }
.vbm-card__link span { color:var(--vbm-cyan); font-size:16px; transition:transform .2s ease; }
.vbm-card__link:hover span { transform:translateX(4px); }

.vbm-pagination { margin-top:52px; }
.vbm-pagination ul { display:flex; align-items:center; justify-content:center; gap:8px; margin:0; padding:0; list-style:none; }
.vbm-pagination a,.vbm-pagination span { display:grid; min-width:42px; height:42px; place-items:center; padding:0 13px; border:1px solid var(--vbm-line); border-radius:8px; color:var(--vbm-navy); background:#fff; font-size:13px; font-weight:700; text-decoration:none; }
.vbm-pagination .current,.vbm-pagination a:hover { border-color:var(--vbm-navy); color:#fff; background:var(--vbm-navy); }
.vbm-blog__empty { padding:90px 30px; border:1px dashed var(--vbm-line); border-radius:16px; text-align:center; }
.vbm-blog__empty h2 { margin:0; color:var(--vbm-navy); }
.vbm-blog__empty p { margin:10px 0 0; }

@media(max-width:1100px){.vbm-blog__grid{grid-template-columns:1fr}.vbm-card{grid-template-columns:minmax(260px,38%) minmax(0,1fr)}}
@media(max-width:680px){.vbm-blog__inner{width:min(calc(100% - 28px),var(--vbm-content-width))}.vbm-hero{min-height:var(--vbm-hero-mobile-height,300px)}.vbm-blog__content{padding:42px 0 74px}.vbm-blog__grid{gap:18px}.vbm-card{grid-template-columns:1fr}.vbm-card__media,.vbm-card__media img,.vbm-card__placeholder{min-height:210px;height:210px}.vbm-card__body{padding:24px 22px}.vbm-card__footer{align-items:flex-start;flex-direction:column}.vbm-card:hover{transform:none}}
@media(prefers-reduced-motion:reduce){.vbm-card,.vbm-card__media img,.vbm-card__link span{transition-duration:.01ms!important}}
