#blogGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
#blogGrid .article-card{min-height:390px}
#blogGrid .article-visual{height:170px;isolation:isolate;background-color:#0d1711}
#blogGrid .article-visual:before{content:"";position:absolute;inset:0;z-index:0;opacity:.96;transform:scale(1.01);transition:transform .35s ease}
#blogGrid .article-visual:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(5,9,7,.10),rgba(5,9,7,.62)),linear-gradient(90deg,rgba(4,8,6,.28),transparent 58%)}
#blogGrid .article-visual span,#blogGrid .article-visual strong{z-index:2}

/* Map guide: stylized terrain + WMU / hunt-zone lines */
#blogGrid .article-card:nth-child(1) .article-visual:before{background:radial-gradient(circle at 73% 47%,rgba(74,222,128,.34) 0 2px,transparent 3px),linear-gradient(117deg,transparent 0 41%,rgba(230,187,79,.75) 42% 43%,transparent 44% 100%),linear-gradient(25deg,transparent 0 52%,rgba(71,155,93,.55) 53% 54%,transparent 55% 100%),repeating-radial-gradient(ellipse at 18% 108%,transparent 0 17px,rgba(116,153,128,.18) 18px 19px,transparent 20px 34px),linear-gradient(145deg,#20392a 0%,#13271c 48%,#0b1510 100%)}
#blogGrid .article-card:nth-child(1) .article-visual:after{background:linear-gradient(180deg,rgba(5,9,7,.04),rgba(5,9,7,.62)),linear-gradient(90deg,rgba(5,9,7,.42),transparent 68%)}
#blogGrid .article-card:nth-child(1) .article-visual strong{color:rgba(131,235,162,.82);text-shadow:0 2px 22px rgba(0,0,0,.45)}

/* App guide: HuntSmart hunt-card UI in the background */
#blogGrid .article-card:nth-child(2) .article-visual{background:radial-gradient(circle at 84% 28%,rgba(74,222,128,.14),transparent 25%),linear-gradient(135deg,#15261b,#0d1510)}
#blogGrid .article-card:nth-child(2) .article-visual:before{inset:20px 34px 18px 38%;border:1px solid rgba(132,229,159,.36);border-radius:14px;box-shadow:-32px 22px 0 -10px rgba(14,28,19,.96),-32px 22px 0 -9px rgba(120,190,140,.16),0 18px 40px rgba(0,0,0,.34);background:linear-gradient(#79e39a,#79e39a) 16px 18px/38% 6px no-repeat,linear-gradient(#728077,#728077) 16px 34px/62% 4px no-repeat,linear-gradient(90deg,#233b2b 0 58%,#173621 58% 100%) 16px 56px/calc(100% - 32px) 34px no-repeat,linear-gradient(#5cd985,#5cd985) 16px 101px/30% 5px no-repeat,linear-gradient(#47534b,#47534b) 16px 116px/68% 4px no-repeat,linear-gradient(145deg,#16241b,#0d1510)}
#blogGrid .article-card:nth-child(2) .article-visual strong{font-size:46px;color:rgba(111,224,145,.54)}

/* LEH explainer: a visual application -> draw -> authorization flow */
#blogGrid .article-card:nth-child(3) .article-visual:before{background:linear-gradient(90deg,transparent 12%,rgba(101,217,133,.75) 12% 14%,transparent 14% 36%,rgba(101,217,133,.75) 36% 38%,transparent 38% 62%,rgba(101,217,133,.75) 62% 64%,transparent 64% 86%,rgba(101,217,133,.75) 86% 88%,transparent 88%),radial-gradient(circle at 13% 58%,#5bd985 0 5px,#173522 6px 13px,transparent 14px),radial-gradient(circle at 37% 58%,#5bd985 0 5px,#173522 6px 13px,transparent 14px),radial-gradient(circle at 63% 58%,#5bd985 0 5px,#173522 6px 13px,transparent 14px),radial-gradient(circle at 87% 58%,#5bd985 0 5px,#173522 6px 13px,transparent 14px),linear-gradient(145deg,#1c2a20,#101611)}
#blogGrid .article-card:nth-child(3) .article-visual:after{background:linear-gradient(180deg,rgba(5,9,7,.08),rgba(5,9,7,.67)),linear-gradient(90deg,rgba(5,9,7,.15),transparent 65%)}

/* Odds guide: historical trend chart */
#blogGrid .article-card:nth-child(4) .article-visual:before{background:linear-gradient(155deg,transparent 0 42%,rgba(78,222,126,.88) 43% 45%,transparent 46% 100%),linear-gradient(22deg,transparent 0 58%,rgba(211,180,74,.72) 59% 61%,transparent 62% 100%),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 72px),repeating-linear-gradient(0deg,rgba(255,255,255,.045) 0 1px,transparent 1px 36px),linear-gradient(145deg,#17301f,#0e1611)}
#blogGrid .article-card:nth-child(4) .article-visual:after{background:radial-gradient(circle at 74% 26%,rgba(74,222,128,.14),transparent 28%),linear-gradient(180deg,rgba(5,9,7,.03),rgba(5,9,7,.68))}

#blogGrid .article-card:hover .article-visual:before{transform:scale(1.045)}
@media(max-width:900px){#blogGrid{grid-template-columns:1fr}#blogGrid .article-card{min-height:0}#blogGrid .article-visual{height:150px}}