/* ============================================================
   LEADSENSE – LIFT (lift.css)
   Gemensamt designlager: färger, rörelse, knappar och alla
   undersidor. Länkas in EFTER sidans egen CSS (på startsidan
   före index.css) så att det vinner vid lika specificitet.
   ============================================================ */

:root {
  --coral: #FF6B4A;
  --radius-xl: 36px;
  --radius-lg: 28px;
  --ease: cubic-bezier(.2, .7, .2, 1);

  /* Accentfärg: EN per undersida, satt via body-klass. Standard = LeadSense-gult. */
  --accent: var(--color-3);
  --accent-ink: #000;
}

.acc-yellow { --accent: var(--color-3); --accent-ink: #000; }
.acc-coral  { --accent: var(--coral);   --accent-ink: #000; }
.acc-blue   { --accent: var(--color-6); --accent-ink: #fff; }


@keyframes spin { to { transform: rotate(360deg); } }
@keyframes rise { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }
@keyframes heroZoom { from { transform: scale(1.12); } to { transform: scale(1); } }


/* ============================================================
   GRUNDER: hjälpklasser, fokus, reveal, highlighter
   ============================================================ */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

:focus-visible {
  outline: 3px solid var(--color-6);
  outline-offset: 3px;
}

.service-card--blue :focus-visible,
.cta-section :focus-visible,
.stats :focus-visible,
.image-card :focus-visible,
.acc-blue .texthero :focus-visible,
.acc-blue .svc-cta :focus-visible,
.acc-blue .kt-info-col :focus-visible,
.acc-blue .ni-option:first-child :focus-visible,
.svc-forwho :focus-visible,
.site-footer :focus-visible {
  outline-color: var(--color-3);
}

.js .reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .9s var(--ease), transform .9s var(--ease);
  transition-delay: var(--d, 0s);
}

.js .reveal.is-visible {
  opacity: 1;
  transform: none;
}

.hl {
  background: linear-gradient(var(--color-3), var(--color-3)) no-repeat 0 90% / 0% .5em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  transition: background-size .9s var(--ease) .35s;
}

.is-visible .hl,
.hl.is-visible,
html:not(.js) .hl {
  background-size: 100% .5em;
}

@media (min-width: 769px) {
  .nowrap { white-space: nowrap; }
}

/* Parallax-behållare: JS flyttar .px, bilden inuti kan skalas vid hover */
.px {
  position: absolute;
  inset: -9% 0;
  will-change: transform;
}

.px img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.1s var(--ease);
}


/* ============================================================
   PILL-KNAPP MED CIRKEL-PIL
   ============================================================ */

.pill {
  --pill-bg: var(--color-5);
  --pill-fg: var(--color-1);
  --pill-dot: var(--color-3);
  --pill-dot-fg: var(--color-5);
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 8px 8px 8px 28px;
  border: 0;
  border-radius: 60px;
  background: var(--pill-bg);
  color: var(--pill-fg);
  font-family: var(--font-primary);
  font-size: var(--h5-size);
  line-height: var(--h5-lh);
  letter-spacing: var(--h5-ls);
  font-weight: 400;
  text-decoration: none;
  cursor: pointer;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}

.pill--light {
  --pill-bg: var(--color-1);
  --pill-fg: var(--color-5);
}

.pill-arrow {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--pill-dot);
  color: var(--pill-dot-fg);
  transition: transform .4s var(--ease);
}

.pill-arrow svg { width: 22px; height: 22px; }

.pill:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0, 0, 0, .22); }
.pill:hover .pill-arrow { transform: rotate(-45deg) scale(1.08); }


/* ============================================================
   NAVIGATION – Kontakt-knappen syns även på mobil
   ============================================================ */

@media (max-width: 768px) {
  .nav-btn-kontakt {
    display: inline-block;
    font-size: 16px;
    padding: 5px 16px;
  }
}

@media (max-width: 480px) {
  .nav-link--active { display: none; }
  .nav-logo img { height: 22px; }
}


