/* ═══ MALL: Turbo (turbo) — port av TemplatesJungle Turbo (Bootstrap 5 HTML) till mall-systemet. Design only; alla komponenter/sektioner bevarade. Scopat [data-template="turbo"]. Licens: gratisversionen kräver credit-länk i footern (behållen). ═══ */

/* ═══ MALL: Turbo (turbo) — EN ENDA FIL i fyra avsnitt ═══
   Port av TemplatesJungle "Turbo" (Bootstrap 5.3 / _ref/turbo/style.css) till mallsystemet.
   1) BAS: tokens, body/typografi, utilities (.tb-*), knappsystem (.tb-btn + delade .btn).
   2) CHROME: header/nav/dropdown/offcanvas/footer/mobilbar (äger --tb-header-h).
   3) STARTSIDA: .tb-hero … .tb-cta-band, .tb-icon-link (en deklaration per sak).
   4) INRE SIDOR: delade styles.css-klasser (subhero, kort, FAQ, formulär, CTA-strip …).
   Typsnitten (Oswald, Nunito Sans) självhostas via next/font/local (woff2 i app/fonts/) i
   app/layout.tsx (--next-font-oswald / --next-font-nunito-sans) — ingen @import/Google Fonts här, eftersom
   layout.tsx länkar den här filen på ALLA mallars sidor.
   Allt scopat under [data-template="turbo"] — inga bara selektorer får förekomma här.
   Publika utilities som ingår i kontraktet men som markupen inte använder just nu:
   .tb-h1–.tb-h6, .tb-btn__arrow.
   Token-blocket ligger på html[data-template="turbo"] (0,1,1) för att slå :root-temat (0,1,0)
   som layout injicerar EFTER all CSS. Klasser för Turbo-specifik markup: prefix .tb-. */

/* ─────────────────────────────────────────────────────────────
   1. TOKEN CONTRACT (enda variabelnamnen som får användas i den här filen)
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] {
  /* Självhostade via next/font/local (app/layout.tsx); namnen efter är bara fallback */
  --tb-heading-font: var(--next-font-oswald), 'Oswald', sans-serif;
  --tb-body-font: var(--next-font-nunito-sans), 'Nunito Sans', sans-serif;
  --tb-heading-color: #1F1F1F; --tb-accent: #F6452D; --tb-accent-hover: #ea422b; --tb-accent-rgb: 246,69,45;
  --tb-body-color: #757575;   /* Turbo #7D7D7D, nudged to pass WCAG AA — visually identical */
  --tb-black: #1F1F1F; --tb-dark: #101010; --tb-light: #FFFFFF; --tb-gray: #E4E4E4; --tb-gray-dark: #ABABAB; --tb-bg-soft: #F6F6F6;
  --tb-border: 2px solid var(--tb-gray); --tb-shadow-review: 0 12px 90px rgba(12,12,12,0.06);
  /* template-system tokens consumed by styles.css */
  --bg: #FFFFFF; --bg-soft: #F6F6F6; --ink: #1F1F1F; --ink-2: #757575; --muted: #757575; /* text: 4.6:1 på vitt — #ABABAB är bara linje/dekor (--line-2, --tb-gray-dark) */ --line: #E4E4E4; --line-2: #ABABAB; --star: #F6452D;
  --brand: #F6452D; --brand-deep: #ea422b; --brand-rgb: 246,69,45;
  --ff-heading: var(--tb-heading-font); --ff-body: var(--tb-body-font);
  --radius: 0px; --radius-lg: 0px; --radius-sm: 0px;
  --btn-radius: 0px; --btn-pad: 1.05rem 2.4rem; --btn-weight: 600; --btn-transform: uppercase; --btn-tracking: 0.075rem;
  /* Foton (egna, ej Turbos stock) — byts på ETT ställe per kund. Startsidans hero tar
     första tjänstekortets Sanity-bild först (TurboHome) och faller tillbaka på --tb-photo-hero. */
  --tb-photo-hero: url("/assets/img/services/billackering2.JPG");
  --tb-photo-subhero: url("/assets/img/services/bild2.jpg");
  --tb-photo-article: url("/assets/img/services/bild3.jpg");
  --tb-photo-cta: url("/assets/img/services/bild2.jpg");
  background: #fff;
  color: var(--tb-body-color);
}
/* Befintliga systemtokens ur styles.css/layout (inte nya namn) som Turbo måste neutralisera:
   containerbredd = .tb-container, inga kortglöd/knappskuggor (Turbo är platt med 2px-linjer). */
html[data-template="turbo"] {
  --container: 1320px;
  --shadow-card: none;
  --shadow-cta: none;
}

/* ─────────────────────────────────────────────────────────────
   2. BODY / GRUNDTYPOGRAFI (Turbo: Nunito Sans 18px, #7D7D7D→#757575)
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] body {
  background: #fff;
  color: var(--tb-body-color);
  font-family: var(--tb-body-font);
  font-size: 18px;
  line-height: 1.75;
}
@media (max-width: 767.98px) {
  [data-template="turbo"] body { font-size: 17px; }
}

/* Rubriker (Turbo style.css 89-125): Oswald, versaler, letter-spacing .0725rem, #1F1F1F;
   h1-h3 600, h4-h6 500. .tb-h1–.tb-h6 = Bootstraps .h1–.h6-motsvarigheter.
   Marginaler sätts INTE här (delade komponenter positionerar sina rubriker själva).
   Storlekar lämnas åt styles.css/turbo.css utom h5/h6 som styles.css inte stilar alls. */
[data-template="turbo"] h1, [data-template="turbo"] h2, [data-template="turbo"] h3,
[data-template="turbo"] h4, [data-template="turbo"] h5, [data-template="turbo"] h6,
[data-template="turbo"] .tb-h1, [data-template="turbo"] .tb-h2, [data-template="turbo"] .tb-h3,
[data-template="turbo"] .tb-h4, [data-template="turbo"] .tb-h5, [data-template="turbo"] .tb-h6 {
  font-family: var(--tb-heading-font);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.0725rem;
  color: var(--tb-heading-color);
  line-height: 1.15;
}
[data-template="turbo"] h4, [data-template="turbo"] h5, [data-template="turbo"] h6,
[data-template="turbo"] .tb-h4, [data-template="turbo"] .tb-h5, [data-template="turbo"] .tb-h6 {
  font-weight: 500;
}
[data-template="turbo"] h5, [data-template="turbo"] .tb-h5 { font-size: 1.25rem; }
[data-template="turbo"] h6, [data-template="turbo"] .tb-h6 { font-size: 1rem; }

