/* ==============================================
   ALL SERVICES PAGE
   ============================================== */
.all-services {
  padding: var(--section-spacing-desktop) 0;
}
/* Wider than the page's 1240px measure. Cards are read across rather than down, so the
   row is the thing that has to be legible, and at three or four to a 1240px container the
   columns come out too narrow for the copy in them. */
.services-wrapper {
  width: calc(100% - 48px);
  max-width: 1600px;
  margin: 0 auto;
}
/* The wide measure is for a set that needs it — the checklist page runs to ten cards, and
   at the page's own width they were too narrow to read. Three cards do not need it, and
   1,600px between blocks that stop at 1,320 reads as a block that has come loose. */
.services-wrapper:not(:has(.services-grid-2col > :nth-child(5))) {
  max-width: var(--container);
}
/* Three to a row, but a row that does not fill is centred rather than ranged left.
   A grid cannot do that — its columns exist whether anything sits in them — so a short
   set left an empty third column and the cards read as pushed to one side. Flex keeps the
   card width a third of the row and centres whatever is left over: the two on
   /tomning-av-lagenhet/, and the odd card at the end of a set of ten. */
.services-grid-2col {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px;
  margin-bottom: 56px;
}
.services-grid-2col > * {
  flex: 0 1 calc((100% - 64px) / 3);
}
/* Past six cards a third of the row is wider than the card needs, and the set reads as a
   long column of rows. Four to a row from the seventh onwards — the checklist's seven
   stages then sit four and three, with the short row centred like any other.

   Behind a min-width query, not a bare rule: a media query adds no specificity, so
   :has(…) > * outranked the two rules below that drop to two columns and then one, and a
   seven-card set stayed four across all the way down to 152px columns on a phone. */
@media (min-width: 1400px) {
  .services-grid-2col:has( > :nth-child(7)) > * {
    flex-basis: calc((100% - 96px) / 4);
  }
}
.service-card-expanded {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  border: 1.5px solid var(--border);
  transition: all var(--transition);
  display: flex;
  flex-direction: column;
}
.service-card-expanded:hover {
  border-color: var(--brand-orange);
  box-shadow: 0 12px 32px rgba(243, 146, 1, 0.15);
  transform: translateY(-4px);
  background: linear-gradient(135deg, rgba(249, 183, 77, 0.03) 0%, rgba(243, 146, 1, 0.03) 100%);
}
.service-card-expanded .service-icon-large {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--brand-orange-tint);
  border-radius: var(--radius-md);
  font-size: 1.75rem;
  color: var(--brand-orange);
  margin-bottom: 20px;
  flex-shrink: 0;
}
.service-card-expanded h3 {
  margin-bottom: 12px;
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text);
}
.service-card-expanded > :is(p, .service-card-copy) {
  color: var(--text-soft);
  font-size: var(--font-size-body);
  line-height: 1.6;
  margin-bottom: 16px;
  flex-grow: 0;
}
/* The copy wraps paragraphs now instead of being one. The gap below stays on the box, so
   the distance to the card's list is the same however many paragraphs it holds. */
.service-card-copy p {
  margin: 0;
}
.service-card-copy p + p {
  margin-top: 12px;
}
.service-card-expanded .service-features {
  list-style: none;
  margin-bottom: 20px;
  flex-grow: 1;
}
.service-card-expanded .service-features li {
  color: var(--text-soft);
  font-size: var(--font-size-small);
  line-height: 1.8;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.service-card-expanded .service-features i {
  color: var(--brand-orange);
  font-size: 0.75rem;
}
.service-card-expanded .btn-sm {
  align-self: flex-start;
  padding: 10px 18px;
  font-size: 0.9rem;
}
@media (max-width: 1024px) {
  .services-grid-2col {
    gap: 24px;
  }
  .services-grid-2col > * {
    flex-basis: calc((100% - 24px) / 2);
  }
}
/* Between the two-column breakpoint and the four-column one, three to a row. The
   four-column threshold sits at 1400px because below it a quarter of the row is under
   300px, which is narrower than these cards' lists read comfortably. */
@media (min-width: 1025px) and (max-width: 1399px) {
  .services-grid-2col > * {
    flex-basis: calc((100% - 64px) / 3);
  }
}
@media (max-width: 768px) {
  .all-services {
    padding: var(--section-spacing-mobile) 0;
  }
  .services-grid-2col {
    gap: 20px;
  }
  .services-grid-2col > * {
    flex-basis: 100%;
  }
  .service-card-expanded {
    padding: 24px 18px;
  }
}
/* The header is optional — a migrated grid often has no heading of its own. */
.all-services .services-header {
  text-align: center;
  margin-bottom: 48px;
}
.all-services .services-header .eyebrow {
  display: block;
  margin-bottom: 10px;
}
/* Migrated cards may carry a photograph where the design used an icon. */
.service-card-expanded .service-card-media {
  margin: -32px -32px 22px;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.service-card-expanded .service-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* The card title level follows the page outline, so size by position. */
.service-card-expanded > :is(h2, h3, h4, h5, h6) {
  font-size: var(--font-size-h3);
  margin-bottom: 12px;
  color: var(--text);
}
/* Tone comes from the page rhythm, not from the block. The cards carry a hairline
   border so they still read as cards when the section behind them is white. */
.service-card-expanded {
  border: 1px solid var(--border);
}
/* Cards in a row are equal height, so the call to action is pinned to the foot rather
   than floating wherever the copy happens to end. */
.service-card-expanded {
  display: flex;
  flex-direction: column;
}
.service-card-expanded > .btn {
  margin-top: auto;
  align-self: flex-start;
}
.service-card-expanded .service-features {
  margin-bottom: 20px;
}
/* The migrated sections end on the button that used to sit under their copy. The arrow
   link, as on the tips band and the process, so it does not compete with the page's
   primary call to action. */
.services-footer {
  text-align: center;
}
/*# sourceMappingURL=style.css.map */
/*# sourceMappingURL=data:application/json;charset=utf8;base64,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 */