/* Hero-innehåll ovanför vecket animeras med CSS vid laddning (inte via scroll-observer) */
.svc-hero-content > *,
.texthero .container > *,
.er-hero-inner > *,
.ni-hero-inner > *,
.tk-inner > * {
  animation: rise .9s var(--ease) both;
}

.svc-hero-content > :nth-child(2),
.texthero .container > :nth-child(2),
.er-hero-inner > :nth-child(2),
.ni-hero-inner > :nth-child(2),
.tk-inner > :nth-child(2) { animation-delay: .1s; }

.svc-hero-content > :nth-child(3),
.texthero .container > :nth-child(3),
.er-hero-inner > :nth-child(3),
.ni-hero-inner > :nth-child(3),
.tk-inner > :nth-child(3) { animation-delay: .2s; }

.texthero .container > :nth-child(n+4),
.ni-hero-inner > :nth-child(n+4),
.tk-inner > :nth-child(n+4) { animation-delay: .3s; }


/* ============================================================
   GEMENSAMT FÖR TJÄNSTESIDORNA (.svc-*)
   Klasserna läggs till på respektive sidas egna element.
   ============================================================ */

/* --- Bildhero -------------------------------------------- */

.svc-hero {
  position: relative;
  height: clamp(560px, 82vh, 780px);
  margin-top: 64px;
  overflow: hidden;
  background: var(--color-4);
}

.svc-hero-img { animation: heroZoom 2.4s var(--ease) both; }

.svc-hero-overlay {
  z-index: 1;
  background: linear-gradient(to top, rgba(0, 0, 0, .74) 0%, rgba(0, 0, 0, .28) 45%, rgba(0, 0, 0, .04) 78%);
}

.svc-hero-content {
  gap: 20px;
  padding-bottom: clamp(36px, 6vw, 88px);
}

.svc-service-label,
.svc-hero-label {
  align-self: flex-start;
  background: var(--accent);
  color: var(--accent-ink);
  border-radius: 40px;
  padding: 6px 18px;
  font-family: var(--font-primary);
  font-size: 15px;
  font-style: normal;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: 1;
}

.svc-hero-title {
  color: #fff;
  font-size: clamp(52px, 14vw, 220px);
  line-height: .9;
  letter-spacing: -.055em;
  max-width: none;
}

.svc-hero--long .svc-hero-title {
  font-size: clamp(38px, 6.6vw, 104px);
  line-height: .98;
  letter-spacing: -.045em;
  max-width: 13em;
}

.svc-hero-sub {
  color: #fff;
  font-size: clamp(20px, 2.3vw, 32px);
  line-height: 1.25;
  letter-spacing: -.015em;
  max-width: 24em;
}


/* --- Intro ------------------------------------------------ */

.svc-intro {
  padding: clamp(72px, 10vw, 150px) 0;
}

.svc-text-block {
  max-width: 1040px;
  gap: 32px;
}

.svc-text-block > p.p1:first-child {
  font-size: clamp(26px, 3.3vw, 46px);
  line-height: 1.15;
  letter-spacing: -.03em;
  color: var(--color-5);
}

.svc-text-block > p.p1:not(:first-child) {
  max-width: 44em;
  margin-left: clamp(0px, 12vw, 190px);
}

.svc-text-block.svc-text-block--h > p.p1 {
  font-size: var(--p1-size);
  line-height: 1.35;
  letter-spacing: 0;
  margin-left: 0;
  max-width: 38em;
}

.svc-text-block h2 {
  font-size: clamp(40px, 6vw, 88px);
  line-height: 1;
  letter-spacing: -.045em;
}


/* --- Etiketter ---------------------------------------------- */

.svc-section-label,
.svc-forwho-label {
  display: inline-block;
  align-self: flex-start;
  border: 1.5px solid currentColor;
  border-radius: 40px;
  padding: 5px 16px;
  opacity: 1;
  color: var(--color-5);
  font-size: 15px;
  letter-spacing: .1em;
}

