/* sites.css — стилі компонента «Портфоліо сайтів».
   Скоуплено під .sites-widget із власними токенами → не конфліктує з хостом.
   Шрифти Unbounded + Inter має підключати хост. */
.sites-widget{
  --s-primary:#0055FF;
  --s-ink:#0B1020;
  --s-muted:#5B6577;
  --s-line:#E7EBF5;
  --s-chip:#EAF0FF;
  --s-radius:16px;
  --s-ease:cubic-bezier(.22,.61,.36,1);
  font-family:'Inter',system-ui,sans-serif;
  color:var(--s-ink);
}
.sites-widget *{box-sizing:border-box}
.sites-widget .sites-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.sites-widget .site-card{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--s-line);
  border-radius:var(--s-radius);overflow:hidden;
  transition:transform .2s var(--s-ease),box-shadow .2s var(--s-ease),border-color .2s;
}
.sites-widget .site-card:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(11,16,32,.10);border-color:#d8e0f5}
.sites-widget .site-image{position:relative;aspect-ratio:16/10;background:var(--s-chip);overflow:hidden}
.sites-widget .site-image picture{display:block;width:100%;height:100%}
.sites-widget .site-image img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
.sites-widget .site-image.is-empty{background:linear-gradient(135deg,#eaf0ff,#f5f8ff)}
.sites-widget .site-badge{
  position:absolute;top:12px;left:12px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);
  color:var(--s-primary);font-size:12px;font-weight:600;padding:5px 12px;border-radius:20px;
}
.sites-widget .site-content{display:flex;flex-direction:column;flex:1;padding:22px 24px 24px}
.sites-widget .site-category{
  font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--s-primary);
  text-transform:uppercase;margin-bottom:8px;
}
.sites-widget .site-name{
  font-family:'Unbounded',sans-serif;font-weight:600;font-size:19px;
  letter-spacing:-0.02em;line-height:1.2;margin:0;color:var(--s-ink);
}
.sites-widget .site-desc{color:var(--s-muted);font-size:14px;line-height:1.55;margin:10px 0 0}
.sites-widget .site-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.sites-widget .site-tag{background:var(--s-chip);color:var(--s-primary);font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:20px}
.sites-widget .site-actions{display:flex;gap:18px;align-items:center;margin-top:auto;padding-top:18px}
.sites-widget .site-link{font-size:13.5px;font-weight:600;text-decoration:none;transition:color .15s}
.sites-widget .site-link--case{color:var(--s-primary)}
.sites-widget .site-link--case:hover{color:#0042C9}
.sites-widget .site-link--live{color:var(--s-muted)}
.sites-widget .site-link--live:hover{color:var(--s-ink)}

@media(prefers-reduced-motion:reduce){.sites-widget .site-card{transition:none}}
@media(max-width:600px){.sites-widget .sites-grid{grid-template-columns:1fr}}