/* Markering */
[data-template="turbo"] ::selection { background: var(--tb-accent); color: #fff; }

/* ─────────────────────────────────────────────────────────────
   3. UTILITIES (.tb-*) — översatta Bootstrap-/Turbo-hjälpklasser
   ───────────────────────────────────────────────────────────── */
/* .container (xxl 1320px) — 24px gutter ersätter Bootstraps 12px */
[data-template="turbo"] .tb-container {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 24px;
}
@media (max-width: 520px) { [data-template="turbo"] .tb-container { padding: 0 18px; } }
@media (max-width: 380px) { [data-template="turbo"] .tb-container { padding: 0 16px; } }

/* .header-top — Turbos eyebrow (accent, versaler, glest spårad) */
[data-template="turbo"] .tb-header-top {
  font-family: var(--tb-body-font);
  color: var(--tb-accent);
  text-transform: uppercase;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.28125rem;
}

/* .display-1 / -4 / -5 — Bootstrap-skalor; Turbo-rubriker är Oswald 600 versaler */
[data-template="turbo"] .tb-display-1,
[data-template="turbo"] .tb-display-4,
[data-template="turbo"] .tb-display-1 { font-size: clamp(2.6rem, 1.625rem + 4.5vw, 5rem); }
[data-template="turbo"] .tb-display-4 { font-size: clamp(2.1rem, 1.475rem + 2.7vw, 3.5rem); }

/* .padding-large (Turbo 26.13rem/14.06rem) — nedskalad: heron bär riktigt innehåll och
   den fasta headern är ~92px hög. .padding-medium = 9rem/9rem (5rem/5rem mobil). */
[data-template="turbo"] .tb-padding-medium { padding: 9rem 0; }
@media (max-width: 767.98px) {
  [data-template="turbo"] .tb-padding-medium { padding: 5rem 0; }
}

/* Linjer — Turbo --bs-border-width 2px #E4E4E4. .tb-border-end släpps under 768px
   (staplade kolumner ska inte bära en högerlinje — PORT-SPEC §19.10). */
[data-template="turbo"] .tb-border-end { border-right: 2px solid var(--tb-gray); }
[data-template="turbo"] .tb-border-bottom { border-bottom: 2px solid var(--tb-gray); }
[data-template="turbo"] .tb-border-top { border-top: 2px solid var(--tb-gray); }
@media (max-width: 767.98px) {
  [data-template="turbo"] .tb-border-end { border-right: 0; }
}

/* Text-utilities (Bootstrap använder !important på dessa — behålls så de vinner mot kontextregler) */
[data-template="turbo"] .tb-text-white { color: #fff !important; }
[data-template="turbo"] .tb-text-center { text-align: center !important; }

/* Mörk yta (foto-band / #101010): vit text, rubriker vita, eyebrow förblir accent.
   Används som kontextklass — se även .btn--ghost-varianten i §5. */
[data-template="turbo"] .tb-on-dark { color: #fff; }
[data-template="turbo"] .tb-on-dark h1, [data-template="turbo"] .tb-on-dark h2, [data-template="turbo"] .tb-on-dark h3,
[data-template="turbo"] .tb-on-dark h4, [data-template="turbo"] .tb-on-dark h5, [data-template="turbo"] .tb-on-dark h6,
[data-template="turbo"] .tb-on-dark .tb-h1, [data-template="turbo"] .tb-on-dark .tb-h2, [data-template="turbo"] .tb-on-dark .tb-h3,
[data-template="turbo"] .tb-on-dark .tb-h4, [data-template="turbo"] .tb-on-dark .tb-h5, [data-template="turbo"] .tb-on-dark .tb-h6 { color: #fff; }
[data-template="turbo"] .tb-on-dark p { color: rgba(255, 255, 255, 0.8); }
[data-template="turbo"] .tb-on-dark .tb-icon-link { color: #fff; }

/* ─────────────────────────────────────────────────────────────
   4. KNAPPAR — .tb-btn (port av Bootstrap .btn + Turbo style.css 174-222)
   Turbo: versaler, letter-spacing .075rem, 600, radius 0, 2px kant, pil-ikon efter texten.
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .tb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--btn-pad);
  min-height: 44px;
  font-family: var(--tb-body-font);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  border: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: inherit;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(var(--tb-accent-rgb), 0.18);
}
[data-template="turbo"] .tb-btn:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(var(--tb-accent-rgb), 0.5);
}
/* Navbar-storlek ("Get pro" px-3 py-2) */

/* .btn-primary */
[data-template="turbo"] .tb-btn--primary {
  color: #fff;
  background: var(--tb-accent);
  border-color: var(--tb-accent);
}
[data-template="turbo"] .tb-btn--primary:hover,
[data-template="turbo"] .tb-btn--primary:active {
  color: #fff;
  background: var(--tb-accent-hover);
  border-color: var(--tb-accent-hover);
}

/* .btn-outline-primary — Turbo använder den bara på mörka ytor: vit text + vit 2px kant */
[data-template="turbo"] .tb-btn--outline {
  color: #fff;
  background: transparent;
  border-color: #fff;
}
/* Ljus-yte-variant: mörk text + mörk kant */
[data-template="turbo"] .tb-btn--outline:hover,
[data-template="turbo"] .tb-btn--outline:active {
  color: #fff;
  background: var(--tb-accent);
  border-color: var(--tb-accent);
}

/* Pil efter etiketten (iconify tabler:arrow-right 16px, margin-bottom -3px).
   Markup: <span class="tb-btn__arrow"><Icon name="arrow-right" size={16}/></span>
   eller <svg class="tb-btn__arrow" …>. En bar <Icon> direkt i knappen får samma marginal. */
[data-template="turbo"] .tb-btn__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 0.5rem;
  flex: 0 0 auto;
  color: inherit;
}
[data-template="turbo"] .tb-btn__arrow svg { display: block; width: 16px; height: 16px; }
[data-template="turbo"] .tb-btn > svg { margin-left: 0.5rem; flex: 0 0 auto; }

/* ─────────────────────────────────────────────────────────────
   5. DELADE .btn (cta-button.tsx, formulär, FAQ, CTA-strip, mobile-call-bar …)
   Alla befintliga <a class="btn btn--primary|btn--ghost"> ska se ut som Turbo.
   Slår themeCss (.btn--primary (0,1,0)) och skins ([data-skin] … (0,2–4,0)).
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .btn {
  border-radius: 0;
  text-transform: uppercase;
  letter-spacing: 0.075rem;
  font-weight: 600;
  font-family: var(--tb-body-font);
  font-size: 1rem;
  line-height: 1.5;
  box-shadow: none;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
[data-template="turbo"] .btn:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(var(--tb-accent-rgb), 0.5);
}
[data-template="turbo"] .btn--primary {
  background: var(--tb-accent);
  border: 2px solid var(--tb-accent);
  color: #fff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-template="turbo"] .btn--primary:hover,
[data-template="turbo"] .btn--primary:active {
  background: var(--tb-accent-hover);
  border-color: var(--tb-accent-hover);
  color: #fff;
  transform: none;
  box-shadow: none;
}
[data-template="turbo"] .btn--ghost {
  background: transparent;
  color: var(--tb-black);
  border: 2px solid var(--tb-black);
  box-shadow: none;
}
[data-template="turbo"] .btn--ghost:hover,
[data-template="turbo"] .btn--ghost:active {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: #fff;
  transform: none;
}
/* Pil-glyfen (→ / ↗ / ←): ingen cirkel — bara tecknet i currentColor, som Turbos inline-ikon.
   display sätts INTE (styles.css döljer .btn__arrow ≤980px — den kompaktionen behålls). */
[data-template="turbo"] .btn--primary .btn__arrow,
[data-template="turbo"] .btn--ghost .btn__arrow,
[data-template="turbo"] .cta-strip .btn--primary .btn__arrow,
[data-template="turbo"] .cta-strip .btn--ghost .btn__arrow {
  width: auto;
  height: auto;
  background: transparent;
  color: inherit;
  border-radius: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1;
}
/* Mörk yta: outline-knappen blir vit (Turbo .btn-outline-primary) och hovrar till accent */
[data-template="turbo"] .tb-on-dark .btn--ghost { color: #fff; border-color: #fff; }
[data-template="turbo"] .tb-on-dark .btn--ghost:hover,
[data-template="turbo"] .tb-on-dark .btn--ghost:active { color: #fff; border-color: var(--tb-accent); background: var(--tb-accent); }

/* ─────────────────────────────────────────────────────────────
   6. .tb-icon-link (port av a.icon-link, style.css 499-515) deklareras EN gång i
   startside-avsnittet (3. TJÄNSTER): absolut 1px accent-understreck 20% → 80%.
   ───────────────────────────────────────────────────────────── */

/* =====================================================================
   TURBO — CHROME: header / nav / dropdown / offcanvas / footer / mobile-call-bar
   Port av TemplatesJungle "Turbo" (nav.navbar.fixed-top + #footer) till
   mallsystemet. Källa för värdena: _ref/turbo/style.css + Bootstrap 5.3-defaults.

   ALLT är scopat under [data-template="turbo"] (layout länkar alla mallars CSS
   på alla sidor). Tokens (--tb-*) definieras EN gång i token-blocket överst och
   refereras bara här. Enda variabeln detta avsnitt äger: --tb-header-h.
   ===================================================================== */

/* Headern är position:fixed och transparent. Sidorna (hero/subhero) lägger
   själva top-padding motsvarande denna höjd — ingen spacer renderas. */
html[data-template="turbo"] {
  --tb-header-h: 100px;
  /* Ankarhopp (#kundformular, #process, #form, #relaterat, FAQ-id:n …) ska landa
     under den fasta headern — scroll-padding på scroll-behållaren täcker alla mål. */
  scroll-padding-top: calc(var(--tb-header-h) + 16px);
}
@media (max-width: 991px) {
  html[data-template="turbo"] { --tb-header-h: 72px; }
}
/* styles.css ger blogg-h2 en egen scroll-margin (120px) som annars skulle adderas
   till scroll-padding ovan → nollställ under Turbo. */
[data-template="turbo"] .blog-article .blog-main h2[id] { scroll-margin-top: 0; }

/* ---------------------------------------------------------------------
   HEADER (Turbo: nav.navbar.fixed-top.p-4 — transparent över mörk hero)
   --------------------------------------------------------------------- */
[data-template="turbo"] .tb-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  background: transparent;
  color: var(--tb-light);
  transition: background-color 0.25s ease, box-shadow 0.25s ease;
}
/* Scrollad (script.js: >= 200px → .bg-black). Vi går solid tidigare så headern
   alltid är läsbar över ljusa sektioner på undersidor med kort subhero. */
[data-template="turbo"] .tb-header.is-stuck {
  background: var(--tb-dark);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
}
/* Sidor utan mörkt band överst (/tack och /404 använder .hero på ljus yta): headern
   måste vara solid redan vid laddning, annars är vit nav/CTA/burgare osynlig på #F6F6F6. */
html[data-template="turbo"] body:has(main > .hero:first-child) .tb-header {
  background: var(--tb-dark);
}
[data-template="turbo"] .tb-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem;
  height: var(--tb-header-h);
  width: 100%;
  max-width: none; /* Turbo: .navbar.container-fluid.p-4 — full bredd, loggan i ytterkant */
  margin: 0;
  padding: 0 max(24px, env(safe-area-inset-right, 0px)) 0 max(24px, env(safe-area-inset-left, 0px));
}
@media (max-width: 520px) { [data-template="turbo"] .tb-header__inner { padding-left: max(18px, env(safe-area-inset-left, 0px)); padding-right: max(18px, env(safe-area-inset-right, 0px)); } }
@media (max-width: 380px) { [data-template="turbo"] .tb-header__inner { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); } }
/* 992–1099: inline-nav + logga + CTA ska få plats → mindre logga och kortare padding */
@media (min-width: 992px) {
  [data-template="turbo"] .tb-header__inner { padding: 0 max(1.25rem, env(safe-area-inset-right, 0px)) 0 max(1.5rem, env(safe-area-inset-left, 0px)); }
}
@media (min-width: 1200px) {
  [data-template="turbo"] .tb-header__inner { padding: 0 max(2rem, env(safe-area-inset-right, 0px)) 0 max(4.5rem, env(safe-area-inset-left, 0px)); }
}
@media (min-width: 1400px) {
  [data-template="turbo"] .tb-header__inner { padding: 0 max(2.5rem, env(safe-area-inset-right, 0px)) 0 max(6rem, env(safe-area-inset-left, 0px)); }
}

/* Märke / logga */
[data-template="turbo"] .tb-brand {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  padding: 0.3125rem 0;
  color: var(--tb-light);
  text-decoration: none;
}
[data-template="turbo"] .tb-brand__logo {
  display: block;
  height: 44px;
  width: auto;
  object-fit: contain;
}
@media (min-width: 992px) {
  [data-template="turbo"] .tb-brand__logo { height: 60px; }
}
@media (min-width: 1200px) {
  [data-template="turbo"] .tb-brand__logo { height: 76px; }
}
/* Turbo byter till en ljus logga i headern. Saknas logoOnDark i Sanity läggs
   kundens vanliga logga på en vit platta så den läses mot den mörka heron. */
/* Saknas logoOnDark i Sanity: den mörka loggan renderas vit (Turbo main-logo-light) direkt på
   den mörka headern — ingen platta. Laddas en ljus logga upp i Studio används den i stället. */
[data-template="turbo"] .tb-brand--plate {
  background: transparent;
  padding: 0;
}
[data-template="turbo"] .tb-brand--plate .tb-brand__logo { height: 40px; filter: brightness(0) invert(1); }
@media (min-width: 992px) {
  [data-template="turbo"] .tb-brand--plate .tb-brand__logo { height: 52px; }
}
[data-template="turbo"] .tb-brand__text {
  display: flex;
  flex-direction: column;
  line-height: 1.05;
}
[data-template="turbo"] .tb-brand__name {
  font-family: var(--tb-heading-font);
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-light);
}
[data-template="turbo"] .tb-brand__tag {
  margin-top: 4px;
  font-family: var(--tb-body-font);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.28125rem;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
}

/* Inline-nav (Turbo: .navbar-nav — synlig ≥ 992px, annars offcanvas) */
[data-template="turbo"] .tb-nav {
  display: none;
  align-items: center;
  justify-content: flex-end;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding-right: 1rem;
}
@media (min-width: 992px) {
  [data-template="turbo"] .tb-nav { display: flex; }
}
@media (min-width: 1400px) {
  [data-template="turbo"] .tb-nav { justify-content: center; }
}
[data-template="turbo"] .tb-nav__item {
  position: relative;
  display: flex;
  align-items: center;
}
/* .nav-link.text-white.text-uppercase.mx-2.px-3 */
[data-template="turbo"] .tb-nav__link {
  display: block;
  padding: 0.5rem 0.6rem;
  margin: 0 0.1rem;
  font-family: var(--tb-body-font);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.75;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: var(--tb-light);
  text-decoration: none;
  border-radius: 0;
  white-space: nowrap;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-nav__link:hover,
[data-template="turbo"] .tb-nav__link:focus-visible,
[data-template="turbo"] .tb-nav__link[aria-current="page"],
[data-template="turbo"] .tb-nav__item--has-menu.is-open > .tb-nav__link {
  background: rgba(255, 255, 255, 0.35);
  color: var(--tb-light);
  outline: none;
}
/* Turbos fulla mått (mx-2 px-3, .9375rem) först när raden faktiskt får plats;
   < 1400: kompakt, 1400–1599: mellan, >= 1600: Turbo-fullt. Annars spiller flex-end-navet ut under loggan. */
@media (min-width: 992px) and (max-width: 1199.98px) {
  [data-template="turbo"] .tb-nav__link { padding: 0.5rem 0.5rem; margin: 0; font-size: 0.78rem; }
}
@media (min-width: 1400px) {
  [data-template="turbo"] .tb-nav__link { padding: 0.5rem 0.75rem; margin: 0 0.15rem; font-size: 0.875rem; }
}
@media (min-width: 1600px) {
  [data-template="turbo"] .tb-nav__link { padding: 0.5rem 1rem; margin: 0 0.5rem; font-size: 0.9375rem; }
}
[data-template="turbo"] .tb-nav__link--parent {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
/* Bootstrap .dropdown-toggle::after (CSS-caret) */
[data-template="turbo"] .tb-nav__caret {
  display: inline-block;
  margin-left: 0.4em;
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
  transition: transform 0.2s ease;
}

/* Dropdown (Turbo: .dropdown-menu bg #1F1F1F, radius 0; .dropdown-item vit) */
[data-template="turbo"] .tb-nav__dropdown {
  position: absolute;
  top: calc(100% + 0.125rem);
  left: 0.5rem;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  min-width: 14rem;
  margin: 0;
  padding: 0.5rem 0;
  background: var(--tb-black);
  border: 2px solid rgba(0, 0, 0, 0.175);
  border-radius: 0;
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}
/* Osynlig brygga så musen kan gå från länken ned i panelen utan att den stängs. */
[data-template="turbo"] .tb-nav__dropdown::before {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  right: 0;
  height: 10px;
}
/* Hover-öppning bara på enheter med riktig pekare (touch styrs av tap/is-open). */
@media (hover: hover) {
  [data-template="turbo"] .tb-nav__item--has-menu:hover .tb-nav__dropdown,
  [data-template="turbo"] .tb-nav__item--has-menu:focus-within .tb-nav__dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }
  [data-template="turbo"] .tb-nav__item--has-menu:hover .tb-nav__caret,
  [data-template="turbo"] .tb-nav__item--has-menu:focus-within .tb-nav__caret {
    transform: rotate(180deg);
  }
}
[data-template="turbo"] .tb-nav__item--has-menu.is-open .tb-nav__dropdown {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}
[data-template="turbo"] .tb-nav__item--has-menu.is-open .tb-nav__caret {
  transform: rotate(180deg);
}
[data-template="turbo"] .tb-nav__dropitem {
  display: flex;
  align-items: center;
  min-height: 44px;
  width: 100%;
  padding: 0.5rem 1rem;
  font-family: var(--tb-body-font);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.75;
  color: var(--tb-light);
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background: transparent;
  border: 0;
  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-nav__dropitem:hover,
[data-template="turbo"] .tb-nav__dropitem:focus-visible {
  background: rgba(255, 255, 255, 0.12);
  color: var(--tb-light);
  outline: none;
}
[data-template="turbo"] .tb-nav__dropitem:active,
[data-template="turbo"] .tb-nav__dropitem.is-active {
  background: var(--tb-gray-dark);
  color: var(--tb-light);
}
[data-template="turbo"] .tb-nav__dropitem--all {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  font-weight: 600;
}

/* Högerzon: telefon + CTA (outline) + burgare */
[data-template="turbo"] .tb-header__right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
  margin-left: auto;
}
@media (min-width: 992px) {
  [data-template="turbo"] .tb-header__right { margin-left: 0; }
}
[data-template="turbo"] .tb-header__phone {
  display: none;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.5rem;
  font-family: var(--tb-body-font);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.75;
  letter-spacing: 0.075rem;
  color: var(--tb-light);
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 0.15s ease-in-out;
}
@media (min-width: 1400px) {
  [data-template="turbo"] .tb-header__phone { display: inline-flex; }
}
[data-template="turbo"] .tb-header__phone:hover,
[data-template="turbo"] .tb-header__phone:focus-visible {
  background: rgba(255, 255, 255, 0.35);
  outline: none;
}
[data-template="turbo"] .tb-header__phone svg { flex-shrink: 0; }

/* Turbo .btn.btn-outline-primary (vit 2px-ram → accent vid hover), header-variant px-3 py-2 */
[data-template="turbo"] .tb-header .tb-header__cta,
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center; /* pil-avståndet kommer från .tb-btn > svg (margin-left) — ingen gap */
  padding: 0.5rem 1rem;
  font-family: var(--tb-body-font);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: var(--tb-light);
  background: transparent;
  border: 2px solid var(--tb-light);
  border-radius: 0;
  box-shadow: none;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
[data-template="turbo"] .tb-header .tb-header__cta:hover,
[data-template="turbo"] .tb-header .tb-header__cta:focus-visible,
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta:hover,
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta:focus-visible {
  color: var(--tb-light);
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  outline: none;
}
[data-template="turbo"] .tb-header .tb-header__cta:focus-visible,
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta:focus-visible {
  box-shadow: 0 0 0 0.25rem rgba(var(--tb-accent-rgb), 0.5);
}
[data-template="turbo"] .tb-header .tb-header__cta svg,
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta svg { flex-shrink: 0; }
/* Under 576px finns bara logga + burgare i raden (mobile-call-bar bär offert-CTA:n). */
[data-template="turbo"] .tb-header .tb-header__cta { display: none; }
@media (min-width: 576px) {
  [data-template="turbo"] .tb-header .tb-header__cta { display: inline-flex; }
}

/* Burgare (Turbo: .navbar-toggler 2px vit ram + 30px hamburger) — synlig < 992px */
[data-template="turbo"] .tb-burger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0.25rem 0.75rem;
  background: transparent;
  border: 2px solid var(--tb-light);
  border-radius: 0;
  color: var(--tb-light);
  line-height: 1;
  cursor: pointer;
  transition: box-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-burger:hover { background: rgba(255, 255, 255, 0.12); }
[data-template="turbo"] .tb-burger:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5);
}
[data-template="turbo"] .tb-burger svg {
  display: block;
  width: 30px;
  height: 30px;
}
@media (min-width: 992px) {
  [data-template="turbo"] .tb-burger { display: none; }
}

/* ---------------------------------------------------------------------
   OFFCANVAS (Turbo: .offcanvas.offcanvas-end, bg --bs-dark #101010, 400px)
   --------------------------------------------------------------------- */
[data-template="turbo"] .tb-offcanvas__backdrop {
  position: fixed;
  inset: 0;
  z-index: 1040;
  background: #000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s linear, visibility 0.15s;
}
[data-template="turbo"] .tb-offcanvas__backdrop.is-open {
  opacity: 0.5;
  visibility: visible;
}
[data-template="turbo"] .tb-offcanvas {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 1045;
  display: flex;
  flex-direction: column;
  width: min(400px, 100vw);
  max-width: 100%;
  background: var(--tb-dark);
  color: var(--tb-light);
  border-left: 2px solid rgba(0, 0, 0, 0.175);
  background-clip: padding-box;
  outline: 0;
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.3s ease-in-out, visibility 0.3s;
}
[data-template="turbo"] .tb-offcanvas.is-open {
  transform: none;
  visibility: visible;
}
[data-template="turbo"] .tb-offcanvas__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--tb-header-h);
  padding: 1rem;
}
/* h5.offcanvas-title.text-white */
[data-template="turbo"] .tb-offcanvas__title {
  margin: 0;
  font-family: var(--tb-heading-font);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-light);
}
/* .btn-close.btn-close-white (opacity .5 → .75) */
[data-template="turbo"] .tb-offcanvas__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0.5rem;
  margin: -0.5rem -0.5rem -0.5rem auto;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--tb-light);
  opacity: 0.5;
  cursor: pointer;
  transition: opacity 0.15s ease-in-out;
}
[data-template="turbo"] .tb-offcanvas__close:hover { opacity: 0.75; }
[data-template="turbo"] .tb-offcanvas__close:focus-visible {
  opacity: 1;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(255, 255, 255, 0.5);
}
[data-template="turbo"] .tb-offcanvas__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 1rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
[data-template="turbo"] .tb-offcanvas__nav {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
/* Samma länkstil som inline-nav, staplad (mb-2) */
[data-template="turbo"] .tb-offcanvas__link {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  margin-bottom: 0.25rem;
  font-family: var(--tb-body-font);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.75;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: var(--tb-light);
  text-decoration: none;
  transition: background-color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-offcanvas__link:hover,
[data-template="turbo"] .tb-offcanvas__link:focus-visible,
[data-template="turbo"] .tb-offcanvas__link[aria-current="page"] {
  background: rgba(255, 255, 255, 0.35);
  outline: none;
}
/* Kategorier indenterade under Tjänster */
[data-template="turbo"] .tb-offcanvas__sub {
  display: flex;
  flex-direction: column;
  margin: -0.25rem 0 0.75rem 1rem;
  padding: 0.25rem 0 0.25rem 0.75rem;
  border-left: 2px solid rgba(255, 255, 255, 0.15);
}
[data-template="turbo"] .tb-offcanvas__sublink {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0.5rem 1rem;
  font-family: var(--tb-body-font);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.75);
  text-decoration: none;
  transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-offcanvas__sublink:hover,
[data-template="turbo"] .tb-offcanvas__sublink:focus-visible {
  background: rgba(255, 255, 255, 0.12);
  color: var(--tb-light);
  outline: none;
}
[data-template="turbo"] .tb-offcanvas__foot {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: auto;
  padding-top: 1.5rem;
  border-top: 2px solid rgba(255, 255, 255, 0.12);
}
[data-template="turbo"] .tb-offcanvas__phone {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 1rem;
  font-family: var(--tb-heading-font);
  font-size: 1.125rem;
  font-weight: 500;
  letter-spacing: 0.0725rem;
  color: var(--tb-light);
  text-decoration: none;
  transition: color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-offcanvas__phone:hover,
[data-template="turbo"] .tb-offcanvas__phone:focus-visible {
  color: var(--tb-accent);
  outline: 2px solid var(--tb-accent);
  outline-offset: 2px;
}
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta {
  width: 100%;
  margin-top: 0.75rem;
  padding: 0.9rem 1.5rem;
}
/* ≥ 992px: Turbo gör offcanvas statisk (inline-nav tar över). Vi döljer den helt. */
@media (min-width: 992px) {
  [data-template="turbo"] .tb-offcanvas,
  [data-template="turbo"] .tb-offcanvas__backdrop { display: none; }
}

/* ---------------------------------------------------------------------
   FOOTER (Turbo: section#footer bg #F6F6F6, row-cols-md-5, border-top, bottom-bar)
   --------------------------------------------------------------------- */
[data-template="turbo"] .tb-footer {
  background: var(--tb-bg-soft);
  color: var(--tb-body-color);
  font-family: var(--tb-body-font);
  font-size: 1rem;
  line-height: 1.75;
}
/* Egen container-säkring (samma mått som .tb-container: 1320px / 24px) */
[data-template="turbo"] .tb-footer__wrap {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding-left: max(24px, env(safe-area-inset-left, 0px));
  padding-right: max(24px, env(safe-area-inset-right, 0px));
}
@media (max-width: 520px) { [data-template="turbo"] .tb-footer__wrap { padding-left: 18px; padding-right: 18px; } }
@media (max-width: 380px) { [data-template="turbo"] .tb-footer__wrap { padding-left: 16px; padding-right: 16px; } }
/* .container.pt-3 > footer.row.my-5.py-5 */
[data-template="turbo"] .tb-footer__top {
  padding-top: 6rem;
  padding-bottom: 5rem;
}
@media (max-width: 767.98px) {
  [data-template="turbo"] .tb-footer__top {
    padding-top: 4rem;
    padding-bottom: 3rem;
  }
}
/* 12-kolumnsgrid: märke col-md-3, första länkkolumn offset-md-1, länkkolumner col-md-2 */
[data-template="turbo"] .tb-footer__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 3rem 1.5rem;
  align-items: start;
}
[data-template="turbo"] .tb-footer__brand { grid-column: 1 / span 3; }
[data-template="turbo"] .tb-footer__col { grid-column: auto / span 2; }
[data-template="turbo"] .tb-footer__brand + .tb-footer__col { grid-column: 5 / span 2; }
@media (max-width: 991px) {
  [data-template="turbo"] .tb-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  [data-template="turbo"] .tb-footer__brand { grid-column: 1 / -1; }
  [data-template="turbo"] .tb-footer__col,
  [data-template="turbo"] .tb-footer__brand + .tb-footer__col { grid-column: auto / span 1; }
}
@media (max-width: 767.98px) {
  [data-template="turbo"] .tb-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1.5rem; }
}
@media (max-width: 576px) {
  [data-template="turbo"] .tb-footer__grid { grid-template-columns: minmax(0, 1fr); }
}

/* Märkeskolumn */
[data-template="turbo"] .tb-footer__logo {
  display: block;
  height: 48px;
  width: auto;
  object-fit: contain;
}
[data-template="turbo"] .tb-footer__name {
  display: block;
  font-family: var(--tb-heading-font);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
[data-template="turbo"] .tb-footer__text {
  margin: 1.5rem 0;
  color: var(--tb-body-color);
}
[data-template="turbo"] .tb-footer__addr {
  margin: 0 0 1rem;
  color: var(--tb-body-color);
}
[data-template="turbo"] .tb-footer__contact {
  display: block;
  width: fit-content;
  padding: 0.5rem 0;
  font-weight: 600;
  color: var(--tb-heading-color);
  text-decoration: none;
  transition: color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-footer__contact:hover,
[data-template="turbo"] .tb-footer__contact:focus-visible {
  color: var(--tb-accent);
  outline: 2px solid var(--tb-accent);
  outline-offset: 2px;
}
/* iconify-icon.social-icon-footer: 20px #D0D0D0 → accent */
[data-template="turbo"] .tb-footer__social {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin-top: 1.5rem;
}
[data-template="turbo"] .tb-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: -12px; /* 20px ikon, 44px tappyta, samma visuella avstånd */
  color: var(--tb-gray-dark);
  transition: color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-footer__social-link:hover,
[data-template="turbo"] .tb-footer__social-link:focus-visible {
  color: var(--tb-accent);
  outline: 2px solid var(--tb-accent);
  outline-offset: 2px;
}
[data-template="turbo"] .tb-footer__social-link svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: currentColor;
}

/* Länkkolumner: h5.fs-5 + ul.navbar-nav.flex-column > li.footer-list.mb-3 > a.nav-link.text-uppercase.p-0 */
[data-template="turbo"] .tb-footer__h5 {
  margin: 0 0 1rem;
  font-family: var(--tb-heading-font);
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
[data-template="turbo"] .tb-footer__links {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
}
[data-template="turbo"] .tb-footer__links li { margin-bottom: 0.25rem; }
[data-template="turbo"] .tb-footer__link {
  display: inline-block;
  padding: 0.55rem 0; /* ≥44px tappyta */
  font-family: var(--tb-body-font);
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.75;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: #111;
  background: transparent;
  text-decoration: none;
  transition: color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-footer__link:hover,
[data-template="turbo"] .tb-footer__link:focus-visible {
  background: transparent;
  color: var(--tb-accent);
  outline: none;
}

/* Fullbredds-regel (footer.border-top utanför .container) */
[data-template="turbo"] .tb-footer__rule { border-top: 2px solid var(--tb-gray); }

/* Bottenrad (footer.py-2.pt-4: copyright vänster, credit höger) */
[data-template="turbo"] .tb-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem 1.5rem;
  padding: 1.5rem 0 1.25rem;
  font-size: 0.9375rem;
}
[data-template="turbo"] .tb-footer__bottom p {
  margin: 0;
  color: var(--tb-body-color);
}
[data-template="turbo"] .tb-footer__copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 1rem;
}
[data-template="turbo"] .tb-footer__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 1.25rem;
}
[data-template="turbo"] .tb-footer__bottom-link {
  display: inline-block;
  padding: 0.6rem 0;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: #111;
  text-decoration: none;
  transition: color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-footer__bottom-link:hover,
[data-template="turbo"] .tb-footer__bottom-link:focus-visible {
  color: var(--tb-accent);
  outline: 2px solid var(--tb-accent);
  outline-offset: 2px;
}
/* Licenskrav (readme.txt): länken till templatesjungle.com får inte tas bort. Liten och dämpad. */
[data-template="turbo"] .tb-footer__credit {
  font-size: 0.8125rem;
  color: var(--tb-gray-dark);
}
[data-template="turbo"] .tb-footer__credit a {
  color: inherit;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-footer__credit a:hover,
[data-template="turbo"] .tb-footer__credit a:focus-visible {
  color: var(--tb-accent);
  outline: 2px solid var(--tb-accent);
  outline-offset: 2px;
}
@media (max-width: 576px) {
  [data-template="turbo"] .tb-footer__bottom {
    flex-direction: column;
    align-items: flex-start;
  }
  [data-template="turbo"] .tb-footer__meta { justify-content: flex-start; }
}

/* ---------------------------------------------------------------------
   MOBILE CALL BAR (delad komponent, renderas av layout för alla mallar)
   Markup: .mobile-call-bar > a.btn.btn--primary[tel] + a.btn.btn--ghost[/kontakt]
   (.call/.quote finns som legacy-hooks — styls också.)
   --------------------------------------------------------------------- */
[data-template="turbo"] .mobile-call-bar {
  background: var(--tb-dark);
  border-top: 2px solid var(--tb-black);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
  gap: 10px;
}
[data-template="turbo"] .mobile-call-bar a {
  padding: 12px 8px;
  border-radius: 0;
  border: 2px solid transparent;
  font-family: var(--tb-heading-font);
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  box-shadow: none;
  transform: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
[data-template="turbo"] .mobile-call-bar .btn--primary {
  background: var(--tb-accent);
  color: var(--tb-light);
  border-color: var(--tb-accent);
}
[data-template="turbo"] .mobile-call-bar .btn--primary:hover {
  background: var(--tb-accent-hover);
  border-color: var(--tb-accent-hover);
  transform: none;
  box-shadow: none;
}
[data-template="turbo"] .mobile-call-bar .btn--ghost {
  background: transparent;
  color: var(--tb-light);
  border-color: var(--tb-light);
}
[data-template="turbo"] .mobile-call-bar .btn--ghost:hover {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: var(--tb-light);
  transform: none;
}

/* ---------------------------------------------------------------------
   Reducerad rörelse
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  [data-template="turbo"] .tb-header,
  [data-template="turbo"] .tb-nav__dropdown,
  [data-template="turbo"] .tb-nav__caret,
  [data-template="turbo"] .tb-offcanvas,
  [data-template="turbo"] .tb-offcanvas__backdrop {
    transition: none;
  }
}

/* ==========================================================================
   TURBO — startsidan (TurboHome) + HeroCarShowcase på mörk hero
   Port av TemplatesJungle "Turbo" (Bootstrap 5.3) → ren, scopad CSS.
   Källvärden: _ref/turbo/style.css, _ref/turbo/index.html (#hero, #about,
   #process, #info, #project, .plan-post, .services-content, a.icon-link).

   ALLT är scopat under [data-template="turbo"] — layout.tsx länkar varje
   mall-CSS på varje sida, så ingen regel får läcka till andra mallar.
   Tokens (--tb-*, --ff-*, --btn-*) definieras i token-blocket överst; här refereras
   de bara. Utilities från bas-avsnittet som används i markupen: .tb-container,
   .tb-header-top, .tb-display-1/-4, .tb-padding-medium, .tb-border-end,
   .tb-border-bottom. Där de behöver ett annat värde i en viss kontext
   (t.ex. vit border på mörk hero) skrivs regeln med högre specificitet.
   ========================================================================== */

/* --------------------------------------------------------------------------
   SEKTIONSWRAPPERS + gemensamt sektionshuvud (Turbo #price/#blog-idiom:
   p.header-top → h2.display-4.mb-5 → intro)
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-section {
  position: relative;
  padding: 5rem 0;
  background: var(--tb-light);
  overflow: hidden; /* klipper reveal-överskalningen, som Turbos overflow:hidden-wrappers */
}
[data-template="turbo"] .tb-section--soft {
  background: var(--tb-bg-soft);
}
/* Sektions-hooks (semantiska modifierare på .tb-section): egen stacking context per
   sektion så z-index i kort/karuseller/områdesgrid inte läcker mellan sektioner. */
[data-template="turbo"] .tb-services-section,
[data-template="turbo"] .tb-usp-section,
[data-template="turbo"] .tb-process,
[data-template="turbo"] .tb-reviews,
[data-template="turbo"] .tb-areas {
  isolation: isolate;
}
[data-template="turbo"] .tb-section__head {
  max-width: 760px;
  margin: 0 0 3rem;
}
[data-template="turbo"] .tb-section__head .tb-header-top {
  margin: 0 0 1rem;
}
[data-template="turbo"] .tb-section__head h2 {
  margin: 0;
}
[data-template="turbo"] .tb-section__intro {
  margin: 1rem 0 0;
  font-family: var(--tb-body-font);
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--tb-body-color);
}
[data-template="turbo"] .tb-heading-color {
  color: var(--tb-accent);
}

/* --------------------------------------------------------------------------
   1. HERO — Turbo #hero: full-bleed foto + mörk overlay, centrerad copy
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-hero {
  position: relative;
  overflow: hidden;
  padding: calc(var(--tb-header-h) + 5rem) 0 clamp(4rem, 3rem + 3vw, 7rem);
  background-color: var(--tb-dark);
  background-image: var(--tb-photo-hero); /* TurboHome sätter inline-bild ur Sanity när den finns */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
}
[data-template="turbo"] .tb-hero__video {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
[data-template="turbo"] .tb-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(rgba(16, 16, 16, 0.78), rgba(16, 16, 16, 0.72));
  pointer-events: none;
}
/* Ett enda grid för hela heron. DOM-ordningen är Terras (recensioner → copy →
   postnummer-koll → bildspel → snabbfakta); grid-areas placerar recensionerna visuellt
   i sidokolumnen ovanför postnummer-kollen, bredvid bilen (≥ 992px). */
[data-template="turbo"] .tb-hero__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "copy"
    "reviews"
    "postal"
    "media"
    "facts";
  column-gap: 2rem;
  align-items: start;
}