.svc-forwho-label { color: #fff; }


/* --- "Vad är …?" (TeamFit) ----------------------------------- */

.svc-what {
  padding-top: clamp(64px, 9vw, 130px);
  padding-bottom: clamp(64px, 9vw, 130px);
}

.svc-what-content-col h2 {
  font-size: clamp(36px, 5vw, 72px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.svc-what-content-col .p1 { max-width: 36em; }


/* --- Vad ingår: kort ----------------------------------------- */

.svc-includes,
.svc-includes.section {   /* .section behövs för att slå sidornas egna ".xx-includes.section { padding-bottom: 0 }" */
  background: var(--color-7);
  padding: clamp(64px, 9vw, 130px) 0;
}

.svc-includes-heading {
  font-size: clamp(44px, 7vw, 104px);
  line-height: 1;
  letter-spacing: -.045em;
  margin-bottom: clamp(32px, 5vw, 64px);
}

.svc-includes-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.svc-include-item {
  display: flex;
  flex-direction: column;
  gap: 28px;
  padding: clamp(28px, 3.4vw, 48px);
  background: #fff;
  border: 0;
  border-radius: var(--radius-xl);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease);
}

.svc-include-item:last-child { border: 0; }

.svc-include-item:last-child:nth-child(odd) { grid-column: 1 / -1; }

.svc-include-item:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 48px rgba(0, 0, 0, .12);
}

.svc-include-number {
  display: grid;
  place-items: center;
  width: 60px;
  height: 60px;
  padding: 0;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-ink);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0;
  opacity: 1;
  transition: transform .5s var(--ease);
}

.svc-include-item:hover .svc-include-number { transform: rotate(360deg); }

.svc-include-body h3 {
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.1;
  letter-spacing: -.03em;
  font-weight: 500;
}


/* --- Vad ingår inte -------------------------------------------- */

.svc-excludes {
  background: #fff;
  padding: clamp(64px, 9vw, 130px) 0;
}

.svc-exclude-item {
  align-items: center;
  border-color: rgba(43, 48, 51, .14);
  transition: padding-left .4s var(--ease);
}

.svc-exclude-item:hover { padding-left: 12px; }

.svc-exclude-cross {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-ink);
  font-size: 28px;
  line-height: 1;
  opacity: 1;
}

.svc-exclude-item h3 {
  font-size: clamp(22px, 2.4vw, 32px);
  letter-spacing: -.03em;
  font-weight: 500;
}


/* --- För vem? --------------------------------------------------- */

.svc-forwho {
  position: relative;
  overflow: hidden;
  background: #000;
  padding: clamp(80px, 11vw, 170px) 0;
}

.svc-forwho-inner {
  position: relative;
  z-index: 1;
  max-width: 960px;
}

.svc-forwho-heading {
  font-size: clamp(40px, 6.4vw, 96px);
  line-height: 1;
  letter-spacing: -.045em;
}

.svc-forwho-body { color: rgba(255, 255, 255, .78); max-width: 34em; }


/* --- CTA (accentfärgad) ---------------------------------------- */

.svc-cta {
  background: var(--accent);
  color: var(--accent-ink);
  min-height: 600px;
}

.svc-cta-image {
  margin: 14px;
  border-radius: var(--radius-xl);
  overflow: hidden;
}

.svc-cta-content {
  gap: 28px;
  padding: clamp(40px, 6vw, 96px);
}

.svc-cta-content h2 {
  font-size: clamp(40px, 5.4vw, 80px);
  line-height: 1;
  letter-spacing: -.045em;
  color: inherit;
}

.svc-cta-content .p1 { color: inherit; max-width: 32ch; }

.acc-blue .svc-cta .pill {
  --pill-bg: #fff;
  --pill-fg: #000;
}


/* --- TeamFit: extra sektioner ---------------------------------- */

.tf-when { padding: clamp(64px, 9vw, 130px) 0; }

