/* hero.css — Homepage hero (asymmetric brutalist) */

.hero {
  min-height: calc(100vh - var(--nav-h));
  padding-top: calc(var(--nav-h) + var(--sp-20));
  padding-bottom: var(--sp-32);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
}

.hero__eyebrow {
  font-family: var(--font-mono);
  font-size: var(--type-micro);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--paper-dim);
  margin-bottom: var(--sp-12);
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}

.hero__eyebrow::before {
  content: '';
  width: 32px;
  height: 1px;
  background: var(--accent);
  display: inline-block;
}

.hero__title {
  font-family: var(--font-display);
  font-size: var(--type-hero);
  font-weight: 500;
  overflow-wrap: break-word;
  word-break: break-word;
  line-height: 0.88;
  letter-spacing: -0.045em;
  color: var(--paper);
  max-width: 16ch;
  margin-bottom: var(--sp-12);
}

.hero__title .hl {
  color: var(--accent);
  font-style: italic;
  font-weight: 500;
  white-space: nowrap;
}

.hero__meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-12);
  align-items: end;
  margin-top: auto;
}

.hero__desc {
  font-size: 1.125rem;
  line-height: 1.55;
  color: var(--paper);
  max-width: 48ch;
}

.hero__desc .dim { color: var(--paper-dim); }

.hero__actions {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}

.hero__corner {
  position: absolute;
  top: calc(var(--nav-h) + var(--sp-8));
  right: var(--side-pad);
  font-family: var(--font-mono);
  font-size: var(--type-micro);
  color: var(--paper-dim);
  letter-spacing: 0.1em;
  text-align: right;
  line-height: 1.8;
}

.hero__corner span { display: block; }
.hero__corner .accent { color: var(--accent); }

@media (max-width: 768px) {
  .hero__meta { grid-template-columns: 1fr; gap: var(--sp-8); }
  .hero__actions { justify-content: flex-start; }
  .hero__corner { display: none; }
}