/* (a) copy — Turbo .col-md-6.offset-md-3.text-center */
[data-template="turbo"] .tb-hero__copy {
  grid-area: copy;
  width: 100%;
  max-width: 760px;
  margin: 0 auto 3rem;
  text-align: center;
}
[data-template="turbo"] .tb-hero__copy .tb-hero__eyebrow {
  margin: 0 0 1.5rem; /* Turbo mb-4 */
}
[data-template="turbo"] .tb-hero__title {
  margin: 0 0 1.5rem;
  color: #fff;
  font-family: var(--tb-heading-font);
  text-transform: uppercase;
  letter-spacing: 0.0725rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
  word-break: break-word;
}
/* Långa SEO-H1:or (4 rader) — måttligare än display-1 så heron inte äter hela vyn. */
[data-template="turbo"] .tb-hero__title.tb-display-1 { font-size: clamp(2rem, 1.4rem + 3vw, 4rem); }
[data-template="turbo"] .tb-hero__title em {
  font-style: normal;
  color: var(--tb-accent);
}
[data-template="turbo"] .tb-hero__title strong {
  font-weight: 700;
  color: #fff;
}
[data-template="turbo"] .tb-hero__lead {
  max-width: 640px;
  margin: 0 auto 2rem;
  font-family: var(--tb-body-font);
  font-size: 1.15rem;
  line-height: 1.6;
  color: #d0d0d0;
}
[data-template="turbo"] .tb-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
}

/* Knappar på mörk yta (Turbo .btn-primary + .btn-outline-primary).
   Skrivna med hög specificitet så temats :root .btn--primary{rgba} och
   styles.css cirkel-pilar aldrig vinner här. */
[data-template="turbo"] .tb-on-dark .btn {
  border-radius: 0;
  border-width: 2px;
  border-style: solid;
  font-family: var(--tb-body-font);
  font-weight: 600;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
[data-template="turbo"] .tb-on-dark .btn--primary {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: #fff;
}
[data-template="turbo"] .tb-on-dark .btn--primary:hover,
[data-template="turbo"] .tb-on-dark .btn--primary:focus-visible {
  background: var(--tb-accent-hover);
  border-color: var(--tb-accent-hover);
  color: #fff;
  transform: none;
  box-shadow: none;
}
[data-template="turbo"] .tb-on-dark .btn--ghost {
  background: transparent;
  border-color: #fff;
  color: #fff;
}
[data-template="turbo"] .tb-on-dark .btn--ghost:hover,
[data-template="turbo"] .tb-on-dark .btn--ghost:focus-visible {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: #fff;
  transform: none;
}
[data-template="turbo"] .tb-on-dark .btn .btn__arrow {
  width: auto;
  height: auto;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font-size: 1em;
  line-height: 1;
}
[data-template="turbo"] .tb-on-dark .btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 0.25rem rgba(var(--tb-accent-rgb), 0.5);
}


/* (b) sidokolumn (recensioner över postnummer-kollen) | media (bil-bildspel + formulär).
   Den lodräta karusellen ligger absolut så dess höga innehåll inte drar ut raden —
   raden får medias resterande höjd och marqueen klipps inuti (som terra). */
[data-template="turbo"] .tb-hero__reviews {
  grid-area: reviews;
  min-width: 0;
  margin: 0 0 2rem;
}
[data-template="turbo"] .tb-hero__reviews .reviews-carousel {
  margin: 0;
}
[data-template="turbo"] .tb-hero__postal {
  grid-area: postal;
  min-width: 0;
}
[data-template="turbo"] .tb-hero__postal .postal-check {
  margin-top: 0;
  max-width: none;
  width: 100%;
  background: #fff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border: 2px solid var(--tb-gray);
  border-radius: 0;
  box-shadow: none;
}
[data-template="turbo"] .tb-hero__media {
  grid-area: media;
  display: flex;
  min-width: 0;
  overflow: visible;
  margin-top: 2rem; /* avstånd till postnummer-kollen när kolumnerna staplas (< 992px) */
}

/* Aside-formulär (hero, hubb-hero, svc-block): knapparna får aldrig spränga ramen —
   staplade, full bredd, kompaktare än Turbos stora .btn. */
[data-template="turbo"] .aside-form .form-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
[data-template="turbo"] .aside-form .form-actions .btn {
  width: 100%;
  min-width: 0;
  justify-content: center;
  padding: 0.85rem 1rem;
  font-size: 0.8125rem;
  letter-spacing: 0.05rem;
  white-space: normal;
  text-align: center;
}

/* (c) snabbfakta — Turbo #info-raden på mörk yta */
[data-template="turbo"] .tb-hero__facts {
  grid-area: facts;
  display: flex;
  flex-wrap: wrap;
  margin-top: 3.5rem;
  padding-top: 2.5rem;
  border-top: 2px solid rgba(255, 255, 255, 0.2);
}
[data-template="turbo"] .tb-hero__facts .tb-fact {
  flex: 1 1 0;
  min-width: 160px;
  padding: 0.5rem 1.5rem;
  text-align: center;
}
[data-template="turbo"] .tb-hero__facts .tb-fact.tb-border-end {
  border-right: 2px solid rgba(255, 255, 255, 0.2);
}
[data-template="turbo"] .tb-fact__value {
  font-family: var(--tb-heading-font);
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.1;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: #fff;
}
[data-template="turbo"] .tb-hero__facts .tb-fact__label {
  margin: 0.5rem 0 0;
}

/* Hero-formulärets rubrik: kompaktare än standard-h2 så kortet inte domineras av den */
[data-template="turbo"] .tb-hero__form .form-card h2 {
  font-size: 1.05rem;
  letter-spacing: 0.05rem;
  line-height: 1.3;
  margin-bottom: 0.9rem;
}
/* Offertformuläret: vitt fyrkantigt kort (Turbo-form) så det läses på mörkt */