.tf-when-heading {
  font-size: clamp(40px, 6vw, 88px);
  line-height: 1;
  letter-spacing: -.045em;
  margin-bottom: clamp(28px, 4vw, 56px);
}

.tf-when-item {
  align-items: center;
  padding: clamp(24px, 3vw, 40px) 0;
  transition: padding-left .4s var(--ease);
}

.tf-when-item:hover { padding-left: 16px; }

.tf-when-item .p1 {
  font-size: clamp(22px, 2.5vw, 34px);
  line-height: 1.2;
  letter-spacing: -.025em;
  color: var(--color-5);
}

.tf-when-dash {
  color: #000;
  font-size: clamp(28px, 3vw, 44px);
  font-weight: 500;
  opacity: 1;
}

.tf-quote {
  background: var(--accent);
  color: var(--accent-ink);
  padding: clamp(80px, 12vw, 190px) 0;
}

.tf-quote-heading {
  color: inherit;
  font-size: clamp(34px, 5vw, 76px);
  line-height: 1.06;
  letter-spacing: -.045em;
  max-width: 17em;
}

.tf-quote-highlight {
  color: var(--color-3);
  background: #000;
  padding: 0 .16em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.tf-results { background: var(--color-7); padding: clamp(64px, 9vw, 130px) 0; }

.tf-results-heading {
  font-size: clamp(44px, 7vw, 104px);
  line-height: 1;
  letter-spacing: -.045em;
  margin-bottom: clamp(32px, 5vw, 64px);
}

.tf-results-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.tf-result-item {
  padding: clamp(28px, 3.4vw, 48px);
  min-height: 300px;
  border: 0;
  border-radius: var(--radius-xl);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 16px;
  transition: transform .4s var(--ease);
}

.tf-result-item:hover { transform: translateY(-6px); }

.tf-result-item:nth-child(1),
.tf-result-item:nth-child(4) { background: var(--accent); color: var(--accent-ink); }
.tf-result-item:nth-child(2),
.tf-result-item:nth-child(3) { background: #000; color: #fff; }

.tf-result-item .p1,
.tf-result-item .tf-result-title { color: inherit; }
.tf-result-item:nth-child(2) .tf-result-title,
.tf-result-item:nth-child(3) .tf-result-title { color: var(--color-3); }

.tf-result-title {
  font-size: clamp(28px, 3.4vw, 46px);
  line-height: 1.02;
  letter-spacing: -.04em;
  font-weight: 500;
}


/* ============================================================
   TEXTHERO (page-hero, erbjudande, nischad)
   ============================================================ */

.texthero {
  position: relative;
  overflow: hidden;
  background: var(--accent);
  color: var(--accent-ink);
  margin-top: 64px;
  padding: clamp(72px, 10vw, 140px) 0 clamp(48px, 6vw, 88px);
}

.texthero .container,
.er-hero-inner,
.ni-hero-inner { position: relative; z-index: 1; }

.texthero .page-hero-title,
.er-hero-title,
.ni-hero-title {
  color: inherit;
  font-size: clamp(44px, 7.2vw, 116px);
  line-height: .96;
  letter-spacing: -.055em;
  max-width: 12em;
  margin-bottom: 28px;
}

.texthero .page-hero-label,
.er-hero-label,
.ni-hero-label {
  display: inline-block;
  align-self: flex-start;
  border: 1.5px solid currentColor;
  border-radius: 40px;
  padding: 5px 16px;
  margin-bottom: 28px;
  color: inherit;
  opacity: 1;
  font-size: 15px;
}

.texthero .page-hero-sub,
.er-hero-sub,
.ni-hero-sub {
  color: inherit;
  opacity: .85;
  font-size: clamp(20px, 2.1vw, 30px);
  line-height: 1.25;
  letter-spacing: -.015em;
  max-width: 24em;
}

.er-hero-inner,
.ni-hero-inner { max-width: 1280px; padding: 0 40px; margin: 0 auto; }

.ip-hero { background: var(--color-7); color: var(--color-4); }
.ip-hero.texthero { padding-bottom: clamp(48px, 6vw, 80px); }

.kt-hero { padding-bottom: clamp(64px, 9vw, 120px); }


/* ============================================================
   FEATURE-SEKTIONER (varför LeadSense, process)
   ============================================================ */

.feat {
  padding: clamp(64px, 9vw, 130px) 0;
  overflow: hidden;
}

.feat { --c: var(--accent); --c-ink: var(--accent-ink); }

.feat-inner { gap: clamp(40px, 7vw, 110px); }

.feat-number {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--c, var(--accent));
  color: var(--c-ink, var(--accent-ink));
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0;
  opacity: 1;
}

.feat-text { gap: 24px; }

.feat-text h2 {
  font-size: clamp(36px, 4.6vw, 68px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.feat-img {
  position: relative;
  overflow: visible;
  border-radius: 0;
  background: none;
}

.feat-img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--c, var(--accent));
  border-radius: var(--radius-xl);
  transform: translate(22px, 22px);
  transition: transform .6s var(--ease);
}

.feat-inner--img-left .feat-img::before,
.feat-inner.vl-feature-inner--img-left .feat-img::before,
.feat-inner.pr-step-inner--img-left .feat-img::before { transform: translate(-22px, 22px); }

.feat-img:hover::before { transform: translate(0, 0); }

.feat-img img {
  position: relative;
  z-index: 1;
  border-radius: var(--radius-xl);
}

.vl-closing { padding: clamp(80px, 11vw, 170px) 0; }

.vl-closing-heading {
  font-size: clamp(40px, 6vw, 88px);
  line-height: 1;
  letter-spacing: -.045em;
}

.vl-closing-inner { max-width: 960px; }


/* ============================================================
   CTA-BAND (process, partners) – gult band
   ============================================================ */

.cta-band { padding: clamp(72px, 10vw, 150px) 0; }

.cta-band h2 {
  font-size: clamp(38px, 5.2vw, 78px);
  line-height: 1;
  letter-spacing: -.045em;
  max-width: 12em;
}

.cta-band .pill { flex-shrink: 0; }


/* ============================================================
   PARTNERS
   ============================================================ */

.pt-content { padding: clamp(56px, 8vw, 110px) 0; }

.pt-section-inner { grid-template-columns: 96px 1fr; gap: clamp(24px, 5vw, 72px); }

.pt-section-label {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  padding: 0;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-ink);
  font-size: 22px;
  font-weight: 500;
  opacity: 1;
}


