/* Bruktbilkampanje-kort — gjenskaper kortet på jaegerbil.no/bruktbil (Tailwind-verdier målt 2026-09-25). */
@font-face { font-family: 'ToyotaType-Book'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('fonts/ToyotaType-Book.woff2') format('woff2'); }
@font-face { font-family: 'ToyotaType'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('fonts/ToyotaType-Regular.woff2') format('woff2'); }
@font-face { font-family: 'ToyotaType'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('fonts/ToyotaType-Semibold.woff2') format('woff2'); }

:root {
  --hc-blue: oklch(0.623 0.214 259.815);
  --hc-gray-700: rgb(108, 112, 115);
  --hc-gray-100: rgb(245, 245, 245);
  --hc-red: rgb(212, 6, 5);
  --hc-black: #000;
}

.hc-page { margin: 0; background: var(--hc-gray-100); }
.hc-page, .hc-card { font-family: 'ToyotaType', sans-serif; color: var(--hc-black);
  -webkit-font-smoothing: antialiased; }
.hc-card *, .hc-card *::before, .hc-card *::after { box-sizing: border-box; }

.hc-wrap { background: var(--hc-gray-100); padding: 32px 24px; }
@media (min-width: 1024px) { .hc-wrap { padding: 40px 24px; } }

.hc-grid { display: grid; gap: 24px; grid-template-columns: minmax(0, 1fr);
  max-width: 1232px; margin: 0 auto; }
@media (min-width: 768px)  { .hc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .hc-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.hc-card { display: flex; flex-direction: column; height: 100%; overflow: hidden;
  background: #fff; box-shadow: 0 18px 50px rgba(0, 0, 0, 0.06); text-decoration: none;
  cursor: pointer; transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1); }
.hc-card:hover { transform: translateY(-4px); }

.hc-media { position: relative; }
.hc-img { display: block; width: 100%; aspect-ratio: 600 / 400; object-fit: cover; }
.hc-approved { pointer-events: none; position: absolute; left: 0; right: 0; bottom: 0; z-index: 10;
  display: flex; align-items: flex-end; height: 96px; padding: 0 20px 16px;
  background: linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,.3), transparent); }
.hc-approved img { height: 32px; width: auto; }

.hc-content { display: flex; flex: 1 1 0%; flex-direction: column; padding: 20px; }
.hc-top > * + * { margin-top: 12px; }
.hc-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  font-family: 'ToyotaType-Book', sans-serif; font-size: 16px; line-height: 1.5; }
.hc-fuel { font-weight: 600; color: var(--hc-blue); }
.hc-loc { display: inline-flex; align-items: center; gap: 8px; color: var(--hc-gray-700); }
.hc-pin { height: 16px; width: 14px; flex-shrink: 0; }
.hc-title { margin: 0; font-size: 24px; font-weight: 600; line-height: 1.15; color: var(--hc-black); }
.hc-variant { margin: 4px 0 0; font-size: 16px; line-height: 1.5; color: var(--hc-gray-700); }

.hc-bottom { margin-top: auto; padding-top: 20px; }
.hc-bottom > * + * { margin-top: 16px; }
.hc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hc-chip { border-radius: 9999px; background: var(--hc-gray-100); padding: 8px 12px;
  font-size: 14px; line-height: 20px; font-weight: 600; color: var(--hc-black); }
.hc-price-row { display: flex; align-items: baseline; justify-content: flex-start; gap: 12px; }
.hc-price { margin: 0; font-family: 'ToyotaType-Book', sans-serif; font-size: 22px;
  line-height: 1.3; color: var(--hc-black); }
.hc-price--sale { color: var(--hc-red); }
.hc-old-price { margin: 0; font-family: 'ToyotaType-Book', sans-serif; font-size: 16px;
  line-height: 1.5; text-decoration: line-through; color: var(--hc-black); }

.hc-empty { max-width: 1232px; margin: 0 auto; font-size: 16px; color: var(--hc-gray-700); }