/* --------------------------------------------------------------------------
   3. TJÄNSTER — Turbo .services-content (radius 20px, 1px #E4E4E4) + a.icon-link
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-services {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
}
[data-template="turbo"] .tb-service {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 2.5rem 2rem;
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-radius: 20px;
  color: inherit;
  text-decoration: none;
  transition: border-color 0.3s ease-in, transform 0.3s ease;
}
[data-template="turbo"] .tb-service:hover,
[data-template="turbo"] .tb-service:focus-visible {
  border-color: var(--tb-accent);
  transform: translateY(-4px);
  outline: 2px solid var(--tb-accent);
  outline-offset: 2px;
}
[data-template="turbo"] .tb-service__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  margin-bottom: 0.5rem;
  color: var(--tb-accent); /* Turbo iconify.service-icon: 80px accent */
}
[data-template="turbo"] .tb-service__icon img {
  width: 72px;
  height: 72px;
  object-fit: contain;
}
[data-template="turbo"] .tb-service__title {
  margin: 0;
  font-family: var(--tb-heading-font);
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.2;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
[data-template="turbo"] .tb-service__desc {
  margin: 0;
  font-family: var(--tb-body-font);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--tb-body-color);
}
[data-template="turbo"] .tb-service__price {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1rem;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
/* a.icon-link: uppercase 1rem, accent-understrykning 20% → 80% */
[data-template="turbo"] .tb-icon-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  align-self: flex-start;
  margin-top: auto;
  padding: 0.5rem 0 4px;
  font-family: var(--tb-body-font);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
[data-template="turbo"] .tb-icon-link::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 20%;
  height: 1px;
  background: var(--tb-accent);
  transition: width 0.2s ease-out;
}
[data-template="turbo"] .tb-service:hover .tb-icon-link::after,
[data-template="turbo"] .tb-service:focus-visible .tb-icon-link::after,
[data-template="turbo"] .tb-icon-link:hover::after {
  width: 80%;
}

/* --------------------------------------------------------------------------
   4. OM OSS — Turbo #about: .container-fluid.border-bottom > .row >
   .col-md-6.padding-medium.pe-5.border-end | .col-md-6.padding-medium-2.ps-md-5
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-about {
  padding: 0;
  border-bottom: 2px solid var(--tb-gray);
}
[data-template="turbo"] .tb-about__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
}
[data-template="turbo"] .tb-about .tb-about__head {
  padding: 5rem 0 0; /* Turbo .padding-medium ≤768 */
  border-right: 0;
}
[data-template="turbo"] .tb-about .tb-about__head .tb-header-top {
  margin: 0 0 1rem; /* mb-3 */
}
[data-template="turbo"] .tb-about .tb-about__head h2 {
  margin: 0 0 0.5rem;
}
[data-template="turbo"] .tb-about .tb-about__body {
  padding: 2rem 0 5rem; /* Turbo .padding-medium-2 ≤768 */
}
[data-template="turbo"] .tb-about__body p {
  margin: 0 0 1rem;
  font-family: var(--tb-body-font);
  font-size: 1.125rem;
  line-height: 1.75;
  color: var(--tb-body-color);
}

/* Om oss-galleri: tre foton i förskjuten rad (Turbo #project .item + hover-description),
   svävande animation, lyft + accentram vid hover/fokus, länkade till kategorihubben. */
[data-template="turbo"] .tb-about__gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem;
  padding: 0 0 4rem;
}
@media (min-width: 576px) {
  [data-template="turbo"] .tb-about__gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
}
@media (max-width: 575.98px) {
  [data-template="turbo"] .tb-about__photo { aspect-ratio: 16 / 9; }
}
[data-template="turbo"] .tb-about__photo {
  --dy: 0px;
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 2px solid var(--tb-gray);
  background: var(--tb-bg-soft);
  transform: translateY(var(--dy));
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
[data-template="turbo"] .tb-about__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.6s cubic-bezier(0.22, 0.7, 0.3, 1);
}
[data-template="turbo"] .tb-about__photo-cap {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.6rem 0.9rem;
  background: rgba(16, 16, 16, 0.78);
  color: #fff;
  font-family: var(--tb-heading-font);
  font-size: 0.85rem;
  font-weight: 500;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  transition: background 0.25s ease;
}
[data-template="turbo"] .tb-about__photo:hover,
[data-template="turbo"] .tb-about__photo:focus-visible {
  border-color: var(--tb-accent);
  box-shadow: 0 18px 40px rgba(16, 16, 16, 0.18);
  outline: none;
}
[data-template="turbo"] .tb-about__photo:hover img,
[data-template="turbo"] .tb-about__photo:focus-visible img { transform: scale(1.06); }
[data-template="turbo"] .tb-about__photo:hover .tb-about__photo-cap,
[data-template="turbo"] .tb-about__photo:focus-visible .tb-about__photo-cap { background: var(--tb-accent); }
[data-template="turbo"] .tb-about--has-gallery .tb-about .tb-about__body,
[data-template="turbo"] .tb-about--has-gallery .tb-about__body { padding-bottom: 3rem; }
@media (min-width: 768px) {
  [data-template="turbo"] .tb-about__gallery { gap: 1.5rem; padding: 0 0 6rem; }
  /* förskjuten rad: mitten lägre, ytterkanterna högre */
  [data-template="turbo"] .tb-about__photo--1 { --dy: -1.25rem; }
  [data-template="turbo"] .tb-about__photo--2 { --dy: 1.5rem; }
  [data-template="turbo"] .tb-about__photo--3 { --dy: -0.5rem; }
  [data-template="turbo"] .tb-about--has-gallery .tb-about .tb-about__head,
  [data-template="turbo"] .tb-about--has-gallery .tb-about .tb-about__body { padding-bottom: 4rem; }
}
@media (prefers-reduced-motion: no-preference) {
  @keyframes tb-float {
    0%, 100% { transform: translateY(var(--dy)); }
    50% { transform: translateY(calc(var(--dy) - 14px)); }
  }
  [data-template="turbo"] .tb-about__photo { animation: tb-float 6s ease-in-out infinite; }
  [data-template="turbo"] .tb-about__photo--2 { animation-delay: -2s; }
  [data-template="turbo"] .tb-about__photo--3 { animation-delay: -4s; }
  [data-template="turbo"] .tb-about__photo:hover { animation-play-state: paused; }
}

/* --------------------------------------------------------------------------
   5. USP — Turbo .plan-post (1px #E4E4E4, vit, centrerad, py-5)
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-usps {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.5rem;
}
[data-template="turbo"] .tb-usp {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding: 3rem 1.5rem;
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  text-align: center;
}
[data-template="turbo"] .tb-usp__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--tb-accent);
  margin-bottom: 0.25rem;
}
[data-template="turbo"] .tb-usp__title {
  margin: 0;
  font-family: var(--tb-heading-font);
  font-weight: 600;
  font-size: 1.15rem;
  line-height: 1.2;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
[data-template="turbo"] .tb-usp p {
  margin: 0;
  font-family: var(--tb-body-font);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--tb-body-color);
}

/* --------------------------------------------------------------------------
   6. STATS — Turbo #info: .col-md-4.text-center.padding-medium.border-end
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-info {
  padding: 2rem 0;
}
[data-template="turbo"] .tb-info__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
[data-template="turbo"] .tb-info .tb-info__col {
  flex: 1 1 100%;
  padding: 3rem 1rem;
  text-align: center;
  border-right: 0;
  border-bottom: 2px solid var(--tb-gray);
}
[data-template="turbo"] .tb-info .tb-info__col:last-child {
  border-bottom: 0;
}
[data-template="turbo"] .tb-info .tb-info__label {
  margin: 0 0 1rem; /* mb-4 i Turbo → 1rem enligt spec */
}
[data-template="turbo"] .tb-info__value {
  font-family: var(--tb-heading-font);
  font-weight: 600;
  font-size: 2.25rem;
  line-height: 1.1;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}

/* --------------------------------------------------------------------------
   7. PROCESS — Turbo #process: 4 × .col-md-6.col-lg-3 > .py-3.py-md-5.px-3 >
   h4 (Oswald 500) > span.heading-color "01." + p
   -------------------------------------------------------------------------- */
[data-template="turbo"] .tb-process__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
[data-template="turbo"] .tb-process__step {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 0.5rem;
  align-items: baseline;
  padding: 1rem;
}
/* Numret ("01.") är ett syskon FÖRE h3 (som terras .te-step__num) så rubriktexten är
   identisk mellan mallar; gridet lägger num + h3 på samma rad som i Turbos h4. */
[data-template="turbo"] .tb-process__num {
  margin: 0 0 1rem;
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: clamp(1.25rem, 1.15rem + 0.3vw, 1.5rem);
  line-height: 1.2;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
}
[data-template="turbo"] .tb-process__h {
  margin: 0 0 1rem;
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: clamp(1.25rem, 1.15rem + 0.3vw, 1.5rem);
  line-height: 1.2;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  color: var(--tb-heading-color);
}
[data-template="turbo"] .tb-process__step p {
  grid-column: 1 / -1;
  margin: 0 0 1rem;
  font-family: var(--tb-body-font);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--tb-body-color);
}

/* --------------------------------------------------------------------------
   10. CTA-BAND — Turbo #project: foto (--tb-photo-cta) + mörk overlay; CtaStrip
   inuti blir transparent med vit text. Fungerar både som omslutande div runt
   <CtaStrip> och som klass direkt på sektionen. ENDA deklarationen i filen
   (mobil-overlayn ligger i ≤767.98px-blocket nedan).
   -------------------------------------------------------------------------- */
html[data-template="turbo"] .tb-cta-band,
html[data-template="turbo"] .tb-cta-band.section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--tb-dark) var(--tb-photo-cta) center / cover no-repeat;
  border: 0;
}
[data-template="turbo"] .tb-cta-band::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(rgba(16, 16, 16, 0.82), rgba(16, 16, 16, 0.66));
  pointer-events: none;
}
[data-template="turbo"] .tb-cta-band > * { position: relative; z-index: 1; }
html[data-template="turbo"] .tb-cta-band .section {
  position: relative;
  z-index: 1;
  background: transparent;
  border: 0;
}
html[data-template="turbo"] .tb-cta-band .cta-strip {
  position: relative;
  padding: 1rem 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #fff;
}
[data-template="turbo"] .tb-cta-band .cta-strip::before,
[data-template="turbo"] .tb-cta-band .cta-strip::after {
  display: none;
}
[data-template="turbo"] .tb-cta-band .cta-strip h2 {
  color: #fff;
}
[data-template="turbo"] .tb-cta-band .cta-strip p {
  color: rgba(255, 255, 255, 0.8);
}

/* --------------------------------------------------------------------------
   RESPONSIVT — Bootstrap-brytpunkter: 576 / 768 / 992 / 1200
   -------------------------------------------------------------------------- */