.pt-section-text-col h2 {
  font-size: clamp(32px, 4vw, 60px);
  line-height: 1.04;
  letter-spacing: -.04em;
}

.pt-section-text-col .p1 { max-width: 40em; }

.pt-stats { padding: clamp(80px, 11vw, 170px) 0; }

.pt-stats-inner { grid-template-columns: minmax(280px, 0.9fr) 1.1fr; }

.pt-stats-big {
  font-size: clamp(120px, 17vw, 260px);
  letter-spacing: -.06em;
}

.pt-stats-sub { color: rgba(255, 255, 255, .75); }

.pt-stats-heading {
  font-size: clamp(32px, 4vw, 60px);
  line-height: 1.04;
  letter-spacing: -.04em;
}


/* ============================================================
   OM OSS – teamgrid
   ============================================================ */

.oo-transition { padding: clamp(64px, 9vw, 130px) 0; }

.oo-transition-text {
  max-width: 1000px;
  font-size: clamp(24px, 3vw, 42px);
  line-height: 1.18;
  letter-spacing: -.03em;
  color: var(--color-5);
}

.oo-team { padding: clamp(56px, 8vw, 110px) 0; }

.oo-team-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(40px, 5vw, 72px) 28px;
}

.oo-member {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 0;
  border: 0;
}

.oo-member:last-child { border: 0; }

