﻿.asb-blog{--asb-accent:#0f3b3a;--asb-columns:3;color:#666;font-family:Montserrat,Arial,sans-serif}
.asb-blog{position:relative}
.asb-blog .asb-grid{align-content:start}
.asb-blog .asb-transition-layer{position:absolute;inset:0;pointer-events:none;z-index:3}
.asb-blog [hidden]{display:none!important}
.asb-blog .asb-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0 0 20px}
.asb-blog .asb-filter{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 12px;border:1px solid #ccc;border-radius:4px;background:#fff;color:rgba(0,0,0,.6);line-height:1.3;text-decoration:none;font-size:14px;font-weight:400}
.asb-blog .asb-filter:hover{border-color:#0f3b3a}
.asb-blog .asb-filter[aria-current]{background:var(--asb-accent);border-color:var(--asb-accent);color:#fff}
.asb-blog a:focus-visible,.asb-blog button:focus-visible{outline:3px solid #147caa;outline-offset:4px}
.asb-blog .asb-status{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.asb-blog .asb-status.asb-status-error{position:static!important;width:auto;height:auto;margin:0 0 16px;clip:auto;white-space:normal;color:#a02020;text-align:center}
.asb-blog .asb-grid{display:grid;grid-template-columns:repeat(var(--asb-columns),minmax(0,1fr));gap:30px}
.asb-blog .asb-card{position:relative;min-width:0;overflow:hidden;border-radius:5px;background:#fff}
.asb-blog .asb-image-link{display:block;width:100%;max-width:350px;aspect-ratio:350/250;overflow:hidden;margin:0 auto 10px;border-radius:5px 5px 0 0}
.asb-blog .asb-image{display:block;width:100%;height:100%;object-fit:cover}
.asb-blog .asb-body{padding:0 10px 10px}
.asb-blog .asb-title{margin:0 0 10px;padding:0;font-family:inherit;font-size:23px;font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.asb-blog .asb-title a{color:rgba(0,0,0,.6);text-decoration:none}
.asb-blog .asb-title a::after{content:"";position:absolute;inset:0;z-index:1}
.asb-blog .asb-title a:focus-visible::after{outline:3px solid #147caa;outline-offset:-3px;border-radius:5px}
.asb-blog .asb-meta{font-size:12px;line-height:1.3;color:#787786;margin:0 0 10px;padding:0}
.asb-blog .asb-meta a{position:relative;z-index:2;color:inherit}
.asb-blog .asb-meta a:hover{text-decoration:underline}
.asb-blog .asb-excerpt{font-size:13px;line-height:1.3;margin:0;padding:0}
.asb-blog .asb-actions{text-align:center;margin-top:32px}
.asb-blog .asb-more,.asb-blog .asb-retry,.asb-blog .asb-pagination a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid var(--asb-accent);border-radius:4px;padding:8px 16px;background:var(--asb-accent);color:#fff;font:inherit;font-size:14px;line-height:1.3;cursor:pointer;text-decoration:none}
.asb-blog .asb-more:disabled{opacity:.6;cursor:wait}
.asb-blog .asb-pagination{display:flex;justify-content:center;gap:16px}
.asb-blog .asb-empty{text-align:center;padding:24px}
.asb-blog .asb-card-enter{animation:asb-enter .25s ease both}
@keyframes asb-enter{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:980px){.asb-blog .asb-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.asb-blog .asb-grid{transition:none}.asb-blog .asb-card-enter{animation:none}}
.asb-blog{color:var(--asb-text-color,#666)}
.asb-blog .asb-card{background:var(--asb-card-color,#fff)}
.asb-blog .asb-title a{color:var(--asb-title-color,#666)}
.asb-blog .asb-meta{color:var(--asb-meta-color,#787786)}
.asb-blog .asb-filter{background:var(--asb-filter-color,#fff);color:var(--asb-filter-text,#666)}
.asb-blog .asb-filter:hover{border-color:var(--asb-accent)}
.asb-blog .asb-filter[aria-current]{background:var(--asb-accent);color:var(--asb-button-text,#fff)}
.asb-blog .asb-more,.asb-blog .asb-retry,.asb-blog .asb-pagination a{color:var(--asb-button-text,#fff)}
.asb-blog .asb-image-link{max-width:var(--asb-image-width,350px);aspect-ratio:var(--asb-image-ratio,350/250)}
.asb-blog .asb-image{object-fit:var(--asb-image-fit,cover)}
.asb-blog .asb-card-enter{animation-duration:calc(var(--asb-duration,450ms) * .55)}
.asb-blog[data-animation="fade"] .asb-card-enter{animation-name:asb-fade}
.asb-blog[data-animation="none"] .asb-card-enter{animation:none}
@keyframes asb-fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.asb-blog .asb-card-enter{animation:none!important}}
