/* A clean, modern article gallery */
:root{
  /* friendly, bright palette */
  --bg: #F3F0EB; /* warm cream */
  --card: #ffffff; /* white cards */
  --muted: #6b7280; /* neutral muted text */
  --accent: #ff6b6b; /* friendly coral accent */
  --glass: rgba(255,255,255,0.6);
}
*{box-sizing:border-box}
html,body{height:100%; min-height: 100vh;}
body{
  margin: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background: linear-gradient(180deg,var(--bg), #F3F0EB 120%);
  color:#0f1724; /* dark text for contrast */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{max-width:1100px;margin:0 auto;padding:20px;}
.controls{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.controls input[type="search"]{
  flex:1;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,0.04);background:var(--glass);color:inherit;outline:none;font-size:14px
}
.controls select{padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,0.04);background:transparent;color:inherit}
.articles{display:grid;gap:18px}
.articles.grid{grid-template-columns:repeat(auto-fill, minmax(240px,1fr))}
.articles.list{grid-template-columns:1fr}
.card{
  padding-top: 10px; display:flex;flex-direction:column;background:white;border-radius:12px;overflow:hidden;
  border:solid 1px rgba(15,23,36,0.06);transition:transform .18s ease, box-shadow .18s ease;
}
/*.card:hover{transform:translateY(-6px);box-shadow:0 12px 28px rgba(15,23,36,0.08)}*/
.thumb{width:100%;height:150px;object-fit:scale-down;}
.card-body{padding:14px;display:flex;flex-direction:column;gap:8px}
.title{font-weight:600;margin:0;font-size:14px}
.excerpt{margin:0;color:var(--muted);font-size:13px;}
a.card {color:#404040; text-decoration:none !important;}
a.card:visited {color:#404040 !important;}
a.card:hover {color:black !important;}
.meta{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:12px}
.badge{padding:6px 10px;border-radius:999px;background:linear-gradient(90deg,var(--accent), #ff9a76);font-weight:600;color:white;font-size:12px}
.card-row{display:flex;gap:12px}
.list .card{flex-direction:row;height:120px}
.list .thumb{width:190px;height:100%;flex-shrink:0}
.list .card-body{padding:12px}
.notes{margin:22px 0 80px;color:var(--muted);font-size:13px}
/*@media (max-width:520px){
  .controls{flex-direction:column}
  .thumb{height:140px}
}*/

.universalLink{
  padding:6px 4px ; display:flex;
  justify-content:space-around;background:white;
  overflow:hidden;border:1px solid rgba(15,23,36,0.06);
  transition:transform .18s ease, box-shadow .18s ease;
  border-top: solid 1px #E0E0E0;
}

.uLink{
  display:flex;
  flex-direction:column;
  align-items:center;
}

a.uLink {
  color:#404040; text-decoration:none !important;
  font-size: 11px;
}

.uLinkImg{
  width: 32px;
}