/**
 * Font Awesome duotone — samma mönster som Whizper (stora ikoner, brand-färger).
 * Kräver FA Kit: https://kit.fontawesome.com/b123aa7e70.js
 */

.telme-icon {
  display: block;
  line-height: 1;
}

.telme-icon--sm {
  font-size: 1.35rem;
}

.telme-icon--md {
  font-size: 2rem;
}

.telme-icon--lg {
  font-size: 3rem;
}

.telme-icon--xl {
  font-size: 3.35rem;
}

/* Telme cyan + blue */
.telme-icon--cyan {
  --fa-primary-color: #3e7697;
  --fa-secondary-color: #96d2dc;
  --fa-secondary-opacity: 0.42;
}

.telme-icon--blue {
  --fa-primary-color: #2a5569;
  --fa-secondary-color: #3e7697;
  --fa-secondary-opacity: 0.4;
}

.telme-icon--orange {
  --fa-primary-color: #c44a1a;
  --fa-secondary-color: #e85d2a;
  --fa-secondary-opacity: 0.38;
}

.telme-icon--green {
  --fa-primary-color: #2d6a3e;
  --fa-secondary-color: #5cb85c;
  --fa-secondary-opacity: 0.4;
}

.telme-icon--white {
  --fa-primary-color: #ffffff;
  --fa-secondary-color: #96d2dc;
  --fa-secondary-opacity: 0.55;
}

/* Kort med ikon — se cards.css (.card--layout-stack) */

/* Hela kortet är klickbart (a.card) */
a.card.card--link {
  cursor: pointer;
}

/* Listor med ikon till vänster — se card-grid--features + featureItem */

/* Artikelsida */
.article-body {
  max-width: 48rem;
}

.article-body h2,
.article-body h3 {
  color: var(--color-heading);
  margin: var(--space-lg) 0 var(--space-sm);
}

.article-body p,
.article-body li {
  color: var(--color-text-muted);
}

.article-body img {
  border-radius: var(--radius);
  margin: var(--space-md) 0;
}

.article-meta {
  display: flex;
  gap: var(--space-md);
  align-items: center;
  margin-bottom: var(--space-lg);
  color: var(--color-text-muted);
  font-size: 0.95rem;
}

.article-hero-icon {
  margin-bottom: var(--space-md);
}

.price-card__head .telme-icon {
  margin: 0 auto var(--space-xs);
}