@media (min-width: 576px) {
  [data-template="turbo"] .tb-services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-usps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  /* #about: sida vid sida, border-end på vänsterkolumnen, 9rem-paddings */
  [data-template="turbo"] .tb-about__row {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  [data-template="turbo"] .tb-about .tb-about__head {
    padding: 9rem 3rem 9rem 0; /* .padding-medium + pe-5 */
    border-right: 2px solid var(--tb-gray);
  }
  [data-template="turbo"] .tb-about .tb-about__body {
    padding: 9rem 0 9rem 3rem; /* .padding-medium-2 + ps-md-5 */
  }
  [data-template="turbo"] .tb-about__body p {
    margin-left: 3rem; /* ms-md-5 */
  }
  /* #info: kolumner i rad med border-end */
  [data-template="turbo"] .tb-info .tb-info__col {
    flex: 1 1 0;
    padding: 4rem 1rem;
    border-bottom: 0;
  }
  [data-template="turbo"] .tb-info .tb-info__col.tb-border-end {
    border-right: 2px solid var(--tb-gray);
  }
  /* #process: 2 kolumner */
  [data-template="turbo"] .tb-process__row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-process__step {
    padding: 3rem 1rem;
  }
}

@media (min-width: 992px) {
  [data-template="turbo"] .tb-hero__inner {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
      "copy media"
      "reviews reviews"
      "postal postal"
      "facts facts";
    column-gap: 3.5rem;
    align-items: start;
  }
  /* Copy vänsterställd bredvid offertformuläret (Turbo-hero i två kolumner) */
  [data-template="turbo"] .tb-hero__copy {
    max-width: none;
    margin: 0 0 2.5rem;
    text-align: left;
  }
  [data-template="turbo"] .tb-hero__ctas {
    justify-content: flex-start;
  }
  /* "Vi finns i ditt område" — centrerad under karusellen */
  [data-template="turbo"] .tb-hero__postal {
    justify-self: center;
    width: 100%;
    max-width: 680px;
  }
  [data-template="turbo"] .tb-hero__media {
    align-self: start;
  }
  [data-template="turbo"] .tb-hero__postal {
    margin-top: 0;
  }
  [data-template="turbo"] .tb-hero__media {
    margin-top: 0;
  }
  /* Luft så offertformuläret (höger, rad 1) inte stöter emot recensionskarusellen nedanför */
  [data-template="turbo"] .tb-hero__reviews {
    margin-top: 2.5rem;
  }
  [data-template="turbo"] .tb-services {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-usps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-usps[data-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-usps[data-count="3"] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-process__row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  [data-template="turbo"] .tb-process__row:has(> :nth-child(5)) {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}

@media (max-width: 767.98px) {
  [data-template="turbo"] .tb-section {
    padding: 3.5rem 0;
  }
  [data-template="turbo"] .tb-section__head {
    margin-bottom: 2rem;
  }
  [data-template="turbo"] .tb-hero {
    padding: calc(var(--tb-header-h) + 3rem) 0 3.5rem;
  }
  [data-template="turbo"] .tb-hero__copy .tb-hero__eyebrow {
    margin-bottom: 1rem;
  }
  [data-template="turbo"] .tb-hero__lead {
    font-size: 1.05rem;
  }
  [data-template="turbo"] .tb-hero__copy {
    margin-bottom: 2.25rem;
  }
  /* Snabbfakta staplas: bort med högerlinjer, in med linje under */
  [data-template="turbo"] .tb-hero__facts {
    margin-top: 2.5rem;
    padding-top: 0;
  }
  [data-template="turbo"] .tb-hero__facts .tb-fact,
  [data-template="turbo"] .tb-hero__facts .tb-fact.tb-border-end {
    flex: 1 1 100%;
    padding: 1.25rem 0;
    border-right: 0;
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
  }
  [data-template="turbo"] .tb-hero__facts .tb-fact:last-child {
    border-bottom: 0;
  }
  [data-template="turbo"] .tb-fact__value {
    font-size: 1.75rem;
  }
  [data-template="turbo"] .tb-service {
    padding: 2rem 1.5rem;
  }
  [data-template="turbo"] .tb-usp {
    padding: 2.25rem 1.25rem;
  }
  [data-template="turbo"] .tb-info {
    padding: 1rem 0;
  }
  [data-template="turbo"] .tb-info__value {
    font-size: 1.9rem;
  }
  [data-template="turbo"] .tb-cta-band::before {
    background: linear-gradient(rgba(16, 16, 16, 0.86), rgba(16, 16, 16, 0.74));
  }
}

@media (max-width: 575.98px) {
  [data-template="turbo"] .tb-hero__ctas .btn {
    width: 100%;
    justify-content: center;
  }
}

/* ── Mjuk övergång hero → nästa (vita) sektion: nedtoning i nederkanten ──
   Gäller startsidans hero och alla inre-sidors mörka banners (subhero/artikel/kontakt).
   Ligger i den nedre paddingen (under innehållet), z-index under texten. */
[data-template="turbo"] .tb-hero::after,
html[data-template="turbo"] .subhero::after,
html[data-template="turbo"] .article-hero::after,
html[data-template="turbo"] .contact-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 96px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 100%);
  pointer-events: none;
  z-index: 1;
}

/* Reducerad rörelse */
@media (prefers-reduced-motion: reduce) {
  [data-template="turbo"] .tb-service,
  [data-template="turbo"] .tb-icon-link::after {
    transition: none;
  }
  [data-template="turbo"] .tb-service:hover {
    transform: none;
  }
}

/* ═══ MALL: Turbo (turbo) — INRE SIDOR (avsnitt 4 av 4) ═══
   Port av TemplatesJungle "Turbo" (_ref/turbo/style.css + Bootstrap 5.3-defaults) till de
   DELADE komponenterna (styles.css-klasser som FlatPageRich, ServicePage, Subhero, Faq,
   AsideForm, CtaStrip, PostalCheck, ReviewsCarousel, AreasGrid, CertMarquee, HeroCarShowcase,
   MiniPriceList, ProseSections, ReadMore, MobileCallBar … renderar). Motsvarar terra.css
   rad 1-92 + QA-blocket + .te-certs — men i Turbos design.

   REGLER
   • 100 % scopat: [data-template="turbo"] … (layout.tsx länkar varje mall-CSS på varje sida).
     Selektorer som måste slå skins ([data-skin] .card:hover, .section-head .eyebrow …) och
     themeCss skrivs med html[data-template="turbo"] (+1 typ i specificitet).
   • Tokens (--tb-*, --bg, --ink …) definieras ENDAST i token-blocket överst — här refereras de bara.
     --tb-header-h (92px / 72px < 992px) ägs av chrome-avsnittet och är alltid definierad.
   • Inget här rör body/h1-h6/.btn/.tb-* — det äger bas-avsnittet.
   • Bara utseende. Struktur, ordning, innehåll och SEO är orörda.
   • En deklaration per sak: .mobile-call-bar → chrome-avsnittet · .tb-cta-band →
     startside-avsnittet (inga dubbletter här).

   TURBO-IDIOM SOM ÅTERANVÄNDS
   • Mörkt fotoband (#hero/#project): foto + rgba(16,16,16,.8), vita Oswald-rubriker.
   • .plan-post-kort: vitt, 1px #E4E4E4, 0 radie, ingen skugga; hover → accentkant.
   • .reviews-components: 2px #FAFAFA, 0 12px 90px rgba(12,12,12,.06), radie 9px, 60px citat.
   • .accordion: öppen fråga bg #E4E4E4, staplade 1px-ramar.
   • .form-control: 0 radie, #E4E4E4-kant, fokus #ABABAB + 0 0 0 .25rem #E4E4E4.
   • button.filter-button / .nav-tabs: versaler, 1px kant, hover/aktiv accent.
   • .blog-content-rad: hover bg #F6F6F6 + rubrik accent.
   • .header-top / .blog-topic: versaler, .9375rem, spårning .28125rem.
   Foton: CSS-tokens --tb-photo-subhero (subhero), --tb-photo-article (blogg-/kontakt-hero),
   --tb-photo-cta (CTA-band) — definierade i token-blocket överst, ett ställe per kund. */

/* ─────────────────────────────────────────────────────────────
   1. GLOBALA TEXTDETALJER (utöver baslagret)
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] p > strong { color: var(--tb-black); }
[data-template="turbo"] .subhero__lead p > strong,
[data-template="turbo"] .article-hero__lead p > strong,
[data-template="turbo"] .contact-hero__lead p > strong,
[data-template="turbo"] .cta-strip p > strong,
[data-template="turbo"] .tb-on-dark p > strong { color: #fff; }
/* Vita kort inuti mörka ytor (hero/band) behåller mörk text — slår .tb-on-dark-reglerna i basen */
[data-template="turbo"] .tb-on-dark .form-card p,
[data-template="turbo"] .tb-on-dark .card p,
[data-template="turbo"] .tb-on-dark .postal-check p,
[data-template="turbo"] .tb-on-dark .subhero__answer p,
[data-template="turbo"] .tb-on-dark .aside-card p,
[data-template="turbo"] .tb-on-dark .reviews-carousel__card p { color: var(--tb-body-color); }
[data-template="turbo"] .tb-on-dark .form-card p > strong,
[data-template="turbo"] .tb-on-dark .card p > strong,
[data-template="turbo"] .tb-on-dark .postal-check p > strong,
[data-template="turbo"] .tb-on-dark .subhero__answer p > strong,
[data-template="turbo"] .tb-on-dark .aside-card p > strong { color: var(--tb-black); }
[data-template="turbo"] .tb-on-dark .form-card h2, [data-template="turbo"] .tb-on-dark .form-card h3,
[data-template="turbo"] .tb-on-dark .form-card h4, [data-template="turbo"] .tb-on-dark .card h2,
[data-template="turbo"] .tb-on-dark .card h3, [data-template="turbo"] .tb-on-dark .card h4,
[data-template="turbo"] .tb-on-dark .aside-card h4, [data-template="turbo"] .tb-on-dark .subhero__answer h3 { color: var(--tb-black); }
[data-template="turbo"] .tb-on-dark .form-card .btn--ghost,
[data-template="turbo"] .tb-hero .form-card .btn--ghost { color: var(--tb-black); border-color: var(--tb-black); background: transparent; }
[data-template="turbo"] .tb-on-dark .form-card .btn--ghost:hover,
[data-template="turbo"] .tb-hero .form-card .btn--ghost:hover { color: #fff; border-color: var(--tb-accent); background: var(--tb-accent); }
html[data-template="turbo"] .tb-on-dark .section-head h2 { color: #fff; }
html[data-template="turbo"] .tb-on-dark .section-head p { color: rgba(255, 255, 255, 0.8); }

/* ─────────────────────────────────────────────────────────────
   2. SEKTIONER — vit/#F6F6F6-växling med 2px linjer, section-head i display-4-skala
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .section { background: #fff; border-top: 0; }
html[data-template="turbo"] .section:nth-of-type(even) { background: var(--tb-bg-soft); border-top: var(--tb-border); }
html[data-template="turbo"] .section-head { text-align: center; }
html[data-template="turbo"] .section-head h2 {
  color: var(--tb-black);
  font-family: var(--tb-heading-font);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.0725rem;
  line-height: 1.2;
  font-size: clamp(2.1rem, 1.475rem + 2.7vw, 3.5rem);
}
html[data-template="turbo"] .section-head p { color: var(--tb-body-color); font-size: 1.05rem; line-height: 1.7; }

/* .eyebrow = Turbos .header-top: ingen pill, ingen kant, accent, versaler, glest spårad */
html[data-template="turbo"] .eyebrow,
html[data-template="turbo"] .section-head .eyebrow {
  display: inline-block;
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  color: var(--tb-accent);
  font-family: var(--tb-body-font);
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.28125rem;
  text-transform: uppercase;
  line-height: normal;
  margin-bottom: 1rem;
}
[data-template="turbo"] .related-link__body .eyebrow { margin-bottom: 0.4rem; font-size: 0.8rem; }

/* Samma etikett-idiom på övriga småetiketter (.blog-topic → #757575 för AA-kontrast) */
[data-template="turbo"] .trusted__label,
[data-template="turbo"] .reviews-source-label,
[data-template="turbo"] .aside-reviews__label,
[data-template="turbo"] .blog-toc > summary,
[data-template="turbo"] .case-card__topic,
[data-template="turbo"] .form-step__num {
  color: var(--tb-body-color);
  font-family: var(--tb-body-font);
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
[data-template="turbo"] .trusted__label,
[data-template="turbo"] .reviews-source-label,
[data-template="turbo"] .aside-reviews__label { font-size: 0.8rem; }
[data-template="turbo"] .svc-block__label,
[data-template="turbo"] .summary-cards__label,
[data-template="turbo"] .about-summary__title,
[data-template="turbo"] .snabbsvar__label,
[data-template="turbo"] .snabbsvar > strong {
  display: block;
  color: var(--tb-accent);
  font-family: var(--tb-body-font);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.28125rem;
  text-transform: uppercase;
}
[data-template="turbo"] .trusted__google-rating,
[data-template="turbo"] .aside-emblems__google-rating { color: var(--tb-black); }
[data-template="turbo"] .trusted__google-sub,
[data-template="turbo"] .aside-emblems__google-sub { color: var(--tb-body-color); }

/* ─────────────────────────────────────────────────────────────
   3. SUBHERO / SIDHEROS — Turbos mörka fotoband (#hero-idiom) under den fasta headern
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .subhero {
  position: relative;
  isolation: isolate;
  background: var(--tb-dark) var(--tb-photo-subhero) center / cover no-repeat;
  color: #fff;
  border-bottom: 0;
  padding: calc(var(--tb-header-h) + 4rem) 0 4.5rem;
}
html[data-template="turbo"] .article-hero,
html[data-template="turbo"] .contact-hero {
  position: relative;
  isolation: isolate;
  background: var(--tb-dark) var(--tb-photo-article) center / cover no-repeat;
  color: #fff;
  padding: calc(var(--tb-header-h) + 4rem) 0 4rem;
}
[data-template="turbo"] .subhero::before,
[data-template="turbo"] .article-hero::before,
[data-template="turbo"] .contact-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(16, 16, 16, 0.8);
  pointer-events: none;
  z-index: 0;
}
[data-template="turbo"] .subhero > .container,
[data-template="turbo"] .article-hero > .container,
[data-template="turbo"] .contact-hero > .container { position: relative; z-index: 1; }

html[data-template="turbo"] .subhero h1,
[data-template="turbo"] .article-hero__text h1,
[data-template="turbo"] .contact-hero__text h1 {
  color: #fff;
  font-family: var(--tb-heading-font);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.0725rem;
  line-height: 1.2;
  font-size: clamp(2.1rem, 1.475rem + 2.7vw, 3.5rem);
  max-width: 900px;
}
html[data-template="turbo"] .subhero h1 em {
  background: none;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  -webkit-text-fill-color: var(--tb-accent);
  color: var(--tb-accent);
  font-style: normal;
}
html[data-template="turbo"] .subhero__lead,
html[data-template="turbo"] .subhero__lead p,
[data-template="turbo"] .subhero__lead li,
[data-template="turbo"] .article-hero__lead,
[data-template="turbo"] .article-hero__lead p,
[data-template="turbo"] .contact-hero__lead { color: #D0D0D0; font-family: var(--tb-body-font); font-style: normal; letter-spacing: 0; }
[data-template="turbo"] .subhero__lead a,
[data-template="turbo"] .article-hero__lead a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* Brödsmulor — vit avdelare (Turbo .breadcrumb --bs-breadcrumb-divider-color: light) */
html[data-template="turbo"] .subhero__crumbs,
html[data-template="turbo"] .subhero__crumbs a {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
[data-template="turbo"] .subhero__crumbs a:hover { color: #fff; }
html[data-template="turbo"] .subhero__crumbs span { color: #fff; }

/* Snabbsvar-rutan: vitt .plan-post-kort med accentkant till vänster */
html[data-template="turbo"] .subhero__answer {
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-left: 4px solid var(--tb-accent);
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: var(--tb-black);
}
html[data-template="turbo"] .subhero__answer-label {
  color: var(--tb-accent);
  font-family: var(--tb-body-font);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.28125rem;
  text-transform: uppercase;
}
html[data-template="turbo"] .subhero__answer-question {
  color: var(--tb-accent);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1.15rem;
  letter-spacing: 0.03rem;
  text-transform: none;
}
html[data-template="turbo"] .subhero__answer p { color: var(--tb-body-color); }
[data-template="turbo"] .subhero__answer strong { color: var(--tb-black); }
[data-template="turbo"] .subhero__answer a { color: var(--tb-accent); text-decoration: underline; text-underline-offset: 3px; }

/* Foton i heron: fyrkantiga med 2px linje */
html[data-template="turbo"] .subhero__photo,
[data-template="turbo"] .photo {
  border-radius: 0;
  box-shadow: none;
  border: 2px solid var(--tb-gray);
  background: var(--tb-bg-soft);
  overflow: hidden;
}
/* Hubbens hero-aside: bilden fyller ytan ovanför formuläret (flex-reglerna i styles.css orörda) */
[data-template="turbo"] .hub-hero-aside__media {
  border-radius: 0;
  box-shadow: none;
  border: 2px solid var(--tb-gray);
  background: var(--tb-bg-soft);
}

/* Outline-knappar på det mörka bandet = Turbo .btn-outline-primary (vit 2px kant → accent) */
[data-template="turbo"] .subhero .btn--ghost,
[data-template="turbo"] .article-hero .btn--ghost,
[data-template="turbo"] .contact-hero .btn--ghost { color: #fff; border-color: #fff; background: transparent; }
[data-template="turbo"] .subhero .btn--ghost:hover,
[data-template="turbo"] .article-hero .btn--ghost:hover,
[data-template="turbo"] .contact-hero .btn--ghost:hover { color: #fff; border-color: var(--tb-accent); background: var(--tb-accent); }
/* …men inuti VITA kort på bandet (offertformulär, sidokort, kontaktkort) är outline-knappen mörk */
[data-template="turbo"] .subhero .form-card .btn--ghost,
[data-template="turbo"] .subhero .aside-card .btn--ghost,
[data-template="turbo"] .subhero .card .btn--ghost,
[data-template="turbo"] .subhero .subhero__answer .btn--ghost,
[data-template="turbo"] .article-hero .form-card .btn--ghost,
[data-template="turbo"] .article-hero .card .btn--ghost,
[data-template="turbo"] .contact-hero .form-card .btn--ghost,
[data-template="turbo"] .contact-hero .contact-method .btn--ghost { color: var(--tb-black); border-color: var(--tb-black); background: transparent; }
[data-template="turbo"] .subhero .form-card .btn--ghost:hover,
[data-template="turbo"] .subhero .aside-card .btn--ghost:hover,
[data-template="turbo"] .subhero .card .btn--ghost:hover,
[data-template="turbo"] .article-hero .form-card .btn--ghost:hover,
[data-template="turbo"] .article-hero .card .btn--ghost:hover,
[data-template="turbo"] .contact-hero .form-card .btn--ghost:hover,
[data-template="turbo"] .contact-hero .contact-method .btn--ghost:hover { color: #fff; border-color: var(--tb-accent); background: var(--tb-accent); }

/* Blogghubbens verktygslista (vitt kort, rader med 1px avdelare) */
[data-template="turbo"] .article-hero__tools { padding: 0; gap: 0; }
[data-template="turbo"] .article-tool {
  border-radius: 0;
  border-bottom: 1px solid var(--tb-gray);
  padding: 1rem 1.25rem;
  color: var(--tb-black);
}
[data-template="turbo"] .article-tool:last-child { border-bottom: 0; }
[data-template="turbo"] .article-tool:hover { background: var(--tb-bg-soft); transform: none; }
[data-template="turbo"] .article-tool__icon,
[data-template="turbo"] .contact-method__icon {
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--tb-accent);
}
[data-template="turbo"] .article-tool strong,
[data-template="turbo"] .contact-method__body strong {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  color: var(--tb-black);
}
[data-template="turbo"] .article-tool small,
[data-template="turbo"] .contact-method__body p { color: var(--tb-body-color); }
[data-template="turbo"] .contact-method:hover { transform: none; border-color: var(--tb-accent); box-shadow: none; }
[data-template="turbo"] .contact-method__body .btn { border-radius: 0; padding: 0.6rem 1rem; font-size: 0.85rem; }
[data-template="turbo"] .contact-hero__form .form-card { border-radius: 0; box-shadow: none; padding: 2rem; }
[data-template="turbo"] .contact-hero__form .form-card > p { color: var(--tb-body-color); }

/* /tack och /404 använder .hero — ljus yta med 2px linje, plats under den fasta headern.
   Headern görs solid på dessa sidor via body:has(main > .hero:first-child) i chrome-avsnittet. */
html[data-template="turbo"] .hero {
  background: var(--tb-dark);
  color: #fff;
  border-bottom: var(--tb-border);
  min-height: auto;
  padding-top: calc(var(--tb-header-h) + 4rem);
}
html[data-template="turbo"] .hero h1,
html[data-template="turbo"] .hero h2 { color: #fff; }
html[data-template="turbo"] .hero p { color: #d0d0d0; }

/* ─────────────────────────────────────────────────────────────
   4. KORT — Turbo .plan-post: vitt, 1px #E4E4E4, 0 radie, ingen skugga; hover accentkant
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .card,
html[data-template="turbo"] .aside-card,
html[data-template="turbo"] .aside-steps,
html[data-template="turbo"] .sitemap-block,
html[data-template="turbo"] .area-service-card,
html[data-template="turbo"] .article-card,
html[data-template="turbo"] .article-featured,
html[data-template="turbo"] .article-hero__tools,
html[data-template="turbo"] .contact-method,
html[data-template="turbo"] .hub-mini__card,
html[data-template="turbo"] .summary-card,
html[data-template="turbo"] .related-link,
html[data-template="turbo"] .process__step,
html[data-template="turbo"] .postal-check,
html[data-template="turbo"] .form-card,
html[data-template="turbo"] .faq__item,
html[data-template="turbo"] .price-table,
html[data-template="turbo"] .blog-hero-trust,
html[data-template="turbo"] .about-check,
html[data-template="turbo"] .team-member,
html[data-template="turbo"] .other-services__card,
html[data-template="turbo"] .article-cta,
html[data-template="turbo"] .info-box,
html[data-template="turbo"] .google-reviews-card,
html[data-template="turbo"] .booking-wizard,
html[data-template="turbo"] .logo-marquee__item,
html[data-template="turbo"] .testimonial,
html[data-template="turbo"] .datapoint {
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  box-shadow: none;
}
html[data-template="turbo"] .card:hover,
html[data-template="turbo"] .area-service-card:hover,
html[data-template="turbo"] .sitemap-block:hover,
html[data-template="turbo"] .hub-mini__card:hover,
html[data-template="turbo"] .team-member:hover {
  border-color: var(--tb-accent);
  box-shadow: none;
  transform: translateY(-3px);
}
html[data-template="turbo"] .card::after,
[data-template="turbo"] .area-service-card::after { background: var(--tb-accent); height: 2px; }
html[data-template="turbo"] .card h3,
[data-template="turbo"] .area-service-card__body h3,
[data-template="turbo"] .article-card h3,
[data-template="turbo"] .sitemap-block h2,
[data-template="turbo"] .hub-why-us .card h3,
[data-template="turbo"] .hub-audience .card h3 { color: var(--tb-black); letter-spacing: 0.0725rem; }
html[data-template="turbo"] .card p,
[data-template="turbo"] .area-service-card__body p,
[data-template="turbo"] .article-card p,
[data-template="turbo"] .article-featured__body p { color: var(--tb-body-color); }
[data-template="turbo"] .card__image,
[data-template="turbo"] .area-service-card__media,
[data-template="turbo"] .article-card__media { background: var(--tb-bg-soft); border-bottom: 1px solid var(--tb-gray); }
[data-template="turbo"] .card__image::after { display: none; }
[data-template="turbo"] .article-card__media--icon { background: var(--tb-bg-soft); color: var(--tb-accent); }
[data-template="turbo"] .article-featured__media { background: var(--tb-black); }
[data-template="turbo"] .article-featured__media--icon { background: var(--tb-black); color: #fff; }

/* Ikonplattor → stor accentikon utan platta (Turbo iconify.service-icon 80px accent) */
html[data-template="turbo"] .card__icon,
[data-template="turbo"] .sitemap-block__icon,
[data-template="turbo"] .postal-check__pin,
[data-template="turbo"] .related-link__icon,
[data-template="turbo"] .article-cta__icon,
[data-template="turbo"] .hub-mini__ico,
[data-template="turbo"] .summary-card__ico {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: var(--tb-accent);
}
html[data-template="turbo"] .card__icon { width: auto; height: auto; display: flex; align-items: center; justify-content: flex-start; align-self: flex-start; }
html[data-template="turbo"] .card__icon svg { width: 36px; height: 36px; }
[data-template="turbo"] .sitemap-block__icon svg { width: 24px; height: 24px; }
[data-template="turbo"] .related-link__icon svg,
[data-template="turbo"] .article-cta__icon svg { width: 34px; height: 34px; }
[data-template="turbo"] .card__iconimg {
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  width: auto;
  height: auto;
  justify-items: start;
}
[data-template="turbo"] .card__iconimg img { width: 44px; height: 44px; }
[data-template="turbo"] .card:hover .card__iconimg { transform: none; background: transparent; box-shadow: none; }
[data-template="turbo"] .card:hover .card__iconimg img { transform: none; }
[data-template="turbo"] .hub-mini__card:hover .hub-mini__ico,
[data-template="turbo"] .summary-card:hover .summary-card__ico { transform: none; }

[data-template="turbo"] .card__price,
[data-template="turbo"] .area-service-card__price {
  color: var(--tb-black);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.03rem;
}
[data-template="turbo"] .card__price small { color: var(--tb-body-color); }

/* Kortlänkar = a.icon-link: versaler, accent, understreck som växer 20 % → 80 % */
[data-template="turbo"] .card__link,
[data-template="turbo"] .area-service-card__cta,
[data-template="turbo"] .article-card__cta,
[data-template="turbo"] .article-featured__cta,
[data-template="turbo"] .service-prices__link,
[data-template="turbo"] .reviews-source-link {
  color: var(--tb-accent);
  font-family: var(--tb-body-font);
  font-weight: 600;
  font-size: 0.9rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  text-decoration: none;
  padding-bottom: 3px;
  background-image: linear-gradient(var(--tb-accent), var(--tb-accent));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 20% 1px;
  transition: background-size 0.2s ease-out, color 0.2s ease;
}
[data-template="turbo"] .card:hover .card__link,
[data-template="turbo"] .area-service-card:hover .area-service-card__cta,
[data-template="turbo"] .article-card:hover .article-card__cta,
[data-template="turbo"] .article-featured:hover .article-featured__cta,
[data-template="turbo"] .service-prices__link:hover,
[data-template="turbo"] .reviews-source-link:hover { background-size: 80% 1px; color: var(--tb-accent); text-decoration: none; }
[data-template="turbo"] .article-featured__arrow {
  background: transparent;
  color: var(--tb-accent);
  border-radius: 0;
  width: auto;
  height: auto;
  font-size: 1rem;
}

/* Hubbens mini-tjänsterutor + sammanfattningskort */
[data-template="turbo"] .hub-mini__card:hover { background: var(--tb-bg-soft); }
[data-template="turbo"] .hub-mini__title {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  color: var(--tb-black);
}
[data-template="turbo"] .hub-mini__arrow,
[data-template="turbo"] .other-services__arrow { color: var(--tb-accent); }
[data-template="turbo"] .summary-card::before { background: var(--tb-accent); }
[data-template="turbo"] .summary-card:hover { border-color: var(--tb-accent); box-shadow: none; }
[data-template="turbo"] .summary-card__title {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.04rem;
  text-transform: uppercase;
  color: var(--tb-black);
}
[data-template="turbo"] .summary-card__desc { color: var(--tb-body-color); }

/* Sitemap-block */
[data-template="turbo"] .sitemap-block__head { border-bottom-color: var(--tb-gray); }
[data-template="turbo"] .sitemap-block__count { border-radius: 0; background: var(--tb-bg-soft); color: var(--tb-body-color); }
[data-template="turbo"] .sitemap-block a { color: var(--tb-body-color); }
[data-template="turbo"] .sitemap-block a:hover { color: var(--tb-accent); }
[data-template="turbo"] .sitemap-block li + li a { border-top-color: var(--tb-gray); }
[data-template="turbo"] .sitemap-block__lede { color: var(--tb-body-color); }
[data-template="turbo"] .sitemap-geo__head h2 { color: var(--tb-black); }

/* Andra tjänster (/priser), info-ruta, artikel-CTA, relaterad länk */
[data-template="turbo"] .other-services__card { color: var(--tb-black); }
[data-template="turbo"] .other-services__card:hover { border-color: var(--tb-accent); box-shadow: none; transform: none; background: var(--tb-bg-soft); }
[data-template="turbo"] .other-services__card strong { color: var(--tb-black); }
[data-template="turbo"] .info-box { padding: 1.75rem; }
html[data-template="turbo"] .article-cta { background: var(--tb-bg-soft); }
[data-template="turbo"] .article-cta h3 { color: var(--tb-black); }
[data-template="turbo"] .article-cta p { color: var(--tb-body-color); }
[data-template="turbo"] .related-link:has(.related-link__btn:hover) { border-color: var(--tb-accent); box-shadow: none; }
[data-template="turbo"] .related-link__body h3 { color: var(--tb-black); }
[data-template="turbo"] .related-link__body p { color: var(--tb-body-color); }
[data-template="turbo"] .related-link__btn { box-shadow: none; }

/* Sidokort (/om-oss-hero, värderingar) + små steg-rutor */
[data-template="turbo"] .aside-card h4 { color: var(--tb-black); }
[data-template="turbo"] .aside-card p { color: var(--tb-body-color); }
[data-template="turbo"] .aside-card a { color: var(--tb-black); }
[data-template="turbo"] .aside-steps .check { border-radius: 0; background: transparent; color: var(--tb-accent); }
[data-template="turbo"] .aside-steps strong { color: var(--tb-black); }

/* Om oss: check-lista, sammanfattning, team */
[data-template="turbo"] .about-check__check {
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  color: var(--tb-accent);
}
[data-template="turbo"] .about-check__label {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  color: var(--tb-black);
}
[data-template="turbo"] .about-check__answer { color: var(--tb-body-color); }
[data-template="turbo"] .about-check--centered .about-check__item { border-bottom-color: var(--tb-gray); }
[data-template="turbo"] .about-summary { background: var(--tb-bg-soft); border: 1px solid var(--tb-gray); border-radius: 0; }
[data-template="turbo"] .about-summary__list li { color: var(--tb-body-color); }
[data-template="turbo"] .about-summary__list li::before {
  border-radius: 0;
  background: var(--tb-accent);
  box-shadow: none;
  width: 10px;
  height: 10px;
  top: 8px;
}
[data-template="turbo"] .about-team__item + .about-team__item { border-top: 2px solid var(--tb-gray); }
[data-template="turbo"] .about-team__item p,
[data-template="turbo"] .team-member p,
[data-template="turbo"] .about-history p { color: var(--tb-body-color); }
[data-template="turbo"] .team-member__photo { background: var(--tb-bg-soft); }

/* ─────────────────────────────────────────────────────────────
   5. RECENSIONER — Turbo .reviews-components (den enda rundade ytan: radie 9px)
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .reviews-carousel__card,
html[data-template="turbo"] .tb-hero .reviews-carousel__card,
html[data-template="turbo"] .tb-on-dark .reviews-carousel__card {
  background: #fff;
  border: 2px solid #FAFAFA;
  border-radius: 9px;
  box-shadow: var(--tb-shadow-review);
}
html[data-template="turbo"] .reviews-carousel__card:hover {
  transform: none;
  border-color: #FAFAFA;
  box-shadow: var(--tb-shadow-review);
}
html[data-template="turbo"] .reviews-carousel__card::after { display: none; }
/* Stort accent-citattecken (iconify.quote 60px) överst i kortet */
[data-template="turbo"] .review-card__head::before {
  content: "\201C";
  display: block;
  flex: 0 0 auto;
  font-family: var(--tb-heading-font);
  font-weight: 600;
  font-size: 3.5rem;
  line-height: 0.6;
  height: 1.6rem;
  color: var(--tb-accent);
}
[data-template="turbo"] .reviews-carousel--mini .review-card__head::before,
[data-template="turbo"] .reviews-carousel--vertical .review-card__head::before,
[data-template="turbo"] .case-carousel .review-card__head::before { font-size: 2.25rem; height: 1rem; }
[data-template="turbo"] .review-card blockquote {
  font-family: var(--tb-body-font);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--tb-black);
}
[data-template="turbo"] .review-card__author {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  color: var(--tb-black);
}
[data-template="turbo"] .review-card__source { color: var(--tb-body-color); }
[data-template="turbo"] .review-card__source-logo { filter: none; }
[data-template="turbo"] .review-card__avatar {
  background: var(--tb-black);
  border-radius: 0;
  box-shadow: none;
  font-family: var(--tb-heading-font);
  font-weight: 500;
}
[data-template="turbo"] .case-card__body { color: var(--tb-black); }
[data-template="turbo"] .case-card__quote { color: var(--tb-accent); border-top-color: var(--tb-gray); }
[data-template="turbo"] .case-section-head > p { color: var(--tb-black); }
[data-template="turbo"] .google-reviews-card__score { font-family: var(--tb-heading-font); font-weight: 600; color: var(--tb-black); }
[data-template="turbo"] .google-reviews-card__count { color: var(--tb-body-color); }
/* Pilknappar (kort-scroller; ReviewsCarousel renderar inga): fyrkantiga 2px-ramar, accentikon → accentfylld */
[data-template="turbo"] .card-scroller__nav {
  background: #fff;
  border: 2px solid var(--tb-gray);
  border-radius: 0;
  color: var(--tb-accent);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-template="turbo"] .card-scroller__nav:hover {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: #fff;
  box-shadow: none;
  transform: translateY(-50%);
}
[data-template="turbo"] .card-scroller__nav:focus-visible { outline: 3px solid var(--tb-accent); outline-offset: 3px; }

/* ─────────────────────────────────────────────────────────────
   6. FAQ — Bootstrap-accordion: staplade 1px-ramar, öppen fråga bg #E4E4E4
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .faq__item { margin-bottom: 0; }
[data-template="turbo"] .faq__item + .faq__item { border-top: 0; }
[data-template="turbo"] .faq__q {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1.05rem;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  color: var(--tb-black);
  background: #fff;
  padding: 1.1rem 1.25rem;
  transition: background-color 0.15s ease-in-out;
}
[data-template="turbo"] .faq__item.open .faq__q { background: var(--tb-gray); }
[data-template="turbo"] .faq__q:hover { background: var(--tb-bg-soft); }
[data-template="turbo"] .faq__item.open .faq__q:hover { background: var(--tb-gray); }
[data-template="turbo"] .faq__q:focus-visible { outline: 2px solid var(--tb-accent); outline-offset: -2px; }
[data-template="turbo"] .faq__icon {
  width: auto;
  height: auto;
  background: transparent;
  border-radius: 0;
  color: var(--tb-accent);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 1;
}
[data-template="turbo"] .faq__a { padding: 0 1.25rem; }
[data-template="turbo"] .faq__item.open .faq__a { padding: 0 1.25rem 1.25rem; }
[data-template="turbo"] .faq__a p,
[data-template="turbo"] .faq__a li { color: var(--tb-body-color); }
[data-template="turbo"] .faq__a a { color: var(--tb-accent); text-decoration: underline; text-underline-offset: 3px; }

/* ─────────────────────────────────────────────────────────────
   7. FORMULÄR — Turbo .form-control (0 radie, #E4E4E4-kant, fokus #ABABAB + grå ring)
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .form-card > p,
[data-template="turbo"] .form-pane__sub { color: var(--tb-body-color); }
[data-template="turbo"] .form-wizard__note,
[data-template="turbo"] .aside-form__note {
  background: var(--tb-bg-soft);
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  color: var(--tb-body-color);
}
[data-template="turbo"] .field label,
[data-template="turbo"] .form-step__name,
[data-template="turbo"] .form-pane__title { color: var(--tb-black); }
[data-template="turbo"] .field label {
  font-family: var(--tb-body-font);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
}
[data-template="turbo"] .form-step__name {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 0.8rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
}
[data-template="turbo"] .form-pane__title {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
}
[data-template="turbo"] .field input,
[data-template="turbo"] .field textarea,
[data-template="turbo"] .field select {
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  color: var(--tb-black);
  padding: 0.9rem;
  font-family: var(--tb-body-font);
  font-size: 1.1rem;
  line-height: 1.5;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
/* Kompaktare kontroller i sidopanels-/hero-formuläret */
[data-template="turbo"] .aside-form .field input,
[data-template="turbo"] .aside-form .field textarea,
[data-template="turbo"] .aside-form .field select { padding: 0.75rem 0.85rem; font-size: 1rem; }
[data-template="turbo"] .field--check input {
  width: auto;
  padding: 0;
  border: 0;
  accent-color: var(--tb-accent);
}
[data-template="turbo"] .field input::placeholder,
[data-template="turbo"] .field textarea::placeholder,
[data-template="turbo"] .postal-check__row input::placeholder,
[data-template="turbo"] .services-search input::placeholder { color: var(--tb-gray-dark); font-weight: 400; }
[data-template="turbo"] .field input:focus,
[data-template="turbo"] .field textarea:focus,
[data-template="turbo"] .field select:focus {
  outline: none;
  border-color: var(--tb-gray-dark);
  box-shadow: 0 0 0 0.25rem var(--tb-gray);
}
[data-template="turbo"] .field--check { color: var(--tb-body-color); }
[data-template="turbo"] .field--check a { color: var(--tb-accent); text-decoration: underline; text-underline-offset: 2px; }
[data-template="turbo"] .field__info {
  border-radius: 0;
  background: rgba(var(--tb-accent-rgb), 0.12);
  color: var(--tb-accent);
  font-family: var(--tb-heading-font);
  font-style: normal;
}
[data-template="turbo"] .field__info:hover,
[data-template="turbo"] .field__info:focus-visible { background: var(--tb-accent); color: #fff; }
[data-template="turbo"] .field__info[data-tooltip]:hover::after,
[data-template="turbo"] .field__info[data-tooltip]:focus::after { background: var(--tb-black); border-radius: 0; box-shadow: none; }
[data-template="turbo"] .field__info[data-tooltip]:hover::before,
[data-template="turbo"] .field__info[data-tooltip]:focus::before { border-top-color: var(--tb-black); }
[data-template="turbo"] .form-msg,
[data-template="turbo"] .form-msg--err { border-radius: 0; }

/* Stegindikator: fyrkantiga bubblor, aktiv = accent, klar = #1F1F1F, koppling #E4E4E4 → accent */
[data-template="turbo"] .form-step::before { background: var(--tb-gray); }
[data-template="turbo"] .form-step.is-done::before,
[data-template="turbo"] .form-step.is-active::before { background: var(--tb-accent); }
[data-template="turbo"] .form-step__bubble {
  border-radius: 0;
  background: #fff;
  border: 2px solid var(--tb-gray);
  color: var(--tb-body-color);
  font-family: var(--tb-heading-font);
  font-weight: 600;
}
[data-template="turbo"] .form-step.is-active .form-step__bubble {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: #fff;
  box-shadow: none;
  transform: none;
}
[data-template="turbo"] .form-step.is-done .form-step__bubble {
  background: var(--tb-black);
  border-color: var(--tb-black);
  color: #fff;
  box-shadow: none;
}
[data-template="turbo"] .form-step.is-active .form-step__num,
[data-template="turbo"] .form-step.is-done .form-step__num { color: var(--tb-accent); }
[data-template="turbo"] .form-step.is-active .form-step__name { color: var(--tb-black); }

/* Fil-släppyta + fillista (vilande markup) */
[data-template="turbo"] .file-drop {
  background: #fff;
  border: 2px dashed var(--tb-gray);
  border-radius: 0;
  color: var(--tb-body-color);
}
[data-template="turbo"] .file-drop:hover,
[data-template="turbo"] .file-drop.is-drag { border-color: var(--tb-accent); background: var(--tb-bg-soft); color: var(--tb-accent); }
[data-template="turbo"] .file-drop__hint { color: var(--tb-body-color); }
[data-template="turbo"] .file-list li { border-radius: 0; border-color: var(--tb-gray); }

/* Adress-autocomplete */
[data-template="turbo"] .addr-ac__list {
  border-radius: 0;
  border: 1px solid var(--tb-gray);
  box-shadow: var(--tb-shadow-review);
  padding: 0;
}
[data-template="turbo"] .addr-ac__item { border-radius: 0; color: var(--tb-body-color); }
[data-template="turbo"] .addr-ac__item.is-active,
[data-template="turbo"] .addr-ac__item:hover { background: var(--tb-bg-soft); color: var(--tb-black); }

/* Boknings-wizard (vilande för turbo, hålls i systemet) */
[data-template="turbo"] .booking-wizard__dot { border-radius: 0; }
[data-template="turbo"] .booking-wizard__dot.is-active { background: var(--tb-accent); }
[data-template="turbo"] .booking-wizard__question { color: var(--tb-black); }
[data-template="turbo"] .booking-wizard__chip {
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  color: var(--tb-black);
  font-size: 0.9rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  transition: all 0.2s ease-in;
}
[data-template="turbo"] .booking-wizard__chip:hover { background: var(--tb-accent); border-color: var(--tb-accent); color: #fff; }
[data-template="turbo"] .booking-wizard__note { color: var(--tb-body-color); }

/* ─────────────────────────────────────────────────────────────
   8. POSTNUMMER-KOLL — vitt fyrkantigt kort, accentpil-knapp
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .postal-check {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding: 1.25rem 1.375rem;
}
[data-template="turbo"] .postal-check__pin { width: auto; height: auto; margin-top: 2px; }
[data-template="turbo"] .postal-check__pin svg { width: 26px; height: 26px; }
[data-template="turbo"] .postal-check__title {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1.05rem;
  letter-spacing: 0.05rem;
  text-transform: uppercase;
  color: var(--tb-black);
}
[data-template="turbo"] .postal-check__sub { color: var(--tb-body-color); }
[data-template="turbo"] .postal-check__row {
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  padding: 4px;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
[data-template="turbo"] .postal-check__row:focus-within { border-color: var(--tb-gray-dark); box-shadow: 0 0 0 0.25rem var(--tb-gray); }
[data-template="turbo"] .postal-check__row.is-invalid { border-color: rgba(166, 32, 32, 0.6); box-shadow: 0 0 0 0.25rem rgba(166, 32, 32, 0.12); }
[data-template="turbo"] .postal-check__row input {
  border: 0;
  background: transparent;
  border-radius: 0;
  color: var(--tb-black);
  font-family: var(--tb-body-font);
  font-size: 1.05rem;
  font-weight: 500;
}
[data-template="turbo"] .postal-check__hint {
  width: 40px;
  height: 40px;
  border-radius: 0;
  background: var(--tb-accent);
  color: #fff;
  box-shadow: none;
  transition: background-color 0.15s ease-in-out;
}
[data-template="turbo"] .postal-check__row:focus-within .postal-check__hint { transform: none; background: var(--tb-accent-hover); }
[data-template="turbo"] .postal-check__feedback-dot { border-radius: 0; box-shadow: none; }

/* Sökfältet över tjänste-/områdesrutorna */
[data-template="turbo"] .services-search input {
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  box-shadow: none;
  padding: 0.9rem 0.9rem 0.9rem 44px;
  font-family: var(--tb-body-font);
  font-size: 1.05rem;
  color: var(--tb-black);
}
[data-template="turbo"] .services-search input:focus { border-color: var(--tb-gray-dark); box-shadow: 0 0 0 0.25rem var(--tb-gray); }
[data-template="turbo"] .services-search input::-webkit-search-cancel-button { border-radius: 0; background: var(--tb-black); }
[data-template="turbo"] .services-search__label > svg { color: var(--tb-gray-dark); }
[data-template="turbo"] .services-search__empty { color: var(--tb-body-color); }
[data-template="turbo"] .services-search__empty a { color: var(--tb-accent); }

/* ─────────────────────────────────────────────────────────────
   9. PROCESS-STEG — Turbo #process: accentnumrering "01." (CSS-räknare, DOM orörd)
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .process__timeline { counter-reset: tb-step; }
[data-template="turbo"] .process__step { counter-increment: tb-step; }
[data-template="turbo"] .process__step::before,
[data-template="turbo"] .process__timeline--row .process__step::before { background: var(--tb-accent); }
[data-template="turbo"] .process__step:hover { border-color: var(--tb-accent); box-shadow: none; }
[data-template="turbo"] .process__step:not(:last-of-type)::after,
[data-template="turbo"] .process__timeline--row .process__step:not(:last-of-type)::after { background: var(--tb-gray); border-radius: 0; }
[data-template="turbo"] .process__check {
  width: 58px;
  height: auto;
  min-height: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--tb-accent);
  display: block;
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1.75rem;
  line-height: 1;
  padding-top: 4px;
}
[data-template="turbo"] .process__check svg { display: none; }
[data-template="turbo"] .process__check::before { content: counter(tb-step, decimal-leading-zero) "."; }
[data-template="turbo"] .process__timeline--row .process__check { width: auto; margin-top: 0; }
/* Vågrät kopplingslinje i rad-varianten centreras mot siffran (styles.css: top 52px för den runda bubblan) */
[data-template="turbo"] .process__timeline--row .process__step:not(:last-of-type)::after { top: 44px; }
[data-template="turbo"] .process__step h3 {
  color: var(--tb-black);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 1.25rem;
  letter-spacing: 0.0725rem;
}
[data-template="turbo"] .process__step p { color: var(--tb-body-color); }
[data-template="turbo"] .hub-bottom__heading { color: var(--tb-black); font-family: var(--tb-heading-font); font-weight: 500; letter-spacing: 0.0725rem; }

/* ─────────────────────────────────────────────────────────────
   10. TJÄNSTEBLOCK / HUBBSEKTIONER — vit bordad aside, fyrkantiga foton med 2px linje
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .svc-block__aside {
  background: #fff;
  border: 1px solid var(--tb-gray);
  border-radius: 0;
  padding: 2rem;
}
[data-template="turbo"] .svc-block__points li { color: var(--tb-black); }
[data-template="turbo"] .svc-block__check { background: transparent; color: var(--tb-accent); border-radius: 0; }
[data-template="turbo"] .svc-block__trustcol { border-left-color: var(--tb-gray); }
[data-template="turbo"] .svc-block__contact h3 {
  color: var(--tb-black);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
}
[data-template="turbo"] .svc-block__contact .btn {
  background: transparent;
  border: 2px solid var(--tb-black);
  color: var(--tb-black);
  box-shadow: none;
}
[data-template="turbo"] .svc-block__contact .btn:hover { background: var(--tb-accent); border-color: var(--tb-accent); color: #fff; }
[data-template="turbo"] .svc-block__gallery .services-gallery__item {
  border-radius: 0;
  border: 2px solid var(--tb-gray);
  background: var(--tb-bg-soft);
}
[data-template="turbo"] .hub-sec__media {
  border-radius: 0;
  box-shadow: none;
  border: 2px solid var(--tb-gray);
  background: var(--tb-bg-soft);
}
[data-template="turbo"] .service-prices__note { color: var(--tb-body-color); }

/* ─────────────────────────────────────────────────────────────
   11. BRÖDTEXT / LÄS MER / SNABBSVAR / INNEHÅLL / PRISTABELL
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .prose h2,
[data-template="turbo"] .prose h3,
[data-template="turbo"] .prose h4 { color: var(--tb-black); }
[data-template="turbo"] .prose p,
[data-template="turbo"] .prose li { font-size: 1.0625rem; line-height: 1.75; color: var(--tb-body-color); }
[data-template="turbo"] .prose strong { color: var(--tb-black); }
[data-template="turbo"] .prose a { color: var(--tb-accent); text-decoration: underline; text-underline-offset: 3px; }
[data-template="turbo"] .prose ul li::marker,
[data-template="turbo"] .prose ol li::marker { color: var(--tb-accent); }
[data-template="turbo"] .prose blockquote {
  border-left: 3px solid var(--tb-accent);
  background: var(--tb-bg-soft);
  border-radius: 0;
  color: var(--tb-black);
  font-family: var(--tb-body-font);
  font-style: normal;
}
[data-template="turbo"] .prose blockquote p { color: var(--tb-black); }
[data-template="turbo"] .prose figure { margin: 1.5rem 0; }
[data-template="turbo"] .prose figure img { border: 2px solid var(--tb-gray); }
[data-template="turbo"] .prose figcaption {
  margin-top: 0.5rem;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tb-body-color);
}

/* Läs mer-knappen = .tb-icon-link-idiom (versaler, accent, växande understreck) */
[data-template="turbo"] .readmore__toggle {
  display: inline-block;
  font-family: var(--tb-body-font);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: var(--tb-accent);
  padding: 0.6rem 0 0;
  min-height: 44px;
}
[data-template="turbo"] .readmore__toggle::after {
  content: "";
  display: block;
  border-bottom: 1px solid var(--tb-accent);
  width: 20%;
  margin-top: 2px;
  transition: width 0.2s ease-out;
}
[data-template="turbo"] .readmore__toggle:hover { text-decoration: none; }
[data-template="turbo"] .readmore__toggle:hover::after,
[data-template="turbo"] .readmore__toggle:focus-visible::after { width: 80%; }
[data-template="turbo"] .readmore__chevron { margin-left: 0.4rem; font-size: 0.8rem; }
/* Toningen ska matcha sektionens yta (vit resp. #F6F6F6) */
[data-template="turbo"] .readmore.is-clamped .readmore__content::after { background: linear-gradient(to bottom, transparent 0%, #fff 92%); }
html[data-template="turbo"] .section:nth-of-type(even) .readmore.is-clamped .readmore__content::after,
[data-template="turbo"] .section[style*="bg-soft"] .readmore.is-clamped .readmore__content::after { background: linear-gradient(to bottom, transparent 0%, var(--tb-bg-soft) 92%); }

/* Snabbsvar i bloggartikel (saknar bas-CSS) */
[data-template="turbo"] .snabbsvar {
  background: var(--tb-bg-soft);
  border-left: 4px solid var(--tb-accent);
  padding: 1.25rem 1.5rem 1rem;
}
[data-template="turbo"] .snabbsvar__label,
[data-template="turbo"] .snabbsvar > strong { margin-bottom: 0.5rem; }

/* Innehållsförteckning + inline-länkar i bloggartikel */
[data-template="turbo"] .blog-toc { border-radius: 0; }
[data-template="turbo"] .blog-toc__list { border-left: 2px solid var(--tb-gray); }
[data-template="turbo"] .blog-toc__list a { color: var(--tb-body-color); border-radius: 0; }
[data-template="turbo"] .blog-toc__list a:hover { color: var(--tb-black); }
[data-template="turbo"] .blog-toc__list a.is-active { color: var(--tb-accent); border-left-color: var(--tb-accent); }
[data-template="turbo"] .inline-related { background: var(--tb-bg-soft); border-left: 2px solid var(--tb-accent); border-radius: 0; }
[data-template="turbo"] .inline-related a { color: var(--tb-accent); }
[data-template="turbo"] .inline-related a:hover { color: var(--tb-accent-hover); }
[data-template="turbo"] .article__meta { color: var(--tb-body-color); }
[data-template="turbo"] .article__cover { border-radius: 0; background: var(--tb-black); }
[data-template="turbo"] .article__cover::after { display: none; }

/* Pristabell */
[data-template="turbo"] .price-table { color: var(--tb-body-color); }
[data-template="turbo"] .price-table th {
  background: var(--tb-bg-soft);
  color: var(--tb-black);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 0.9rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
}
[data-template="turbo"] .price-table th,
[data-template="turbo"] .price-table td { border-bottom-color: var(--tb-gray); }
[data-template="turbo"] .price-table .num {
  color: var(--tb-black);
  font-family: var(--tb-heading-font);
  font-weight: 500;
  letter-spacing: 0.03rem;
}
html[data-template="turbo"] .datapoint { background: var(--tb-bg-soft); }
[data-template="turbo"] .datapoint__num { color: var(--tb-accent); font-family: var(--tb-heading-font); font-weight: 600; }
[data-template="turbo"] .datapoint__lab { color: var(--tb-body-color); }
[data-template="turbo"] .testimonial blockquote { color: var(--tb-black); font-family: var(--tb-body-font); }
[data-template="turbo"] .testimonial cite { color: var(--tb-body-color); }
[data-template="turbo"] .testimonial__visual { background: var(--tb-dark); border-radius: 0; }
[data-template="turbo"] .testimonial__visual::after { display: none; }

/* ─────────────────────────────────────────────────────────────
   12. BLOGGHUBB — .blog-content-rader, .blog-topic, filter-chips, paginering
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .article-card:hover,
html[data-template="turbo"] .article-featured:hover {
  transform: none;
  border-color: var(--tb-gray);
  background: var(--tb-bg-soft);
  box-shadow: none;
}
[data-template="turbo"] .article-card__body h3,
[data-template="turbo"] .article-featured__body h2 { color: var(--tb-black); transition: color 0.3s ease-in; }
[data-template="turbo"] .article-card:hover .article-card__body h3,
[data-template="turbo"] .article-featured:hover .article-featured__body h2 { color: var(--tb-accent); }
/* Datum/lästid = accentsiffra i Oswald (Turbo h4.heading-color), ämne = .blog-topic */
[data-template="turbo"] .article-meta {
  font-family: var(--tb-heading-font);
  font-weight: 500;
  font-size: 0.8rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  color: var(--tb-accent);
}
[data-template="turbo"] .article-meta span + span::before { color: var(--tb-gray-dark); }
[data-template="turbo"] .article-badge {
  border-radius: 0;
  padding: 0;
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  color: var(--tb-body-color);
}
[data-template="turbo"] .article-badge--onmedia {
  background: #fff;
  color: var(--tb-black);
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding: 5px 10px;
}
[data-template="turbo"] .article-empty { border-radius: 0; background: var(--tb-bg-soft); color: var(--tb-body-color); }
[data-template="turbo"] .article-filter { background: transparent; border: 0; border-radius: 0; padding: 0; gap: 10px; }
[data-template="turbo"] .article-filter__chip,
[data-template="turbo"] .pagination__btn {
  border: 1px solid var(--tb-gray);
  background: transparent;
  color: var(--tb-black);
  border-radius: 0;
  font-family: var(--tb-body-font);
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
  box-shadow: none;
  transition: all 0.2s ease-in;
}
[data-template="turbo"] .article-filter__chip { padding: 0.5rem 1.25rem; }
[data-template="turbo"] .article-filter__chip:hover,
[data-template="turbo"] .pagination__btn:hover:not(:disabled):not(.is-active) {
  background: var(--tb-accent);
  border-color: var(--tb-accent);
  color: #fff;
  transform: none;
}
[data-template="turbo"] .article-filter__chip.is-active { background: var(--tb-accent); border-color: var(--tb-accent); color: #fff; box-shadow: none; }
/* Turbo .pagination: aktiv sida = #1F1F1F med #ABABAB-kant */
[data-template="turbo"] .pagination__btn.is-active { background: var(--tb-black); border-color: var(--tb-gray-dark); color: #fff; box-shadow: none; }
[data-template="turbo"] .pagination__btn:focus-visible { outline: 3px solid var(--tb-accent); }
[data-template="turbo"] .article-filter__count { border-radius: 0; background: var(--tb-bg-soft); color: var(--tb-body-color); }
[data-template="turbo"] .article-filter__chip.is-active .article-filter__count { background: rgba(255, 255, 255, 0.2); color: #fff; }
[data-template="turbo"] .pagination__gap,
[data-template="turbo"] .pagination__status { color: var(--tb-body-color); }
[data-template="turbo"] .pagination__status strong { color: var(--tb-black); }

/* ─────────────────────────────────────────────────────────────
   13. CTA-STRIP — Turbo #project-band: #101010 (eller foto + overlay via .tb-cta-band)
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .cta-strip {
  background: var(--tb-dark);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #fff;
}
[data-template="turbo"] .cta-strip::before,
[data-template="turbo"] .cta-strip::after { display: none; }
html[data-template="turbo"] .cta-strip h2 {
  color: #fff;
  font-family: var(--tb-heading-font);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.0725rem;
  line-height: 1.2;
  font-size: clamp(2.1rem, 1.475rem + 2.7vw, 3.5rem);
}
html[data-template="turbo"] .cta-strip p { color: #D0D0D0; }
html[data-template="turbo"] .cta-strip .btn--primary {
  background: var(--tb-accent);
  color: #fff;
  border-color: var(--tb-accent);
  box-shadow: none;
}
html[data-template="turbo"] .cta-strip .btn--primary:hover { background: var(--tb-accent-hover); border-color: var(--tb-accent-hover); color: #fff; }
html[data-template="turbo"] .cta-strip .btn--ghost {
  background: transparent;
  color: #fff;
  border: 2px solid #fff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-template="turbo"] .cta-strip .btn--ghost:hover { background: var(--tb-accent); border-color: var(--tb-accent); color: #fff; }

/* .tb-cta-band (fotoband runt CTA-stripen) deklareras EN gång i startside-avsnittet (10. CTA-BAND). */

/* ─────────────────────────────────────────────────────────────
   14. ÖVRIGT DELAT — bildspel (/tjanster), mobilbar, cookie-banner, marquees
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .hub-areas-link p { color: var(--tb-body-color); }
[data-template="turbo"] .hub-areas-link a { color: var(--tb-accent); }
[data-template="turbo"] .hub-areas-link a:hover { color: var(--tb-accent-hover); }

/* Hero-bildspelet på /tjanster: fyrkantig scen, vita 2px-pilar (Turbo #project-pilar) */
[data-template="turbo"] .hero-carousel__stage { border-radius: 0; box-shadow: none; background: var(--tb-dark); }
[data-template="turbo"] .hero-slide:focus-visible { border-radius: 0; }
[data-template="turbo"] .hero-slide__placeholder { background: var(--tb-dark); }
[data-template="turbo"] .hero-slide__eyebrow {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: var(--tb-accent);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.28125rem;
}
[data-template="turbo"] .hero-slide__title {
  font-family: var(--tb-heading-font);
  font-weight: 600;
  letter-spacing: 0.0725rem;
  text-transform: uppercase;
  text-shadow: none;
}
[data-template="turbo"] .hero-slide__cta {
  background: transparent;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 0;
  box-shadow: none;
  padding: 0.6rem 1.1rem;
  font-family: var(--tb-body-font);
  font-weight: 600;
  letter-spacing: 0.075rem;
  text-transform: uppercase;
}
[data-template="turbo"] .hero-slide__cta:hover { background: var(--tb-accent); border-color: var(--tb-accent); color: #fff; transform: none; }
[data-template="turbo"] .hero-slide__arrow { background: transparent; color: inherit; border-radius: 0; width: auto; height: auto; }
[data-template="turbo"] .hero-slide__cta:hover .hero-slide__arrow { background: transparent; color: #fff; }
[data-template="turbo"] .hero-carousel__nav {
  background: transparent;
  border: 2px solid #fff;
  border-radius: 0;
  color: #fff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-template="turbo"] .hero-carousel__nav:hover { background: var(--tb-accent); border-color: var(--tb-accent); color: #fff; transform: translateY(-50%); }
[data-template="turbo"] .hero-carousel__nav:focus-visible { outline: 3px solid var(--tb-accent); }
[data-template="turbo"] .hero-carousel__nav--prev { left: 14px; }
[data-template="turbo"] .hero-carousel__nav--next { right: 14px; }
[data-template="turbo"] .hero-carousel__dots {
  background: rgba(16, 16, 16, 0.6);
  border: 0;
  border-radius: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-template="turbo"] .hero-carousel__dot { border-radius: 0; }
[data-template="turbo"] .hero-carousel__dot.is-active { border-radius: 0; background: var(--tb-accent); }

/* Fast mobilbar (.mobile-call-bar, renderas av layout för alla mallar): stilas i chrome-avsnittet —
   inga regler här (en deklaration per sak). */

/* Cookie-samtycke */
[data-template="turbo"] .cookie-banner { background: #fff; border-top: 2px solid var(--tb-gray); box-shadow: none; }
[data-template="turbo"] .cookie-banner__text { color: var(--tb-body-color); }
[data-template="turbo"] .cookie-banner__text a { color: var(--tb-accent); }
[data-template="turbo"] .cookie-banner__btn { border-radius: 0; }
[data-template="turbo"] .cookie-banner__btn--ghost { background: transparent; border: 2px solid var(--tb-black); color: var(--tb-black); box-shadow: none; }
[data-template="turbo"] .cookie-banner__btn--ghost:hover { border-color: var(--tb-accent); background: var(--tb-accent); color: #fff; }

/* Logga-/fotokaruseller (renderas av default-startsidan; hålls koherenta) */
[data-template="turbo"] .logo-marquee__item { border-radius: 0; box-shadow: none; }
[data-template="turbo"] .vphoto,
[data-template="turbo"] .vphoto__card { border-radius: 0; }
[data-template="turbo"] .vphoto__card { box-shadow: none; background: var(--tb-bg-soft); }
[data-template="turbo"] .vphoto__cap { background: linear-gradient(0deg, rgba(16, 16, 16, 0.85), transparent); }

/* ─────────────────────────────────────────────────────────────
   15. CERTIFIKAT-MARQUEE (CertMarquee renderar .te-section.te-certs …).
   terra.css läcker bara .te-*-regler; allt återdeklareras här i Turbos design:
   vit yta med 2px linjer, .tb-header-top-eyebrow, gråskalade loggor som färgas vid hover.
   ───────────────────────────────────────────────────────────── */
[data-template="turbo"] .te-section.te-certs {
  padding: 2.5rem 0;
  background: #fff;
  border-top: var(--tb-border);
  border-bottom: var(--tb-border);
}
[data-template="turbo"] .te-certs .te-section__inner { max-width: 1320px; margin: 0 auto; padding: 0 24px; }
[data-template="turbo"] .te-certs__head { text-align: center; margin-bottom: 1.75rem; }
[data-template="turbo"] .te-certs .te-eyebrow {
  display: inline-block;
  gap: 0;
  font-family: var(--tb-body-font);
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.28125rem;
  text-transform: uppercase;
  line-height: normal;
  color: var(--tb-accent);
}
[data-template="turbo"] .te-certs .te-eyebrow::before { content: none; display: none; }
[data-template="turbo"] .te-certs__marquee {
  position: relative;
  overflow: hidden;
  width: 100%;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
[data-template="turbo"] .te-certs__track {
  display: flex;
  width: max-content;
  align-items: flex-start;
  animation: tb-certs-scroll 48s linear infinite;
  will-change: transform;
}
[data-template="turbo"] .te-certs__marquee:hover .te-certs__track,
[data-template="turbo"] .te-certs__marquee:focus-within .te-certs__track { animation-play-state: paused; }
[data-template="turbo"] .te-certs__item {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 0 44px;
  text-decoration: none;
  color: inherit;
  background: #fff;
}
[data-template="turbo"] .te-certs__item:focus-visible { outline: 2px solid var(--tb-accent); outline-offset: 4px; }
[data-template="turbo"] .te-certs__logo {
  height: 72px;
  width: auto;
  max-width: 200px;
  object-fit: contain;
  filter: none; /* emblemen i sina riktiga färger */
  opacity: 1;
  mix-blend-mode: normal;
  transition: filter 0.25s ease, opacity 0.25s ease, transform 0.25s ease;
}
[data-template="turbo"] .te-certs__cap {
  font-family: var(--tb-body-font);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: 1.3;
  text-align: center;
  max-width: 190px;
  color: var(--tb-body-color);
  transition: color 0.2s ease;
}
[data-template="turbo"] .te-certs__item:hover .te-certs__logo,
[data-template="turbo"] .te-certs__item:focus-visible .te-certs__logo { filter: none; opacity: 1; transform: scale(1.04); }
[data-template="turbo"] .te-certs__item:hover .te-certs__cap,
[data-template="turbo"] .te-certs__item:focus-visible .te-certs__cap { color: var(--tb-black); }
@keyframes tb-certs-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  [data-template="turbo"] .te-certs__track { animation: none; flex-wrap: wrap; justify-content: center; width: 100%; gap: 24px 8px; }
  [data-template="turbo"] .te-certs__marquee { -webkit-mask-image: none; mask-image: none; }
}
@media (max-width: 640px) {
  [data-template="turbo"] .te-section.te-certs { padding: 2rem 0; }
  [data-template="turbo"] .te-certs__item { padding: 0 26px; gap: 10px; }
  [data-template="turbo"] .te-certs__logo { height: 54px; max-width: 150px; }
  [data-template="turbo"] .te-certs__cap { font-size: 0.75rem; max-width: 150px; }
}

/* ─────────────────────────────────────────────────────────────
   16. QA — delade komponenter på MÖRKA ytor (.tb-on-dark) + vita kort på hero-bandet
   .tb-on-dark = generisk mörk yta (inre sidor/band): trust-bandet nollställs och
   etiketter/betyg blir vita.
   ───────────────────────────────────────────────────────────── */
html[data-template="turbo"] .tb-on-dark .trusted {
  margin-top: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
[data-template="turbo"] .tb-on-dark .trusted__label { color: rgba(255, 255, 255, 0.7); }
[data-template="turbo"] .tb-on-dark .trusted__google-rating { color: #fff; }
[data-template="turbo"] .tb-on-dark .trusted__google-sub { color: rgba(255, 255, 255, 0.7); }
/* Postnummer-kollen och offertformuläret förblir vita kort på mörka band —
   2px ram, samma som startside-avsnittet (.tb-hero__postal .postal-check / .tb-hero__form .form-card) */
html[data-template="turbo"] .tb-hero .postal-check,
html[data-template="turbo"] .tb-on-dark .postal-check,
html[data-template="turbo"] .tb-hero .form-card,
html[data-template="turbo"] .tb-on-dark .form-card {
  background: #fff;
  border: 2px solid var(--tb-gray);
  border-radius: 0;
  box-shadow: none;
}

/* ─────────────────────────────────────────────────────────────
   18. ANIMATIONER (reduced-motion-säkrade) — Turbos zoom-out-känsla, .5s
   Kort med data-reveal styrs av RevealObserver och animeras inte här.
   fill-mode backwards → hover-transform fungerar efter att animationen är klar.
   ───────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: no-preference) {
  @keyframes tb-card-in {
    from { opacity: 0; transform: scale(1.04); }
    to   { opacity: 1; transform: none; }
  }
  [data-template="turbo"] .section .card:not([data-reveal]),
  [data-template="turbo"] .area-service-card:not([data-reveal]),
  [data-template="turbo"] .article-card:not([data-reveal]),
  [data-template="turbo"] .hub-mini__card:not([data-reveal]) { animation: tb-card-in 0.5s ease backwards; }
  [data-template="turbo"] .section .card:not([data-reveal]):nth-child(2),
  [data-template="turbo"] .article-card:not([data-reveal]):nth-child(2) { animation-delay: 0.06s; }
  [data-template="turbo"] .section .card:not([data-reveal]):nth-child(3),
  [data-template="turbo"] .article-card:not([data-reveal]):nth-child(3) { animation-delay: 0.12s; }
  [data-template="turbo"] .section .card:not([data-reveal]):nth-child(4) { animation-delay: 0.18s; }
  [data-template="turbo"] .card__icon,
  [data-template="turbo"] .sitemap-block__icon,
  [data-template="turbo"] .hub-mini__ico { transition: transform 0.3s ease; }
  [data-template="turbo"] .card:hover .card__icon,
  [data-template="turbo"] .sitemap-block:hover .sitemap-block__icon { transform: translateY(-2px); }
  [data-template="turbo"] .faq__icon { transition: transform 0.2s ease-in-out; }
  [data-template="turbo"] .article-tool,
  [data-template="turbo"] .other-services__card,
  [data-template="turbo"] .hub-mini__card { transition: background-color 0.2s ease-in, border-color 0.2s ease-in, transform 0.25s ease; }
}

/* ─────────────────────────────────────────────────────────────
   19. RESPONSIVT
   ───────────────────────────────────────────────────────────── */
@media (max-width: 767.98px) {
  html[data-template="turbo"] .subhero { padding: calc(var(--tb-header-h) + 2.5rem) 0 3rem; }
  html[data-template="turbo"] .article-hero,
  html[data-template="turbo"] .contact-hero { padding: calc(var(--tb-header-h) + 2.5rem) 0 2.5rem; }
  html[data-template="turbo"] .hero { padding-top: calc(var(--tb-header-h) + 2.5rem); }
  [data-template="turbo"] .svc-block__aside { padding: 1.5rem; }
  [data-template="turbo"] .contact-hero__form .form-card { padding: 1.5rem; }
}
@media (max-width: 520px) {
  [data-template="turbo"] .faq__q { padding: 1rem; font-size: 0.95rem; }
  [data-template="turbo"] .faq__a { padding: 0 1rem; }
  [data-template="turbo"] .faq__item.open .faq__a { padding: 0 1rem 1rem; }
  [data-template="turbo"] .field input,
  [data-template="turbo"] .field textarea,
  [data-template="turbo"] .field select { font-size: 1rem; padding: 0.8rem; }
  [data-template="turbo"] .postal-check__hint { width: 36px; height: 36px; }
  [data-template="turbo"] .process__check { font-size: 1.5rem; }
  html[data-template="turbo"] .subhero__crumbs,
  html[data-template="turbo"] .subhero__crumbs a { font-size: 0.75rem; letter-spacing: 0.1em; }
}

/* ═══ RESPONSIVT / TOUCH — iOS safe-area, tappytor, radbrytning (mobile-first) ═══ */
/* Hemindikator på iPhone: knappraden och cookie-bannern får inte ligga under den */
[data-template="turbo"] .mobile-call-bar { padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
[data-template="turbo"] .cookie-banner { z-index: 1035; padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px)); } /* under offcanvas (1045), över header */
@media (max-width: 780px) {
  [data-template="turbo"] body { padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)); }
}
[data-template="turbo"] .tb-offcanvas { padding-right: env(safe-area-inset-right, 0px); }
[data-template="turbo"] .tb-offcanvas .tb-offcanvas__cta { white-space: normal; text-align: center; }
/* Långa svenska ord får aldrig spränga kolumner/kort */
[data-template="turbo"] .tb-service__title,
[data-template="turbo"] .tb-usp__title,
[data-template="turbo"] .tb-process__h,
[data-template="turbo"] .tb-fact__value,
[data-template="turbo"] .subhero h1,
[data-template="turbo"] .hub-mini__card,
[data-template="turbo"] .card h3 { overflow-wrap: anywhere; word-break: break-word; min-width: 0; }
/* Tappytor ≥ 44px */
[data-template="turbo"] .subhero__crumbs a { display: inline-block; padding: 0.75rem 0; }
[data-template="turbo"] .blog-toc__list a { display: block; min-height: 44px; padding-top: 0.6rem; padding-bottom: 0.6rem; }
[data-template="turbo"] .pagination__btn { min-height: 44px; min-width: 44px; }
[data-template="turbo"] .tb-footer__bottom a { display: inline-block; padding: 0.7rem 0; }
[data-template="turbo"] .field__info { background: rgba(var(--tb-accent-rgb), 0.12); color: var(--tb-accent); }
/* Video i heron pausas för användare som bett om mindre rörelse (bakgrundsfotot ligger kvar) */
@media (prefers-reduced-motion: reduce) {
  [data-template="turbo"] .tb-hero__video { display: none; }
}
/* OBS: ingen overflow-x på <html> — det gör body till scroll-container och bryter position:sticky (bloggens sidokolumn). */