/* trendbuzz.to — base custom styles (Swiss / Grid Borders aesthetic) */
:root {
  --brand: #002FA7;
  --ink: #0A0A0A;
  --muted: #52525B;
  --line: #E5E5E5;
  --soft: #F5F5F7;
  --alert: #FF2A2A;
}

html { -webkit-font-smoothing: antialiased; }
body { font-feature-settings: "ss01" 1, "cv11" 1; }

.font-display { font-family: "Clash Display", sans-serif; letter-spacing: -0.02em; }

.grid-skeleton { background-image:
    linear-gradient(to right, rgba(10,10,10,0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(10,10,10,0.06) 1px, transparent 1px);
  background-size: 80px 80px;
}

.marquee {
  display: flex;
  overflow: hidden;
  user-select: none;
  mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
}
.marquee__track {
  display: flex;
  flex: 0 0 auto;
  min-width: 100%;
  gap: 4rem;
  animation: marquee 40s linear infinite;
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}

.counter[data-target] { font-variant-numeric: tabular-nums; }

.accordion-item[open] summary .accordion-icon { transform: rotate(45deg); }

.bid-stream {
  position: relative;
  height: 220px;
  overflow: hidden;
  background: #0A0A0A;
  border: 1px solid #1F1F22;
}
.bid-stream__line {
  position: absolute; left: 0; right: 0; height: 1px;
  background: linear-gradient(to right, transparent, #002FA7 50%, transparent);
  opacity: 0.7;
  animation: bid-line 3.2s linear infinite;
}
@keyframes bid-line {
  0% { transform: translateY(-10px); opacity: 0; }
  20% { opacity: 0.7; }
  100% { transform: translateY(230px); opacity: 0; }
}

/* Reveal on scroll */
.reveal { opacity: 0; transform: translateY(12px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-in { opacity: 1; transform: none; }

/* Stark inputs */
input.tb, select.tb, textarea.tb {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  height: 48px;
  padding: 0 14px;
  border-radius: 0;
  width: 100%;
  font-size: 14px;
}
textarea.tb { height: auto; padding: 12px 14px; min-height: 140px; }
input.tb:focus, select.tb:focus, textarea.tb:focus {
  outline: none;
  border-color: var(--brand);
  box-shadow: inset 0 0 0 1px var(--brand);
}

.btn { display:inline-flex; align-items:center; justify-content:center; height:48px; padding:0 22px; font-size:14px; font-weight:600; transition:.15s ease; border-radius:0; }
.btn-primary { background: var(--brand); color:#fff; }
.btn-primary:hover { background: var(--ink); }
.btn-outline { border:1px solid var(--ink); color:var(--ink); }
.btn-outline:hover { background: var(--ink); color:#fff; }

.label-eyebrow { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--brand); font-weight: 700; }

.kbd { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 12px; padding: 2px 6px; border: 1px solid var(--line); background: var(--soft); }
