.tt-blog {
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#0b1120;
  color:#e5e7eb;
}
.tt-blog a { color:inherit; text-decoration:none; }
.tt-blog a:hover { color:#facc15; }

.tt-blog .tt-container {
  max-width:1120px;
  margin:0 auto;
  padding:0 16px;
}

/* A11y */
.tt-sr-only{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* Tools (search / filters) */
.tt-blog-tools{ margin-top:16px; }
.tt-blog-tools-form{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  padding:12px;
  border-radius:18px;
  border:1px solid #1f2937;
  background:rgba(2,6,23,.55);
}
@media (min-width:768px){
  .tt-blog-tools-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) 220px 180px auto auto;
    align-items:center;
  }
  .tt-blog-tools-form .tt-input{ width:100%; min-width:0; }
}
.tt-input,
.tt-select{
  background:#020617;
  border:1px solid #1f2937;
  color:#e5e7eb;
  border-radius:999px;
  padding:10px 12px;
  font-size:13px;
  outline:none;
}
.tt-input{ min-width:220px; flex:1 1 240px; }
.tt-select{ flex:0 0 auto; }
.tt-input:focus,
.tt-select:focus{ border-color:#facc15; box-shadow:0 0 0 2px rgba(250,204,21,.12); }

.tt-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid #facc15;
  background:transparent;
  color:#facc15;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  transition:transform .12s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease;
}
.tt-btn:hover{ box-shadow:0 0 0 2px rgba(250,204,21,.12); transform:translateY(-1px); }
.tt-btn:active{ transform:translateY(0); }
.tt-btn-ghost{ border-color:#1f2937; color:#e5e7eb; }
.tt-btn-ghost:hover{ border-color:#facc15; color:#facc15; }
/* Hard override: prevent theme button/input styles from bleeding into our UI */
.tt-blog .tt-input,
.tt-blog .tt-select{
  background:#020617 !important;
  border:1px solid #1f2937 !important;
  color:#e5e7eb !important;
  border-radius:999px !important;
}

.tt-blog .tt-btn{
  border-radius:999px !important;
  background:transparent !important;
  border:1px solid #facc15 !important;
  color:#facc15 !important;
}
.tt-blog .tt-btn-solid{
  background:#facc15 !important;
  color:#0b1120 !important;
}
.tt-blog .tt-btn-solid:hover{ box-shadow:0 0 0 2px rgba(250,204,21,.18) !important; }
.tt-blog .tt-btn-ghost{
  border-color:#1f2937 !important;
  color:#e5e7eb !important;
}


/* Chips */
.tt-chip-row{ display:flex; gap:6px; flex-wrap:wrap; }
.tt-chip{
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid #1f2937;
  color:#9ca3af;
  font-size:11px;
  line-height:1;
}

/* Hero / header */
.tt-blog-header {
  padding:48px 0 24px;
  border-bottom:1px solid #1f2937;
}
.tt-blog-title {
  font-size:32px;
  font-weight:800;
  margin-bottom:6px;
}
.tt-blog-sub {
  font-size:14px;
  color:#9ca3af;
}

/* Posts grid */
.tt-blog-main {
  padding:24px 0 40px;
}
.tt-blog-grid {
  display:grid;
  gap:20px;
}
@media (min-width:768px){
  .tt-blog-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
.tt-blog-card {
  background:radial-gradient(circle at top,#020617,#020617);
  border-radius:18px;
  border:1px solid #1f2937;
  transition:border-color .18s ease, box-shadow .18s ease;
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:12px;
  gap:10px;
}
.tt-blog-card:hover {
  border-color:#facc15;
  box-shadow:0 0 0 1px rgba(250,204,21,.28), 0 18px 40px rgba(0,0,0,.45);
}

.tt-blog-card-img {
  background:#020617;
  border-radius:14px;
  overflow:hidden;
  display:block;
}
.tt-blog-card-img img {
  width:100%;
  height:auto;
  display:block;
}
.tt-blog-card-fallback{
  width:100%;
  height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  color:#6b7280;
}

/* Featured */
.tt-blog-featured{
  margin-bottom:22px;
}
.tt-blog-featured-head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  margin:4px 2px 10px;
}
.tt-blog-featured-title{ font-weight:800; letter-spacing:.2px; }
.tt-blog-featured-sub{ color:#6b7280; font-size:12px; }
.tt-blog-featured-grid{
  display:grid;
  gap:18px;
}
@media (min-width:768px){
  .tt-blog-featured-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .tt-blog-card--featured .tt-blog-card-title{ font-size:17px; }
}
.tt-blog-card-body {
  padding:0 2px 2px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.tt-blog-card-title {
  font-size:16px;
  font-weight:600;
}
.tt-blog-card-excerpt {
  font-size:13px;
  color:#9ca3af;
}
.tt-blog-card-meta {
  font-size:12px;
  color:#6b7280;
  margin-top:4px;
}

/* Pagination */
.tt-blog-pagination {
  margin-top:24px;
  display:flex;
  justify-content:center;
  gap:8px;
  font-size:13px;
}
.tt-blog-pagination a,
.tt-blog-pagination span {
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #1f2937;
}
.tt-blog-pagination span.current {
  border-color:#facc15;
  color:#facc15;
}

/* No posts */
.tt-blog-empty {
  padding:24px;
  text-align:center;
  font-size:14px;
  color:#9ca3af;
}