.oo-member-img {
  position: relative;
  aspect-ratio: 4 / 5;
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--color-4);
}

.oo-member-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .9s var(--ease);
}

.oo-member:hover .oo-member-img img { transform: scale(1.05); }


.oo-member-info { padding-top: 0; gap: 10px; }

.oo-member-name {
  font-size: clamp(26px, 2.6vw, 36px);
  font-weight: 500;
  letter-spacing: -.03em;
}

.oo-member-role {
  align-self: flex-start;
  border: 1.5px solid var(--color-4);
  border-radius: 40px;
  padding: 3px 12px;
  opacity: 1;
  font-size: 13px;
}

.oo-cta { background: var(--accent); color: var(--accent-ink); padding: clamp(80px, 11vw, 170px) 0; }

.oo-cta-heading {
  color: #000;
  font-size: clamp(38px, 5.6vw, 84px);
  line-height: 1;
  letter-spacing: -.045em;
  max-width: 12em;
}


/* ============================================================
   FORMULÄR (kontakt, nätverk, erbjudande)
   ============================================================ */

.kt-input,
.nt-input,
.er-input {
  background: var(--color-7);
  border: 2px solid transparent;
  border-radius: 18px;
  padding: 16px 20px;
  font-size: 18px;
  color: var(--color-4);
  transition: border-color .25s, background-color .25s;
}

