/* © Haut Forvalting AS (Org.nr. 931 603 760) — Altibedrift.
 * Konfidensiell arkitektur/arbeidsdokument. Uautorisert kopiering/distribusjon forbudt.
 * MTA output with scoped reduced-motion and pseudo-element cleanup.
 */
/* ==========================================================================
   MTA — MORPHE TRANSFORMATION ARCHITECT
   TARGET: WEBSJEKK-PAGE-SURFACE-004 (/innsikt/markedsforing/)
   SCOPE: html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main
   FILE: synlighet-motion-haut-v1.css
   ========================================================================== */

html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main {
  --mta-ease: cubic-bezier(0.2, 0, 0, 1);
  --mta-trans: 180ms var(--mta-ease);
}

/* 1. Taktil mikrobevegelse (Knapper, lenker, native summary) */
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main a,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main button,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main summary {
  transition: transform var(--mta-trans), box-shadow var(--mta-trans), filter var(--mta-trans);
}

/* Active / Pressed-tilstand (Gjelder Touch og Mus) */
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main a:active,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main button:active,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main summary:active {
  transform: scale(0.98);
}

/* 2. Fokus: Tydelig 3px #397651 med hvit kontrastkant for universell utforming */
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main :is(a, button, summary, input):focus-visible {
  outline: 3px solid #397651 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #ffffff !important;
  border-radius: 2px;
}

/* 3. Hover (Kun for fine pointer. IKKE hover-løft på ikke-klikkbare kort) */
@media (hover: hover) and (pointer: fine) {
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main a:hover,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main button:hover,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main summary:hover {
    filter: brightness(1.05);
  }

  /* Løft gjelder kun eksakte CTA-knapper og eksplisitte lenkekort, ikke base-kort */
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .button--primary:hover,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .insight-editorial-exit__primary:hover,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .insight-editorial-exit__secondary:hover,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .traffic-journey__link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(16, 39, 36, 0.08);
  }
}

/* 4. Native details åpning (Engangs 180ms lav translateY, ingen opacity/height animasjon. Respekterer skjulte native states) */
@keyframes mta-syn-details-reveal-v1 {
  0% { transform: translateY(-2px); }
  100% { transform: translateY(0); }
}

html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main details[open] summary ~ * {
  animation: mta-syn-details-reveal-v1 180ms cubic-bezier(0.2, 0, 0, 1);
}

/* 5. Nøytraliser gamle uendelige kontinuerlige animasjoner (bevarer layout og statisk SVG geometri) */
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .ws-exit-brand,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .ws-exit-brand * {
  animation: none !important;
}

/* 6. Reduced Motion (Målrettet fjerning av transition/animation, IKKE universal transform:none som ødelegger SVG-rom) */
@media (prefers-reduced-motion: reduce) {
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main a,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main button,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main summary,
  html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main details[open] summary ~ * {
    transition: none !important;
    animation: none !important;
  }
}

html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .ws-exit-brand *::before,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main .ws-exit-brand *::after { animation:none !important; }
@media(prefers-reduced-motion:reduce) {
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main :is(a,button,summary):is(:hover,:active) { transform:none !important; }
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main *,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main *::before,
html body[data-ws-experience="2"][data-ws-synlighet-surface="1"] main *::after { animation:none !important; transition:none !important; }
}
