/* Cruise line page and /cruise-lines. Shared entity components live in ship.css. */

.line-facts { display: grid; gap: var(--s-5); }
@media (min-width: 60rem) { .line-facts { grid-template-columns: minmax(0, 1fr) 17rem; align-items: center; gap: var(--s-7); } }
.facts .line-facts__value { font-size: var(--step-1); }

.fleet, .line-cards { list-style: none; padding: 0; display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); }
.fleet__card, .line-card { height: 100%; }
.fleet__blank, .line-card__blank {
  display: grid; place-items: center;
  background:
    repeating-radial-gradient(circle at 70% 120%, transparent 0 14px, rgba(46, 97, 115, 0.12) 15px 16px),
    var(--paper-alt);
}
.line-card__blank { font: 700 var(--step-5)/1 var(--font-display); color: var(--harbour); }
.card--link .card__stub::before, .card--link .card__stub::after { background: var(--paper-alt); }
.section:not(.section--alt) .card__stub::before, .section:not(.section--alt) .card__stub::after { background: var(--paper); }