.nt-input { background: #fff; }

.kt-input:focus,
.nt-input:focus,
.er-input:focus {
  border-color: var(--color-5);
  box-shadow: none;
}

.kt-input::placeholder,
.nt-input::placeholder,
.er-input::placeholder { color: rgba(43, 48, 51, .45); }

.kt-label,
.nt-label,
.er-label { opacity: .75; font-size: 14px; letter-spacing: .08em; text-transform: uppercase; }

.kt-submit,
.nt-submit,
.er-submit { margin-top: 12px; }

.kt-contact,
.er-form-section { padding: clamp(56px, 8vw, 120px) 0; }

.kt-info-col {
  align-self: start;
  gap: 32px;
  padding: clamp(28px, 3.4vw, 44px);
  border-radius: var(--radius-xl);
  background: var(--accent);
  color: var(--accent-ink);
}

.kt-info-label { color: inherit; opacity: .75; }
.kt-info-value,
.kt-info-value a { color: inherit; }
.kt-info-value a { border-bottom-color: currentColor; }

.kt-network-link a { border-bottom-width: 2px; }

.nt-hero-title,
.pt-hero-title { max-width: 14em; }

.nt-main .nt-intro-col .p1:first-child {
  font-size: clamp(24px, 2.6vw, 36px);
  line-height: 1.2;
  letter-spacing: -.025em;
  color: var(--color-5);
}

.er-value-inner { gap: 20px; }

.er-value-item {
  padding: clamp(28px, 3vw, 40px);
  border-radius: var(--radius-xl);
  min-height: 300px;
  justify-content: space-between;
  transition: transform .4s var(--ease);
}

.er-value-item:hover { transform: translateY(-6px); }
.er-value-item:nth-child(1),
.er-value-item:nth-child(3) { background: var(--accent); color: var(--accent-ink); }
.er-value-item:nth-child(2) { background: #000; color: #fff; }
.er-value-item .p1,
.er-value-item h3 { color: inherit; }

.er-value-icon {
  color: inherit;
  opacity: 1;
  font-size: clamp(56px, 6vw, 88px);
  font-weight: 500;
  letter-spacing: -.05em;
}

.er-value-item h3 {
  font-size: clamp(24px, 2.4vw, 32px);
  letter-spacing: -.03em;
  font-weight: 500;
}

.er-form-lead h2 {
  font-size: clamp(36px, 4.6vw, 68px);
  line-height: 1.02;
  letter-spacing: -.045em;
}


/* ============================================================
   NISCHAD
   ============================================================ */

.ni-hero { background: var(--accent); }

/* Partnerlogotypen är färgad – lägg den på en vit platta så den syns mot blått */
.ni-partner-logo {
  box-sizing: content-box;
  height: 54px;
  padding: 16px 26px;
  border-radius: 20px;
  background: #fff;
}

.ni-options { background: var(--color-7); padding: clamp(56px, 8vw, 110px) 0; }
.ni-options-inner { gap: 20px; }

.ni-option,
.ni-option:last-child {
  padding: clamp(28px, 3.6vw, 52px);
  border: 0;
  border-radius: var(--radius-xl);
  min-height: 420px;
}

.ni-option:nth-child(1) { background: var(--accent); color: var(--accent-ink); }
.ni-option:nth-child(2) { background: #000; color: #fff; }
.ni-option .p1,
.ni-option-number,
.ni-code-hint { color: inherit; opacity: 1; }
.ni-option-number { font-size: 22px; font-weight: 500; opacity: .8; }
.ni-code-hint { opacity: .75; }
.ni-option:nth-child(2) .pill {
  --pill-bg: var(--color-3);
  --pill-fg: #000;
  --pill-dot: #000;
  --pill-dot-fg: var(--color-3);
}

.ni-option h2 {
  font-size: clamp(32px, 3.8vw, 56px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.ni-why { padding: clamp(72px, 10vw, 150px) 0; }

.ni-why-inner h2 {
  font-size: clamp(38px, 5.4vw, 80px);
  line-height: 1;
  letter-spacing: -.045em;
  max-width: 14em;
}


/* ============================================================
   TACK
   ============================================================ */

.tk-main {
  position: relative;
  overflow: hidden;
  background: var(--color-3);
}

.tk-inner { position: relative; z-index: 1; max-width: 900px; }

.tk-icon { background: #000; color: var(--color-3); width: 88px; height: 88px; font-size: 40px; }

.tk-heading {
  font-size: clamp(48px, 9vw, 130px);
  line-height: .94;
  letter-spacing: -.055em;
}

.tk-body { opacity: 1; color: #000; font-size: clamp(20px, 2vw, 28px); line-height: 1.25; }


/* ============================================================
   INTEGRITETSPOLICY
   ============================================================ */

.ip-content { padding: clamp(48px, 7vw, 100px) 0; }
.ip-content-inner { max-width: 860px; }


/* ============================================================
   MOBIL
   ============================================================ */

@media (max-width: 1024px) {
  .oo-team-grid { grid-template-columns: repeat(2, 1fr); }
  .pt-stats-inner { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {

  .svc-hero { height: clamp(520px, 78vh, 640px); }

  .svc-text-block > p.p1:not(:first-child) { margin-left: 0; }

  .svc-includes-grid,
  .tf-results-grid { grid-template-columns: 1fr; }

  .svc-cta { min-height: 0; }
  .svc-cta-image { margin: 12px; height: 300px; }

  .er-hero-inner,
  .ni-hero-inner { padding: 0 20px; }

  .feat-img::before { transform: translate(12px, 12px); }
  .feat-inner--img-left .feat-img::before,
  .feat-inner.vl-feature-inner--img-left .feat-img::before,
  .feat-inner.pr-step-inner--img-left .feat-img::before { transform: translate(12px, 12px); }

  .pt-section-inner { grid-template-columns: 1fr; gap: 20px; }
  .pt-section-label { width: 52px; height: 52px; font-size: 18px; }

  .oo-team-grid { grid-template-columns: 1fr; }

  .kt-info-col { order: -1; }

  .er-value-item,
  .ni-option,
  .ni-option:last-child { min-height: 0; }

  .er-value-inner { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .svc-hero-img,
  .svc-hero-content > *,
  .texthero .container > *,
  .er-hero-inner > *,
  .ni-hero-inner > *,
  .tk-inner > * { animation: none; }

  .js .reveal { opacity: 1; transform: none; transition: none; }
  .hl { background-size: 100% .5em; transition: none; }
  .px { transform: none !important; }
}