/* ===================================================
   ADALI — nettside-stiler
   =================================================== */

/* Selvhostede skrifter (latin) – erstatter Google Fonts (raskere + ingen ekstern henting) */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 500;font-display:swap;src:url(fonts/fraunces-latin.woff2) format('woff2');}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/fraunces-italic-latin.woff2) format('woff2');}
@font-face{font-family:'Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/geist-vf.woff2) format('woff2');}

:root {
  --ink: #0A1B3D;
  --ink-deep: #050E22;
  --blue: #1E4FD4;
  --blue-bright: #2F62EA; /* mørknet litt for lesbar kontrast (>=4.5:1) på lys bakgrunn */
  --blue-soft: #E8EFFE;
  --blue-mist: #F4F7FE;
  --paper: #FBFCFE;
  --line: #DDE3F0;
  --muted: #5E6680;
  --accent: #C9D6F7;

  /* ===== AVSTANDSSYSTEM — jevn rytme på mobil, tablet og desktop ===== */
  /* Fast luft-skala (bruk disse i stedet for tilfeldige px-verdier) */
  --space-3xs: 4px;
  --space-2xs: 8px;
  --space-xs: 12px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-2xl: 64px;
  --space-3xl: 96px;
  /* Flytende luft som skalerer jevnt (ingen harde hopp mellom skjermer) */
  --section-y: clamp(56px, 7vw, 96px);  /* loddrett luft mellom seksjoner */
  --gutter:    clamp(20px, 5vw, 32px);  /* sidemarg (container) */
  --flow:      clamp(40px, 6vw, 64px);  /* luft mellom overskrift og innhold */
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

/* Synlig tastaturfokus på lenker og knapper (universell utforming) */
a:focus-visible,
button:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 2px;
  border-radius: 3px;
}

/* «Hopp til innhold»-lenke: skjult til man tabber til den */
.skip-link {
  position: absolute;
  left: 8px;
  top: -60px;
  background: var(--ink);
  color: #fff;
  padding: 10px 16px;
  border-radius: 8px;
  z-index: 2000;
  text-decoration: none;
  font-weight: 600;
  transition: top 0.2s ease;
}
.skip-link:focus { top: 8px; }

body {
  font-family: 'Geist', -apple-system, sans-serif;
  background: var(--paper);
  color: var(--ink);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

.display { font-family: 'Fraunces', Georgia, serif; font-weight: 400; letter-spacing: -0.02em; }

.container { max-width: 1320px; margin: 0 auto; padding: 0 var(--gutter); }

/* ===== NAV ===== */
nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  padding: 20px 0;
  background: #FFFFFF;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s ease;
}

nav.scrolled { border-bottom-color: var(--line); }

.nav-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 10px;
}

.logo-mark {
  width: 38px;
  height: 28px;
  flex-shrink: 0;
  display: block;
}

.nav-links { display: flex; gap: 36px; align-items: center; }
.nav-links a {
  color: var(--ink);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  position: relative;
  transition: color 0.2s;
}
.nav-links a:hover { color: var(--blue); }
.nav-links a.cta {
  background: var(--ink);
  color: white;
  padding: 10px 20px;
  border-radius: 100px;
  transition: all 0.3s;
}
.nav-links a.cta:hover { background: var(--blue); color: white; transform: translateY(-1px); }

.menu-toggle { display: none; background: none; border: none; cursor: pointer; padding: 12px; }
.menu-toggle span { display: block; width: 22px; height: 2px; background: var(--ink); margin: 5px 0; transition: 0.3s; }
.menu-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle.open span:nth-child(2) { opacity: 0; }
.menu-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ===== HERO ===== */
.hero {
  padding: 108px 0 56px;
  position: relative;
  overflow: hidden;
}

.hero-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 80px;
  align-items: end;
}

.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 32px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 500;
}
.hero-eyebrow::before {
  content: '';
  width: 32px;
  height: 1px;
  background: var(--blue);
}

.hero h1 {
  font-family: 'Fraunces', serif;
  font-size: clamp(48px, 7vw, 96px);
  line-height: 0.95;
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 32px;
  letter-spacing: -0.03em;
}
.hero h1 em {
  font-style: italic;
  font-weight: 400;
  color: var(--blue);
}
.hero h1 .underline {
  position: relative;
  display: inline-block;
}
.hero h1 .underline::after {
  content: '';
  position: absolute;
  bottom: 0.08em;
  left: 0;
  right: 0;
  height: 0.06em;
  background: var(--blue);
  opacity: 0.3;
}

/* Hero linjer — synlig fra start */
.hero-line {
  display: block;
}

.hero-side {
  padding-bottom: 8px;
}

.hero-side p {
  font-size: 17px;
  color: var(--muted);
  line-height: 1.55;
  margin-bottom: 32px;
  max-width: 380px;
}

.hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }

.hero-shortcut { margin-top: 16px; }

/* Generisk kort — brukt på SEO-/undersider (webdesign-oslo, prosjekter m.fl.) */
.card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 28px;
}
.card h3 {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  line-height: 1.2;
  margin: 0 0 10px;
  color: var(--ink);
}
.card p { color: var(--muted); line-height: 1.6; margin: 0 0 10px; }
.card p:last-child { margin-bottom: 0; }
.card img { max-width: 100%; height: auto; display: block; border-radius: 10px; margin-bottom: 18px; }

.btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 16px 28px;
  border-radius: 100px;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s;
  cursor: pointer;
  border: none;
  font-family: inherit;
}
.btn-primary {
  background: var(--ink);
  color: white;
}
.btn-primary:hover { background: var(--blue); transform: translateY(-2px); box-shadow: 0 12px 32px rgba(30, 79, 212, 0.25); }
.btn-secondary {
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
}
.btn-secondary:hover { background: var(--blue-mist); border-color: var(--blue); }

.btn .arrow { transition: transform 0.3s; }
.btn:hover .arrow { transform: translateX(4px); }

/* Hero stats strip */
.hero-stats {
  margin-top: var(--flow);
  padding: 32px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.stat-item .num {
  font-family: 'Fraunces', serif;
  font-size: 40px;
  line-height: 1;
  color: var(--ink);
  font-weight: 400;
  margin-bottom: 6px;
  letter-spacing: -0.02em;
}
.stat-item .num em { font-style: italic; color: var(--blue); }
.stat-item .label {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* ===== SECTIONS ===== */
section { padding: var(--section-y) 0; position: relative; }

.section-label {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--blue);
  font-weight: 600;
  margin-bottom: 20px;
}
.section-label::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--blue);
  border-radius: 50%;
}

.section-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.05;
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 24px;
  letter-spacing: -0.025em;
  max-width: 900px;
}
.section-title em { font-style: italic; color: var(--blue); font-weight: 400; }

.section-intro {
  font-size: 18px;
  color: var(--muted);
  max-width: 620px;
  line-height: 1.6;
}

/* ===== PORTFOLIO ===== */
.portfolio { background: var(--paper); }

.portfolio-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
  gap: 40px;
  flex-wrap: wrap;
}

.project-card {
  background: white;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid var(--line);
  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
  position: relative;
}
.project-card:hover {
  transform: translateY(-6px);
  border-color: var(--blue);
  box-shadow: 0 30px 60px -20px rgba(30, 79, 212, 0.18);
}

.project-visual {
  aspect-ratio: 16 / 10;
  background: linear-gradient(135deg, #0A1B3D 0%, #1E4FD4 100%);
  position: relative;
  overflow: hidden;
}

/* ===== PROJECT SHOWCASE (magasin-stil) ===== */
.project-showcase {
  background: linear-gradient(135deg, #F7F4EF 0%, #EFE9DF 100%);
  padding: 40px 40px 0;
  position: relative;
  overflow: hidden;
}

.project-showcase::before {
  content: '';
  position: absolute;
  top: -100px;
  right: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(30, 79, 212, 0.06) 0%, transparent 70%);
  pointer-events: none;
}

.showcase-bg {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 36px;
  align-items: end;
}

.showcase-badge {
  position: absolute;
  top: -12px;
  left: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: white;
  padding: 7px 14px;
  border-radius: 100px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--ink);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  z-index: 2;
}
.badge-dot {
  width: 8px;
  height: 8px;
  background: #22C55E;
  border-radius: 50%;
  animation: pulse 2s infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.showcase-title {
  padding-bottom: 40px;
}
.showcase-eyebrow {
  display: block;
  font-size: 10px;
  letter-spacing: 0.14em;
  color: #8B7B6B;
  font-weight: 600;
  margin-bottom: 14px;
}
.showcase-title h4 {
  font-family: 'Fraunces', serif;
  font-size: clamp(24px, 2.8vw, 34px);
  line-height: 1.05;
  font-weight: 300;
  color: #243524;
  letter-spacing: -0.02em;
  margin-bottom: 14px;
}
.showcase-title h4 em {
  font-style: italic;
  color: #243524;
  font-weight: 400;
}
.showcase-title p {
  font-size: 13px;
  line-height: 1.55;
  color: #6B5D4F;
  max-width: 340px;
}

.showcase-products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding-bottom: 0;
}

.showcase-product {
  aspect-ratio: 3/4;
  background: white;
  border-radius: 10px 10px 0 0;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  transition: transform 0.5s ease;
}
.showcase-product:nth-child(1) { transform: translateY(20px); }
.showcase-product:nth-child(2) { transform: translateY(-10px); }
.showcase-product:nth-child(3) { transform: translateY(30px); }

.project-card:hover .showcase-product:nth-child(1) { transform: translateY(10px); }
.project-card:hover .showcase-product:nth-child(2) { transform: translateY(-20px); }
.project-card:hover .showcase-product:nth-child(3) { transform: translateY(20px); }

.showcase-product img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ===== MEDENTLY CASE — kompakt blå variant av showcase ===== */
.project-showcase.medently-showcase {
  background:
    radial-gradient(circle at 0% 0%, rgba(30, 79, 212, 0.06) 0%, transparent 50%),
    linear-gradient(135deg, #F4F7FE 0%, #E8EFFE 100%);
}

.project-showcase.medently-showcase::before {
  background: radial-gradient(circle, rgba(59, 111, 245, 0.12) 0%, transparent 70%);
}

.medently-eyebrow {
  color: var(--blue) !important;
}

.medently-h4 {
  color: var(--ink) !important;
}
.medently-h4 em {
  color: var(--blue) !important;
  font-style: italic;
  font-weight: 400;
}

.medently-p {
  color: var(--muted) !important;
}

/* Sørg for at Medently sine bilder fyller boksen pent */
.medently-showcase .showcase-product {
  background: white;
}
.medently-showcase .showcase-product img {
  object-fit: cover;
  object-position: center top;
}

/* ===== Legacy mockup (kept for backwards compatibility) ===== */
.sofa-mockup {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
}

.browser-window {
  width: 100%;
  max-width: 540px;
  background: #FBFCFE;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
  transform: rotate(-2deg);
  transition: transform 0.5s ease;
}
.project-card:hover .browser-window { transform: rotate(0deg) scale(1.02); }

.browser-bar {
  background: #F0F2F7;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid #E5E8F0;
}
.browser-bar .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #DDE3F0;
}
.browser-bar .url {
  margin-left: 12px;
  font-size: 10px;
  color: #6B7591;
  background: white;
  padding: 3px 12px;
  border-radius: 4px;
  flex: 1;
  text-align: center;
}

.browser-content {
  padding: 24px;
  background: #F7F4EF;
  min-height: 220px;
}
.browser-content .mockup-nav {
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: #243524;
  font-weight: 500;
  margin-bottom: 18px;
  padding-bottom: 10px;
  border-bottom: 1px solid #E8E1D8;
}
.browser-content .mockup-title {
  font-family: 'Fraunces', serif;
  font-size: 24px;
  color: #243524;
  line-height: 1.1;
  margin-bottom: 12px;
}
.browser-content .mockup-sub {
  font-size: 10px;
  color: #8B7B6B;
  margin-bottom: 16px;
}
.mockup-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.mockup-grid div {
  aspect-ratio: 1;
  background: #E8E1D8;
  border-radius: 3px;
}
.mockup-grid div:nth-child(2) { background: #C4B8A8; }
.mockup-grid div:nth-child(3) { background: #243524; }

.project-info {
  padding: 32px 40px 36px;
}

.project-meta {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 500;
}
.project-meta span:not(:last-child)::after {
  content: '·';
  margin-left: 12px;
  color: var(--accent);
}

.project-title {
  font-family: 'Fraunces', serif;
  font-size: 32px;
  color: var(--ink);
  margin-bottom: 12px;
  font-weight: 400;
  letter-spacing: -0.02em;
}

.project-desc {
  color: var(--muted);
  margin-bottom: 24px;
  line-height: 1.6;
}

.project-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}
.tag {
  background: var(--blue-mist);
  color: var(--blue);
  padding: 6px 14px;
  border-radius: 100px;
  font-size: 12px;
  font-weight: 500;
}

.project-link {
  color: var(--ink);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--ink);
  transition: all 0.3s;
}
.project-link:hover { color: var(--blue); border-color: var(--blue); gap: 12px; }

/* Upcoming project card */
.upcoming-card {
  background: var(--blue-mist);
  border: 2px dashed var(--accent);
  border-radius: 24px;
  padding: 60px 40px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 400px;
}
.upcoming-card .icon {
  width: 56px;
  height: 56px;
  background: white;
  border-radius: 50%;
  margin: 0 auto 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--blue);
  font-size: 28px;
  border: 1px solid var(--accent);
}
.upcoming-card h3 {
  font-family: 'Fraunces', serif;
  font-size: 24px;
  margin-bottom: 12px;
  color: var(--ink);
  font-weight: 400;
}
.upcoming-card p {
  color: var(--muted);
  font-size: 14px;
}

/* ===== SERVICES ===== */
.services { background: var(--ink); color: white; border-radius: 32px; margin: 0 32px; }
.services-container { padding: 0 32px; max-width: 1256px; margin: 0 auto; }
.services .section-title { color: white; }
.services .section-title em { color: var(--blue-bright); }
.services .section-intro { color: rgba(255, 255, 255, 0.6); }
.services .section-label { color: var(--blue-bright); }

.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: var(--flow);
}

.service-card {
  padding: 40px 32px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 20px;
  transition: all 0.3s;
  background: rgba(255, 255, 255, 0.02);
}
.service-card:hover {
  background: rgba(59, 111, 245, 0.08);
  border-color: var(--blue-bright);
  transform: translateY(-4px);
}
.service-num {
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: var(--blue-bright);
  margin-bottom: 24px;
  font-style: italic;
}
.service-card h3 {
  font-family: 'Fraunces', serif;
  font-size: 24px;
  margin-bottom: 14px;
  font-weight: 400;
  letter-spacing: -0.01em;
}
.service-card p {
  color: rgba(255, 255, 255, 0.65);
  font-size: 15px;
  line-height: 1.6;
}

.service-price {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: var(--blue-bright);
  font-style: italic;
  letter-spacing: 0.02em;
}

/* ===== TESTIMONIALS ===== */
.testimonials {
  background: var(--paper);
  border-top: 1px solid var(--line);
}

.testimonials-header {
  text-align: center;
  margin-bottom: 40px;
}
.testimonials-header .section-label {
  justify-content: center;
}
.testimonials-header .section-title {
  margin: 0 auto;
}

.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
}

.testimonial {
  background: white;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 40px;
  margin: 0;
  position: relative;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
}

.testimonial:hover {
  border-color: var(--blue);
  transform: translateY(-4px);
  box-shadow: 0 20px 50px -20px rgba(30, 79, 212, 0.15);
}

.testimonial::before {
  content: '"';
  position: absolute;
  top: 16px;
  left: 32px;
  font-family: 'Fraunces', serif;
  font-size: 80px;
  line-height: 1;
  color: var(--blue);
  opacity: 0.15;
  font-weight: 400;
}

.testimonial-stars {
  color: #FFB800;
  font-size: 14px;
  letter-spacing: 4px;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}

.testimonial blockquote {
  font-family: 'Fraunces', serif;
  font-size: 19px;
  line-height: 1.5;
  color: var(--ink);
  font-weight: 400;
  margin: 0 0 28px;
  letter-spacing: -0.01em;
  font-style: italic;
  position: relative;
  z-index: 1;
}

.testimonial figcaption {
  padding-top: 20px;
  border-top: 1px solid var(--line);
  margin-top: auto;
}

.testimonial-author {
  font-family: 'Fraunces', serif;
  font-size: 15px;
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 4px;
}

.testimonial-role {
  font-size: 12px;
  color: var(--muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-weight: 500;
}

/* Google-vurdering (Forslag 2) */
.testimonials-google {
  display: flex;
  align-items: center;
  gap: 9px;
  width: max-content;
  max-width: 100%;
  margin: 0 auto 28px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 18px;
  text-decoration: none;
}
.testimonials-google:hover { border-color: var(--blue); }
.testimonials-google .g-logo { flex-shrink: 0; }
.tg-score {
  font-family: 'Fraunces', serif;
  font-weight: 600;
  color: var(--ink);
  font-size: 16px;
}
.tg-stars { color: #FFB800; letter-spacing: 2px; font-size: 14px; }
.tg-text { color: var(--muted); font-size: 13px; }

/* Anmeldelses-karusell (like store kort som beveger seg) */
.testimonials-carousel {
  overflow-x: auto;
  overflow-y: hidden;
  position: relative;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  cursor: grab;
}
.testimonials-carousel::-webkit-scrollbar { width: 0; height: 0; display: none; }
.testimonials-carousel.is-grabbing { cursor: grabbing; }
.testimonials-carousel.is-grabbing .testimonial { pointer-events: none; }
.testimonials-track {
  display: flex;
  width: max-content;
  align-items: stretch;
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.testimonials-track .testimonial {
  flex: 0 0 min(380px, 82vw);
  margin-right: 24px;
}

/* Figcaption med kilde-merke */
.testimonial-cap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.testimonial-id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.testimonial-logo { height: 22px; width: auto; max-width: 130px; object-fit: contain; flex-shrink: 0; }
.testimonial-source {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}
.testimonial-source svg { flex-shrink: 0; }

/* Pending state (mens vi venter på godkjente anbefalinger) */
.testimonial-pending {
  background: var(--blue-mist);
  border-style: dashed;
  border-color: var(--accent);
}

.testimonial-pending::before {
  display: none;
}

.testimonial-pending blockquote {
  color: var(--muted);
  font-style: normal;
  font-size: 17px;
}

.pending-mark {
  display: inline-block;
  font-family: 'Fraunces', serif;
  font-size: 18px;
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 20px;
}

/* ===== PROCESS ===== */
.process { background: var(--paper); border-top: 1px solid var(--line); }

.process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  margin-top: var(--flow);
}

.process-step {
  position: relative;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}

.process-step .step-num {
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: var(--blue);
  letter-spacing: 0.04em;
  font-weight: 500;
  margin-bottom: 24px;
  font-style: italic;
}

.process-step h3 {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  color: var(--ink);
  font-weight: 400;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.process-step p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.65;
}

/* ===== ABOUT ===== */
.about { background: var(--paper); }

.about-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  grid-template-areas: "cards intro" "cards rest";
  gap: 20px 80px;
  align-items: center;
}
.about-intro { grid-area: intro; }
.about-rest { grid-area: rest; }
.about-grid .founder-cards { grid-area: cards; }

.about-visual {
  aspect-ratio: 4/5;
  background: linear-gradient(180deg, #F4F7FE 0%, #E8EFFE 100%);
  border-radius: 24px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
}
.about-visual .initials {
  font-family: 'Fraunces', serif;
  font-size: 180px;
  font-weight: 300;
  color: var(--blue);
  line-height: 1;
  letter-spacing: -0.04em;
}

/* Grunnlegger-grid */
.initials-grid {
  display: flex;
  align-items: center;
  gap: 24px;
  width: 100%;
  justify-content: center;
}

.founder {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1;
}

.founder-initial {
  font-family: 'Fraunces', serif;
  font-size: clamp(72px, 9vw, 120px);
  font-weight: 300;
  color: var(--blue);
  line-height: 1;
  letter-spacing: -0.04em;
  margin-bottom: 18px;
}

.founder-name {
  font-family: 'Fraunces', serif;
  font-size: 15px;
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 4px;
  letter-spacing: -0.01em;
}

.founder-role {
  font-size: 10px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 500;
}

.founder-divider {
  width: 1px;
  height: 80px;
  background: var(--accent);
  flex-shrink: 0;
}

.about-visual::after {
  content: 'GRUNNLEGGERE';
  position: absolute;
  bottom: 24px;
  left: 24px;
  font-size: 11px;
  color: var(--muted);
  letter-spacing: 0.12em;
  background: white;
  padding: 6px 12px;
  border-radius: 100px;
}

.about-content .section-title {
  margin-bottom: 32px;
}
.about-content p {
  color: var(--ink);
  font-size: 17px;
  line-height: 1.7;
  margin-bottom: 20px;
}
.about-content p.lead {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  line-height: 1.4;
  color: var(--ink);
  font-weight: 400;
  margin-bottom: 28px;
}

.about-points {
  list-style: none;
  margin-top: 32px;
  border-top: 1px solid var(--line);
  padding-top: 32px;
}
.about-points li {
  padding: 16px 0;
  display: flex;
  gap: 20px;
  align-items: baseline;
  border-bottom: 1px solid var(--line);
}
.about-points li:last-child { border-bottom: none; }
.about-points .key {
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: var(--blue);
  font-style: italic;
  min-width: 100px;
}
.about-points .val { color: var(--ink); font-size: 15px; }

/* ===== CONTACT ===== */
.contact { background: var(--blue-mist); }

.contact-inner {
  text-align: center;
  max-width: 760px;
  margin: 0 auto;
}
.contact .section-title { margin-left: auto; margin-right: auto; }
.contact .section-intro { margin-left: auto; margin-right: auto; }

.contact-cta {
  margin-top: var(--flow);
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

.contact-grid {
  margin-top: var(--flow);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  text-align: left;
  padding-top: 64px;
  border-top: 1px solid var(--accent);
}
.contact-item .label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-bottom: 10px;
  font-weight: 600;
}
.contact-item .value {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  color: var(--ink);
  text-decoration: none;
  display: block;
  font-weight: 400;
}
.contact-item a.value:hover { color: var(--blue); }

/* ===== FOOTER ===== */
footer {
  background: var(--ink-deep);
  color: rgba(255, 255, 255, 0.7);
  padding: 64px 0 32px;
}
.footer-inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 32px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
footer .logo { color: white; }

.footer-text { max-width: 380px; margin-top: 20px; font-size: 14px; line-height: 1.6; }

.footer-links { display: flex; gap: 32px; flex-wrap: wrap; }
.footer-links a {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s;
}
.footer-links a:hover { color: var(--blue-bright); }

.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 32px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.62);
  flex-wrap: wrap;
  gap: 16px;
}

/* ===== ANIMATIONS — DEAKTIVERT (alt synlig fra starten) ===== */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to { opacity: 1; transform: translateY(0); }
}

.reveal {
  opacity: 1;
  /* Animasjon fjernet — innhold synlig fra start */
}

.scroll-reveal {
  opacity: 1;
  transform: none;
  /* Tidligere skjult til scroll — nå alltid synlig */
}
.scroll-reveal.visible {
  opacity: 1;
  transform: none;
}

/* ===== Bevegelse: seksjoner glir inn ved scroll (kun forsider, via .home-motion — JS-styrt så innhold aldri forsvinner) ===== */
.home-motion .scroll-reveal { opacity: 0; transform: translateY(18px);
  transition: opacity .45s cubic-bezier(.2,.8,.2,1), transform .45s cubic-bezier(.2,.8,.2,1); }
.home-motion .scroll-reveal.visible { opacity: 1; transform: none; }
.home-motion .project-grid .project-card:nth-child(2){ transition-delay: .10s; }
.home-motion .services-grid .service-card:nth-child(2){ transition-delay: .07s; }
.home-motion .services-grid .service-card:nth-child(3){ transition-delay: .14s; }
.home-motion .services-grid .service-card:nth-child(4){ transition-delay: .21s; }
.home-motion .services-grid .service-card:nth-child(5){ transition-delay: .28s; }
.home-motion .services-grid .service-card:nth-child(6){ transition-delay: .35s; }
@media (prefers-reduced-motion: reduce){
  .home-motion .scroll-reveal { opacity: 1; transform: none; transition: none; }
}

/* ===== Prosjektkort tonet i hver nettsides egen merkevarefarge (kun forsiden) ===== */
.home-motion .project-card:has(img[src*="preview-sofaexpert"]) { --brand: #8f744d; }
.home-motion .project-card:has(img[src*="preview-medently"])   { --brand: #1b2a8f; }
.home-motion .project-card:has(img[src*="preview-verifica"])   { --brand: #1f2844; }
.home-motion .project-card {
  background: color-mix(in srgb, var(--brand, transparent) 16%, #ffffff);
  border-color: color-mix(in srgb, var(--brand, var(--line)) 28%, var(--line));
}
.home-motion .project-card::after {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 5px;
  background: linear-gradient(90deg, var(--brand, transparent), color-mix(in srgb, var(--brand, transparent) 55%, transparent) 60%, transparent);
  z-index: 3; pointer-events: none;
}
.home-motion .project-card:hover {
  border-color: color-mix(in srgb, var(--brand, var(--blue)) 55%, var(--line));
  box-shadow: 0 30px 60px -20px color-mix(in srgb, var(--brand, #1E4FD4) 45%, transparent);
}

/* ===== FAQ ===== */
.faq {
  background: var(--paper);
  border-top: 1px solid var(--line);
}

.faq-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 48px;
  align-items: start;
}

.faq-intro {
  position: sticky;
  top: 120px;
}

.faq-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.faq-item {
  border-bottom: 1px solid var(--line);
  padding: 0;
  transition: all 0.3s ease;
}

.faq-item:first-child {
  border-top: 1px solid var(--line);
}

.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  font-family: 'Fraunces', serif;
  font-size: 19px;
  color: var(--ink);
  font-weight: 400;
  letter-spacing: -0.01em;
  transition: color 0.2s ease;
}

.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--blue); }

.faq-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--blue-mist);
  color: var(--blue);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 400;
  flex-shrink: 0;
  transition: all 0.3s ease;
  font-family: 'Geist', sans-serif;
}

.faq-item[open] .faq-icon {
  background: var(--blue);
  color: white;
  transform: rotate(45deg);
}

.faq-content {
  padding: 0 0 24px;
  animation: fadeIn 0.4s ease;
}

.faq-content p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--muted);
  max-width: 560px;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ===== CONTACT (ny versjon) ===== */
.contact {
  background: var(--blue-mist);
}

.contact-header {
  text-align: center;
  margin-bottom: 40px;
}
.contact-header .section-title { margin: 0 auto; }
.contact-header .section-intro { margin: 0 auto; }

.getting-started {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 52px;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

.start-step {
  background: white;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 32px;
  text-align: left;
  transition: all 0.3s ease;
}

.start-step:hover {
  border-color: var(--blue);
  transform: translateY(-4px);
  box-shadow: 0 20px 50px -20px rgba(30, 79, 212, 0.18);
}

.start-num {
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: var(--blue);
  font-style: italic;
  margin-bottom: 20px;
  font-weight: 500;
}

.start-step h4 {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  color: var(--ink);
  font-weight: 400;
  margin-bottom: 12px;
  letter-spacing: -0.01em;
}

.start-step p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
}

/* Kontaktskjema */
.contact-form-wrap {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 64px;
  max-width: 1100px;
  margin: 0 auto;
  background: white;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 56px;
}

.form-side .form-title {
  font-family: 'Fraunces', serif;
  font-size: 28px;
  font-weight: 400;
  color: var(--ink);
  line-height: 1.15;
  margin-bottom: 12px;
  letter-spacing: -0.02em;
}

.form-side .form-sub {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.6;
  margin-bottom: 40px;
}

.contact-details {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-top: 32px;
  border-top: 1px solid var(--line);
}

.contact-detail {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.detail-label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 600;
}

.detail-value {
  font-family: 'Fraunces', serif;
  font-size: 18px;
  color: var(--ink);
  font-weight: 400;
  text-decoration: none;
}

a.detail-value:hover { color: var(--blue); }

/* Form fields */
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-field label {
  font-size: 12px;
  color: var(--ink);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.optional-tag {
  font-size: 11px;
  color: var(--muted);
  font-weight: 400;
  letter-spacing: 0;
  margin-left: 6px;
  font-style: italic;
}

.form-field input,
.form-field select,
.form-field textarea {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 14px 16px;
  font-size: 16px; /* min 16px: hindrer at iPhone zoomer inn når man trykker i feltet */
  font-family: 'Geist', sans-serif;
  color: var(--ink);
  transition: all 0.2s ease;
  width: 100%;
}

.form-field select { cursor: pointer; }

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline: none;
  border-color: var(--blue);
  background: white;
  box-shadow: 0 0 0 4px rgba(30, 79, 212, 0.08);
}

.form-field textarea { resize: vertical; min-height: 100px; }

.form-submit {
  align-self: flex-start;
  margin-top: 8px;
}

.form-note {
  font-size: 12px;
  color: var(--muted);
  margin-top: 4px;
}

/* ===== STICKY CTA ===== */
.sticky-cta {
  position: fixed;
  bottom: 24px;
  right: 24px;
  background: var(--ink);
  color: white;
  padding: 14px 22px;
  border-radius: 100px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 12px 32px rgba(10, 27, 61, 0.25);
  transform: translateY(120px);
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
  z-index: 99;
}

.sticky-cta.visible {
  transform: translateY(0);
  opacity: 1;
}

.sticky-cta:hover {
  background: var(--blue);
  transform: translateY(-2px);
  box-shadow: 0 16px 40px rgba(30, 79, 212, 0.35);
}

.sticky-cta .arrow { transition: transform 0.3s ease; }
.sticky-cta:hover .arrow { transform: translateX(4px); }

/* ===== COOKIE BANNER ===== */
.cookie-banner {
  position: fixed;
  bottom: 24px;
  left: 24px;
  right: auto;
  max-width: 420px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 20px 60px rgba(10, 27, 61, 0.15);
  z-index: 100;
  transform: translateY(150%);
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.cookie-banner.visible {
  transform: translateY(0);
  opacity: 1;
}

.cookie-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: stretch;
}

.cookie-text {
  flex: 1;
}

.cookie-text strong {
  font-family: 'Fraunces', serif;
  font-size: 16px;
  font-weight: 500;
  color: var(--ink);
  display: block;
  margin-bottom: 4px;
}

.cookie-text p {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
}

.cookie-text a {
  color: var(--blue);
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* «Les mer» ligger nå UTENFOR avsnittet, så den overlever når avsnittet
   skjules på mobil. Uten dette ville samtykket vært uinformert på telefon. */
.cookie-mer{display:inline-block;color:var(--blue);font-size:12.5px;font-weight:650;text-decoration:underline;text-underline-offset:2px}

.cookie-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

.cookie-actions .btn-cookie {
  flex: 1;
}

.btn-cookie {
  padding: 10px 16px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  border: none;
  transition: all 0.2s ease;
}

.btn-cookie-primary {
  background: var(--ink);
  color: white;
}

.btn-cookie-primary:hover { background: var(--blue); }

.btn-cookie-secondary {
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
}

.btn-cookie-secondary:hover { background: var(--blue-mist); border-color: var(--blue); }

/* ===== FOOTER (oppdatert) ===== */
.footer-brand {
  max-width: 380px;
}

.footer-cols {
  display: flex;
  gap: 80px;
}

.footer-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-col-title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 600;
  margin-bottom: 4px;
}

.footer-col a,
.footer-col .footer-static {
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s;
}

.footer-col a:hover { color: var(--blue-bright); }

.footer-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  padding: 24px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin-top: 8px;
}

.trust-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 500;
}

.trust-icon {
  font-size: 14px;
}

/* Sosiale medier-lenker */
.social-links {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.social-links a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.7);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s;
}

.social-links a:hover {
  color: var(--blue-bright);
}

.social-links svg {
  flex-shrink: 0;
}

/* Footer meta-rad */
.footer-meta {
  display: flex;
  align-items: center;
  gap: 12px;
}

.footer-meta a {
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  transition: color 0.2s;
}

.footer-meta a:hover { color: var(--blue-bright); }

.footer-meta span:not(.footer-static) {
  color: rgba(255, 255, 255, 0.6);
}
.footer-meta .footer-static {
  color: rgba(255, 255, 255, 0.6);
}

/* ===== BRUKT AV / TRUST-STRIP ===== */
.trust-strip { padding: 36px 0; border-bottom: 1px solid var(--line); }
.trust-strip-label { text-align: center; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin: 0 0 18px; font-weight: 500; }
.trust-strip-logos { display: flex; justify-content: center; align-items: center; gap: 16px 48px; flex-wrap: wrap; }
.trust-logo { font-family: 'Fraunces', serif; font-size: 26px; font-weight: 500; color: var(--ink); opacity: 0.68; letter-spacing: -0.01em; transition: opacity 0.3s, transform 0.3s; text-decoration: none; }
.trust-logo:hover { opacity: 1; }
.trust-logo--medently { color: #1E4FD4; }
.trust-logo--sofa { color: #2E9E5B; }
.trust-logo--verifica { color: #C9A227; }
/* Logo-stripe: full farge, myk inn-toning + subtil sveving + hover-løft */
.trust-strip-logos .trust-logo { opacity: 1; transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.trust-strip-logos .trust-logo:hover { transform: translateY(-4px) scale(1.06); }
@media (prefers-reduced-motion: no-preference){
  .trust-strip-logos .trust-logo { opacity: 0; animation: tlFade .7s ease forwards; }
  .trust-strip-logos .trust-logo:nth-child(1){ animation-delay: .05s; }
  .trust-strip-logos .trust-logo:nth-child(2){ animation-delay: .18s; }
  .trust-strip-logos .trust-logo:nth-child(3){ animation-delay: .31s; }
  .trust-strip-logos .trust-logo img { animation: tlFloat 5s ease-in-out infinite; will-change: transform; }
  .trust-strip-logos .trust-logo:nth-child(2) img { animation-delay: -1.6s; }
  .trust-strip-logos .trust-logo:nth-child(3) img { animation-delay: -3.2s; }
}
@keyframes tlFade { to { opacity: 1; } }
@keyframes tlFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@media (max-width: 600px) {
  .trust-strip { padding: 28px 0; }
  .trust-strip-logos { gap: 12px 28px; }
  .trust-logo { font-size: 21px; }
}

/* ===== MOBILE ===== */
@media (max-width: 1199px) {
  /* sidemarg styres nå flytende av --gutter (20–32px) */
  nav { padding: 16px 0; }
  .menu-toggle { display: block; }
  .nav-links {
    position: fixed;
    top: 64px;
    left: 0;
    right: 0;
    background: #FFFFFF;
    flex-direction: column;
    padding: 32px 20px;
    gap: 20px;
    border-bottom: 1px solid var(--line);
    transform: translateY(-120%);
    transition: transform 0.3s;
  }
  .nav-links.open { transform: translateY(0); }

  .hero { padding: 110px 0 48px; }
  .hero-grid { grid-template-columns: 1fr; gap: 40px; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); gap: 24px; }

  /* seksjonsluft styres nå flytende av --section-y (56–96px) */

  .services { margin: 0 16px; border-radius: 24px; }
  .services-container { padding: 0 20px; }
  .services-grid { grid-template-columns: 1fr; gap: 16px; }

  .about-grid { grid-template-columns: 1fr; grid-template-areas: "intro" "cards" "rest"; gap: 28px; }
  .about-visual { aspect-ratio: 5/3; padding: 32px; }
  .about-visual .initials { font-size: 120px; }
  .initials-grid { gap: 16px; }
  .founder-initial { font-size: 64px; margin-bottom: 12px; }
  .founder-name { font-size: 13px; }
  .founder-role { font-size: 11px; }
  .founder-divider { height: 60px; }

  .process-grid { grid-template-columns: 1fr; gap: 24px; }

  .testimonials-grid { grid-template-columns: 1fr; gap: 16px; }
  .testimonial { padding: 22px; }
  .testimonial blockquote { font-size: 17px; }
  .testimonials-header { margin-bottom: 40px; }

  .contact-grid { grid-template-columns: 1fr; gap: 28px; padding-top: 40px; }

  /* FAQ mobil */
  .faq-grid { grid-template-columns: 1fr; gap: 40px; }
  .faq-intro { position: static; }
  .faq-item summary { font-size: 16px; padding: 20px 0; gap: 16px; }
  .faq-icon { width: 28px; height: 28px; font-size: 16px; }
  .faq-content { padding-bottom: 20px; }
  .faq-content p { font-size: 14px; }

  /* Getting started mobil */
  .getting-started { grid-template-columns: 1fr; gap: 12px; margin-bottom: 36px; }
  .start-step { padding: 20px; }
  .contact-header { margin-bottom: 32px; }

  /* Kontaktskjema mobil */
  .contact-form-wrap {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 32px 24px;
    border-radius: 18px;
  }
  .form-row { grid-template-columns: 1fr; gap: 16px; }
  .form-side .form-title { font-size: 24px; }

  /* Sticky CTA mobil — litt mindre, ned i hjørnet */
  .sticky-cta {
    bottom: 16px;
    right: 16px;
    padding: 12px 18px;
    font-size: 13px;
  }

  /* Footer mobil */
  .footer-cols { gap: 24px; flex-direction: column; }
  .footer-trust { gap: 16px; padding: 20px 0; }
  .trust-item { font-size: 11px; }

  /* Cookie banner mobil */
  .cookie-banner {
    bottom: 12px;
    left: 12px;
    right: 12px;
    padding: 18px;
    border-radius: 14px;
  }
  .cookie-content { gap: 16px; flex-direction: column; align-items: stretch; }
  .cookie-actions { width: 100%; }
  .btn-cookie { flex: 1; padding: 10px 12px; font-size: 12px; }

  /* Footer meta mobil */
  .footer-meta { flex-wrap: wrap; }

  .project-info { padding: 20px; }
  .project-title { font-size: 24px; }

  /* Showcase på mobil */
  .project-showcase { padding: 24px; }
  .showcase-bg { grid-template-columns: 1fr; gap: 20px; padding-top: 0; }
  .showcase-title { padding-bottom: 12px; }
  .showcase-badge {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    margin-bottom: 16px;
    align-self: flex-start;
  }
  .showcase-products { gap: 6px; }

  .footer-inner { flex-direction: column; }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ===================================================
   TABLET (810–1199px) — ekte 2-kolonners oppsett
   Før viste iPad mobilversjonen (1 skinn kolonne). Nå får
   kort-rutenettene 2 pene kolonner. Tekst+bilde-seksjoner
   (hero, om, FAQ) forblir stablet — det er ryddig der.
   =================================================== */
@media (min-width: 810px) and (max-width: 1199px) {
  .services-grid,
  .process-grid,
  .testimonials-grid,
  .project-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
}

/* ===================================================
   CASE STUDY SIDER
   =================================================== */
.case-page {
  background: var(--paper);
  padding-top: 108px;
}

.case-hero {
  padding: 44px 0 52px;
  position: relative;
}

.case-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--muted);
  text-decoration: none;
  margin-bottom: 28px;
  transition: color 0.2s;
  font-weight: 500;
}
.case-back:hover { color: var(--blue); }

.case-meta-top {
  display: flex;
  gap: 16px;
  margin-bottom: 28px;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-weight: 600;
}
.case-meta-top span:not(:last-child)::after {
  content: '·';
  margin-left: 16px;
  color: var(--accent);
}

.case-title {
  font-family: 'Fraunces', serif;
  font-size: clamp(48px, 7vw, 88px);
  line-height: 1;
  font-weight: 300;
  color: var(--ink);
  letter-spacing: -0.03em;
  margin-bottom: 28px;
}
.case-title em {
  font-style: italic;
  color: var(--blue);
  font-weight: 400;
}

.case-tagline {
  font-family: 'Fraunces', serif;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.35;
  color: var(--muted);
  font-weight: 400;
  max-width: 720px;
  margin-bottom: 32px;
}

.case-hero-actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

/* Stats strip */
.case-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  padding: 40px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.case-stat .num {
  font-family: 'Fraunces', serif;
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 300;
  color: var(--ink);
  line-height: 1;
  margin-bottom: 8px;
  letter-spacing: -0.02em;
}
.case-stat .num em {
  font-style: italic;
  color: var(--blue);
}
.case-stat .label {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 500;
}

/* Featured image */
.case-featured-image {
  margin: 48px 0;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
  aspect-ratio: 16/9;
}
.case-featured-image img,
.case-featured-image .featured-mockup {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.featured-mockup {
  background: linear-gradient(135deg, #0A1B3D 0%, #1E4FD4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px;
}

/* Section blocks */
.case-section {
  padding: 52px 0;
}

.case-section + .case-section {
  border-top: 1px solid var(--line);
}

.case-section-grid {
  display: grid;
  grid-template-columns: 1fr 1.6fr;
  gap: 56px;
}

.case-section-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--blue);
  font-weight: 600;
  margin-bottom: 14px;
}

.case-section h2 {
  font-family: 'Fraunces', serif;
  font-size: clamp(32px, 4vw, 48px);
  line-height: 1.1;
  font-weight: 300;
  color: var(--ink);
  letter-spacing: -0.02em;
  position: sticky;
  top: 120px;
}
.case-section h2 em {
  font-style: italic;
  color: var(--blue);
  font-weight: 400;
}

.case-section-body p {
  font-size: 17px;
  line-height: 1.7;
  color: var(--ink);
  margin-bottom: 20px;
}

.case-section-body p.lead {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  line-height: 1.5;
  color: var(--ink);
  font-weight: 400;
  margin-bottom: 28px;
}

/* Feature list */
.feature-list {
  list-style: none;
  margin: 32px 0;
  padding: 0;
}
.feature-list li {
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
.feature-list li:first-child { border-top: 1px solid var(--line); }
.feature-list .feature-num {
  font-family: 'Fraunces', serif;
  font-size: 14px;
  color: var(--blue);
  font-style: italic;
  font-weight: 500;
  min-width: 32px;
  padding-top: 4px;
}
.feature-list .feature-text {
  flex: 1;
}
.feature-list .feature-title {
  font-family: 'Fraunces', serif;
  font-size: 17px;
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 4px;
}
.feature-list .feature-desc {
  font-size: 14px;
  color: var(--muted);
  line-height: 1.55;
}

/* Tech stack */
.tech-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}
.tech-stack .tech-item {
  background: var(--blue-mist);
  color: var(--blue);
  padding: 8px 16px;
  border-radius: 100px;
  font-size: 13px;
  font-weight: 500;
}

/* Image gallery */
.case-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 32px 0;
}
.case-gallery-item {
  aspect-ratio: 4/3;
  border-radius: 16px;
  overflow: hidden;
  background: var(--blue-mist);
}
.case-gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.case-gallery-item.tall {
  grid-row: span 2;
  aspect-ratio: 4/5;
}

/* Quote */
.case-quote {
  background: var(--blue-mist);
  border-radius: 24px;
  padding: 48px;
  margin: 52px 0;
  position: relative;
}
.case-quote::before {
  content: '"';
  position: absolute;
  top: 24px;
  left: 48px;
  font-family: 'Fraunces', serif;
  font-size: 120px;
  line-height: 1;
  color: var(--blue);
  opacity: 0.15;
}
.case-quote blockquote {
  font-family: 'Fraunces', serif;
  font-size: clamp(22px, 2.6vw, 32px);
  line-height: 1.4;
  color: var(--ink);
  font-weight: 400;
  font-style: italic;
  margin: 0 0 32px;
  letter-spacing: -0.01em;
  position: relative;
  z-index: 1;
}
.case-quote-author {
  font-family: 'Fraunces', serif;
  font-size: 17px;
  color: var(--ink);
  font-weight: 500;
}
.case-quote-role {
  font-size: 12px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 4px;
  font-weight: 500;
}

/* Next project / CTA */
.case-next {
  background: var(--ink);
  color: white;
  border-radius: 32px;
  margin: 52px 32px;
  padding: 56px 56px;
  text-align: center;
}
.case-next .section-label {
  color: var(--blue-bright);
  justify-content: center;
}
.case-next h3 {
  font-family: 'Fraunces', serif;
  font-size: clamp(36px, 5vw, 56px);
  line-height: 1.1;
  font-weight: 300;
  margin-bottom: 24px;
  letter-spacing: -0.02em;
}
.case-next h3 em {
  font-style: italic;
  color: var(--blue-bright);
  font-weight: 400;
}
.case-next p {
  font-size: 17px;
  color: rgba(255, 255, 255, 0.7);
  max-width: 540px;
  margin: 0 auto 40px;
  line-height: 1.6;
}
.case-next-actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

/* Mobile case study */
@media (max-width: 1199px) {
  .case-page { padding-top: 100px; }
  .case-hero { padding: 40px 0 60px; }
  .case-back { margin-bottom: 32px; }
  .case-meta-top { gap: 12px; font-size: 10px; }
  .case-stats { grid-template-columns: 1fr 1fr; gap: 20px; padding: 28px 0; }
  .case-featured-image { margin: 48px 0; border-radius: 16px; }
  .case-section { padding: 56px 0; }
  .case-section-grid { grid-template-columns: 1fr; gap: 24px; }
  .case-section h2 { position: static; }
  .case-quote { padding: 40px 28px; margin: 56px 0; border-radius: 18px; }
  .case-quote::before { left: 24px; top: 12px; font-size: 80px; }
  .case-gallery { gap: 10px; }
  .case-gallery-item.tall { grid-row: span 1; aspect-ratio: 4/3; }
  .case-next { margin: 56px 16px; padding: 56px 28px; border-radius: 24px; }
}

/* Project links side-by-side */
.project-links {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.project-link.primary {
  font-weight: 600;
  color: var(--blue);
}
.project-link:not(.primary) {
  color: var(--muted);
  font-size: 14px;
  font-weight: 500;
}
.project-link:not(.primary):hover {
  color: var(--ink);
}

@media (max-width: 809px) {
  .project-links { gap: 16px; }
}

/* ===== SPRÅKVELGER ===== */
.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  margin-left: 12px;
  padding-left: 20px;
  border-left: 1px solid var(--line);
}
.lang-switch .lang-active,
.lang-switch .lang-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 4px;
}
.lang-switch .flag-icon {
  width: 18px;
  height: 13px;
  border-radius: 2px;
  display: inline-block;
  vertical-align: middle;
  box-shadow: 0 0 0 1px rgba(10, 27, 61, 0.08);
  flex-shrink: 0;
}
.lang-switch .lang-active {
  color: var(--ink);
}
.lang-switch .lang-sep {
  color: var(--muted);
  opacity: 0.5;
}
.lang-switch .lang-link {
  color: var(--muted);
  text-decoration: none;
  transition: color 0.2s;
}
.lang-switch .lang-link:hover {
  color: var(--blue);
}

@media (max-width: 1199px) {
  .lang-switch {
    margin-left: 0;
    padding-left: 0;
    border-left: none;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
    width: 100%;
    justify-content: center;
  }
}

/* Case study featured card — samme styling som forsiden */
.case-featured-card {
  margin: 48px 0;
  border-radius: 24px;
  overflow: hidden;
}

@media (max-width: 1199px) {
  .case-featured-card {
    margin: 48px 0;
    border-radius: 16px;
  }
}

/* ===== POLERTE HOVER-EFFEKTER ===== */

/* Portfolio-kort: subtil løft ved hover */
.project-card {
  transition: transform 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
              box-shadow 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.project-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px -20px rgba(10, 27, 61, 0.18);
}

/* Bilder i portfolio-kortet: subtil zoom ved hover */
.showcase-product img {
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.project-card:hover .showcase-product img {
  transform: scale(1.05);
}

/* Tjenester-kort: subtil glød */
.service-card {
  transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease;
}

.service-card:hover {
  transform: translateY(-4px);
  border-color: var(--blue-bright);
  background: rgba(30, 79, 212, 0.05);
}

/* Knapper: subtil scale ved hover */
.btn-primary,
.btn-secondary {
  transition: transform 0.2s ease, background 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}

.btn-primary:hover,
.btn-secondary:hover {
  transform: translateY(-2px);
}

/* Bedre arrow-animasjon på alle knapper */
.btn .arrow,
.project-link .arrow,
.sticky-cta .arrow {
  display: inline-block;
  transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.btn:hover .arrow,
.project-link:hover .arrow,
.sticky-cta:hover .arrow {
  transform: translateX(5px);
}

/* Testimonials: subtil heving */
.testimonial {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.testimonial:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px -16px rgba(10, 27, 61, 0.1);
}

/* ===== EKSTRA MOBIL-STRAMMING ===== */
@media (max-width: 809px) {
  /* Mindre avstander i section-headere */
  .section-header { margin-bottom: 32px; }
  .section-title { font-size: 30px; line-height: 1.1; margin-bottom: 12px; }
  .section-intro { font-size: 15px; margin-bottom: 0; }

  /* Hero-tekst litt mindre */
  .hero h1 { font-size: 48px; line-height: 1.05; }
  .hero-lead { font-size: 15px; }

  /* Hero stats — mindre fontstørrelse, mindre padding */
  .hero-stats {
    padding: 28px 0 0;
    gap: 16px;
    grid-template-columns: 1fr 1fr;
  }
  .hero-stat .num { font-size: 28px; }
  .hero-stat .label { font-size: 10px; }

  /* Portfolio: mindre avstand mellom kortene */
  .project-card { margin-top: 20px !important; }

  /* Tjenester: mindre padding på kortene */
  .service-card { padding: 24px; }

  /* Prosess-grid: tettere */
  .process-grid { gap: 20px; }
  .process-step { padding: 24px; }
  .step-num { font-size: 32px; }

  /* About: mindre avstander */
  .about-visual { aspect-ratio: 4/3; padding: 28px; }
  .about-content { padding-top: 20px; }
  .about-meta { gap: 14px; padding-top: 20px; }

  /* FAQ-padding */
  .faq-grid { gap: 24px; }

  /* Footer */
  footer { padding: 48px 0 24px; }
  .footer-inner { gap: 28px; }

  /* Kontakt-skjemaet padding */
  .contact-form-wrap { padding: 24px 18px; gap: 28px; }

  /* Sticky CTA litt mindre */
  .sticky-cta { padding: 10px 16px; font-size: 12px; }
}

/* ===== KOMPAKT STARTSTEG PÅ MOBIL ===== */
@media (max-width: 809px) {
  .getting-started {
    gap: 8px;
    margin-bottom: 28px;
  }
  .start-step {
    padding: 16px 18px;
    border-radius: 14px;
  }
  .start-step h4 {
    font-size: 16px;
    margin-bottom: 6px;
    display: inline;
  }
  .start-num {
    font-size: 12px;
    margin-bottom: 0;
    margin-right: 8px;
    display: inline;
    color: var(--blue);
  }
  .start-step p {
    font-size: 13px;
    line-height: 1.5;
    margin-top: 4px;
  }

  /* Mindre padding på selve kontakt-seksjonen på mobil */
  .contact .section-title { font-size: 28px; }

  /* Mindre top-padding på kontaktsiden */
  section.contact[style*="padding-top: 140px"] {
    padding-top: 100px !important;
  }
}

/* ===== PLACEHOLDER-KORT (erstatter hotlinkede bilder) ===== */
.showcase-product.placeholder-card {
  border-radius: 10px 10px 0 0;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.62);
}

/* Sofa Expert — varme, møbel-aktige toner */
.showcase-product.sofa-card-1 {
  background: linear-gradient(135deg, #D9CBB8 0%, #C4B299 100%);
}
.showcase-product.sofa-card-2 {
  background: linear-gradient(135deg, #B8A589 0%, #9D8A6E 100%);
}
.showcase-product.sofa-card-3 {
  background: linear-gradient(135deg, #6B5D4C 0%, #4F4536 100%);
}

/* Subtil "møbel"-form i kortene */
.sofa-card-1::after,
.sofa-card-2::after,
.sofa-card-3::after {
  content: '';
  position: absolute;
  bottom: 20%;
  left: 15%;
  right: 15%;
  height: 35%;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 8px 8px 4px 4px;
}

/* Medently — kjølige, medisinske blåtoner */
.medently-showcase .showcase-product.med-card-1 {
  background: linear-gradient(135deg, #5B8DE8 0%, #3B6FD4 100%);
}
.medently-showcase .showcase-product.med-card-2 {
  background: linear-gradient(135deg, #2D6BF0 0%, #1543C4 100%);
}
.medently-showcase .showcase-product.med-card-3 {
  background: linear-gradient(135deg, #14305f 0%, #0A1B3D 100%);
}

/* Subtil "kort/dokument"-form */
.med-card-1::after,
.med-card-2::after,
.med-card-3::after {
  content: '';
  position: absolute;
  top: 25%;
  left: 20%;
  right: 20%;
  height: 8px;
  background: rgba(255, 255, 255, 0.35);
  border-radius: 4px;
  box-shadow: 0 16px 0 rgba(255, 255, 255, 0.25), 0 32px 0 rgba(255, 255, 255, 0.15);
}

/* På mobil — litt lavere kort */
@media (max-width: 809px) {
  .placeholder-card { min-height: 90px; }
}

/* ===== BROWSER-MOCKUP (realistisk skjermbilde av kundenes nettsider) ===== */
.browser-mockup {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(10, 27, 61, 0.18);
  background: white;
  border: 1px solid rgba(10, 27, 61, 0.06);
}

.browser-bar {
  background: #EDEFF3;
  padding: 10px 14px;
  display: flex;
  align-items: center;
  gap: 7px;
  border-bottom: 1px solid rgba(10, 27, 61, 0.05);
}
.bdot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.bdot-r { background: #FF5F57; }
.bdot-y { background: #FEBC2E; }
.bdot-g { background: #28C840; }
.browser-url {
  flex: 1;
  margin-left: 10px;
  background: white;
  border-radius: 6px;
  padding: 5px 12px;
  font-size: 11px;
  color: #8896AE;
  font-family: 'Geist', sans-serif;
}

.browser-screen { aspect-ratio: 16/9; overflow: hidden; position: relative; background: #fff; }

.screenshot-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}

/* Sofa Expert screen */
.sofa-screen {
  background: #F5F1E8;
  padding: 20px 24px;
  display: flex;
  flex-direction: column;
}
.sofa-screen-logo {
  font-family: 'Fraunces', serif;
  font-size: 13px;
  letter-spacing: 0.2em;
  color: #3A4A3A;
  text-align: center;
  margin-bottom: 16px;
}
.sofa-screen-body { display: flex; gap: 18px; align-items: center; flex: 1; }
.sofa-screen-text { flex: 1; }
.sofa-screen-h {
  font-family: 'Fraunces', serif;
  font-size: 22px;
  color: #2E3A2E;
  line-height: 1.1;
  margin-bottom: 8px;
  font-weight: 500;
}
.sofa-screen-tags { font-size: 8px; color: #8A9A7A; letter-spacing: 0.1em; margin-bottom: 12px; }
.sofa-screen-btn {
  display: inline-block;
  background: #2E4A2E;
  color: white;
  font-size: 10px;
  padding: 8px 16px;
  border-radius: 5px;
}
.sofa-screen-img {
  flex: 1;
  aspect-ratio: 4/3;
  background: linear-gradient(135deg, #D8CFC0 0%, #B5A98F 50%, #9A8E74 100%);
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}
.sofa-screen-img::before {
  content: '';
  position: absolute;
  bottom: 18%; left: 12%; right: 12%; height: 38%;
  background: rgba(255, 255, 255, 0.22);
  border-radius: 6px;
}

/* Medently screen */
.med-screen {
  background: white;
  display: flex;
  flex-direction: column;
}
.med-screen-nav {
  background: #1A2B7A;
  padding: 9px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}
.med-screen-nav span { color: white; font-size: 8px; opacity: 0.85; }
.med-screen-logo { font-weight: 800 !important; font-size: 11px !important; opacity: 1 !important; }
.med-screen-body { flex: 1; padding: 20px 24px; display: flex; flex-direction: column; justify-content: center; }
.med-screen-h {
  font-size: 22px;
  font-weight: 800;
  color: #0A1633;
  line-height: 1.1;
  margin-bottom: 16px;
  letter-spacing: -0.02em;
}
.med-screen-h span { color: #2D6BF0; }
.med-screen-cards { display: flex; gap: 10px; }
.med-sc {
  flex: 1;
  padding: 14px 12px;
  border-radius: 10px;
  color: white;
  font-size: 12px;
  font-weight: 700;
  min-height: 70px;
}
.med-sc1 { background: linear-gradient(135deg, #E84393 0%, #D6306F 100%); }
.med-sc2 { background: linear-gradient(135deg, #A855C8 0%, #8B3FA8 100%); }
.med-sc3 { background: linear-gradient(135deg, #3B6FF5 0%, #2456D8 100%); }

/* Mobil-tilpasning */
@media (max-width: 809px) {
  .sofa-screen, .med-screen-body { padding: 14px 16px; }
  .sofa-screen-h, .med-screen-h { font-size: 16px; }
  .sofa-screen-logo { font-size: 11px; margin-bottom: 10px; }
  .med-sc { font-size: 10px; padding: 10px 8px; min-height: 54px; }
  .browser-url { font-size: 9px; }
}


/* ===== PORTFOLIO — kompakte kort side om side ===== */
.project-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  align-items: stretch;
}
.project-grid .project-card { margin-top: 0 !important; display: flex; flex-direction: column; }
.project-grid .project-shot { flex: 0 0 auto; }
.project-shot { padding: 20px 20px 0; }
.project-grid .project-info { padding: 22px 26px 28px; flex: 1 1 auto; display: flex; flex-direction: column; }
.project-grid .project-links { margin-top: auto; }
.project-grid .browser-screen { aspect-ratio: 16 / 6; }
.screenshot-img { transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1); }
.project-card:hover .screenshot-img { transform: scale(1.04); }

/* ===== Levende live-forhåndsvisning (ekte nettsider som scroller) ===== */
.is-live-preview .browser-screen { aspect-ratio: 16 / 7; }
.is-live-preview .screenshot-img {
  height: auto;
  transition: transform 6.5s ease-in-out;
  transform: translateY(0);
  will-change: transform;
}
.project-card:hover .is-live-preview .screenshot-img,
.is-live-preview .screenshot-img.is-scrolling {
  transform: translateY(var(--live-scroll, 0px));
}
@media (prefers-reduced-motion: reduce) {
  .is-live-preview .screenshot-img { transition: none; }
  .project-card:hover .is-live-preview .screenshot-img,
  .is-live-preview .screenshot-img.is-scrolling { transform: translateY(0); }
}
.browser-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: 4px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.05em;
  color: #15803D;
  white-space: nowrap;
}
.browser-live .ld {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22C55E;
}
@media (max-width: 1199px) {
  .project-grid { grid-template-columns: 1fr; gap: 24px; }
  .project-shot { padding: 16px 16px 0; }
  .project-grid .project-info { padding: 20px 22px 24px; }
}

/* Case-side: vis skjermbildet i samme brede format som forsiden */
.case-featured-card .browser-screen { aspect-ratio: 16 / 6; }

/* Hero: stort, nedtonet AD-monogram (logoen) som fader ut i bakgrunnen */
.hero { z-index: 0; }
.hero::after {
  content: "";
  position: absolute;
  top: 0;
  right: -3%;
  bottom: 0;
  width: 60%;
  z-index: -1;
  pointer-events: none;
  background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxMjAgMTAwJz48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9J2cnIHgxPScxJyB5MT0nMCcgeDI9JzAnIHkyPScwJz48c3RvcCBvZmZzZXQ9JzAnIHN0b3AtY29sb3I9JyNmZmYnIHN0b3Atb3BhY2l0eT0nMScvPjxzdG9wIG9mZnNldD0nMC42Micgc3RvcC1jb2xvcj0nI2ZmZicgc3RvcC1vcGFjaXR5PScwJy8+PC9saW5lYXJHcmFkaWVudD48bWFzayBpZD0nbSc+PHJlY3Qgd2lkdGg9JzEyMCcgaGVpZ2h0PScxMDAnIGZpbGw9J3VybCgjZyknLz48L21hc2s+PC9kZWZzPjxnIG1hc2s9J3VybCgjbSknPjxwYXRoIGQ9J002IDg4IEwzNCAxMiBMNTAgMTIgTDc4IDg4IEw2MSA4OCBMNTUgNzEgTDI5IDcxIEwyMyA4OCBaIE0zNCA1OCBMNTAgNTggTDQyIDM0IFonIGZpbGw9JyMwQTFCM0QnLz48cGF0aCBkPSdNNTggMTIgTDcwIDEyIFExMTQgMTIgMTE0IDUwIFExMTQgODggNzAgODggTDU4IDg4JyBmaWxsPSdub25lJyBzdHJva2U9JyMxRTRGRDQnIHN0cm9rZS13aWR0aD0nMTMnIHN0cm9rZS1saW5lam9pbj0ncm91bmQnIHN0cm9rZS1saW5lY2FwPSdyb3VuZCcvPjwvZz48L3N2Zz4=") no-repeat right center;
  background-size: auto 170%;
  opacity: 0.2;
}
@media (max-width: 1199px) {
  .hero::after { width: 80%; background-size: auto 120%; opacity: 0.15; }
}

/* ===== Animert helt: aurora-glød + shimmer på nøkkelord ===== */
.hero-animated > .container { position: relative; z-index: 1; }
.hero-animated .hero-aurora { position: absolute; inset: 0; z-index: -2; pointer-events: none; overflow: hidden; }
.hero-animated .hero-aurora span {
  position: absolute; display: block; border-radius: 50%;
  filter: blur(64px); opacity: .55; will-change: transform;
}
.hero-animated .hero-aurora span:nth-child(1){ width: 46vw; height: 46vw; left: -12vw; top: -18vw;
  background: radial-gradient(circle at 40% 40%, rgba(59,111,245,.55), rgba(59,111,245,0) 70%);
  animation: auroraA 18s ease-in-out infinite; }
.hero-animated .hero-aurora span:nth-child(2){ width: 42vw; height: 42vw; right: -10vw; top: -12vw;
  background: radial-gradient(circle at 55% 45%, rgba(30,79,212,.5), rgba(30,79,212,0) 70%);
  animation: auroraB 23s ease-in-out infinite; }
.hero-animated .hero-aurora span:nth-child(3){ width: 40vw; height: 40vw; left: 30vw; top: 4vw;
  background: radial-gradient(circle at 50% 50%, rgba(150,180,255,.42), rgba(150,180,255,0) 70%);
  animation: auroraC 27s ease-in-out infinite; }
@keyframes auroraA { 0%,100%{ transform: translate(0,0) scale(1); } 50%{ transform: translate(7vw,5vw) scale(1.15); } }
@keyframes auroraB { 0%,100%{ transform: translate(0,0) scale(1); } 50%{ transform: translate(-6vw,6vw) scale(1.12); } }
@keyframes auroraC { 0%,100%{ transform: translate(0,0) scale(1); } 50%{ transform: translate(5vw,-5vw) scale(1.2); } }
.hero-animated h1 em {
  background: linear-gradient(100deg, #1E4FD4 0%, #3B6FF5 25%, #9fbcff 50%, #3B6FF5 75%, #1E4FD4 100%);
  background-size: 220% auto;
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  animation: heroEmShimmer 7s linear infinite;
}
@keyframes heroEmShimmer { to { background-position: -220% center; } }
@media (prefers-reduced-motion: reduce) {
  .hero-animated .hero-aurora span, .hero-animated h1 em { animation: none; }
}

/* ===== Silkemykt håndverk: egen muspeker + magnetiske knapper (hele nettstedet) ===== */
@media (hover: hover) and (pointer: fine){
  html.craft-on, html.craft-on * { cursor: none !important; }
  html.craft-on input, html.craft-on textarea, html.craft-on select { cursor: auto !important; }
  #cx-dot, #cx-ring{ position: fixed; top: 0; left: 0; border-radius: 50%; pointer-events: none; z-index: 99999; transform: translate(-50%, -50%); }
  #cx-dot{ width: 7px; height: 7px; background: var(--blue); }
  #cx-ring{ width: 32px; height: 32px; border: 1.5px solid rgba(30,79,212,.45);
    transition: width .22s ease, height .22s ease, border-color .22s ease, background .22s ease; }
  #cx-ring.is-hot{ width: 54px; height: 54px; border-color: rgba(30,79,212,.75); background: rgba(30,79,212,.07); }
  .btn-primary, .nav-links a.cta, .sticky-cta{ transition: transform .25s cubic-bezier(.2,.8,.2,1), background .2s, box-shadow .2s; }
  .hero-animated .hero-spot{ position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0; transition: opacity .5s ease; background: radial-gradient(340px circle at var(--mx,50%) var(--my,35%), rgba(59,111,245,.20), transparent 62%); }
  .hero-animated:hover .hero-spot{ opacity: 1; }
  .hero-animated .hero-aurora{ transition: transform .6s cubic-bezier(.2,.8,.2,1); }
}

/* Fiks: sekundærknapp på mørk "case-next"-seksjon — hvit tekst så den synes hele tiden */
.case-next .btn-secondary {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.62);
  background: transparent;
}
.case-next .btn-secondary:hover {
  background: #fff;
  color: var(--ink);
  border-color: #fff;
}

/* Grunnlegger-foto — rundt portrett som erstatter monogram-bokstaven */
.founder-photo {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  margin-bottom: 18px;
  border: 1px solid var(--line);
}
@media (max-width: 1199px) {
  .founder-photo { width: 130px; height: 130px; margin-bottom: 12px; }
}

/* ===== Founder cards (Om / About) ===== */
.founder-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.founder-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 6px 24px rgba(10, 27, 61, 0.05);
}
.founder-card-photo {
  position: relative;
  aspect-ratio: 1233 / 1276;
  background: var(--blue-mist);
  overflow: hidden;
}
.founder-card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.founder-card-photo.is-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(160deg, #F4F7FE 0%, #E8EFFE 100%);
}
.founder-card-mono {
  font-family: 'Fraunces', serif;
  font-size: clamp(64px, 12vw, 108px);
  font-weight: 300;
  color: var(--blue);
  line-height: 1;
}
.founder-card-flag {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(10, 27, 61, 0.16);
}
.founder-card-body {
  padding: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}
.founder-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.founder-card-name {
  font-family: 'Fraunces', serif;
  font-size: 19px;
  font-weight: 500;
  color: var(--ink);
  line-height: 1.2;
}
.founder-card-pill {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--blue);
  background: var(--blue-mist);
  padding: 4px 9px;
  border-radius: 999px;
  white-space: nowrap;
}
.founder-card-role {
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
.founder-card-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: var(--blue);
  color: #fff;
  font-family: 'Geist', sans-serif;
  font-size: 14px;
  font-weight: 500;
  padding: 11px 14px;
  border-radius: 11px;
  text-decoration: none;
  transition: background 0.2s ease, transform 0.2s ease;
}
.founder-card-btn:hover {
  background: var(--ink);
  transform: translateY(-1px);
}
.founder-card-btn svg { flex-shrink: 0; }
@media (max-width: 520px) {
  .founder-cards { grid-template-columns: 1fr; }
}


/* ===== Småskjerm-finpuss + tilgjengelighet ===== */
@media (max-width: 400px) {
  .hero h1 { font-size: 40px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}


/* Runde 3 (03.07.2026): kontrast + klikkeflater mobil */
@media (max-width: 809px) {
  .nav-links a { padding: 10px 0; }
  .footer-col a { display: inline-block; padding: 11px 0; }
  .cookie-text a { display: inline-block; padding: 6px 0; }
}


/* ===== Fargeliv på undersidene (v16, 03.07.2026) ===== */
.fargeglod{position:relative;overflow:hidden}
.fargeglod .glod{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;pointer-events:none;z-index:0}
.fargeglod .glod.g1{width:420px;height:420px;background:radial-gradient(circle,#7EA4FF,transparent 70%);top:-120px;right:-80px;animation:glodFlyt 14s ease-in-out infinite alternate}
.fargeglod .glod.g2{width:340px;height:340px;background:radial-gradient(circle,#B39DFF,transparent 70%);bottom:-140px;left:-60px;animation:glodFlyt 18s ease-in-out infinite alternate-reverse}
.fargeglod .glod.g3{width:260px;height:260px;background:radial-gradient(circle,#7BC9A2,transparent 72%);top:38%;left:56%;opacity:.3;animation:glodFlyt 22s ease-in-out infinite alternate}
.fargeglod > .container{position:relative;z-index:1}
@keyframes glodFlyt{from{transform:translate(0,0) scale(1)}to{transform:translate(38px,24px) scale(1.1)}}
@media (prefers-reduced-motion: reduce){.fargeglod .glod{animation:none}}

/* Fargede stat-chips */
.chip{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;font-weight:700;border-radius:999px;padding:7px 14px;margin:0 8px 8px 0}
.chip .pr{width:8px;height:8px;border-radius:50%;flex:none}
.chip-blaa{background:#E8EFFE;color:#1E4FD4}.chip-blaa .pr{background:#1E4FD4}
.chip-groenn{background:#E6F3EB;color:#1F7A55}.chip-groenn .pr{background:#2E8B62}
.chip-lilla{background:#EEE9FB;color:#5B3BC4}.chip-lilla .pr{background:#6D4AE0}
.chip-varm{background:#F7ECDC;color:#A15C3E}.chip-varm .pr{background:#C56A4E}
.chip-rosa{background:#FCE8F0;color:#B0316E}.chip-rosa .pr{background:#D64687}

/* Delikate fargetoner på kort */
.card.kort-tint-1{background:linear-gradient(160deg,#F4F7FE,#E8EFFE);border-color:#D5E0F5}
.card.kort-tint-2{background:linear-gradient(160deg,#F3F9F5,#E6F3EB);border-color:#D3E8DB}
.card.kort-tint-3{background:linear-gradient(160deg,#F7F4FC,#EEE9FB);border-color:#E0D8F4}
.card.kort-tint-4{background:linear-gradient(160deg,#FBF6F0,#F7ECDC);border-color:#EFDFC9}

/* Lyst gradient-panel rundt slutt-CTA */
.cta-panel{background:linear-gradient(135deg,#F4F7FE 0%,#E8EFFE 55%,#EEE9FB 100%);border:1px solid #D5E0F5;border-radius:26px;padding:40px 26px 44px;margin-top:var(--flow)}
.cta-panel .glod{opacity:.4}

/* Produkt-synlighet (v17) */
.nyhet-pill{display:inline-flex;align-items:center;gap:8px;max-width:100%;background:linear-gradient(90deg,#E8EFFE,#EEE9FB);border:1px solid #cdd9f6;color:#1E4FD4;font-weight:700;font-size:.85rem;line-height:1.3;border-radius:999px;padding:8px 16px;text-decoration:none;margin-bottom:20px;transition:border-color .2s,transform .2s}
.nyhet-pill .nyhet-pill-txt{min-width:0}
.nyhet-pill .nyhet-pill-arrow{flex:0 0 auto}
.nyhet-pill:hover{border-color:#1E4FD4;transform:translateY(-1px)}
.nav-ny{display:inline-block;font-size:.58rem;font-weight:800;letter-spacing:.06em;background:#1E4FD4;color:#fff;border-radius:999px;padding:2px 7px;margin-left:5px;vertical-align:middle;transform:translateY(-1px)}

/* ===== BLÅ HERO (kun forsiden .hero-animated) — radial glød som følger musa MOTSATT (v19) ===== */
.hero.hero-animated{
  --lx:50%; --ly:44%;
  background: radial-gradient(58% 74% at var(--lx) var(--ly), #1D65D1 0%, #1a4fb2 34%, #16267D 74%);
  color:#fff;
}
.hero.hero-animated .hero-aurora,
.hero.hero-animated .hero-spot{ display:none !important; }
.hero.hero-animated::after{ display:none; }
.hero.hero-animated h1{ color:#fff; }
.hero.hero-animated h1 em{ color:#8FB6FF; background:none; -webkit-text-fill-color:#8FB6FF; animation:none; }
.hero.hero-animated .hero-eyebrow{ color:rgba(255,255,255,.72); }
.hero.hero-animated .hero-eyebrow::before{ background:rgba(255,255,255,.6); }
.hero.hero-animated .hero-side p{ color:rgba(255,255,255,.85); }
.hero.hero-animated .hero-shortcut{ color:#9fc0ff !important; }
.hero.hero-animated .nyhet-pill{ background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.45); color:#fff; }
.hero.hero-animated .nyhet-pill:hover{ border-color:#fff; }
.hero.hero-animated .hero-stats{ border-top:1px solid rgba(255,255,255,.16); }
.hero.hero-animated .stat-item .num{ color:#fff; }
.hero.hero-animated .stat-item .num em{ color:#8FB6FF; }
.hero.hero-animated .stat-item .label{ color:rgba(255,255,255,.62); }
.hero.hero-animated .btn-primary{ background:#fff; color:#0A1B3D; }
.hero.hero-animated .btn-primary:hover{ background:#eaf0ff; color:#0A1B3D; box-shadow:0 12px 32px rgba(0,0,0,.28); }
.hero.hero-animated .btn-secondary{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.5); }
.hero.hero-animated .btn-secondary:hover{ background:rgba(255,255,255,.10); border-color:#fff; color:#fff; }

/* ============================================================
   MOBIL-OPTIMALISERING (2026-07-05) — alt mobil-scopet, rorer ikke desktop
   ============================================================ */

/* Bryt lange ord i overskrifter/tekst (usynlig pa desktop der ordet far plass) */
h1,h2,h3,h4,h5,p,li,.section-title,.hero-line,.legal-title{ overflow-wrap:break-word; }
/* Bilder skal aldri sprenge bredden */
img{ max-width:100%; }
/* testimonials-kort kan krympe under 300px pa smaskjerm */
.testimonials-grid{ grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); }

/* prosjekter-en: case-bilder som banner, ikke tynn stripe */
.services-grid .card > img[src="sofa-expert.jpg"],
.services-grid .card > img[src="medently.jpg"],
.services-grid .card > img[src="verifica.jpg"]{ aspect-ratio:16/7; object-fit:cover; object-position:top center; }

/* ---- Nettbrett (600-1199px): bedre utnyttelse av bredden ---- */
@media (min-width:600px) and (max-width:1199px){
  .services-grid:not([style]){ grid-template-columns:1fr 1fr; }
  .process-grid{ grid-template-columns:1fr 1fr; }
}

/* ---- Mobilmeny / hamburger (<=1199px) ---- */
@media (max-width:1199px){
  .nav-links{ max-height:calc(100vh - 64px); max-height:calc(100dvh - 64px); overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
  .nav-links a:not(.cta){ padding:12px 0; }
  .lang-switch{ gap:6px; }
  .lang-switch .lang-active, .lang-switch .lang-link{ padding:11px 12px; min-height:44px; box-sizing:border-box; display:inline-flex; align-items:center; }
  .btn-cookie{ padding:13px 14px; font-size:13px; min-height:44px; }
  .case-section-body p, .case-section-body p.lead{ max-width:66ch; }
  .about-content p, .about-content p.lead{ max-width:62ch; }
  .showcase-title p{ font-size:14px; }
  .showcase-eyebrow{ font-size:11px; letter-spacing:0.1em; }
}

/* ---- Telefon (<=809px) ---- */
@media (max-width:809px){
  .hero h1{ font-size:clamp(30px,8vw,50px); line-height:1.06; }
  .hero-stats .stat-item .num{ font-size:28px; }
  .hero-stats .stat-item .label{ font-size:10px; }
  .hero-side p{ font-size:15px; }
  .social-links{ gap:8px; }
  .social-links a{ display:inline-flex; align-items:center; min-height:44px; padding:8px 0; box-sizing:border-box; }
  .footer-meta a{ display:inline-block; padding:8px 2px; }
  .sticky-cta{ padding:13px 20px; font-size:13px; min-height:44px; box-sizing:border-box; }
  .project-link{ padding:10px 0; }
  .nyhet-pill{ padding:12px 18px; min-height:44px; box-sizing:border-box; }
  .hero-shortcut{ padding:10px 2px; }
  .case-back{ padding:8px 0; }
  .detail-value, .contact-item .value{ display:inline-block; padding:6px 0; }
  .form-submit{ align-self:stretch; width:100%; justify-content:center; }
  .case-stats[style*="repeat(3"]{ grid-template-columns:1fr 1fr !important; }
  .cookie-banner.visible ~ .sticky-cta{ opacity:0; transform:translateY(120px); pointer-events:none; }
}

/* ---- Inline 2-kol grid (om/kundesystem) skal kollapse pa telefon ---- */
@media (max-width:600px){
  .services-grid[style*="repeat(2,1fr)"]{ grid-template-columns:1fr !important; }
  .hero.hero-animated h1{ font-size:34px; line-height:1.08; }
  .hero.hero-animated .nyhet-pill{ font-size:.78rem; line-height:1.3; padding:11px 16px; }
}

/* ---- Bla hero: stable knapper i full bredde (<=520px) ---- */
@media (max-width:520px){
  .hero.hero-animated .hero-actions{ flex-direction:column; align-items:stretch; gap:12px; }
  .hero.hero-animated .hero-actions .btn{ width:100%; justify-content:center; }
}

/* ---- Smatelefon (<=400px) ---- */
@media (max-width:400px){
  .hero h1{ font-size:clamp(28px,8.5vw,40px); }
  .hero.hero-animated h1{ font-size:30px; }
  .case-stats[style*="repeat(3"]{ gap:12px !important; }
}

/* ===================================================
   NIGHTSKY — mørk forside: mørk nav + mørk hero med
   diagonal, selvscrollende prosjektvegg.
   Alt er scopet til body.theme-nightsky / .hero-night
   slik at undersidene (som deler denne CSS-en) er urørt.
   =================================================== */

/* Mørk grunnflate på hele forsiden — ingen hvit stripe under footeren på høye skjermer */
body.theme-nightsky { background: #050A18; }

/* ----- Mørk navigasjonsbar i to nivåer: logo sentrert øverst + tynn lenke-bar under ----- */
.theme-nightsky nav, .nav-night nav {
  padding: 0;
  background: rgba(4, 9, 27, 0.72);
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.theme-nightsky nav.scrolled, .nav-night nav.scrolled { border-bottom-color: rgba(255, 255, 255, 0.14); }
/* 17. juli, Amins valg: glass-effekten fra forsiden gjelder på ALLE sider —
   toppen er gjennomskinnelig med blur, så innholdet skimtes bak når man blar.
   (Bakgrunnen ligger i fellesregelen over: rgba(4,9,27,.72) + backdrop-blur.) */
.theme-nightsky .nav-top, .nav-night .nav-top {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 64px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07); /* det tynne skillet mellom de to nivåene */
}
.logo-wordmark { display: block; line-height: 0; }
.logo-wordmark .wordmark { display: block; height: 22px; width: auto; }
.theme-nightsky .menu-toggle, .nav-night .menu-toggle {
  position: absolute;
  right: var(--gutter);
  top: 50%;
  transform: translateY(-50%);
}
.theme-nightsky .nav-rail .nav-inner, .nav-night .nav-rail .nav-inner { justify-content: center; }
.theme-nightsky .nav-rail .nav-links, .nav-night .nav-rail .nav-links {
  gap: 30px;
  min-height: 46px;
  justify-content: center;
}
.theme-nightsky .nav-links a, .nav-night .nav-links a { color: rgba(233, 239, 255, 0.82); font-size: 13px; }
.theme-nightsky .nav-links a:hover, .nav-night .nav-links a:hover { color: #fff; }
.theme-nightsky .nav-links a.cta, .nav-night .nav-links a.cta {
  background: rgba(255, 255, 255, 0.10);
  backdrop-filter: blur(12px) saturate(160%);
  -webkit-backdrop-filter: blur(12px) saturate(160%);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  padding: 7px 16px;
  box-shadow: inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.30), inset -1px -1px 1px rgba(255, 255, 255, 0.10), 0 6px 20px rgba(2, 6, 18, 0.30);
}
.theme-nightsky .nav-links a.cta:hover, .nav-night .nav-links a.cta:hover {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  transform: translateY(-1px);
}
.theme-nightsky .nav-ny, .nav-night .nav-ny {
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
}
.theme-nightsky .menu-toggle span, .nav-night .menu-toggle span { background: #fff; }
.theme-nightsky .lang-switch, .nav-night .lang-switch { border-left-color: rgba(255, 255, 255, 0.18); }
.theme-nightsky .lang-switch .lang-active, .nav-night .lang-switch .lang-active,
.theme-nightsky .lang-switch .lang-sep, .nav-night .lang-switch .lang-sep,
.theme-nightsky .lang-switch .lang-link, .nav-night .lang-switch .lang-link { color: rgba(233, 239, 255, 0.75); }
.theme-nightsky .lang-switch .lang-link:hover, .nav-night .lang-switch .lang-link:hover { color: #fff; }
@media (max-width: 1199px) {
  .theme-nightsky .nav-top, .nav-night .nav-top { height: 58px; border-bottom: none; }
  .logo-wordmark .wordmark { height: 18px; }
  .theme-nightsky .nav-links, .nav-night .nav-links {
    top: 58px;
    background: rgba(4, 9, 27, 0.97);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
  }
}

/* ---- iPad-landskap / små laptoper (1000–1199px): gjenopprett desktop-nav ----
   CTA «Start prosjekt» + språkvelger skal være synlige, ikke gjemt bak hamburger.
   Additiv override — rører ikke 1199-blokkene over, vinner via kilderekkefølge. */
@media (min-width: 1000px) and (max-width: 1199px) {
  .menu-toggle { display: none; }
  .nav-links {
    position: static;
    top: auto;
    left: auto;
    right: auto;
    transform: none;
    flex-direction: row;
    align-items: center;
    background: transparent;
    padding: 0;
    gap: 24px;
    border-bottom: none;
    max-height: none;
    overflow: visible;
  }
  /* Mørk nav (nightsky / nav-night) — høyere spesifisitet for å slå glass-bakgrunn/kant */
  .theme-nightsky .nav-links, .nav-night .nav-links {
    position: static;
    top: auto;
    transform: none;
    flex-direction: row;
    align-items: center;
    background: transparent;
    padding: 0;
    gap: 24px;
    border-bottom: none;
    max-height: none;
    overflow: visible;
    justify-content: center;
    min-height: 46px;
  }
  /* Footer tilbake til desktop-rad (settes til column i 1199-blokken) */
  .footer-cols { flex-direction: row; }
  .footer-inner { flex-direction: row; }
  /* Språkvelger tilbake til desktop-inline (nullstiller mobil-stablingen fra 1199-blokken) */
  .lang-switch { margin-left: 12px; padding-left: 20px; border-left: 1px solid var(--line); margin-top: 0; padding-top: 0; border-top: none; width: auto; justify-content: flex-start; }
}

/* ----- Mørk hero-flate ----- */
.hero.hero-night {
  background:
    radial-gradient(1100px 620px at 88% -12%, rgba(47, 98, 234, 0.32), transparent 62%),
    radial-gradient(900px 540px at -12% 112%, rgba(30, 79, 212, 0.24), transparent 62%),
    linear-gradient(180deg, #050A18 0%, #081226 55%, #0C1B3E 100%);
  min-height: min(92vh, 960px);
  display: flex;
  align-items: center;
  padding: 176px 0 96px;
  overflow: clip; /* veggen holder seg innenfor den mørke delen */
}
.hero.hero-night > .container { width: 100%; }
.hero-night::after { display: none; } /* skjul det lyse AD-monogrammet fra lys versjon */

/* Auroraen (boblene) — dyp blå glød som i referansebildet */
.hero-night .hero-aurora span { filter: blur(72px); opacity: 0.5; }
.hero-night .hero-aurora span:nth-child(1) { background: radial-gradient(circle at 40% 40%, rgba(80, 125, 235, 0.42), rgba(80, 125, 235, 0) 70%); }
.hero-night .hero-aurora span:nth-child(2) { background: radial-gradient(circle at 55% 45%, rgba(47, 98, 234, 0.34), rgba(47, 98, 234, 0) 70%); }
.hero-night .hero-aurora span:nth-child(3) { background: radial-gradient(circle at 50% 50%, rgba(150, 180, 255, 0.24), rgba(150, 180, 255, 0) 70%); }

/* Lysstreker + stjerner bak prosjektstrømmen */
.hero-deco { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.hero-deco svg { width: 100%; height: 100%; display: block; animation: decoPuls 9s ease-in-out infinite alternate; }
@keyframes decoPuls { from { opacity: 0.75; } to { opacity: 1; } }

/* ----- Tekstkolonnen ----- */
.hero-night-inner { max-width: 700px; position: relative; z-index: 2; }
.theme-nightsky .nyhet-pill {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.20);
  color: rgba(240, 244, 255, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, 0.22);
}
.theme-nightsky .nyhet-pill:hover { border-color: rgba(255, 255, 255, 0.45); }
.hero-night .hero-eyebrow { color: rgba(233, 239, 255, 0.62); }
.hero-night .hero-eyebrow::before { background: rgba(255, 255, 255, 0.55); }

.hero.hero-night h1 {
  font-family: 'Geist', -apple-system, sans-serif; /* samme font som navigasjonsbaren */
  font-size: clamp(38px, 4.3vw, 64px);
  line-height: 1.06;
  font-weight: 750;
  letter-spacing: -0.04em;
  color: #fff;
  margin-bottom: 22px;
}
/* Helt hvit tittel — ingen lyseblå gradient (premium/monokrom) */
.hero.hero-night h1 em {
  font-style: normal;
  font-weight: 750;
  background: none;
  -webkit-text-fill-color: #fff;
  color: #fff;
  animation: none;
}
.hero-night .hero-tagline {
  font-size: clamp(16px, 1.4vw, 19px);
  color: rgba(226, 233, 252, 0.75);
  line-height: 1.6;
  max-width: 560px;
  margin: 0 0 36px;
}

/* Primærknapp — «liquid glass»: frostet glass med lys innerkant og myk dybde */
.btn.btn-night {
  position: relative;
  background: rgba(255, 255, 255, 0.10);
  backdrop-filter: blur(16px) saturate(160%);
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.28);
  padding: 18px 34px;
  font-size: 16px;
  font-weight: 600;
  box-shadow:
    0 10px 36px rgba(2, 6, 18, 0.40),
    inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.35),
    inset -1px -1px 1px rgba(255, 255, 255, 0.12);
  transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.6);
}
.btn.btn-night::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 45%);
  pointer-events: none;
}
.btn.btn-night:hover {
  transform: translateY(-2px);
  background: rgba(255, 255, 255, 0.18);
  box-shadow:
    0 16px 48px rgba(2, 6, 18, 0.5),
    inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.42),
    inset -1px -1px 1px rgba(255, 255, 255, 0.15);
}

/* ----- Diagonal prosjektvegg ----- */
.hero-wall { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.wall-tilt {
  position: absolute;
  top: -12%;
  right: max(0px, calc((100vw - 1320px) / 2));
  width: min(38vw, 560px);
  height: 135%;
  transform: perspective(1600px) rotateX(10deg);
  transform-origin: 50% 30%;
}
.wall-col { height: 100%; }
.wall-track { display: flex; flex-direction: column; will-change: transform; animation: wallDown 32s linear infinite; animation-delay: -14s; }
/* Tracket er kortene duplisert 2x — translateY(-50%) av trackets EGEN høyde
   er da nøyaktig ett sett, så loopen blir sømløs */
@keyframes wallDown {
  from { transform: translateY(-50%); }
  to   { transform: translateY(0); }
}
.wall-card {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  margin-bottom: -12%; /* kortene overlapper — tett, dyp stabel som i referansen */
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #10182B;
  box-shadow: 0 34px 80px rgba(2, 6, 18, 0.68), 0 -16px 44px rgba(2, 6, 18, 0.35);
  aspect-ratio: 16 / 10;
}
/* Svak felles skråstilling + bølgende sideforskyvning — «flytende» fall nedover */
.wall-track .wall-card { transform: rotateZ(-2.5deg); }
.wall-track .wall-card:nth-child(3n+1) { transform: translateX(5%) rotateZ(-2.5deg); }
.wall-track .wall-card:nth-child(3n+2) { transform: translateX(-2%) rotateZ(-2.5deg); }
.wall-track .wall-card:nth-child(3n)   { transform: translateX(-7%) rotateZ(-2.5deg); }
.wall-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(115deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, 0) 30%);
}
.wall-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% var(--wy, 0%);
  display: block;
}
.wall-card .wall-tag {
  position: absolute;
  left: 12px;
  bottom: 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(255, 255, 255, 0.94);
  background: rgba(4, 9, 27, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.16);
  padding: 5px 11px;
  border-radius: 100px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
/* Myk innfading: mot teksten (venstre) og mot topp/bunn av heroen */
.hero-wall::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(6, 12, 26, 0.97) 26%, rgba(6, 12, 26, 0) 58%);
}
.hero-wall::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(5, 10, 24, 0.96) 2%, rgba(5, 10, 24, 0) 24%),
    linear-gradient(0deg, rgba(12, 27, 62, 0.9) 0%, rgba(12, 27, 62, 0) 18%);
}

/* ----- Mobil/tablet: tekst øverst, veggen som skrått bånd under ----- */
@media (max-width: 1199px) {
  /* Tekst først, veggen som skrått bånd under (flex-order styrer rekkefølgen,
     siden veggen ligger før teksten i HTML-en) */
  .hero.hero-night { display: flex; flex-direction: column; align-items: stretch; min-height: 0; padding: 124px 0 0; }
  .hero.hero-night > .container { order: 1; }
  .hero-night-inner { max-width: 620px; }
  .hero-night .hero-wall {
    order: 2;
    position: relative;
    inset: auto;
    height: 360px;
    margin-top: 44px;
    overflow: clip;
  }
  .hero-night .wall-tilt {
    top: -60%;
    left: 4vw;
    right: 4vw;
    width: auto;
    height: 280%;
    transform: perspective(1200px) rotateX(8deg);
  }
  .hero-night .wall-track { animation-duration: 27s; }
  .hero-night .wall-track .wall-card { margin-bottom: -9%; }
  .hero-night .wall-track .wall-card:nth-child(3n+1) { transform: translateX(3%) rotateZ(-2deg); }
  .hero-night .wall-track .wall-card:nth-child(3n+2) { transform: translateX(-1%) rotateZ(-2deg); }
  .hero-night .wall-track .wall-card:nth-child(3n)   { transform: translateX(-4%) rotateZ(-2deg); }
  .hero-night .hero-wall::before { display: none; }
  .hero-night .hero-wall::after {
    background:
      linear-gradient(180deg, rgba(6, 12, 26, 0.95) 0%, rgba(6, 12, 26, 0) 24%),
      linear-gradient(0deg, rgba(12, 27, 62, 0.95) 0%, rgba(12, 27, 62, 0) 24%);
  }
}
@media (max-width: 400px) {
  .hero.hero-night.hero-animated h1 { font-size: 32px; letter-spacing: -0.03em; }
}

/* Mus-gløden i heroen — nøytral i stedet for blå */
.theme-nightsky .hero-animated .hero-spot {
  background: radial-gradient(340px circle at var(--mx, 50%) var(--my, 35%), rgba(205, 218, 245, 0.10), transparent 62%);
}

/* Respekter «reduser bevegelse» — veggen står da stille */
@media (prefers-reduced-motion: reduce) {
  .wall-track { animation: none !important; }
}


/* ===== WIZARD «Hva trenger du?» — Nightsky-designspråket =====
   Flyttes inn i style.css når hele wizarden (steg 1–4) er godkjent. */

.wiz {
  min-height: min(100vh, 1050px);
  padding: 110px 0 90px;
  background:
    radial-gradient(1100px 620px at 50% -12%, rgba(60, 105, 225, 0.16), transparent 62%),
    linear-gradient(180deg, #0C1B3E 0%, #0A1428 55%, #071022 100%);
  overflow: clip;
}

/* Topp: overskrift + progresjon */
.wiz-head { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.wiz-head .hero-eyebrow { justify-content: center; }
.wiz-head h1 {
  font-family: 'Geist', -apple-system, sans-serif;
  font-size: clamp(38px, 4.6vw, 64px);
  font-weight: 750;
  letter-spacing: -0.04em;
  line-height: 1.05;
  color: #fff;
  margin: 10px 0 14px;
}
.wiz-sub { color: rgba(226, 233, 252, 0.68); font-size: clamp(15px, 1.3vw, 18px); margin: 0 0 30px; }
.wiz-sub b { color: #fff; font-weight: 650; }
.wiz-progress { display: flex; gap: 8px; justify-content: center; max-width: 320px; margin: 0 auto; }
.wiz-progress span {
  flex: 1;
  height: 4px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: background 0.5s, box-shadow 0.5s;
}
.wiz-progress span.on { background: #fff; box-shadow: 0 0 14px rgba(255, 255, 255, 0.5); }
.wiz-steglabel { font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(226, 233, 252, 0.5); margin-top: 12px; display: block; }

/* Steg-paneler */
.wiz-steg { display: none; }
.wiz-steg.aktiv { display: block; animation: stegInn 0.55s cubic-bezier(0.2, 0.8, 0.25, 1); }
@keyframes stegInn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }

/* Valgkortene — glass */
.wiz-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(14px, 1.6vw, 24px);
  max-width: 1180px;
  margin: 0 auto;
}
.wiz-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  text-align: left;
  padding: 22px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 20px 60px rgba(2, 6, 18, 0.4), inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.18);
  cursor: pointer;
  transition: transform 0.45s cubic-bezier(0.175, 0.885, 0.32, 1.4), background 0.3s, border-color 0.3s, box-shadow 0.45s;
}
.wiz-card:hover {
  transform: translateY(-6px);
  background: rgba(255, 255, 255, 0.10);
  border-color: rgba(255, 255, 255, 0.28);
}
.wiz-card:focus-visible { outline: 3px solid rgba(255, 255, 255, 0.7); outline-offset: 3px; }
.wiz-card.valgt {
  background: rgba(255, 255, 255, 0.13);
  border-color: rgba(255, 255, 255, 0.55);
  box-shadow: 0 24px 70px rgba(2, 6, 18, 0.5), inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.35), 0 0 0 4px rgba(255, 255, 255, 0.08);
}
.wiz-card.valgt::after {
  content: "✓";
  position: absolute;
  top: 14px;
  right: 14px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #fff;
  color: #0A101F;
  font-size: 14px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wiz-ico { display: block; line-height: 0; opacity: 0.95; }
.wiz-ico svg { width: 30px; height: 30px; stroke: #fff; stroke-width: 1.8; fill: none; stroke-linecap: round; stroke-linejoin: round; }

/* Selvrullende forhåndsvisning — ROLIG tempo så man rekker å se */
.wiz-preview {
  width: 100%;
  height: 148px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: #10182B;
  display: block;
}
.wiz-preview img {
  display: block;
  width: 100%;
  height: auto;
  animation: wizRull 60s ease-in-out infinite alternate;
  will-change: transform;
}
@keyframes wizRull {
  from { transform: translateY(0); }
  to   { transform: translateY(calc(-100% + 148px)); }
}

/* «Se eksempelet»-knapp med pil som peker opp mot det rullende bildet */
.wiz-eksempel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 10px 14px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.10);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, 0.25);
  transition: background 0.3s, transform 0.3s;
}
.wiz-eksempel:hover { background: rgba(255, 255, 255, 0.2); transform: translateY(-1px); }
.wiz-eksempel svg { width: 14px; height: 14px; stroke: #fff; stroke-width: 2; fill: none; stroke-linecap: round; stroke-linejoin: round; }

.wiz-title { font-size: 18px; font-weight: 650; color: #fff; letter-spacing: -0.01em; }
.wiz-desc { font-size: 13.5px; line-height: 1.5; color: rgba(226, 233, 252, 0.62); }

/* Steg 2: tjeneste-kort (mindre, uten preview) */
.wiz-grid-s2 { grid-template-columns: repeat(3, 1fr); max-width: 980px; }
.wiz-grid-s2 .wiz-card { border-radius: 18px; padding: 20px; gap: 10px; }
.wiz-tilbake-rad { display: flex; justify-content: center; margin-bottom: 26px; }
.wiz-tilbake {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 18px;
  border-radius: 100px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: rgba(233, 239, 255, 0.85);
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.3s;
}
.wiz-tilbake:hover { background: rgba(255, 255, 255, 0.14); color: #fff; }

/* Glass-docken — valgene flyr ned og lander her */
.wiz-dock-wrap { display: flex; justify-content: center; margin-top: 48px; position: sticky; bottom: 18px; z-index: 60; }
.wiz-dock {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
  padding: 12px 14px;
  border-radius: 32px;
  background: rgba(13, 20, 36, 0.55);
  backdrop-filter: blur(20px) saturate(160%);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  border: 1px solid rgba(255, 255, 255, 0.22);
  box-shadow: 0 18px 56px rgba(2, 6, 18, 0.55), inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.28), inset -1px -1px 1px rgba(255, 255, 255, 0.08);
  min-height: 62px;
  max-width: 92vw;
}
.wiz-dock-empty { color: rgba(226, 233, 252, 0.55); font-size: 14px; padding: 0 18px; }
.wiz-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 100px;
  background: #fff;
  color: #0A101F;
  font-size: 14px;
  font-weight: 650;
  white-space: nowrap;
  border: 0;
  font-family: inherit;
}
.wiz-chip svg { width: 14px; height: 14px; stroke: #0A101F; stroke-width: 2.2; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.wiz-chip.chip-tjeneste {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  cursor: pointer;
  font-weight: 550;
  font-size: 13px;
  padding: 8px 15px;
}
.wiz-chip.chip-tjeneste svg { stroke: #fff; }
.wiz-chip.chip-tjeneste:hover { background: rgba(255, 255, 255, 0.2); }
.wiz-chip.chip-tjeneste .kryss { opacity: 0.6; font-weight: 400; margin-left: 2px; }
.wiz-neste {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 13px 24px;
  border-radius: 100px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.10);
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  opacity: 0.35;
  pointer-events: none;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.4);
  box-shadow: inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.3);
}
.wiz-dock.har-valg .wiz-neste { opacity: 1; pointer-events: auto; }
.wiz-neste:hover { background: rgba(255, 255, 255, 0.2); transform: translateY(-1px); }
.wiz-neste .arrow { transition: transform 0.3s; }
.wiz-neste:hover .arrow { transform: translateX(4px); }

/* Chip som flyr fra kortet ned i docken */
.wiz-fly {
  position: fixed;
  z-index: 999;
  pointer-events: none;
  transition: transform 0.65s cubic-bezier(0.3, 0.9, 0.35, 1.15), opacity 0.65s;
}

/* Popup: bla gjennom hele eksempel-nettsiden */
.wiz-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.wiz-modal[hidden] { display: none; }
.wiz-modal-bak { position: absolute; inset: 0; background: rgba(3, 6, 14, 0.74); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.wiz-modal-boks {
  position: relative;
  width: min(860px, 94vw);
  height: min(86vh, 920px);
  border-radius: 20px;
  overflow: hidden;
  background: #0D1424;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.6), inset 1px 1px 1px rgba(255, 255, 255, 0.2);
  display: flex;
  flex-direction: column;
  animation: modalInn 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.15);
}
@keyframes modalInn { from { opacity: 0; transform: translateY(26px) scale(0.965); } to { opacity: 1; transform: translateY(0) scale(1); } }
.wiz-modal-topp {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.04);
}
.wiz-modal-dots { display: flex; gap: 6px; }
.wiz-modal-dots span { width: 10px; height: 10px; border-radius: 50%; }
.wiz-modal-dots span:nth-child(1) { background: #FF5F57; }
.wiz-modal-dots span:nth-child(2) { background: #FEBC2E; }
.wiz-modal-dots span:nth-child(3) { background: #28C840; }
.wiz-modal-tittel { flex: 1; text-align: center; color: rgba(233, 239, 255, 0.8); font-size: 13px; font-weight: 600; }
.wiz-modal-kryss {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s;
}
.wiz-modal-kryss:hover { background: rgba(255, 255, 255, 0.2); }
.wiz-modal-scroll { flex: 1; overflow-y: auto; background: #fff; overscroll-behavior: contain; }
.wiz-modal-scroll img { width: 100%; display: block; }
.wiz-modal-hint { text-align: center; font-size: 12px; color: rgba(233, 239, 255, 0.55); padding: 10px; border-top: 1px solid rgba(255, 255, 255, 0.08); }
body.modal-apen { overflow: hidden; }

/* Steg 3: kontaktskjema — glass-felter */
.wiz-form { max-width: 560px; margin: 0 auto; display: grid; gap: 18px; }
.wiz-felt label { display: block; font-size: 13px; font-weight: 600; color: rgba(233, 239, 255, 0.8); margin-bottom: 7px; }
.wiz-felt input, .wiz-felt textarea {
  width: 100%;
  padding: 14px 18px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  box-sizing: border-box;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, 0.12);
  transition: border-color 0.3s, background 0.3s;
  resize: vertical;
}
.wiz-felt input::placeholder, .wiz-felt textarea::placeholder { color: rgba(226, 233, 252, 0.35); }
.wiz-felt input:focus, .wiz-felt textarea:focus { outline: none; border-color: rgba(255, 255, 255, 0.55); background: rgba(255, 255, 255, 0.1); }
.wiz-feil { color: #FF9DA3; font-size: 12.5px; margin-top: 6px; display: none; }
.wiz-felt.har-feil .wiz-feil { display: block; }
.wiz-felt.har-feil input { border-color: rgba(255, 130, 140, 0.7); }

/* Steg 4: oppsummering + send */
.wiz-oppsum { max-width: 560px; margin: 0 auto; }
.wiz-oppsum-kort {
  border-radius: 22px;
  padding: 26px 28px;
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(14px) saturate(150%);
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 20px 60px rgba(2, 6, 18, 0.4), inset 1.5px 1.5px 1px rgba(255, 255, 255, 0.18);
}
.wiz-oppsum-rad { display: flex; justify-content: space-between; gap: 18px; padding: 12px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.09); }
.wiz-oppsum-rad:last-child { border-bottom: none; }
.wiz-oppsum-rad .k { color: rgba(226, 233, 252, 0.55); font-size: 13.5px; flex-shrink: 0; padding-top: 1px; }
.wiz-oppsum-rad .v { color: #fff; font-size: 14.5px; font-weight: 550; text-align: right; white-space: pre-line; }
.wiz-send-rad { max-width: 560px; margin: 26px auto 0; text-align: center; }
.wiz-send { width: 100%; justify-content: center; font-size: 16px; padding: 17px 28px; opacity: 1; pointer-events: auto; }
.wiz-send-hint { margin-top: 12px; font-size: 13px; color: rgba(226, 233, 252, 0.55); }
.wiz-suksess { max-width: 560px; margin: 0 auto; text-align: center; padding: 30px 0 10px; }
.wiz-suksess-ikon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  margin: 0 auto 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  color: #0A101F;
  background: #fff;
  box-shadow: 0 0 50px rgba(255, 255, 255, 0.35);
}
.wiz-suksess h2 { font-family: 'Geist', sans-serif; font-weight: 720; font-size: clamp(26px, 3vw, 36px); letter-spacing: -0.03em; color: #fff; margin: 0 0 12px; }
.wiz-suksess p { color: rgba(226, 233, 252, 0.7); font-size: 16px; line-height: 1.6; }

/* Mobil */
@media (max-width: 1199px) {
  .wiz { padding: 130px 0 60px; }
  .wiz-grid { grid-template-columns: repeat(2, 1fr); max-width: 640px; }
  .wiz-grid-s2 { grid-template-columns: repeat(2, 1fr); max-width: 640px; }
}
@media (max-width: 640px) {
  .wiz-grid, .wiz-grid-s2 { grid-template-columns: 1fr; max-width: 420px; }
  .wiz-preview { height: 170px; }
  @keyframes wizRull {
    from { transform: translateY(0); }
    to   { transform: translateY(calc(-100% + 170px)); }
  }
  .wiz-dock { border-radius: 26px; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .wiz-preview img { animation: none; }
  .wiz-fly { transition: none; }
  .wiz-steg.aktiv { animation: none; }
}

/* ===== HVEM ER ADALI? — grunnleggerne på forsiden ===== */
.who { background: var(--paper); overflow: clip; }
.who-head { text-align: center; max-width: 760px; margin: 0 auto 52px; }
.who-head .section-label { justify-content: center; }
.who-title {
  /* Fet Geist — Fraunces er kun lastet i vekt 300–500 og kan ikke bli ekte fet */
  font-family: 'Geist', -apple-system, sans-serif;
  font-size: clamp(36px, 4.6vw, 60px);
  font-weight: 750;
  letter-spacing: -0.04em;
  line-height: 1.05;
  color: var(--ink);
  margin: 10px 0 16px;
}
.who-title em { font-family: 'Fraunces', serif; font-style: italic; font-weight: 400; color: var(--blue); }
/* Logo-wordmarken (samme SVG som i nav-baren) brukt som ordet «Adali» i tittelen */
.who-title .who-wordmark { height: .9em; width: auto; display: inline-block; vertical-align: -.075em; color: var(--blue); }
/* Wordmarken tegner seg opp bokstav for bokstav når tittelen glir inn (krever pathLength="1" på path-ene) */
.home-motion .who-head .who-wordmark path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.home-motion .who-head.visible .who-wordmark path { animation: whoDraw .9s cubic-bezier(.4, 0, .2, 1) forwards; }
.home-motion .who-head.visible .who-wordmark path:nth-of-type(1) { animation-delay: .25s; }
.home-motion .who-head.visible .who-wordmark path:nth-of-type(2) { animation-delay: .40s; }
.home-motion .who-head.visible .who-wordmark path:nth-of-type(3) { animation-delay: .55s; }
.home-motion .who-head.visible .who-wordmark path:nth-of-type(4) { animation-delay: .70s; }
.home-motion .who-head.visible .who-wordmark path:nth-of-type(5) { animation-delay: .85s; }
@keyframes whoDraw { to { stroke-dashoffset: 0; } }
.who-intro { margin: 0 auto; }

.who-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: clamp(18px, 4vw, 44px);
  max-width: 880px;
  margin: 0 auto;
  align-items: stretch;
}
.who-card-wrap { display: flex; }

/* Skråstillingen ligger på kortet, IKKE på scroll-reveal-wrapperen — .visible setter transform:none */
.who-card { --tilt: -2deg; transform: rotate(var(--tilt)); width: 100%;
  transition: transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease, border-color .3s ease; }
.who-cards .who-card-wrap:last-child .who-card { --tilt: 2deg; }
.who-card:hover { transform: rotate(0deg) translateY(-6px);
  border-color: color-mix(in srgb, var(--blue) 40%, var(--line));
  box-shadow: 0 30px 60px -18px rgba(30, 79, 212, 0.28); }
.who-card .founder-card-photo img { transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.who-card:hover .founder-card-photo img { transform: scale(1.04); }

.who-card .founder-card-role { flex: 0 0 auto; font-weight: 600; color: var(--ink); }
.who-bio { font-size: 14px; color: var(--muted); line-height: 1.65; margin: 0; flex: 1; }
.who-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.who-meta span { font-size: 11.5px; font-weight: 600; color: var(--blue);
  background: var(--blue-mist); border: 1px solid var(--blue-soft);
  border-radius: 999px; padding: 4px 10px; white-space: nowrap; }

/* Streken mellom kortene: to gradient-segmenter med en «&» i midten */
.who-divider { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.who-divider::before, .who-divider::after { content: ''; flex: 1; width: 1px; }
.who-divider::before { background: linear-gradient(180deg, transparent, var(--line)); }
.who-divider::after  { background: linear-gradient(180deg, var(--line), transparent); }
.who-divider span { font-family: 'Fraunces', serif; font-style: italic; font-size: 20px;
  color: var(--blue); width: 40px; height: 40px; border-radius: 50%; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid var(--line);
  box-shadow: 0 4px 14px rgba(10, 27, 61, 0.08); }

.who-more { text-align: center; margin: 34px 0 0; }
.who-more a { color: var(--blue); font-weight: 600; text-decoration: none; }
.who-more a:hover { text-decoration: underline; }

/* Inn-gliding fra hver sin side + stagger (kun forsidene, samme gate som resten).
   :not(.visible) fordi denne blokken står etter .home-motion .scroll-reveal.visible i fila
   og ellers ville overstyrt slutt-tilstanden ved lik spesifisitet. */
.home-motion .who-card-wrap.scroll-reveal:not(.visible) { transform: translate(-28px, 24px); }
.home-motion .who-cards .who-card-wrap:last-child.scroll-reveal:not(.visible) { transform: translate(28px, 24px); }
.home-motion .who-cards .who-card-wrap:last-child.scroll-reveal { transition-delay: .12s; }
.home-motion .who-divider.scroll-reveal { transition-delay: .22s; }

/* Mobil: kortene stables, skråstillingen slippes, streken blir horisontal */
@media (max-width: 720px) {
  .who-cards { grid-template-columns: 1fr; max-width: 440px; }
  .who-card, .who-cards .who-card-wrap:last-child .who-card { --tilt: 0deg; }
  .who-divider { flex-direction: row; width: 100%; padding: 2px 0; }
  .who-divider::before, .who-divider::after { width: auto; height: 1px; }
  .who-divider::before { background: linear-gradient(90deg, transparent, var(--line)); }
  .who-divider::after  { background: linear-gradient(90deg, var(--line), transparent); }
}

/* Redusert bevegelse: statisk skrå beholdes (dekorativt), all animasjon av.
   Reveal-forskyvningen må også nullstilles — :not(.visible)-reglene over har
   høyere spesifisitet enn den globale reduced-motion-nullstillingen. */
@media (prefers-reduced-motion: reduce) {
  .who-card, .who-card .founder-card-photo img { transition: none; }
  .who-card:hover { transform: rotate(var(--tilt)); border-color: var(--line);
    box-shadow: 0 6px 24px rgba(10, 27, 61, 0.05); }
  .who-card:hover .founder-card-photo img { transform: none; }
  .home-motion .who-card-wrap.scroll-reveal:not(.visible),
  .home-motion .who-cards .who-card-wrap:last-child.scroll-reveal:not(.visible) { transform: none; }
  .home-motion .who-head .who-wordmark path { stroke-dasharray: none; stroke-dashoffset: 0; animation: none; }
}

/* =================================================================
   UNDERSIDER MED FORSIDENS DNA (17. juli 2026)
   – overskrifter i Geist fet (som forsiden), Fraunces-kursiv kun som aksent i <em>
   – .uside-hero: mørk nightsky-hero øverst med drivende aurora-glød
   – motion aktiveres per side med html.home-motion (samme gate som forsiden)
   ================================================================= */
.nav-night .section-title{font-family:'Geist',-apple-system,BlinkMacSystemFont,sans-serif;font-weight:750;letter-spacing:-.035em;line-height:1.06;}
/* 17. juli 2026 (Amins ordre): ÉN skrifttype overalt — em er ikke lenger serif/kursiv, kun farge-aksent */
.nav-night .section-title em{font-family:inherit;font-style:normal;font-weight:inherit;letter-spacing:inherit;}

.uside-hero{position:relative;overflow:clip;padding:clamp(128px,15vh,168px) 0 clamp(46px,6vw,74px);
  background:radial-gradient(1000px 540px at 72% -14%, rgba(60,105,225,.22), transparent 62%),
  linear-gradient(180deg,#0C1B3E 0%,#0A1428 58%,#071022 100%);}
.uside-hero .container{position:relative;z-index:1;}
.uside-hero .section-label{color:rgba(233,239,255,.66);}
.uside-hero .section-label::before{background:#7FA6FF;}
.uside-hero .section-title{color:#fff;margin-bottom:18px;}
.uside-hero .section-title em{color:#fff;} /* helt hvit tittel — som forsidens hero */
.uside-hero .section-intro{color:rgba(226,233,252,.72);}
.uside-hero .section-intro strong{color:#fff;}
.uside-hero a{color:#AFC6FF;}
.uh-aurora i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;pointer-events:none;display:block;}
.uh-aurora i:nth-child(1){width:clamp(360px,34vw,660px);height:clamp(270px,25.5vw,495px);left:6%;top:-10%;background:radial-gradient(circle,rgba(80,125,235,.45),transparent 70%);animation:uhDrift 16s ease-in-out infinite alternate;}
.uh-aurora i:nth-child(2){width:clamp(300px,29vw,570px);height:clamp(240px,22.9vw,450px);right:4%;top:8%;background:radial-gradient(circle,rgba(47,98,234,.36),transparent 70%);animation:uhDrift 19s ease-in-out infinite alternate-reverse;}
.uh-aurora i:nth-child(3){width:clamp(240px,23vw,450px);height:clamp(190px,18.4vw,360px);left:46%;bottom:-26%;background:radial-gradient(circle,rgba(150,180,255,.26),transparent 70%);animation:uhDrift 22s ease-in-out infinite alternate;}
@keyframes uhDrift{from{transform:translate(0,0) scale(1);}to{transform:translate(44px,26px) scale(1.12);}}
@media (prefers-reduced-motion: reduce){.uh-aurora i{animation:none;}}

/* Alle overskrifter på undersidene i Geist (som forsiden) — Fraunces lever videre
   kun som kursiv <em>-aksent og i småtall/sitater. Står sist i fila med vilje:
   vinner over eldre serif-regler med lik spesifisitet. */
.nav-night h1, .nav-night h2, .nav-night h3, .nav-night h4 {
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.nav-night h1.section-title, .nav-night h2.section-title { font-weight: 750; letter-spacing: -0.035em; }

/* =================================================================
   KORTSTOKKEN — prosjekter.html (17. juli 2026, idé-panel-vinner)
   Tre sticky prosjektkort som legger seg oppå hverandre som en
   kortstokk ved scroll. Ren CSS sticky — ingen scroll-jacking.
   Motion er gated bak .home-motion (samme sikkerhetsnett som ellers).
   ================================================================= */
.uside-hero--kompakt{padding:clamp(138px,15vh,156px) 0 44px;text-align:center;}
.uside-hero--kompakt .section-label{justify-content:center;margin-bottom:14px;}
.uside-hero--kompakt .section-title{margin-left:auto;margin-right:auto;font-size:clamp(30px,3.5vw,46px);margin-bottom:12px;}
.uside-hero--kompakt .section-intro{margin-left:auto;margin-right:auto;font-size:clamp(15px,1.2vw,17px);}
.hero-tillit{margin-top:12px;font-size:.92rem;font-weight:600;color:rgba(226,233,252,.78);}
.hero-tillit .stj{color:#FFC53D;letter-spacing:.1em;}

/* =================================================================
   SCENEN — prosjekter.html (17. juli 2026, v5)
   Én stor browser-ramme (venstre) + «Les oss også!»-stabel (høyre):
   de to andre prosjektene som to skrå kort med snakkeboble over.
   Lastelinje i Google-farger inne i browser-baren viser auto-bytte.
   ================================================================= */
.scene{overflow-x:clip;padding:34px 0 40px;}
.scene .container{max-width:1100px;}

/* Info-panelet (ett per prosjekt, kun aktivt vises) */
.scene-panel{display:none;}
.scene-panel.is-active{display:flex;flex-direction:column;align-items:center;text-align:center;
  animation:panelInn .45s cubic-bezier(.16,1,.3,1);}
@keyframes panelInn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
.sc-meta{font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:650;margin-bottom:10px;
  color:color-mix(in srgb, var(--brand, var(--blue)) 64%, var(--ink));display:inline-flex;align-items:center;gap:10px;}
.sc-tittel{font-family:'Geist',-apple-system,BlinkMacSystemFont,sans-serif;font-weight:750;letter-spacing:-.035em;
  line-height:1.06;font-size:clamp(26px,2.6vw,38px);color:var(--ink);margin:0 0 8px;}
.sc-linje{font-size:clamp(15px,1.2vw,17px);line-height:1.55;color:var(--muted);max-width:640px;margin:0 auto 14px;}
.sc-chips{display:flex;flex-wrap:wrap;justify-content:center;}
.sc-chips .chip{margin:0 4px 8px;}
@keyframes chipPop{to{opacity:1;transform:none;}}
.scene-panel .chip{opacity:0;transform:scale(.6);}
.scene-panel.is-active .chip{animation:chipPop .35s cubic-bezier(.34,1.56,.64,1) forwards;}
.scene-panel.is-active .chip:nth-child(1){animation-delay:.1s;}
.scene-panel.is-active .chip:nth-child(2){animation-delay:.17s;}
.scene-panel.is-active .chip:nth-child(3){animation-delay:.24s;}
.sc-lenker{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:12px;}

/* Bühnen: ramme til venstre, peek-stabel til høyre */
.scene-buhne{display:flex;align-items:center;justify-content:center;gap:36px;margin-top:30px;}
.scene-mockup{position:relative;flex:0 1 800px;min-width:0;}
.scene-glod{position:absolute;inset:-8%;pointer-events:none;}
.scene-glod span{position:absolute;border-radius:50%;filter:blur(80px);opacity:0;transition:opacity .7s ease;}
.scene-glod span:nth-child(1){background:radial-gradient(circle,#8f744d,transparent 70%);left:-4%;top:14%;width:56%;height:76%;}
.scene-glod span:nth-child(2){background:radial-gradient(circle,#1b2a8f,transparent 70%);right:-4%;top:6%;width:56%;height:76%;}
.scene-glod span:nth-child(3){background:radial-gradient(circle,#1f2844,transparent 70%);left:24%;bottom:-10%;width:52%;height:66%;}
.scene[data-aktiv="0"] .scene-glod span:nth-child(1){opacity:.42;}
.scene[data-aktiv="1"] .scene-glod span:nth-child(2){opacity:.42;}
.scene[data-aktiv="2"] .scene-glod span:nth-child(3){opacity:.4;}
.scene-glod span:nth-child(4){background:radial-gradient(circle,#7a5c33,transparent 70%);right:6%;bottom:-8%;width:54%;height:70%;}
.scene[data-aktiv="3"] .scene-glod span:nth-child(4){opacity:.4;}
.scene-mockup .browser-mockup{position:relative;z-index:2;box-shadow:0 30px 80px rgba(10,27,61,.26);transition:transform .3s ease;}
.scene .browser-bar{position:relative;}
.scene-lastelinje{position:absolute;left:0;bottom:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,#4285F4,#34A853,#FBBC05,#EA4335);z-index:3;}
@keyframes lasteLinje{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.scene.auto .scene-lastelinje{animation:lasteLinje var(--syk,9s) linear forwards;}
.scene .browser-screen{aspect-ratio:16/8.5;position:relative;}
/* Klikkbart skjermbilde (23. juli 2026): auto-rullingen («liveRull») er fjernet.
   Klikk på rammen åpner en popup (gjenbruker .wiz-modal) der man blar gjennom hele siden. */
.scene-shot{position:absolute;inset:0;opacity:0;transition:opacity .4s ease;pointer-events:none;overflow:hidden;}
.scene-shot.is-active{opacity:1;pointer-events:auto;cursor:zoom-in;}
.scene-shot .screenshot-img{display:block;width:100%;height:auto;object-fit:unset;object-position:unset;transition:none;}
.scene-bla-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;pointer-events:none;
  display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:#fff;font-size:15px;font-weight:700;
  letter-spacing:-.01em;padding:14px 26px;border-radius:999px;
  box-shadow:0 18px 44px rgba(10,27,61,.45),0 0 0 6px rgba(255,255,255,.4);
  animation:blaPuls 2.6s ease-in-out infinite;}
.scene-bla-hint svg{flex:0 0 auto;}
@keyframes blaPuls{0%,100%{transform:translate(-50%,-50%) scale(1);}50%{transform:translate(-50%,-50%) scale(1.06);}}
.browser-screen:hover .scene-bla-hint{background:var(--blue);}
@media (hover:hover){.scene-mockup:hover .browser-mockup{transform:translateY(-4px);}}

/* «Les oss også!»-stabelen: snakkeboble + to skrå kort */
.peek-stabel{flex:0 0 216px;display:flex;flex-direction:column;align-items:center;gap:18px;}
.peek-rop{position:relative;display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:9px 18px;font-weight:750;font-size:.92rem;letter-spacing:-.01em;color:var(--ink);
  box-shadow:0 10px 26px rgba(10,27,61,.12);animation:ropFlyt 3.4s ease-in-out infinite;}
.peek-rop::after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:#fff;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:translateX(-50%) rotate(45deg);}
.rop-dots{display:inline-flex;gap:4px;}
.rop-dots i{width:7px;height:7px;border-radius:50%;}
.rop-dots i:nth-child(1){background:#4285F4;animation:ropDott 1.8s ease-in-out infinite;}
.rop-dots i:nth-child(2){background:#34A853;animation:ropDott 1.8s ease-in-out .2s infinite;}
.rop-dots i:nth-child(3){background:#FBBC05;animation:ropDott 1.8s ease-in-out .4s infinite;}
@keyframes ropFlyt{0%,100%{transform:translateY(0) rotate(-1deg);}50%{transform:translateY(-5px) rotate(1deg);}}
@keyframes ropDott{0%,100%{transform:none;opacity:1;}50%{transform:translateY(-3px);opacity:.75;}}
.scene-peek{position:relative;width:100%;aspect-ratio:16/10;border-radius:14px;overflow:hidden;padding:0;
  border:1px solid var(--line);background:#fff;cursor:pointer;box-shadow:0 14px 34px rgba(10,27,61,.16);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.scene-peek:first-of-type{transform:rotate(2.5deg);animation:peekNikkA 6s ease-in-out infinite;}
.scene-peek:last-of-type{transform:rotate(-2deg);animation:peekNikkB 6s ease-in-out 3s infinite;}
@keyframes peekNikkA{0%,84%,100%{transform:rotate(2.5deg);}92%{transform:rotate(1deg) translateX(-9px);}}
@keyframes peekNikkB{0%,84%,100%{transform:rotate(-2deg);}92%{transform:rotate(-.5deg) translateX(-9px);}}
.scene-peek:hover{animation:none;transform:rotate(0) translateX(-8px) scale(1.05);border-color:#B9C6E8;
  box-shadow:0 20px 44px rgba(10,27,61,.24);}
.scene-peek:focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
.peek-shots{position:absolute;inset:0;}
.peek-shots img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transition:opacity .35s ease;}
.peek-shots img.is-vist{opacity:1;}
.peek-navn{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);white-space:nowrap;
  background:rgba(10,27,61,.88);color:#fff;font-weight:700;font-size:.76rem;letter-spacing:.01em;
  padding:5px 12px;border-radius:999px;pointer-events:none;}

/* Piler: kun når peek-stabelen ikke har plass (under 1200px) */
.scene-pil{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:46px;height:46px;border-radius:50%;
  border:1px solid var(--line);background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink);
  box-shadow:0 8px 24px rgba(10,27,61,.16);transition:transform .2s,box-shadow .2s,border-color .2s;}
.scene-pil svg{width:18px;height:18px;display:block;}
.scene-pil:hover{transform:translateY(-50%) scale(1.1);border-color:#B9C6E8;box-shadow:0 12px 30px rgba(10,27,61,.22);}
.scene-pil:focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
.scene-pil-venstre{left:8px;}
.scene-pil-hoyre{right:8px;}

/* =================================================================
   PROSJEKTVELGER — prosjekter.html / prosjekter-en.html
   (20. juli 2026) — erstatter auto-rotasjon + «Les oss også»-stabel.
   Alle fire prosjektene er alltid synlige og klikkbare, i alle bredder.
   MERK: 4 kolonner er dimensjonert for 4 prosjekter. Ved 5+ bytt til
   grid-template-columns:repeat(auto-fit,minmax(150px,1fr)).
   ================================================================= */
.scene-velger-blokk{width:min(800px,100%);margin:22px auto 0;
  display:flex;flex-direction:column;align-items:center;gap:14px;}

/* Husets egen stemme beholdt: pillen med de tre prikkene */
.velger-rop{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:8px 16px;font-weight:700;font-size:.82rem;letter-spacing:-.01em;
  color:var(--muted);box-shadow:0 8px 20px rgba(10,27,61,.10);}

.scene-velger{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;width:100%;}

.velger-kort{display:flex;flex-direction:column;gap:8px;min-width:0;padding:0;border:0;background:none;
  cursor:pointer;font-family:inherit;text-align:center;}
.vk-bilde{position:relative;display:block;overflow:hidden;aspect-ratio:16/10;border-radius:12px;
  border:1px solid var(--line);background:#fff;box-shadow:0 6px 18px rgba(10,27,61,.10);
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease,border-color .3s ease;}
.vk-bilde img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;
  opacity:.6;filter:saturate(.7);transition:opacity .3s ease,filter .3s ease;}
.vk-tekst{display:block;line-height:1.25;}
.vk-navn{display:block;font-size:13px;font-weight:650;letter-spacing:-.01em;color:var(--muted);
  overflow-wrap:anywhere;transition:color .3s ease;}
.vk-nr{font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--muted);margin-right:6px;transition:color .3s ease;}
.vk-bransje{display:block;font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--muted);
  opacity:.72;transition:opacity .3s ease;}

/* Valgt kort — nøytral markering som alltid virker ... */
.velger-kort.is-valgt .vk-bilde{border-color:#B9C6E8;box-shadow:0 12px 28px rgba(10,27,61,.18);}
.velger-kort.is-valgt .vk-bilde img{opacity:1;filter:none;}
.velger-kort.is-valgt .vk-navn{color:var(--ink);}
.velger-kort.is-valgt .vk-bransje{opacity:1;}
/* ... og prosjektets egen merkefarge der nettleseren støtter color-mix */
@supports (color:color-mix(in srgb,red,blue)){
  .velger-kort.is-valgt .vk-bilde{
    border-color:color-mix(in srgb, var(--brand,var(--blue)) 55%, var(--line));
    box-shadow:0 0 0 2px color-mix(in srgb, var(--brand,var(--blue)) 45%, transparent),
               0 12px 28px rgba(10,27,61,.18);}
  .velger-kort.is-valgt .vk-nr{color:color-mix(in srgb, var(--brand,var(--blue)) 64%, var(--ink));}
}

@media (hover:hover){
  .velger-kort:hover .vk-bilde{transform:translateY(-3px);box-shadow:0 14px 30px rgba(10,27,61,.20);border-color:#B9C6E8;}
  .velger-kort:hover .vk-bilde img{opacity:1;filter:none;}
  .velger-kort:hover .vk-navn{color:var(--ink);}
}
.velger-kort:focus-visible{outline:none;}
.velger-kort:focus-visible .vk-bilde{outline:2px solid var(--blue);outline-offset:3px;}

/* Casestudie-lenke som følger valget — fikser blindveien på mobil */
.velger-cta{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:.92rem;
  color:var(--blue);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s ease;}
.velger-cta:hover{border-bottom-color:currentColor;}
.velger-cta .arrow{transition:transform .2s ease;}
.velger-cta:hover .arrow{transform:translateX(3px);}
@media (min-width:1200px){.scene-pil{display:none;}}
@media (max-width:1199px){
  .peek-stabel{display:none;}
  .scene-buhne{display:block;}
  .scene-mockup{width:min(800px,100%);margin:0 auto;}
}
@media (max-width:809px){
  .uside-hero--kompakt{padding-top:104px;}
  .sc-linje{font-size:15px;}
  .sc-chips .chip{font-size:.72rem;padding:5px 10px;}
  .scene .browser-screen{aspect-ratio:4/5;}
  .scene-pil{width:38px;height:38px;}
  .scene-velger{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .scene-velger-blokk{margin-top:18px;gap:12px;}
  .velger-rop{font-size:.76rem;padding:7px 13px;}
  .vk-navn{font-size:12px;}
  .vk-nr{font-size:10px;}
  .vk-bransje{font-size:10px;}
  .velger-cta{font-size:.86rem;}
}
@media (prefers-reduced-motion: reduce){
  .scene-panel.is-active{animation:none;}
  .scene-bla-hint{animation:none;}
  .scene-panel .chip{opacity:1;transform:none;animation:none !important;}
  .scene-lastelinje{display:none;}
  .scene-shot{transition:none;}
  .peek-rop,.rop-dots i,.scene-peek{animation:none !important;}
  .velger-kort .vk-bilde,
  .velger-kort .vk-bilde img,
  .velger-kort .vk-navn,
  .velger-kort .vk-nr,
  .velger-kort .vk-bransje{transition:none;}
  .velger-kort:hover .vk-bilde{transform:none;}
  .velger-cta .arrow{transition:none;}
  .velger-cta:hover .arrow{transform:none;}
  .scene-peek:first-of-type,.scene-peek:last-of-type{transform:none;}
}

/* =================================================================
   TEKST-SLUTT — prosjekter.html (17. juli 2026): bunnseksjonene
   Kinetisk tekst (ordene tennes ved scroll), drivende ordbånd,
   CTA i glød-panel. Monokrome overskrifter (em = samme farge).
   ================================================================= */
.tekst-slutt{padding:46px 0 8px;}
.tekst-slutt .section-title,.tekst-slutt-cta .section-title{margin-left:auto;margin-right:auto;}
.tekst-slutt .section-title em,.tekst-slutt-cta .section-title em{color:inherit;}
.ord-lys{font-size:clamp(19px,2vw,27px);line-height:1.52;font-weight:640;letter-spacing:-.015em;
  max-width:800px;margin:6px auto 0;color:var(--ink);}
.ord-lys span{color:rgba(10,27,61,.18);transition:color .35s ease;}
.ord-lys span.lyst{color:var(--ink);}
.ts-lenker{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;margin-top:24px;}
.ts-lenker a{font-weight:700;color:var(--blue);text-decoration:none;font-size:.98rem;}
.ts-lenker .arrow{display:inline-block;transition:transform .2s ease;}
.ts-lenker a:hover .arrow{transform:translateX(4px);}

.ord-band{overflow:hidden;padding:32px 0 26px;}
.ord-spor{display:flex;align-items:center;gap:44px;width:max-content;animation:ordGli 32s linear infinite;}
.ord-spor span{display:inline-flex;align-items:center;gap:44px;font-weight:750;
  font-size:clamp(20px,2.3vw,30px);letter-spacing:-.02em;white-space:nowrap;}
.ord-spor span::after{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;opacity:.65;}
/* Farge-syklus på 6 = halve båndet, så loopen er sømløs (12 ord = 2 × 6) */
.ord-spor span:nth-child(6n+1){color:#1E4FD4;}
.ord-spor span:nth-child(6n+2){color:#5B3BC4;}
.ord-spor span:nth-child(6n+3){color:#1F7A55;}
.ord-spor span:nth-child(6n+4){color:#B0316E;}
.ord-spor span:nth-child(6n+5){color:#2F62EA;}
.ord-spor span:nth-child(6n+6){color:#A15C3E;}
@keyframes ordGli{to{transform:translateX(-50%);}}

.tekst-slutt-cta{padding:8px 0 88px;}
/* Mindre panel med vandrende Google-lysstråle rundt kanten */
@property --ctaVinkel{syntax:'<angle>';inherits:false;initial-value:0deg;}
.cta-ramme{position:relative;max-width:920px;margin:0 auto;border-radius:32px;padding:2px;
  background:conic-gradient(from var(--ctaVinkel) at 50% 50%,
    #D5E0F5 0deg,#4285F4 34deg,#34A853 66deg,#FBBC05 96deg,#EA4335 126deg,#D5E0F5 160deg,#D5E0F5 360deg);
  animation:ctaRoter 9s linear infinite;}
@keyframes ctaRoter{to{--ctaVinkel:360deg;}}
.tekst-slutt-cta .cta-panel{margin-top:0;border:none;border-radius:30px;
  padding:clamp(34px,4.6vw,48px) clamp(18px,4vw,44px);}
.tekst-slutt-cta .section-title{font-size:clamp(30px,3.4vw,46px);margin-bottom:16px;}
/* Glass-knapp (samme familie som Start prosjekt i menyen, tilpasset lys bakgrunn) */
.btn-glass{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.42);
  backdrop-filter:blur(14px) saturate(170%);-webkit-backdrop-filter:blur(14px) saturate(170%);
  border:1px solid rgba(255,255,255,.78);color:var(--ink);font-weight:750;font-size:1rem;
  padding:13px 27px;border-radius:999px;text-decoration:none;cursor:pointer;
  box-shadow:inset 1.5px 1.5px 1px rgba(255,255,255,.55),inset -1px -1px 1px rgba(255,255,255,.25),0 10px 28px rgba(10,27,61,.16);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s,box-shadow .2s;
  animation:ctaPuls 2.6s ease-in-out infinite;}
.btn-glass:hover{background:rgba(255,255,255,.62);transform:translateY(-2px);
  box-shadow:inset 1.5px 1.5px 1px rgba(255,255,255,.6),inset -1px -1px 1px rgba(255,255,255,.3),0 14px 34px rgba(10,27,61,.24);}
@keyframes ctaPuls{0%,100%{box-shadow:inset 1.5px 1.5px 1px rgba(255,255,255,.55),inset -1px -1px 1px rgba(255,255,255,.25),0 8px 22px rgba(30,79,212,.14);}
  50%{box-shadow:inset 1.5px 1.5px 1px rgba(255,255,255,.55),inset -1px -1px 1px rgba(255,255,255,.25),0 14px 36px rgba(30,79,212,.34);}}
.btn-glass .arrow{display:inline-block;animation:pilDytt 2.6s ease-in-out infinite;}
@keyframes pilDytt{0%,100%{transform:translateX(0);}50%{transform:translateX(4px);}}

@media (max-width:809px){
  .ord-lys{font-size:17px;}
  .ord-spor span{font-size:19px;}
  .ts-lenker{gap:18px;}
}
@media (prefers-reduced-motion: reduce){
  .ord-spor{animation:none;}
  .ord-lys span{color:var(--ink);transition:none;}
  .cta-ramme{animation:none;}
  .btn-glass{animation:none;}
  .btn-glass .arrow{animation:none;}
}

/* =================================================================
   WEBDESIGN-OSLO — sidestramming (17. juli 2026, kveld)
   Alt midtstilt, monokrome overskrifter, strammere seksjoner,
   kort med stagger + hover, prosess på én rad. Gjenbruker ord-lys,
   ord-band, cta-ramme og btn-glass fra prosjekter-siden.
   ================================================================= */
.wo .section{padding:clamp(40px,5vw,64px) 0;text-align:center;}
.wo .section-label{justify-content:center;}
.wo .section-title{margin-left:auto;margin-right:auto;}
.wo .section-title em{color:inherit;}
.wo .section-intro{margin-left:auto;margin-right:auto;}
.wo .card{text-align:center;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.wo .card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(10,27,61,.10);border-color:#C7D3EC;}
.wo .prosess-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.home-motion .wo .services-grid.scroll-reveal .card,
.home-motion .wo .prosess-grid.scroll-reveal .card{opacity:0;transform:translateY(14px) scale(.98);
  transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1);}
.home-motion .wo .services-grid.scroll-reveal.visible .card,
.home-motion .wo .prosess-grid.scroll-reveal.visible .card{opacity:1;transform:none;}
.home-motion .wo .scroll-reveal.visible .card:nth-child(2){transition-delay:.06s;}
.home-motion .wo .scroll-reveal.visible .card:nth-child(3){transition-delay:.12s;}
.home-motion .wo .scroll-reveal.visible .card:nth-child(4){transition-delay:.18s;}
.home-motion .wo .scroll-reveal.visible .card:nth-child(5){transition-delay:.24s;}
.home-motion .wo .scroll-reveal.visible .card:nth-child(6){transition-delay:.30s;}
@media (max-width:1080px){.wo .prosess-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.wo .prosess-grid{grid-template-columns:1fr;}}
@media (prefers-reduced-motion: reduce){
  .home-motion .wo .services-grid.scroll-reveal .card,
  .home-motion .wo .prosess-grid.scroll-reveal .card{opacity:1;transform:none;transition:none;}
}

/* =================================================================
   OSLOLINJEN — webdesign-oslo.html (17. juli 2026, idé-panel-vinner)
   Hele siden som ett T-bane-linjekart: loddrett skinne som fylles
   ved scroll, stasjonsringer som «dinger», rutekart i heroen,
   Oslo-nål, og endestasjon med Google-salutt ved CTA-en.
   ================================================================= */
.linjea .stasjon{position:relative;scroll-margin-top:96px;}
.linjea .spor{position:absolute;left:50%;top:0;transform:translateX(-50%);width:2px;
  height:clamp(36px,4.4vw,54px);border-radius:2px;background:rgba(10,27,61,.08);}
.linjea #hvorfor .spor,.linjea #oslo .spor{height:clamp(32px,3.6vw,44px);}
.linjea .spor-fyll{position:absolute;inset:0;border-radius:2px;background:var(--st);
  transform:scaleY(var(--p,0));transform-origin:top;}
.linjea .spor-fyll::after{content:"";position:absolute;left:50%;bottom:0;width:8px;height:8px;
  transform:translate(-50%,50%);border-radius:50%;background:var(--st);
  box-shadow:0 0 12px 3px var(--st-glod,rgba(30,79,212,.5));opacity:var(--tog,0);}

/* Stasjonsskiltet: boks rundt seksjons-labelen — skinnen dokker i skiltet,
   og skiltet tennes i stasjonsfargen når man ankommer (som ekte T-baneskilt) */
.linjea .st-label{display:inline-flex;justify-content:center;align-items:center;gap:10px;
  position:relative;padding:9px 20px;border:2px solid rgba(10,27,61,.16);border-radius:12px;
  background:#fff;color:var(--ink);margin-left:auto;margin-right:auto;
  transition:background .45s ease,border-color .45s ease,color .45s ease;}
.linjea .st-label::before{display:none;}
.linjea .stasjon.naadd .st-label{background:var(--st);border-color:var(--st);color:#fff;
  animation:stDing .42s cubic-bezier(.34,1.56,.64,1);}
.linjea .st-ring{width:14px;height:14px;border-radius:50%;background:#fff;flex:none;
  border:3px solid rgba(10,27,61,.22);transition:border-color .3s ease,background .3s ease;}
.linjea .stasjon.naadd .st-ring{border-color:#fff;}
@keyframes stDing{0%{transform:scale(1);}55%{transform:scale(1.06);}100%{transform:scale(1);}}
.stasjon--pin.naadd .st-naal{fill:#fff;}
.stasjon--pin.naadd .naal-puls{border-color:#fff;}

/* Rutekartet i heroen: 5 klikkbare stasjoner med synlige navn */
.rutekart{display:flex;justify-content:center;gap:clamp(14px,3vw,30px);margin:24px auto 0;position:relative;width:max-content;max-width:100%;}
.rutekart .rk-linje{position:absolute;top:6px;left:30px;right:26px;height:2px;background:rgba(255,255,255,.22);}
.rutekart a{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;
  font-size:.78rem;font-weight:650;color:rgba(226,233,252,.85);text-decoration:none;padding:0 4px 4px;}
.rutekart a i{width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--st);
  box-sizing:border-box;transition:transform .25s ease;}
.rutekart a:hover i,.rutekart a:focus-visible i{transform:scale(1.35);}
.rutekart a:hover{color:#fff;}
.home-motion .rutekart a{opacity:0;transform:scale(.6);
  transition:opacity .35s cubic-bezier(.34,1.56,.64,1),transform .35s cubic-bezier(.34,1.56,.64,1);}
.home-motion .rutekart.visible a{opacity:1;transform:none;}
.home-motion .rutekart.visible a:nth-child(3){transition-delay:.06s;}
.home-motion .rutekart.visible a:nth-child(4){transition-delay:.12s;}
.home-motion .rutekart.visible a:nth-child(5){transition-delay:.18s;}
.home-motion .rutekart.visible a:nth-child(6){transition-delay:.24s;}

/* Prosess-sporet: horisontal skinne + 4 stasjonsprikker i Google-fargene */
.prosess-spor{position:relative;padding-top:22px;}
.prosess-spor .card{position:relative;}
.steg-dot{position:absolute;top:-24px;left:50%;transform:translateX(-50%);width:12px;height:12px;
  border-radius:50%;background:#fff;border:3px solid var(--line);transition:border-color .3s ease;}
@media (min-width:1081px){
  .prosess-spor::before{content:"";position:absolute;top:5px;left:12%;right:12%;height:2px;
    background:rgba(10,27,61,.1);transform:scaleX(0);transform-origin:left;transition:transform .7s ease-out;}
  .prosess-spor.visible::before{transform:scaleX(1);}
}
.prosess-spor.visible .card:nth-child(1) .steg-dot{border-color:#4285F4;transition-delay:.35s;}
.prosess-spor.visible .card:nth-child(2) .steg-dot{border-color:#34A853;transition-delay:.41s;}
.prosess-spor.visible .card:nth-child(3) .steg-dot{border-color:#FBBC05;transition-delay:.47s;}
.prosess-spor.visible .card:nth-child(4) .steg-dot{border-color:#EA4335;transition-delay:.53s;}
.prosess-spor .card:nth-child(1):hover{border-color:#4285F4;box-shadow:0 14px 34px rgba(66,133,244,.20);}
.prosess-spor .card:nth-child(2):hover{border-color:#34A853;box-shadow:0 14px 34px rgba(52,168,83,.20);}
.prosess-spor .card:nth-child(3):hover{border-color:#FBBC05;box-shadow:0 14px 34px rgba(251,188,5,.24);}
.prosess-spor .card:nth-child(4):hover{border-color:#EA4335;box-shadow:0 14px 34px rgba(234,67,53,.18);}

/* Oslo-stasjonen: kartnål som slippes ned + rolig puls (sidens eneste evige animasjon) */
.naal-wrap{position:relative;display:inline-flex;flex:none;}
.st-naal{width:16px;height:auto;fill:var(--st);opacity:0;transform:translateY(-14px);}
.stasjon.naadd .st-naal{animation:naalSlipp .5s cubic-bezier(.34,1.56,.64,1) forwards;}
@keyframes naalSlipp{to{opacity:1;transform:translateY(0);}}
.naal-puls{position:absolute;left:50%;top:38%;width:22px;height:22px;transform:translate(-50%,-50%);
  border-radius:50%;border:2px solid #D64687;opacity:0;pointer-events:none;}
.stasjon--pin.naadd .naal-puls{animation:naalPuls 2s ease-out .7s infinite;}
@keyframes naalPuls{0%{opacity:.35;transform:translate(-50%,-50%) scale(1);}100%{opacity:0;transform:translate(-50%,-50%) scale(1.9);}}

/* Endestasjonen: dokking ved CTA — Google-salutt + grønn live-puls + glass-pust */
.ende-dokk{position:relative;display:flex;flex-direction:column;align-items:center;margin-bottom:14px;}
.salutt{position:absolute;left:50%;top:-4px;width:0;height:0;}
.salutt i{position:absolute;left:0;top:0;width:9px;height:9px;border-radius:50%;opacity:0;}
.salutt i:nth-child(1){background:#4285F4;--dx:-34px;}
.salutt i:nth-child(2){background:#34A853;--dx:-12px;}
.salutt i:nth-child(3){background:#FBBC05;--dx:12px;}
.salutt i:nth-child(4){background:#EA4335;--dx:34px;}
.endestasjon.naadd .salutt i{animation:salutt .7s cubic-bezier(.34,1.56,.64,1) forwards;}
.endestasjon.naadd .salutt i:nth-child(2){animation-delay:.07s;}
.endestasjon.naadd .salutt i:nth-child(3){animation-delay:.14s;}
.endestasjon.naadd .salutt i:nth-child(4){animation-delay:.21s;}
@keyframes salutt{0%{opacity:0;transform:translate(-50%,0) scale(.4);}35%{opacity:1;}
  100%{opacity:0;transform:translate(calc(-50% + var(--dx)),-30px) scale(1);}}
/* Avgangstavla (som Ruters tavler — i Adalis nattehimmel-marine, med ADALI-logoen) */
.avgangstavle{display:inline-flex;align-items:center;gap:14px;
  background:linear-gradient(180deg,#0E1E42 0%,#0A1428 100%);
  border:1px solid rgba(127,166,255,.24);border-radius:10px;padding:11px 18px;
  box-shadow:0 12px 30px rgba(7,16,34,.35);opacity:0;transform:translateY(6px);
  transition:opacity .5s ease .15s,transform .5s ease .15s;}
.at-logo{height:11px;width:auto;flex:none;display:block;}
.at-dest{color:#FFB84D;font-size:.78rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;}
.at-tid{display:inline-flex;align-items:center;gap:6px;color:#FFB84D;font-size:.78rem;font-weight:750;
  letter-spacing:.08em;text-transform:uppercase;}
.at-tid i{width:7px;height:7px;border-radius:50%;background:#34C759;flex:none;}
.endestasjon.naadd .avgangstavle{opacity:1;transform:none;}
.endestasjon.naadd .at-tid i{animation:atBlink 1.3s ease-in-out infinite;}
@keyframes atBlink{0%,100%{opacity:1;}50%{opacity:.25;}}
.endestasjon.naadd .ende-live i{animation:endePuls 1.6s ease-out infinite;}
@keyframes endePuls{0%{box-shadow:0 0 0 0 rgba(34,197,94,.45);}100%{box-shadow:0 0 0 10px rgba(34,197,94,0);}}
.endestasjon.naadd .btn-glass{animation:ctaPuls 2.6s ease-in-out infinite,glassPust .5s ease-out 1;}
@keyframes glassPust{0%{transform:scale(1);}50%{transform:scale(1.04);}100%{transform:scale(1);}}

/* Strammere luft (henter inn rutekartets og endestasjonens høyde) */
.linjea .section{padding:clamp(36px,4.4vw,54px) 0;}
.linjea #hvorfor.section,.linjea #oslo.section{padding:clamp(32px,3.6vw,44px) 0;}

@media (max-width:809px){
  .linjea .stasjon{scroll-margin-top:76px;}
  .rutekart{gap:12px;}
  .rutekart a{font-size:.7rem;}
}
@media (max-width:600px){
  .steg-dot{position:static;transform:none;display:block;margin:0 auto 10px;}
}
@media (prefers-reduced-motion: reduce){
  .linjea .spor-fyll{transform:scaleY(1);}
  .linjea .spor-fyll::after{opacity:0;}
  .linjea .st-ring,.steg-dot{transition:none;animation:none !important;}
  .prosess-spor::before{transform:scaleX(1);transition:none;}
  .st-naal{opacity:1;transform:none;animation:none !important;}
  .naal-puls,.endestasjon.naadd .ende-live i{animation:none !important;}
  .salutt{display:none;}
  .home-motion .rutekart a{opacity:1;transform:none;transition:none;}
}

/* ===== OSLOLINJEN v2 (Amins runde): sidekort, stasjonsmerker i tekst,
   avstandskart, FAQ-billetter, perrong-CTA ===== */
/* Tjenestekort: 2 kolonner — hvert PAR glir inn fra hver sin side når man når det */
.linjea #tjenester .services-grid{grid-template-columns:repeat(2,1fr);max-width:980px;margin-left:auto;margin-right:auto;}
/* RETTET 20. juli 2026: kortene under står parkert 80px ut til siden før de glir inn.
   På telefon dyttet de siden 102px bredere enn skjermen, så hele siden kunne dras
   sidelengs (Google flagger det som «Content wider than screen»). clip stopper det
   ved kilden — uten å lage en scroll-boks slik overflow:hidden ville gjort. */
main.linjea{overflow-x:clip;}
.home-motion .linjea #tjenester .par-kort{opacity:0;
  transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1);}
.home-motion .linjea #tjenester .par-kort:nth-child(odd){transform:translateX(-80px);}
.home-motion .linjea #tjenester .par-kort:nth-child(even){transform:translateX(80px);}
.home-motion .linjea #tjenester .par-kort.inne{opacity:1;transform:none;}
.home-motion .linjea #tjenester .par-kort.inne:nth-child(even){transition-delay:.08s;}

/* Stasjonsmerker i teksten: nøkkelord som fargede stopp-piller */
.stopp-tekst{font-size:clamp(19px,2vw,26px);line-height:1.65;font-weight:640;letter-spacing:-.015em;
  max-width:820px;margin:6px auto 0;color:var(--ink);}
mark.ord-stopp{display:inline-flex;align-items:center;gap:7px;background:var(--stbg);color:var(--ink);
  border-radius:999px;padding:1px 13px;white-space:nowrap;opacity:0;transform:scale(.7);
  transition:opacity .4s cubic-bezier(.34,1.56,.64,1),transform .4s cubic-bezier(.34,1.56,.64,1);}
mark.ord-stopp i{width:8px;height:8px;border-radius:50%;background:var(--st);flex:none;}
.stasjon.naadd mark.ord-stopp{opacity:1;transform:none;}
.stasjon.naadd mark.ord-stopp:nth-of-type(1){transition-delay:.1s;}
.stasjon.naadd mark.ord-stopp:nth-of-type(2){transition-delay:.28s;}
.stasjon.naadd mark.ord-stopp:nth-of-type(3){transition-delay:.46s;}
.stasjon.naadd mark.ord-stopp:nth-of-type(4){transition-delay:.64s;}

/* Avstandskartet: Din bedrift ⸺ Adali · Oslo */
.oslo-kart{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:24px;flex-wrap:wrap;}
.ok-stopp{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;font-weight:700;color:var(--ink);}
.ok-dot{width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid #1E4FD4;flex:none;}
.ok-naal{width:14px;height:auto;fill:#D64687;flex:none;}
.ok-linje{position:relative;width:clamp(110px,20vw,240px);height:2px;background:rgba(10,27,61,.12);border-radius:2px;}
.ok-fyll{position:absolute;inset:0;background:#D64687;border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform 1s ease .3s;}
.stasjon.naadd .ok-fyll{transform:scaleX(1);}
.ok-linje em{position:absolute;left:50%;top:10px;transform:translateX(-50%);font-style:normal;
  font-size:.72rem;font-weight:650;color:var(--muted);white-space:nowrap;}

/* FAQ-billetter: stiplet kant, hakk i sidene, nummer i stasjonsfarger, lett på skrå */
.linjea #faq .services-grid{grid-template-columns:repeat(2,1fr);max-width:900px;margin-left:auto;margin-right:auto;}
.faq-billetter .card{border:1.5px dashed #C3CFE9;position:relative;}
.faq-billetter .card::before,.faq-billetter .card::after{content:"";position:absolute;top:50%;width:16px;height:16px;
  border-radius:50%;background:var(--paper);transform:translateY(-50%);}
.faq-billetter .card::before{left:-9px;border-right:1.5px dashed #C3CFE9;}
.faq-billetter .card::after{right:-9px;border-left:1.5px dashed #C3CFE9;}
/* Spørsmålstegn-badge: vrikker seg inn, og vrikker ved hover */
.faq-billetter .card h3::before{content:"?";display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;margin:0 auto 10px;color:#fff;font-size:1.1rem;font-weight:750;}
.faq-billetter .card:nth-child(1) h3::before{background:#4285F4;}
.faq-billetter .card:nth-child(2) h3::before{background:#34A853;}
.faq-billetter .card:nth-child(3) h3::before{background:#F4B400;}
.faq-billetter .card:nth-child(4) h3::before{background:#EA4335;}
@keyframes spWobble{0%{transform:rotate(0) scale(.3);opacity:0;}55%{transform:rotate(-14deg) scale(1.12);opacity:1;}
  75%{transform:rotate(9deg) scale(1);}90%{transform:rotate(-4deg);}100%{transform:rotate(0) scale(1);}}
.home-motion .faq-billetter.visible .card:nth-child(1) h3::before{animation:spWobble .8s cubic-bezier(.34,1.56,.64,1) .1s both;}
.home-motion .faq-billetter.visible .card:nth-child(2) h3::before{animation:spWobble .8s cubic-bezier(.34,1.56,.64,1) .22s both;}
.home-motion .faq-billetter.visible .card:nth-child(3) h3::before{animation:spWobble .8s cubic-bezier(.34,1.56,.64,1) .34s both;}
.home-motion .faq-billetter.visible .card:nth-child(4) h3::before{animation:spWobble .8s cubic-bezier(.34,1.56,.64,1) .46s both;}
@keyframes spHilse{0%,100%{transform:rotate(0);}30%{transform:rotate(-12deg);}60%{transform:rotate(9deg);}}
.faq-billetter .card:hover h3::before{animation:spHilse .5s ease;}
.faq-billetter .card:nth-child(odd){transform:rotate(-.7deg);}
.faq-billetter .card:nth-child(even){transform:rotate(.7deg);}
.faq-billetter .card:hover{transform:rotate(0) translateY(-4px);}

/* Perrongen: mørk endestasjons-boks (nattehimmel som heroen — reisen ender der den startet) */
.perrong{position:relative;overflow:hidden;max-width:920px;margin:0 auto;border-radius:30px;
  padding:clamp(38px,5vw,56px) clamp(18px,4vw,46px);text-align:center;
  background:radial-gradient(900px 500px at 70% -20%, rgba(60,105,225,.28), transparent 62%),
  linear-gradient(180deg,#0C1B3E 0%,#0A1428 58%,#071022 100%);}
.perrong > .container,.perrong .pr-innhold{position:relative;z-index:1;}
.perrong .section-label{color:rgba(233,239,255,.7);justify-content:center;}
.perrong .section-label::before{background:#7FA6FF;}
.perrong .section-title{color:#fff;}
.perrong .section-intro{color:rgba(226,233,252,.75);}
@media (max-width:809px){
  /* Var: .services-grid.scroll-reveal .card — den klassen finnes ikke på dette
     rutenettet, så regelen traff aldri noe. Nå: ingen sidelengs gliding på telefon,
     kortene fader bare inn. Effekten leses knapt på liten skjerm uansett. */
  .home-motion .linjea #tjenester .par-kort:nth-child(odd),
  .home-motion .linjea #tjenester .par-kort:nth-child(even){transform:none;}
  .stopp-tekst{font-size:17px;}
  .faq-billetter .card:nth-child(odd),.faq-billetter .card:nth-child(even){transform:none;}
}
@media (prefers-reduced-motion: reduce){
  .home-motion .linjea #tjenester .par-kort{opacity:1;transform:none;transition:none;}
  .faq-billetter .card h3::before{animation:none !important;}
  mark.ord-stopp{opacity:1;transform:none;transition:none;}
  .ok-fyll{transform:scaleX(1);transition:none;}
}

/* =================================================================
   KS-DASH — kundesystem.html (17. juli 2026): premium dashbord-mockup
   Ekte innhold (KPI-er, graf, pipeline, henvendelser, oppgaver) i
   Geist — det første kunden ser på Kundesystem-siden.
   ================================================================= */
.ks-vindu{background:#fff;border:1px solid #E1E8F5;border-radius:14px;overflow:hidden;
  box-shadow:0 24px 60px rgba(10,27,61,.12);text-align:left;}
.ks-topp{display:flex;align-items:center;gap:6px;background:#0A1B3D;padding:10px 14px;}
.ks-topp .dot{width:9px;height:9px;border-radius:50%;flex:none;}
.ks-topp .tittel{margin-left:10px;color:rgba(255,255,255,.72);font-size:.72rem;font-weight:600;}
.ks-sok{margin-left:auto;display:inline-flex;align-items:center;background:rgba(255,255,255,.1);
  border-radius:99px;padding:4px 12px;color:rgba(255,255,255,.55);font-size:.68rem;}
.ks-bjelle{position:relative;width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35);margin:0 4px 0 10px;}
.ks-bjelle::after{content:"";position:absolute;top:-2px;right:-2px;width:5px;height:5px;border-radius:50%;background:#EA4335;}
.ks-avatar{width:20px;height:20px;border-radius:50%;background:linear-gradient(135deg,#1E4FD4,#7EA4FF);
  color:#fff;font-size:.62rem;font-weight:750;display:flex;align-items:center;justify-content:center;}
.ks-kropp{display:flex;background:#FBFCFE;}
.ks-side{width:120px;flex:none;background:#F7F9FE;border-right:1px solid #EDF1F9;padding:14px 10px;
  display:flex;flex-direction:column;gap:4px;}
.ks-side .logo{width:22px;height:22px;border-radius:7px;background:#1E4FD4;margin:0 0 10px 6px;}
.ks-side a{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:8px;
  font-size:.7rem;font-weight:650;color:#6B7A9C;text-decoration:none;pointer-events:none;}
.ks-side a i{width:7px;height:7px;border-radius:3px;background:#C7D3EA;flex:none;}
.ks-side a.aktiv{background:#E8EFFE;color:#1E4FD4;}
.ks-side a.aktiv i{background:#1E4FD4;}
.ks-innhold{flex:1;min-width:0;padding:16px;}
.ks-hode{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.ks-hode b{font-size:.92rem;font-weight:750;color:#0A1B3D;letter-spacing:-.01em;}
.ks-hode span{font-size:.68rem;color:#8A96B4;}
.ks-nyknapp{margin-left:auto;background:#1E4FD4;color:#fff;font-size:.66rem;font-weight:700;
  border-radius:99px;padding:5px 12px;}
.ks-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;}
.ks-kpi > div{background:#fff;border:1px solid #E1E8F5;border-radius:11px;padding:11px 13px;min-width:0;}
.ks-kpi .l{font-size:.62rem;color:#8A96B4;font-weight:600;white-space:nowrap;overflow:hidden;}
.ks-kpi .v{font-size:1.05rem;font-weight:750;color:#0A1B3D;letter-spacing:-.02em;margin-top:2px;white-space:nowrap;font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;}
.ks-kpi .d{font-size:.62rem;font-weight:700;margin-top:2px;}
.ks-kpi .opp{color:#1BA97F;}
.ks-kpi .obs{color:#B07C1F;}
.ks-kpi .noyt{color:#8A96B4;font-weight:600;}
.ks-midt{display:grid;grid-template-columns:1.7fr 1fr;gap:9px;margin-top:9px;}
.ks-kort{background:#fff;border:1px solid #E1E8F5;border-radius:11px;padding:11px 13px;min-width:0;}
.ks-kort .t{font-size:.68rem;font-weight:750;color:#0A1B3D;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;}
.ks-kort .t span{font-size:.62rem;color:#8A96B4;font-weight:600;}
.ks-graf{display:flex;gap:6px;align-items:flex-end;height:88px;}
.ks-graf > div{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;height:100%;justify-content:flex-end;min-width:0;}
.ks-graf i{display:block;width:100%;border-radius:4px 4px 0 0;background:#DCE6FA;height:var(--h);
  transform:scaleY(0);transform-origin:bottom;transition:transform .7s cubic-bezier(.16,1,.3,1);}
.ks-graf > div:last-child i{background:linear-gradient(180deg,#4D8DFF,#1E4FD4);}
.ks-graf em{font-style:normal;font-size:.58rem;color:#8A96B4;font-weight:600;}
.home-motion .ks-wrap.visible .ks-graf i{transform:scaleY(1);}
.home-motion .ks-wrap.visible .ks-graf > div:nth-child(2) i{transition-delay:.06s;}
.home-motion .ks-wrap.visible .ks-graf > div:nth-child(3) i{transition-delay:.12s;}
.home-motion .ks-wrap.visible .ks-graf > div:nth-child(4) i{transition-delay:.18s;}
.home-motion .ks-wrap.visible .ks-graf > div:nth-child(5) i{transition-delay:.24s;}
.home-motion .ks-wrap.visible .ks-graf > div:nth-child(6) i{transition-delay:.3s;}
.home-motion .ks-wrap.visible .ks-graf > div:nth-child(7) i{transition-delay:.36s;}
.ks-pipe{display:flex;flex-direction:column;gap:8px;}
.ks-pipe > div{min-width:0;}
.ks-pipe .r{display:flex;justify-content:space-between;font-size:.64rem;font-weight:650;color:#0A1B3D;}
.ks-pipe .r span{color:#8A96B4;}
.ks-pipe .s{height:5px;border-radius:3px;background:#EDF1F9;margin-top:3px;overflow:hidden;}
.ks-pipe .s i{display:block;height:100%;border-radius:3px;width:var(--w);}
.ks-bunn{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:9px;}
.ks-rad{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid #EDF1F9;min-width:0;}
.ks-rad .init{width:20px;height:20px;border-radius:50%;background:#E8EFFE;color:#1E4FD4;
  font-size:.6rem;font-weight:750;display:flex;align-items:center;justify-content:center;flex:none;}
.ks-rad .hvem{flex:1;min-width:0;}
.ks-rad .hvem b{display:block;font-size:.68rem;font-weight:700;color:#0A1B3D;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ks-rad .hvem span{font-size:.6rem;color:#8A96B4;}
.ks-pill{font-size:.58rem;font-weight:750;border-radius:99px;padding:2px 8px;flex:none;}
.ks-pill.ny{background:#E8EFFE;color:#1E4FD4;}
.ks-pill.tilbud{background:#FFF4DE;color:#B07C1F;}
.ks-pill.vunnet{background:#E3F7EF;color:#1BA97F;}
.ks-sjekk{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid #EDF1F9;font-size:.68rem;color:#0A1B3D;}
.ks-sjekk i{width:13px;height:13px;border-radius:4px;border:1.5px solid #C7D3EA;flex:none;display:flex;
  align-items:center;justify-content:center;font-size:.55rem;color:#fff;font-style:normal;font-weight:800;}
.ks-sjekk.ok i{background:#1BA97F;border-color:#1BA97F;}
.ks-sjekk.ok span{color:#8A96B4;text-decoration:line-through;}
.ks-sjekk time{margin-left:auto;font-size:.6rem;color:#8A96B4;flex:none;}
@media (max-width:809px){
  .ks-side{width:44px;padding:14px 8px;}
  .ks-side a{justify-content:center;padding:7px 0;}
  .ks-side a b{display:none;}
  .ks-side .logo{margin:0 auto 10px;}
  .ks-kpi{grid-template-columns:repeat(2,1fr);}
  .ks-midt,.ks-bunn{grid-template-columns:1fr;}
  .ks-sok{display:none;}
}
@media (prefers-reduced-motion: reduce){
  .ks-graf i{transform:scaleY(1);transition:none;}
}

/* ===== KS-DUO: to dashbord som ruller ut som et teppe fra hver sin side ===== */
.ks-duo{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.ks-duo .ks-vindu{min-width:0;}
.ks-duo .ks-innhold{padding:12px;}
.ks-duo .ks-kpi{grid-template-columns:1fr 1fr;}
.ks-duo .ks-graf{height:76px;}
.home-motion .ks-teppe-v,.home-motion .ks-teppe-h{
  transition:clip-path 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),opacity .55s ease;}
.home-motion .ks-teppe-v{clip-path:inset(0 0 0 100%);transform:translateX(9%);opacity:0;}
.home-motion .ks-teppe-h{clip-path:inset(0 100% 0 0);transform:translateX(-9%);opacity:0;transition-delay:.08s;}
.home-motion .ks-wrap.aapen .ks-teppe-v,.home-motion .ks-wrap.aapen .ks-teppe-h{
  clip-path:inset(0 0 0 0);transform:none;opacity:1;}
.ks-wrap.aapen .ks-graf i{transform:scaleY(1);}
.ks-wrap.aapen .ks-graf > div:nth-child(2) i{transition-delay:.5s;}
.ks-wrap.aapen .ks-graf > div:nth-child(3) i{transition-delay:.56s;}
.ks-wrap.aapen .ks-graf > div:nth-child(4) i{transition-delay:.62s;}
.ks-wrap.aapen .ks-graf > div:nth-child(5) i{transition-delay:.68s;}
.ks-wrap.aapen .ks-graf > div:nth-child(6) i{transition-delay:.74s;}
.ks-wrap.aapen .ks-graf > div:nth-child(7) i{transition-delay:.8s;}
@media (max-width:809px){
  .ks-duo{grid-template-columns:1fr;}
  .home-motion .ks-teppe-v{transform:translateX(5%);}
  .home-motion .ks-teppe-h{transform:translateX(-5%);}
}
@media (prefers-reduced-motion: reduce){
  .home-motion .ks-teppe-v,.home-motion .ks-teppe-h{clip-path:none;transform:none;opacity:1;transition:none;}
}

/* ===== KS-MØRK: det andre kundesystemet i duoen (mørk booking-stil) ===== */
.ks-mork{background:#0A1224;border-color:rgba(255,255,255,.12);}
.ks-mork .ks-kropp{background:#0A1224;}
.ks-mork .ks-kpi > div{background:#111C38;border-color:rgba(255,255,255,.09);}
.ks-mork .ks-kpi .l{color:#5B6B94;}
.ks-mork .ks-kpi .v{color:#E8EFFE;}
.ks-mork .ks-kort{background:#111C38;border-color:rgba(255,255,255,.09);}
.ks-mork .ks-kort .t{color:#E8EFFE;}
.ks-mork .ks-kort .t span{color:#5B6B94;}
.ks-time{display:flex;gap:9px;align-items:stretch;margin-top:6px;}
.ks-time em{font-style:normal;font-size:.62rem;font-weight:700;color:#5B6B94;width:32px;padding-top:6px;flex:none;}
.ks-time > div{flex:1;background:#0D1730;border:1px solid rgba(255,255,255,.08);border-left:3px solid var(--tf,#22D3EE);
  border-radius:8px;padding:6px 9px;min-width:0;}
.ks-time b{display:block;font-size:.68rem;font-weight:700;color:#E8EFFE;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ks-time span{font-size:.6rem;color:#5B6B94;}
.ks-neste{margin-top:9px;text-align:center;font-size:.62rem;color:#5B6B94;font-weight:600;}
.ks-neste b{color:#3DDC97;font-weight:750;}

/* ===== KS-detaljer: faner, statuslinje og ukesbelegg — «helt ferdig system»-følelsen ===== */
.ks-tabs{display:flex;gap:4px;padding:9px 12px 0;background:#FBFCFE;}
.ks-tabs span{font-size:.62rem;font-weight:650;color:#8A96B4;padding:5px 11px;border-radius:8px;}
.ks-tabs .aktiv{background:#E8EFFE;color:#1E4FD4;}
.ks-mork .ks-tabs{background:#0A1224;}
.ks-mork .ks-tabs span{color:#5B6B94;}
.ks-mork .ks-tabs .aktiv{background:#111C38;color:#7DD3FC;}
.ks-status{display:flex;align-items:center;gap:7px;justify-content:center;padding:8px 12px;
  border-top:1px solid #EDF1F9;font-size:.6rem;color:#8A96B4;font-weight:600;background:#FBFCFE;}
.ks-status i{width:6px;height:6px;border-radius:50%;background:#1BA97F;flex:none;}
.ks-mork .ks-status{border-top-color:rgba(255,255,255,.07);color:#5B6B94;background:#0A1224;}
.ks-uke{display:flex;gap:5px;align-items:flex-end;height:46px;margin-top:4px;}
.ks-uke > div{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;height:100%;justify-content:flex-end;min-width:0;}
.ks-uke i{display:block;width:100%;border-radius:3px 3px 0 0;background:rgba(77,141,255,.32);height:var(--h);}
.ks-uke .idag i{background:linear-gradient(180deg,#22D3EE,#4D8DFF);}
.ks-uke em{font-style:normal;font-size:.55rem;color:#5B6B94;font-weight:600;}

/* =================================================================
   KS-SALGSREISE — kundesystem.html (18. juli 2026, idé-panel-vinner)
   Hele salgsreisen i første skjermbilde: to dører (gratis demo /
   bestill), tillitslinje, 3-stegs «slik funker det» i vindus-språk,
   stil-stripe med temafarger, prisbånd uten tall.
   ================================================================= */
.ks-cta-rad{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px;}
.ks-cta-rad .btn-primary{animation:ctaPuls 2.6s ease-in-out infinite;}
.ks-cta-rad .btn-glass{animation:none;}
.ks-trust{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin-top:16px;
  font-size:.85rem;font-weight:600;color:rgba(226,233,252,.78);}
.ks-trust .ok{color:#3DDC97;font-weight:750;margin-right:4px;}
.ks-trust .stj{color:#FFC53D;margin-right:4px;}
.ks-trust-lys{color:var(--muted);}
.ks-trust-lys .ok{color:#1BA97F;}
.ks-scrollcue{display:inline-block;margin-top:18px;font-size:.8rem;font-weight:650;
  color:rgba(226,233,252,.6);text-decoration:none;}
.ks-scrollcue:hover{color:#fff;}
.ks-bevis{max-width:760px;margin:22px auto 0;text-align:center;color:var(--muted);line-height:1.7;}
.ks-bevis a{color:var(--blue);font-weight:700;text-decoration:none;white-space:nowrap;}
.ks-bevis em{display:block;font-style:normal;font-size:.8rem;color:#8A96B4;margin-top:4px;}

/* 3 steg i vindus-språk med linje som tegner seg */
.ks-steg{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  max-width:920px;margin:24px auto 0;padding:0;position:relative;counter-reset:steg;}
.ks-steg::before{content:"";position:absolute;top:-12px;left:8%;right:8%;height:2px;
  background:rgba(10,27,61,.1);transform:scaleX(0);transform-origin:left;transition:transform .8s ease-out .1s;}
.ks-steg.visible::before{transform:scaleX(1);}
.ks-steg li{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 18px 16px;
  text-align:center;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;}
.ks-steg li:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(10,27,61,.10);}
.stegchrome{display:flex;gap:5px;padding:9px 0;margin:0 -18px 12px;background:#F7F9FE;
  border-bottom:1px solid #EDF1F9;justify-content:center;}
.stegchrome i{width:8px;height:8px;border-radius:50%;}
.stegchrome i:nth-child(1){background:#FF5F57;}
.stegchrome i:nth-child(2){background:#FEBC2E;}
.stegchrome i:nth-child(3){background:#28C840;}
.ks-steg b{display:block;font-weight:750;font-size:1rem;color:var(--ink);letter-spacing:-.01em;}
.ks-steg li > span:last-child{display:block;margin-top:6px;font-size:.88rem;color:var(--muted);line-height:1.55;}
.home-motion .ks-steg li{opacity:0;transform:translateY(14px);
  transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1);}
.home-motion .ks-steg.visible li{opacity:1;transform:none;}
.home-motion .ks-steg.visible li:nth-child(2){transition-delay:.1s;}
.home-motion .ks-steg.visible li:nth-child(3){transition-delay:.2s;}

/* Stil-stripen: 6 tema-chips med todelt fargesirkel (eksakte demo-farger) */
.ks-stil-intro{text-align:center;color:var(--muted);margin:10px auto 0;max-width:640px;}
.ks-stil-intro em{font-style:normal;font-size:.85rem;color:#8A96B4;}
.stil-strip{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:20px;}
.stil-chip{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1.5px solid var(--line);
  border-radius:999px;padding:9px 18px 9px 10px;text-decoration:none;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;}
.stil-chip i{width:26px;height:26px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,var(--a) 50%,var(--b) 50%);border:1px solid rgba(10,27,61,.12);}
.stil-chip b{font-size:.88rem;font-weight:750;color:var(--ink);letter-spacing:-.01em;}
.stil-chip span{font-size:.72rem;color:var(--muted);font-weight:600;}
.stil-chip:hover,.stil-chip:active{transform:translateY(-3px);border-color:var(--b);
  box-shadow:0 10px 26px rgba(10,27,61,.12);}
.home-motion .stil-strip.scroll-reveal .stil-chip{opacity:0;transform:scale(.7);
  transition:opacity .35s cubic-bezier(.34,1.56,.64,1),transform .35s cubic-bezier(.34,1.56,.64,1);}
.home-motion .stil-strip.scroll-reveal.visible .stil-chip{opacity:1;transform:none;}
.home-motion .stil-strip.scroll-reveal.visible .stil-chip:nth-child(2){transition-delay:.06s;}
.home-motion .stil-strip.scroll-reveal.visible .stil-chip:nth-child(3){transition-delay:.12s;}
.home-motion .stil-strip.scroll-reveal.visible .stil-chip:nth-child(4){transition-delay:.18s;}
.home-motion .stil-strip.scroll-reveal.visible .stil-chip:nth-child(5){transition-delay:.24s;}
.home-motion .stil-strip.scroll-reveal.visible .stil-chip:nth-child(6){transition-delay:.3s;}

/* Grids: «Hva dere får» på én rad, FAQ 2×2 */
.ks-faar{grid-template-columns:repeat(4,1fr);}
.faq-ks{grid-template-columns:repeat(2,1fr);}
@media (max-width:1080px){.ks-faar{grid-template-columns:repeat(2,1fr);}.ks-steg{grid-template-columns:repeat(2,1fr);max-width:640px;}.ks-steg::before{display:none;}}
@media (max-width:760px){.ks-steg{grid-template-columns:1fr;max-width:560px;}}
@media (max-width:809px){
  .ks-faar,.faq-ks{grid-template-columns:1fr;}
  .ks-trust{gap:12px;font-size:.78rem;}
  .ks-cta-rad{gap:12px;}
}
@media (prefers-reduced-motion: reduce){
  .ks-cta-rad .btn-primary{animation:none;}
  .ks-steg::before{transform:scaleX(1);transition:none;}
  .home-motion .ks-steg li,.home-motion .stil-strip.scroll-reveal .stil-chip{opacity:1;transform:none;transition:none;}
}

/* Helhvit hovedknapp for mørk hero (sterkeste dør i salgsreisen) */
.uside-hero a.btn-hvit,.btn-hvit{display:inline-flex;align-items:center;gap:9px;background:#fff;color:var(--ink);
  font-weight:750;font-size:1rem;padding:14px 28px;border-radius:999px;text-decoration:none;
  box-shadow:0 12px 32px rgba(2,6,18,.35);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease;
  animation:hvitPuls 2.6s ease-in-out infinite;}
.btn-hvit:hover{transform:translateY(-2px);box-shadow:0 16px 44px rgba(127,166,255,.5);}
.btn-hvit .arrow{display:inline-block;color:var(--ink);animation:pilDytt 2.6s ease-in-out infinite;}
@keyframes hvitPuls{0%,100%{box-shadow:0 10px 28px rgba(2,6,18,.35);}50%{box-shadow:0 14px 44px rgba(127,166,255,.55);}}
@media (prefers-reduced-motion: reduce){.btn-hvit,.btn-hvit .arrow{animation:none;}}

/* =================================================================
   KS-ENKEL — kundesystem.html radikalt forenklet (18. juli 2026)
   Mindre tekst, store tydelige steg, ikon-rad, sammenslåbar FAQ.
   ================================================================= */
/* Tre store nummererte steg med forbindelseslinje */
.ks-stor-steg{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  max-width:840px;margin:28px auto 0;padding:0;position:relative;}
.ks-stor-steg::before{content:"";position:absolute;top:28px;left:16%;right:16%;height:2px;
  background:rgba(10,27,61,.1);transform:scaleX(0);transform-origin:left;transition:transform .9s ease-out .1s;}
.ks-stor-steg.visible::before{transform:scaleX(1);}
.ks-stor-steg li{text-align:center;position:relative;}
.ks-stor-steg .nr{position:relative;z-index:1;width:56px;height:56px;border-radius:50%;margin:0 auto 16px;
  display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:750;color:#fff;
  background:var(--blue);box-shadow:0 10px 26px rgba(30,79,212,.30);}
.ks-stor-steg b{display:block;font-size:1.12rem;font-weight:750;color:var(--ink);letter-spacing:-.02em;}
.ks-stor-steg span{display:block;margin-top:5px;font-size:.92rem;color:var(--muted);line-height:1.5;}
.home-motion .ks-stor-steg li{opacity:0;transform:translateY(16px);
  transition:opacity .5s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1);}
.home-motion .ks-stor-steg.visible li{opacity:1;transform:none;}
.home-motion .ks-stor-steg.visible li:nth-child(2){transition-delay:.12s;}
.home-motion .ks-stor-steg.visible li:nth-child(3){transition-delay:.24s;}

/* Kompakt ikon-rad med fordeler */
.ks-fordeler{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:26px auto 0;}
.ks-fordeler span{display:inline-flex;align-items:center;gap:8px;font-weight:650;font-size:.92rem;
  color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 17px;}
.ks-fordeler b{color:#1BA97F;font-weight:800;}

/* Stor bestill-knapp */
.ks-bestill-knapp{font-size:1.06rem !important;padding:16px 34px !important;}

/* FAQ som sammenslåbare rader */
.faq-akk{max-width:720px;margin:20px auto 0;text-align:left;}
.faq-akk details{border-bottom:1px solid var(--line);}
.faq-akk details:first-child{border-top:1px solid var(--line);}
.faq-akk summary{cursor:pointer;padding:17px 6px;font-weight:700;font-size:1.02rem;color:var(--ink);
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;}
.faq-akk summary::-webkit-details-marker{display:none;}
.faq-akk summary::after{content:"+";font-size:1.4rem;color:var(--blue);font-weight:400;flex:none;
  transition:transform .25s ease;}
.faq-akk details[open] summary::after{content:"−";}
.faq-akk p{padding:0 6px 18px;color:var(--muted);line-height:1.7;margin:0;}
@media (max-width:809px){
  .ks-stor-steg{grid-template-columns:1fr;max-width:340px;gap:16px;}
  .ks-stor-steg::before{display:none;}
}
@media (prefers-reduced-motion: reduce){
  .ks-stor-steg::before{transform:scaleX(1);transition:none;}
  .home-motion .ks-stor-steg li{opacity:1;transform:none;transition:none;}
}

/* =================================================================
   KS-STILVELGER v2 — like store fliser m/ mini-dashbord (18. juli)
   Erstatter de ulike-brede pill-chipene. Elegant, uniform, premium.
   ================================================================= */
.stil-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:760px;margin:24px auto 0;}
.stil-tile{display:block;text-decoration:none;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:12px 12px 14px;transition:transform .28s cubic-bezier(.16,1,.3,1),
  box-shadow .28s ease,border-color .28s ease;}
.stil-tile:hover{transform:translateY(-5px);border-color:var(--ac);
  box-shadow:0 18px 40px color-mix(in srgb,var(--ac) 24%,transparent);}
.st-prev{display:block;border-radius:11px;overflow:hidden;background:var(--bg);
  border:1px solid rgba(10,27,61,.09);}
.st-bar{display:flex;align-items:center;gap:4px;padding:7px 9px;background:var(--side);}
.st-bar i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.5);}
.st-in{display:block;padding:9px;}
.st-cards{display:flex;gap:5px;}
.st-cards b{flex:1;height:22px;border-radius:5px;background:color-mix(in srgb,var(--ac) 16%,var(--bg));
  border:1px solid color-mix(in srgb,var(--ac) 22%,transparent);position:relative;}
.st-cards b::after{content:"";position:absolute;left:5px;top:5px;width:40%;height:4px;border-radius:2px;
  background:var(--ac);opacity:.8;}
.st-rows{display:block;margin-top:6px;}
.st-rows em{display:block;height:5px;border-radius:3px;margin-top:5px;
  background:color-mix(in srgb,var(--ac) 20%,transparent);}
.st-rows em:nth-child(1){width:86%;}
.st-rows em:nth-child(2){width:64%;}
.st-rows em:nth-child(3){width:74%;}
.st-navn{display:block;font-weight:750;font-size:.95rem;color:var(--ink);letter-spacing:-.01em;margin-top:11px;}
.st-modul{display:block;font-size:.78rem;color:var(--muted);font-weight:600;margin-top:1px;}
.home-motion .stil-grid.scroll-reveal .stil-tile{opacity:0;transform:translateY(16px);
  transition:opacity .5s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1);}
.home-motion .stil-grid.scroll-reveal.visible .stil-tile{opacity:1;transform:none;}
.home-motion .stil-grid.scroll-reveal.visible .stil-tile:nth-child(2){transition-delay:.06s;}
.home-motion .stil-grid.scroll-reveal.visible .stil-tile:nth-child(3){transition-delay:.12s;}
.home-motion .stil-grid.scroll-reveal.visible .stil-tile:nth-child(4){transition-delay:.18s;}
.home-motion .stil-grid.scroll-reveal.visible .stil-tile:nth-child(5){transition-delay:.24s;}
.home-motion .stil-grid.scroll-reveal.visible .stil-tile:nth-child(6){transition-delay:.3s;}

/* Ren hakelinje (erstatter de løse fordels-pillene) */
.ks-punkter{display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;
  margin:28px auto 0;font-size:.92rem;font-weight:600;color:var(--ink);}
.ks-punkter span{display:inline-flex;align-items:center;gap:7px;}
.ks-punkter span::before{content:"✓";color:#1BA97F;font-weight:800;}
.ks-punkter span:not(:last-child)::after{content:"";width:4px;height:4px;border-radius:50%;
  background:var(--line);margin-left:6px;}
@media (max-width:809px){
  .stil-grid{grid-template-columns:repeat(2,1fr);gap:12px;max-width:400px;}
  .ks-punkter{gap:8px;font-size:.82rem;}
}
@media (prefers-reduced-motion: reduce){
  .home-motion .stil-grid.scroll-reveal .stil-tile{opacity:1;transform:none;transition:none;}
}

/* ===== KS-SOLO: ett midtstilt dashbord m/ elegant fade-inn (18. juli) ===== */
.ks-solo{max-width:600px;margin:0 auto;}
.ks-solo .ks-kpi{grid-template-columns:1fr 1fr;}
@media (max-width:340px){.ks-solo .ks-kpi{grid-template-columns:1fr;}}
.home-motion .ks-teppe-solo{opacity:0;transform:translateY(24px) scale(.98);
  transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);}
.home-motion .ks-wrap.aapen .ks-teppe-solo{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .home-motion .ks-teppe-solo{opacity:1;transform:none;transition:none;}
}

/* ===== KS-LIV: dashbordet puster — pipeline vokser, sync-prikk pulserer (18. juli) ===== */
.ks-solo .ks-pipe .s i{transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.16,1,.3,1);}
.ks-wrap.aapen .ks-pipe .s i{transform:scaleX(1);}
.ks-wrap.aapen .ks-pipe > div:nth-child(1) .s i{transition-delay:.55s;}
.ks-wrap.aapen .ks-pipe > div:nth-child(2) .s i{transition-delay:.65s;}
.ks-wrap.aapen .ks-pipe > div:nth-child(3) .s i{transition-delay:.75s;}
.ks-wrap.aapen .ks-pipe > div:nth-child(4) .s i{transition-delay:.85s;}
.ks-status i{position:relative;}
.ks-wrap.aapen .ks-status i{animation:ksSync 1.8s ease-out infinite;}
@keyframes ksSync{0%{box-shadow:0 0 0 0 rgba(27,169,127,.5);}70%,100%{box-shadow:0 0 0 7px rgba(27,169,127,0);}}
@media (prefers-reduced-motion: reduce){
  .ks-solo .ks-pipe .s i{transform:scaleX(1);transition:none;}
  .ks-wrap.aapen .ks-status i{animation:none;}
}

/* ===== KS-BUNN: FAQ og kontakt-boks side ved side (18. juli) ===== */
.ks-bunn-rad{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:1000px;
  margin:56px auto 0;align-items:stretch;}
.ks-bunn-faq{background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:26px 28px;text-align:left;display:flex;flex-direction:column;}
.ks-bunn-faq h2{text-align:left !important;margin:0 0 4px;}
.ks-bunn-faq .faq-akk{margin:6px 0 0;max-width:none;}
.ks-bunn-faq .faq-akk details:first-child{border-top:none;}
.ks-bunn-rad .cta-panel{margin:0 !important;display:flex;flex-direction:column;justify-content:center;}
@media (max-width:809px){
  .ks-bunn-rad{grid-template-columns:1fr;gap:18px;margin-top:44px;}
}

/* =================================================================
   DEMO-MODAL — kundesystem.html viser demoen i en boks (iframe)
   i stedet for å sende brukeren til en ny side (18. juli)
   ================================================================= */
.demo-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;}
.demo-modal[hidden]{display:none;}
.demo-modal-bakteppe{position:absolute;inset:0;background:rgba(6,12,26,.62);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);}
.demo-modal-boks{position:relative;width:min(1180px,96vw);height:min(90vh,940px);
  background:#0A1B3D;border-radius:22px;overflow:hidden;box-shadow:0 40px 100px rgba(4,10,26,.5);
  animation:demoModalInn .4s cubic-bezier(.16,1,.3,1);}
@keyframes demoModalInn{from{opacity:0;transform:translateY(24px) scale(.98);}to{opacity:1;transform:none;}}
.demo-modal-boks iframe{width:100%;height:100%;border:0;display:block;}
.demo-modal-lukk{position:absolute;top:10px;right:12px;z-index:3;width:38px;height:38px;border-radius:50%;
  border:none;background:rgba(255,255,255,.16);color:#fff;font-size:16px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s;}
.demo-modal-lukk:hover{background:rgba(255,255,255,.3);transform:scale(1.08);}
@media(max-width:600px){.demo-modal{padding:0;}.demo-modal-boks{width:100vw;width:100dvw;height:100vh;height:100dvh;border-radius:0;}}
@media(prefers-reduced-motion:reduce){.demo-modal-boks{animation:none;}}

/* Hover-hint på stil-flisene: viser «Prøv denne →» så folk skjønner at det kan testes (18. juli) */
.stil-tile .st-prev{position:relative;}
.stil-tile .st-prev::before{content:"";position:absolute;inset:0;background:rgba(10,27,61,.32);
  opacity:0;transition:opacity .25s ease;pointer-events:none;}
.stil-tile .st-prev::after{content:"Prøv denne →";position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%) scale(.9);background:#fff;color:var(--ink);font-weight:750;
  font-size:.82rem;letter-spacing:-.01em;padding:8px 16px;border-radius:999px;white-space:nowrap;
  box-shadow:0 8px 20px rgba(10,27,61,.28);opacity:0;
  transition:opacity .25s ease,transform .25s ease;pointer-events:none;}
.stil-tile:hover .st-prev::before{opacity:1;}
.stil-tile:hover .st-prev::after{opacity:1;transform:translate(-50%,-50%) scale(1);}
@media (hover:none){.stil-tile .st-prev::before,.stil-tile .st-prev::after{display:none;}}

/* =================================================================
   OM-SIDE — midtstilt, grunnlegger-reveal + tro-manifest (18. juli 2026)
   Konsept «Menneskene bak»: portrettene glir inn mot midten mot
   hverandre m/ Google-glød; «Det vi tror på» = manifest som tennes;
   tallene teller seg opp.
   ================================================================= */
.om-side .section{text-align:center;}
.om-side .section-title{margin-left:auto;margin-right:auto;}
.om-side .section-title em{color:inherit;}
.om-side .section-intro{margin-left:auto;margin-right:auto;}
.om-blokk{max-width:760px;margin:0 auto;}

/* Grunnleggerne — to portretter som glir inn mot midten */
.om-forteller{font-size:clamp(19px,2.2vw,27px);font-weight:750;letter-spacing:-.02em;line-height:1.35;
  color:var(--ink);max-width:600px;margin:0 auto;}
.om-portretter{display:flex;justify-content:center;align-items:flex-start;gap:clamp(16px,2.5vw,36px);
  margin:38px auto 0;flex-wrap:wrap;}
.om-portrett{margin:0;flex:0 1 272px;max-width:300px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.om-foto{position:relative;width:100%;aspect-ratio:56/58;border-radius:22px;overflow:hidden;
  box-shadow:0 26px 60px rgba(10,27,61,.20);}
.om-foto img{width:100%;height:100%;object-fit:cover;display:block;}
.om-glow{position:absolute;left:50%;top:52%;width:130%;height:130%;transform:translate(-50%,-50%);
  z-index:-1;border-radius:50%;filter:blur(46px);opacity:0;transition:opacity .9s ease;
  background:conic-gradient(from 0deg,#4285F4,#34A853,#FBBC05,#EA4335,#4285F4);}
.om-strek{position:absolute;left:0;top:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;
  background:linear-gradient(90deg,#4285F4,#34A853,#FBBC05,#EA4335);}
.om-kaption{margin-top:16px;display:flex;flex-direction:column;align-items:center;gap:7px;}
.om-navn{font-family:'Geist',sans-serif;font-weight:750;font-size:1.15rem;letter-spacing:-.02em;color:var(--ink);}
.om-rolle{font-size:.9rem;color:var(--muted);}
.om-bio{font-size:.82rem;color:var(--muted);line-height:1.55;max-width:270px;}
.om-portrett .btn{margin-top:6px;}
.om-portrett .btn-primary{font-size:.9rem;padding:11px 20px;}

/* Reveal: portrettene glir inn mot hverandre + glød blomstrer + kaption staggres */
.home-motion .om-portrett{opacity:0;transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1);}
.home-motion .om-portrett[data-inn="venstre"]{transform:translateX(-64px) rotate(-3deg);}
.home-motion .om-portrett[data-inn="midt"]{transform:translateY(52px);}
.home-motion .om-portrett[data-inn="hoyre"]{transform:translateX(64px) rotate(3deg);}
.home-motion .om-grunnleggere.i-syne .om-portrett{opacity:1;transform:none;}
.home-motion .om-grunnleggere.i-syne .om-glow{opacity:.45;}
.om-grunnleggere.i-syne .om-strek{transition:transform .7s ease-out .5s;transform:scaleX(1);}
.home-motion .om-kaption > *{opacity:0;transform:translateY(12px);
  transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1);}
.home-motion .om-grunnleggere.i-syne .om-kaption > *{opacity:1;transform:none;}
.home-motion .om-grunnleggere.i-syne .om-kaption > :nth-child(2){transition-delay:.45s;}
.home-motion .om-grunnleggere.i-syne .om-kaption > :nth-child(3){transition-delay:.55s;}
.home-motion .om-grunnleggere.i-syne .om-kaption > :nth-child(4){transition-delay:.65s;}
.home-motion .om-grunnleggere.i-syne .om-kaption > :nth-child(5){transition-delay:.75s;}

/* «Det vi tror på» — manifest: store tall som tennes ett om gangen */
.tror-liste{list-style:none;padding:0;max-width:680px;margin:30px auto 0;
  display:flex;flex-direction:column;gap:clamp(26px,4.5vw,46px);}
.tror-punkt{display:flex;flex-direction:column;align-items:center;text-align:center;}
.tror-nr{width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:'Geist',sans-serif;font-weight:750;font-size:1.35rem;color:#fff;margin-bottom:14px;
  background:var(--tf,#C7D3EA);transform:scale(.6);opacity:.35;
  transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .5s ease,background .5s ease;}
.tror-punkt h3{font-family:'Geist',sans-serif;font-weight:750;font-size:clamp(20px,2.4vw,30px);
  letter-spacing:-.03em;color:var(--ink);margin:0;opacity:.5;transition:opacity .5s ease;}
.tror-punkt p{font-size:clamp(15px,1.3vw,17px);line-height:1.6;color:var(--muted);max-width:480px;
  margin:8px auto 0;opacity:.4;transition:opacity .5s ease;}
.tror-punkt.tent .tror-nr{transform:scale(1);opacity:1;}
.tror-punkt.tent h3{opacity:1;}
.tror-punkt.tent p{opacity:1;}

/* «Der vi står i dag» — tall som teller seg opp */
.om-tall{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:760px;margin:28px auto 0;}
.om-tall > div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 14px;
  transition:transform .25s ease,box-shadow .25s ease;}
.om-tall > div:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(10,27,61,.10);}
.om-tall .v{font-family:'Geist',sans-serif;font-weight:750;font-size:clamp(24px,2.6vw,34px);
  letter-spacing:-.02em;color:var(--ink);}
.om-tall .v .stj{color:#FFC53D;}
.om-tall .l{font-size:.82rem;color:var(--muted);margin-top:6px;line-height:1.45;}

@media (max-width:809px){
  .om-portretter{gap:22px;}
  .om-portrett{flex-basis:44%;}
  .om-portrett .btn-primary{font-size:.82rem;padding:9px 14px;}
  .om-tall{grid-template-columns:repeat(2,1fr);}
  .home-motion .om-portrett[data-inn="venstre"]{transform:translateX(-30px) rotate(-3deg);}
  .home-motion .om-portrett[data-inn="midt"]{transform:translateY(28px);}
  .home-motion .om-portrett[data-inn="hoyre"]{transform:translateX(30px) rotate(3deg);}
}
@media (prefers-reduced-motion: reduce){
  .home-motion .om-portrett,.home-motion .om-kaption > *{opacity:1;transform:none;transition:none;}
  .om-glow{opacity:.45;}
  .om-strek{transform:scaleX(1);}
  .tror-nr{transform:scale(1);opacity:1;}
  .tror-punkt h3,.tror-punkt p{opacity:1;}
}

/* ===== KS-TOPPRAD: dashbord venstre, «Slik bestiller du» høyre (18. juli) ===== */
.ks-topprad{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,52px);
  align-items:start;max-width:1120px;margin:14px auto 0;}
.ks-hoyre{padding-top:8px;}
.ks-topprad .ks-wrap{margin:0;}
.ks-hoyre{text-align:left;}
.ks-hoyre .section-title{text-align:left;margin:0;}
.ks-steg-vert{list-style:none;padding:0;margin:22px 0 0;position:relative;
  display:flex;flex-direction:column;gap:24px;}
.ks-steg-vert::before{content:"";position:absolute;left:23px;top:26px;bottom:26px;width:2px;background:var(--line);}
.ks-steg-vert li{display:flex;align-items:flex-start;gap:16px;position:relative;}
.ks-steg-vert .nr{width:46px;height:46px;border-radius:50%;background:var(--blue);color:#fff;
  font-family:'Geist',sans-serif;font-weight:750;font-size:1.2rem;display:flex;align-items:center;
  justify-content:center;flex:none;z-index:1;box-shadow:0 8px 20px rgba(30,79,212,.28);}
.ks-steg-vert li > div{padding-top:3px;}
.ks-steg-vert b{display:block;font-size:1.05rem;font-weight:750;color:var(--ink);letter-spacing:-.01em;}
.ks-steg-vert li > div > span{display:block;margin-top:3px;color:var(--muted);font-size:.92rem;line-height:1.5;}
.home-motion .ks-steg-vert.scroll-reveal li{opacity:0;transform:translateX(18px);
  transition:opacity .5s cubic-bezier(.16,1,.3,1),transform .5s cubic-bezier(.16,1,.3,1);}
.home-motion .ks-steg-vert.scroll-reveal.visible li{opacity:1;transform:none;}
.home-motion .ks-steg-vert.scroll-reveal.visible li:nth-child(2){transition-delay:.1s;}
.home-motion .ks-steg-vert.scroll-reveal.visible li:nth-child(3){transition-delay:.2s;}
@media(max-width:900px){
  .ks-topprad{grid-template-columns:1fr;gap:26px;max-width:640px;}
  .ks-hoyre,.ks-hoyre .section-title{text-align:center;}
  .ks-steg-vert{max-width:380px;margin-left:auto;margin-right:auto;}
}
@media(prefers-reduced-motion:reduce){.home-motion .ks-steg-vert.scroll-reveal li{opacity:1;transform:none;}}

/* «Velg din stil» flyttet inn i høyre kolonne under «Slik bestiller du» (18. juli) */
.ks-hoyre .ks-stil-tittel{margin-top:38px;}
.ks-hoyre .stil-grid{max-width:none;margin:18px 0 0;gap:12px;}
.ks-hoyre .stil-tile{padding:9px 9px 11px;border-radius:14px;}
.ks-hoyre .st-navn{font-size:.86rem;margin-top:9px;}
.ks-hoyre .st-modul{font-size:.72rem;}
@media(max-width:900px){
  .ks-hoyre .ks-stil-tittel,.ks-hoyre .stil-grid{text-align:center;}
  .ks-hoyre .stil-grid{max-width:400px;margin-left:auto;margin-right:auto;grid-template-columns:repeat(2,1fr);}
}

/* =================================================================
   OM «LØFTEKORTENE» — 4 prinsipper m/ bevis-tall, kompakt rad
   (18. juli 2026, idé-panel-vinner: slår sammen prinsipper + tall)
   ================================================================= */
.prov-undertittel{font-family:'Geist',sans-serif;font-weight:750;font-size:clamp(15px,1.4vw,18px);
  color:var(--muted);margin:8px auto 0;letter-spacing:-.01em;text-align:center;}
.prov-undertittel em{font-style:normal;color:var(--blue);}
.prov-rutenett{list-style:none;padding:0;margin:clamp(28px,4vw,42px) auto 0;max-width:1140px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.prov-kort{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:24px 18px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s ease;}
.prov-kort::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--pf);
  transform:scaleX(0);transform-origin:center;transition:transform .5s ease .25s;}
.prov-kort:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(10,27,61,.12);}
.prov-emblem{position:relative;width:56px;height:56px;display:grid;place-items:center;margin-bottom:12px;}
.prov-ring{position:absolute;inset:-3px;border-radius:50%;opacity:0;
  background:conic-gradient(from 0deg,var(--pf),transparent 78%);
  -webkit-mask:radial-gradient(farthest-side,transparent 70%,#000 72%);mask:radial-gradient(farthest-side,transparent 70%,#000 72%);}
.prov-nr{width:50px;height:50px;border-radius:50%;background:var(--pb);color:var(--pf);
  font-family:'Geist',sans-serif;font-weight:750;font-size:1.2rem;display:grid;place-items:center;
  transform:scale(.6);opacity:.4;}
.prov-kort h3{font-family:'Geist',sans-serif;font-weight:750;font-size:1.05rem;color:var(--ink);
  margin:0 0 6px;letter-spacing:-.01em;}
.prov-kort p{font-size:.86rem;line-height:1.5;color:var(--muted);margin:0;}
.prov-bevis{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);width:100%;
  display:flex;flex-direction:column;align-items:center;}
.prov-tall{font-family:'Geist',sans-serif;font-weight:750;font-size:1.5rem;color:var(--pf);letter-spacing:-.02em;}
.prov-tall .stj{color:#FFC53D;}
.prov-etikett{font-size:.72rem;color:var(--muted);margin-top:2px;}
/* Reveal: kortene tennes ett om gangen (venstre→høyre), ring spinner inn, tall teller opp */
.home-motion .prov-rutenett .prov-kort{opacity:0;transform:translateY(18px) scale(.97);
  transition:opacity .55s cubic-bezier(.16,1,.3,1),transform .55s cubic-bezier(.16,1,.3,1);}
.home-motion .prov-nr{transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .5s ease;}
.home-motion .prov-ring{transition:opacity .5s ease;}
.home-motion .prov-rutenett.visible .prov-kort{opacity:1;transform:none;}
.home-motion .prov-rutenett.visible .prov-kort:nth-child(2){transition-delay:.11s;}
.home-motion .prov-rutenett.visible .prov-kort:nth-child(3){transition-delay:.22s;}
.home-motion .prov-rutenett.visible .prov-kort:nth-child(4){transition-delay:.33s;}
.home-motion .prov-rutenett.visible .prov-nr{transform:scale(1);opacity:1;}
.home-motion .prov-rutenett.visible .prov-ring{opacity:.9;animation:provSpinn .9s cubic-bezier(.16,1,.3,1);}
.home-motion .prov-rutenett.visible .prov-kort::before{transform:scaleX(1);}
.prov-kort:hover .prov-ring{animation:provSpinn 6s linear infinite;}
@keyframes provSpinn{from{transform:rotate(-140deg);}to{transform:rotate(0);}}
@media(max-width:900px){.prov-rutenett{grid-template-columns:repeat(2,1fr);gap:14px;max-width:520px;}}
@media(max-width:520px){
  .home-motion .prov-rutenett.visible .prov-kort:nth-child(3){transition-delay:.11s;}
  .home-motion .prov-rutenett.visible .prov-kort:nth-child(4){transition-delay:.22s;}
}
@media(prefers-reduced-motion:reduce){
  .home-motion .prov-rutenett .prov-kort,.home-motion .prov-nr{opacity:1;transform:none;transition:none;}
  .home-motion .prov-rutenett .prov-ring{opacity:.9;}
  .prov-kort::before{transform:scaleX(1);}
}

/* ===== OM-SIDE finpuss (18. juli): mindre luft + levende aura bak grunnleggerne ===== */
.om-side .section{padding-top:clamp(28px,3.4vw,46px);padding-bottom:clamp(28px,3.4vw,46px);}
.om-side .om-forteller{margin-bottom:4px;}
.om-side .prov-rutenett{margin-top:clamp(24px,3vw,34px);}
/* Levende aura: Google-fargeglød roterer sakte bak hvert portrett — alltid i bevegelse */
@keyframes omAura{from{transform:translate(-50%,-50%) rotate(0deg);}to{transform:translate(-50%,-50%) rotate(360deg);}}
.home-motion .om-grunnleggere.i-syne .om-glow{opacity:.5;animation:omAura 16s linear infinite;}
@media(prefers-reduced-motion:reduce){.home-motion .om-grunnleggere.i-syne .om-glow{animation:none;}}

/* ===== WhatsApp-knapp (global — alle sider, 18. juli 2026) ===== */
.wa-widget{position:fixed;top:11px;right:18px;z-index:99500;display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(-8px);transition:opacity .45s ease,transform .45s ease;pointer-events:none}
.wa-widget.wa-vis{opacity:1;transform:none;pointer-events:auto}
.wa-knapp{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(180deg,#3ACC6C,#22A552);box-shadow:0 6px 18px rgba(0,0,0,.35);transition:transform .2s}
.wa-knapp:hover{transform:scale(1.1)}
.wa-knapp svg{width:24px;height:24px;display:block}
.wa-melding{font-size:13px;font-weight:650;color:#0A1B3D;background:#fff;border-radius:999px;padding:9px 14px;box-shadow:0 8px 22px rgba(0,0,0,.28);text-decoration:none;white-space:nowrap;opacity:0;transform:translateX(8px) scale(.9);transform-origin:100% 50%;transition:opacity .4s ease .15s,transform .4s cubic-bezier(.3,1.4,.5,1) .15s}
.wa-widget.wa-vis .wa-melding{opacity:1;transform:none}
.wa-widget.wa-melding-skjul .wa-melding{opacity:0;transform:translateX(8px) scale(.9);pointer-events:none}
/* Mobil (30. juli): knappen bodde oppe til høyre og krasjet med kampanjepillen i
   heroen — flyttet ned til venstre hjørne (vanlig WhatsApp-plass; sticky-CTA eier
   høyre hjørne). Meldingen legger seg til HØYRE for knappen. */
@media (max-width:999px){
  .wa-widget{top:auto;bottom:18px;left:14px;right:auto;flex-direction:row-reverse;transform:translateY(8px)}
  .wa-widget.wa-vis{transform:none}
  .wa-knapp{width:44px;height:44px}
  .wa-knapp svg{width:24px;height:24px}
  .wa-melding{font-size:11.5px;padding:8px 12px;transform-origin:0 50%;transform:translateX(-8px) scale(.9)}
  .cookie-banner.visible ~ .wa-widget{opacity:0!important;pointer-events:none!important}
}
/* WhatsApp-flyger: ikonet flyr fra intro-skyen til knappen i hjørnet (kun forsiden) */
.wa-flyger{position:fixed;width:42px;height:42px;border-radius:50%;background:#2D6BF0;display:grid;place-items:center;z-index:100001;box-shadow:0 6px 18px rgba(0,0,0,.35);transform:scale(.42);transition:transform .82s cubic-bezier(.45,-.12,.25,1);pointer-events:none}
.wa-flyger svg{width:24px;height:24px;display:block}
/* Skjul WhatsApp-knappen når en fullskjerm-overlay er åpen (dekket lukke-krysset) */
body.wizfs-apen .wa-widget,body.modal-apen .wa-widget{opacity:0!important;pointer-events:none!important}

/* ==== Bevis-stripe (forside) ==== */
/* Kort, mørkt bånd med sosialt bevis mellom «Hva trenger du?» og «Hvem er Adali?»
   (19. juli 2026). Samme nightsky-DNA som .uside-hero: mørk gradient + rolig glød.
   Diskret og elegant — bevis, ikke støy. */
.bevis{position:relative;overflow:clip;padding:clamp(44px,6vw,72px) 0;
  background:radial-gradient(900px 420px at 72% -18%,rgba(60,105,225,.20),transparent 62%),
  linear-gradient(180deg,#0C1B3E 0%,#0A1428 100%);}
.bevis-glod{position:absolute;left:50%;top:-34%;width:620px;height:360px;max-width:90vw;
  transform:translateX(-50%);border-radius:50%;filter:blur(80px);pointer-events:none;
  background:radial-gradient(circle,rgba(80,125,235,.30),transparent 70%);}
.bevis .container{position:relative;z-index:1;}
.bevis-inner{max-width:760px;margin:0 auto;text-align:center;}
/* Google-badgen (hvit pille) lyser fint mot det mørke båndet */
.bevis .testimonials-google{margin:0 auto 24px;box-shadow:0 10px 30px rgba(2,6,18,.45);}
/* Sitatet — Fraunces-kursiv (sitat-aksenten i Design 2.0), hvitt og luftig */
.bevis-sitat{margin:0 auto clamp(24px,3.5vw,32px);}
.bevis-sitat blockquote{margin:0;font-family:'Fraunces',serif;font-style:italic;font-weight:400;
  font-size:clamp(20px,2.6vw,29px);line-height:1.4;letter-spacing:-.01em;color:#fff;
  max-width:30ch;margin-inline:auto;}
.bevis-sitat figcaption{margin-top:12px;font-family:'Geist',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:13px;font-weight:600;letter-spacing:.02em;color:rgba(226,233,252,.6);}
/* Tall-chips (glass mot natthimmelen) + lenke til prosjektene */
.bevis-tall{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 12px;}
.bevis-chip{display:inline-flex;align-items:baseline;gap:7px;font-size:13.5px;font-weight:600;
  color:rgba(226,233,252,.85);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:9px 16px;white-space:nowrap;}
.bevis-chip b{font-family:'Fraunces',serif;font-weight:500;font-size:17px;line-height:1;color:#fff;}
.bevis-lenke{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:650;
  color:#AFC6FF;text-decoration:none;padding:9px 4px;}
.bevis-lenke:hover{color:#fff;}
.bevis-lenke .bevis-pil{transition:transform .25s;}
.bevis-lenke:hover .bevis-pil{transform:translateX(4px);}
/* Smale skjermer (ned til 360px): chipsene stables, sitatet holder seg lesbart */
@media (max-width:480px){
  .bevis{padding:40px 0;}
  .bevis-sitat blockquote{font-size:19px;}
  .bevis-chip{white-space:normal;text-align:left;}
  .bevis-tall{gap:8px 10px;}
}
@media (prefers-reduced-motion: reduce){.bevis-lenke .bevis-pil{transition:none;}}

/* Andre vegg-kolonne (mobil-HTML) — brukes ikke lenger på mobil, skjult overalt */
.wall-col-2{ display: none; }

/* Prosjekt-visningen finnes KUN for mobil — aldri på PC (der ligger prosjektene i hero-veggen) */
.mob-portfolio{ display: none; }

/* ===== 19.07.2026 — REN mobil-hero + auto-blaende prosjektstripe (Amins mockup) =====
   Mobil: hero-veggen skjules, heroen blir ren og VENSTREJUSTERT med innhold øverst
   (pill øverst). Prosjektene vises som en horisontal stripe som blar bortover av seg
   selv — en visning av nettsider vi lager (dekor, ikke klikkbar).
   PC (>=1200px) er urørt — beholder hero-veggen som før.
   Reversering: hent tilbake filene i _backup-ren-hero-20260719/ og publiser på nytt. */
@media (max-width: 1199px){
  .hero.hero-night{
    position: relative;
    display: block;
    min-height: 0;
    padding: 116px 0 40px;
    overflow: clip;
  }
  .hero.hero-night > .container{ position: relative; z-index: 2; }
  .hero-night-inner{ max-width: 600px; }

  /* Veggen skjules helt på mobil */
  .hero-night .hero-wall{ display: none; }

  /* Tittel-størrelse som alltid får plass på tvers av telefonbredder */
  .hero.hero-night.hero-animated h1{ font-size: clamp(24px, 7vw, 34px); line-height: 1.12; }

  /* ===== Auto-blaende prosjektstripe (kun mobil) ===== */
  .mob-portfolio{
    display: block;
    background: linear-gradient(180deg, #0A1428 0%, #0C1B3E 100%);
    padding: 4px 0 40px;
  }
  .mob-portfolio-head{
    display: flex; align-items: baseline; justify-content: space-between;
    gap: 12px; margin-bottom: 16px;
  }
  .mob-portfolio-tittel{
    font-family: 'Geist', -apple-system, sans-serif;
    font-size: 17px; font-weight: 700; letter-spacing: -0.01em; color: #fff;
  }
  .mob-portfolio-mer{
    display: inline-flex; align-items: center; gap: 6px; flex: none;
    font-size: 14px; font-weight: 600; color: rgba(233,239,255,.82);
    text-decoration: none;
  }
  /* Stripa: full bredde, kortene glir jevnt mot venstre */
  .mob-carousel{ overflow: hidden; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
  .mob-carousel-track{
    display: flex;
    width: max-content;
    animation: mobSlide 48s linear infinite;
  }
  .mob-slide{
    flex: none;
    width: 74vw;
    max-width: 320px;
    margin-right: 14px;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.12);
    background: #10182B;
    box-shadow: 0 16px 34px rgba(2,6,18,.45);
    aspect-ratio: 16 / 10;
  }
  .mob-slide img{ width: 100%; height: 100%; object-fit: cover; display: block; }
  /* (Prikkene under karusellen ble fjernet 30. juli 2026 på Amins ordre — de tok plass) */
}
/* Sømløs venstre-loop for prosjektstripa (kortene duplisert 2x → -50% = ett sett) */
@keyframes mobSlide{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .mob-carousel-track{ animation: none; }
}

/* ===== 19.07.2026 — Mobil-optimalisering (fiks alt etter research) ===== */

/* #2 Sticky CTA: tydelig blå så den synes på både lyse og mørke seksjoner */
.sticky-cta{background:#2D6BF0}
.sticky-cta:hover{background:#1a5fe0}

/* #3 Tillit/pris-linje rett under hero-CTA */
.hero-trust{margin:16px 0 0;font-size:13.5px;font-weight:500;color:rgba(233,239,255,.82);letter-spacing:.01em;line-height:1.55}
.hero-trust .hero-trust-star{color:#FFC94D;font-weight:700}
/* (Hero-underteksten ble fjernet helt fra forsiden 30. juli 2026 — Amins ordre) */

/* Avsluttende CTA-seksjon (før footer) */
.slutt-cta{background:linear-gradient(180deg,#0A1428 0%,#071022 100%);padding:clamp(44px,7vw,72px) 0;text-align:center}
.slutt-cta h2{font-family:'Geist',-apple-system,sans-serif;font-size:clamp(26px,5vw,40px);font-weight:750;letter-spacing:-.03em;color:#fff;margin:0 0 10px}
.slutt-cta p{color:rgba(233,239,255,.78);font-size:clamp(15px,1.4vw,17px);margin:0 auto 24px;max-width:46ch}
.slutt-cta .slutt-knapp{display:inline-flex;align-items:center;gap:9px;background:#2D6BF0;color:#fff;font-weight:650;font-size:16px;border-radius:999px;padding:15px 30px;text-decoration:none;transition:transform .2s,background .2s}
.slutt-cta .slutt-knapp:hover{background:#1a5fe0;transform:translateY(-2px)}

@media (max-width:768px){
  /* #4 Demp uendelige animasjoner/blur på mobil (batteri, hakking, INP) */
  .hero-animated .hero-aurora span{animation:none!important}
  .hero-deco svg{animation:none!important}

  /* #5 Cookie-banner: kompakt panel i bunnen.
     RETTET 20. juli 2026 — den forrige «bunn-stripe»-varianten la tekst og begge
     knappene på ÉN rad. Innholdet trengte 485px i en 366px bred boks, så «Godta»
     ble dyttet 149px utenfor høyre kant og var umulig å trykke på. I praksis kunne
     ingen på mobil samtykke, kun avslå. Derfor: tekst over, knappene på egen rad. */
  .cookie-banner{left:10px;right:10px;bottom:10px;max-width:none;padding:12px 13px;border-radius:14px}
  .cookie-content{flex-direction:column;align-items:stretch;gap:9px}
  .cookie-text strong{display:block;font-size:13.5px;margin-bottom:2px}
  /* Den lange forklaringen skjules på telefon — «Les mer» står igjen og
     lenker til hele personvernerklæringen, så samtykket fortsatt er informert. */
  .cookie-text p{display:none}
  .cookie-mer{font-size:12px}
  .cookie-actions{display:flex;flex-direction:row;gap:8px;width:100%}
  /* flex:1 + min-width:0 gjør at knappene deler bredden likt og aldri kan
     vokse ut av boksen, uansett hvor lang teksten på dem blir. */
  .btn-cookie{flex:1 1 0;min-width:0;padding:11px 12px;font-size:13.5px;min-height:44px;white-space:nowrap}

  /* #2 Sticky CTA litt mindre på mobil */
  .sticky-cta{bottom:16px;right:12px;padding:12px 18px;font-size:13.5px}

  /* #8 Komprimer «Hvem er Adali» på mobil */
  .who2 .fhero{gap:16px;padding:22px 0}
  .who2 .fhero-foto{max-width:180px}
  .who2 .fhero-bio{font-size:14px;line-height:1.6}
}

/* #4 Respekter «reduser bevegelse» også for hero-dekor og karuseller */
@media (prefers-reduced-motion:reduce){
  .hero-animated .hero-aurora span,.hero-deco svg,.mob-carousel-track,.wall-track,.hero-animated h1 em{animation:none!important}
}

/* ==========================================================================
   PROSJEKT-MENY (mega-meny under «Prosjekter» i navigasjonen) — 29. juli 2026
   --------------------------------------------------------------------------
   Mønsteret er «liste + levende forhåndsvisning», slik de beste studio-sidene
   gjør det: navnene står som en kompakt liste til venstre (produktnavnet er
   det største elementet), og bildet til høyre krysstoner til prosjektet man
   peker på. Grunnen til å velge dette framfor et rutenett av bildekort:
   listen tåler 20 prosjekter uten å bygges om — kortene ville sprengt bredden.
   Hele flaten bruker samme mørke glass som navigasjonen (nav-night).
   ========================================================================== */

.nav-drop { display: inline-flex; align-items: center; }

/* Selve lenka i navigasjonen. Klikk går fortsatt til prosjekter.html —
   menyen er et tillegg, ikke en erstatning. */
.nav-drop-lenke { display: inline-flex; align-items: center; gap: 5px; }
.nav-chev {
  width: 9px; height: 6px; flex-shrink: 0;
  opacity: .55;
  transition: transform .32s cubic-bezier(.2,.8,.2,1), opacity .2s;
}
.nav-drop:hover .nav-chev, .nav-drop.er-aapen .nav-chev { opacity: 1; }
.nav-drop.er-aapen .nav-chev { transform: rotate(180deg); }

/* Knappen som folder ut lista på mobil (skjult på PC — der styrer musepekeren). */
.nav-drop-knapp { display: none; }

/* ---- Flaten som glir ned ---- */
.nav-mega {
  position: absolute;      /* mot <nav> (fixed) — derfor full bredde og sentrert */
  top: 100%; left: 0; right: 0;
  padding: 12px var(--gutter) 0;
  display: flex; justify-content: center;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .22s ease, visibility .22s;
}
.nav-drop.er-aapen .nav-mega { opacity: 1; visibility: visible; pointer-events: auto; }

.nav-mega-flate {
  width: 100%; max-width: 820px;
  background: linear-gradient(180deg, rgba(10,16,38,.97), rgba(6,11,28,.98));
  backdrop-filter: blur(26px) saturate(150%);
  -webkit-backdrop-filter: blur(26px) saturate(150%);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  box-shadow: 0 30px 70px -22px rgba(2,6,18,.8), inset 0 1px 0 rgba(255,255,255,.07);
  padding: 16px;
  transform: translateY(-10px) scale(.985);
  opacity: 0;
  transition: transform .4s cubic-bezier(.2,.85,.25,1), opacity .3s ease;
}
.nav-drop.er-aapen .nav-mega-flate { transform: none; opacity: 1; }

.nm-inner { display: grid; grid-template-columns: minmax(0,300px) minmax(0,1fr); gap: 18px; }

/* ---- Venstre: lista ---- */
.nm-kolonne { display: flex; flex-direction: column; min-width: 0; }
.nm-stikk {
  font-size: 10px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: rgba(233,239,255,.36); padding: 2px 10px 9px;
}
.nm-liste { display: flex; flex-direction: column; gap: 2px; max-height: 292px; overflow-y: auto; }
.nm-liste::-webkit-scrollbar { width: 4px; }
.nm-liste::-webkit-scrollbar-thumb { background: rgba(255,255,255,.16); border-radius: 4px; }

.nav-links .nm-rad {
  position: relative;
  display: grid; grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center; gap: 11px;
  padding: 9px 12px; border-radius: 12px;
  text-decoration: none; color: inherit;
  opacity: 0; transform: translateY(7px);
  transition: background .22s ease, opacity .34s ease, transform .34s cubic-bezier(.2,.85,.25,1);
}
.nav-drop.er-aapen .nm-rad { opacity: 1; transform: none; }
.nav-drop.er-aapen .nm-rad:nth-child(1) { transition-delay: .05s, .05s, .05s; }
.nav-drop.er-aapen .nm-rad:nth-child(2) { transition-delay: .05s, .10s, .10s; }
.nav-drop.er-aapen .nm-rad:nth-child(3) { transition-delay: .05s, .15s, .15s; }
.nav-drop.er-aapen .nm-rad:nth-child(4) { transition-delay: .05s, .20s, .20s; }
.nav-drop.er-aapen .nm-rad:nth-child(5) { transition-delay: .05s, .25s, .25s; }
.nav-drop.er-aapen .nm-rad:nth-child(6) { transition-delay: .05s, .30s, .30s; }
.nav-drop.er-aapen .nm-rad:nth-child(n+7) { transition-delay: .05s, .34s, .34s; }

/* Den lille loddrette streken i prosjektets egen farge — dukker opp på den aktive raden */
.nm-rad::before {
  content: ""; position: absolute; left: 0; top: 50%;
  width: 2px; height: 0; border-radius: 2px;
  background: var(--glod, #7FA6FF);
  transform: translateY(-50%);
  transition: height .28s cubic-bezier(.2,.85,.25,1);
}
.nm-rad.er-aktiv { background: rgba(255,255,255,.055); }
.nm-rad.er-aktiv::before { height: 22px; }

.nm-nr {
  font-size: 10.5px; font-weight: 700; letter-spacing: .04em;
  color: rgba(233,239,255,.32); font-variant-numeric: tabular-nums;
  transition: color .22s ease;
}
.nm-rad.er-aktiv .nm-nr { color: var(--glod, #7FA6FF); }

.nm-tekst { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.nav-links .nm-navn {
  font-size: 15px; font-weight: 600; letter-spacing: -.01em; line-height: 1.25;
  color: rgba(233,239,255,.88);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: color .22s ease;
}
.nm-rad.er-aktiv .nm-navn { color: #fff; }
.nm-bransje {
  font-size: 11px; color: rgba(233,239,255,.44); line-height: 1.35;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.nm-pil {
  font-size: 13px; color: rgba(233,239,255,.5);
  opacity: 0; transform: translateX(-5px);
  transition: opacity .24s ease, transform .24s cubic-bezier(.2,.85,.25,1);
}
.nm-rad.er-aktiv .nm-pil { opacity: 1; transform: none; color: #fff; }

/* Bunnlinja: «Se alle prosjekter» */
.nav-links a.nm-alle {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 12px; padding: 10px 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  font-size: 12.5px; font-weight: 600; color: rgba(233,239,255,.68);
  transition: color .2s ease;
}
.nav-links a.nm-alle:hover { color: #fff; }
.nm-alle-pil { transition: transform .28s cubic-bezier(.2,.85,.25,1); }
.nav-links a.nm-alle:hover .nm-alle-pil { transform: translateX(4px); }

/* ---- Høyre: forhåndsvisningen ---- */
.nm-scene { position: relative; display: flex; flex-direction: column; min-width: 0; }
.nm-ramme {
  position: relative; z-index: 1; width: 100%; aspect-ratio: 16 / 10;
  border-radius: 14px; overflow: hidden;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(255,255,255,.03);
}
/* Fargeskjæret bak forhåndsvisningen — tar prosjektets egen farge.
   Ligger som søsken til rammen (ikke inni), ellers ville overflow:hidden klippet det. */
.nm-glod {
  position: absolute; inset: -18% -15% 6%;
  background: radial-gradient(58% 58% at 50% 52%, var(--glod, #7FA6FF) 0%, transparent 70%);
  filter: blur(40px); opacity: .48; z-index: 0;
  transition: background .55s ease;
  pointer-events: none;
}
.nm-bilde {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: top center;
  opacity: 0; transform: scale(1.05);
  transition: opacity .45s ease, transform .7s cubic-bezier(.2,.85,.25,1);
}
.nm-bilde.er-vist { opacity: 1; transform: none; }

.nm-under { padding: 11px 3px 2px; min-height: 42px; }
.nm-under-navn {
  display: block; font-size: 13.5px; font-weight: 600; color: #fff; letter-spacing: -.01em;
}
.nm-under-linje { display: block; font-size: 11.5px; color: rgba(233,239,255,.5); margin-top: 2px; }
.nm-under-navn, .nm-under-linje { transition: opacity .25s ease; }
.nm-scene.bytter .nm-under-navn, .nm-scene.bytter .nm-under-linje { opacity: 0; }

/* ==========================================================================
   MOBIL / NETTBRETT — INGEN mega-meny (Amins beslutning 29. juli 2026).
   På telefon ser «Prosjekter» ut og oppfører seg akkurat som før: en vanlig
   lenke i hamburgermenyen. `display: contents` løser opp wrapperen, slik at
   lenka blir et helt vanlig menypunkt på linje med «Hjem» og «Om».
   ========================================================================== */
@media (max-width: 999px) {
  .nav-drop { display: contents; }
  .nav-chev, .nav-drop-knapp, .nav-mega { display: none !important; }

  /* Rettelse som ble funnet underveis og gjelder uansett: mobilmenyen
     sentrerte innholdet loddrett, så de øverste lenkene kunne havne over
     skjermkanten på lave skjermer — uten at man kunne bla opp til dem.
     «safe center» sentrerer som før, men gir etter når det ikke er plass. */
  .nav-links,
  .theme-nightsky .nav-rail .nav-links, .nav-night .nav-rail .nav-links { justify-content: safe center; }
}

/* Nettbrett i liggende format (1000–1199px): navigasjonen er desktop igjen,
   men skjermen er lav — hold flaten smalere så den ikke dekker hele bildet. */
@media (min-width: 1000px) and (max-width: 1199px) {
  .nav-mega-flate { max-width: 820px; padding: 15px; }
  .nm-inner { grid-template-columns: minmax(0,280px) minmax(0,1fr); gap: 16px; }
  .nm-liste { max-height: 244px; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-mega, .nav-mega-flate, .nm-rad, .nm-bilde, .nm-pil, .nm-rad::before,
  .nav-chev, .nm-alle-pil, .nav-drop-knapp svg { transition: none !important; }
  .nav-mega-flate, .nm-rad { transform: none !important; }
}

/* ===== 30.07.2026 — Medently: EKTE skrivemaskin (Amins bestilling: «akkurat
   som medently.com»). Basisbildene har TOM ordlinje; .med-type ligger oppå og
   skriver landet bokstav for bokstav med ekte tekst i Medentlys egen font
   (Clash Grotesk 500, selvhostet — Fontshare-lisensen tillater det) + blinkende
   markør. script.js driver skrivingen, synkront på alle flater. */
@font-face{font-family:'Clash Grotesk';src:url('clash-grotesk-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Clash Grotesk';src:url('clash-grotesk-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
.med-skift{position:relative;display:block;width:100%;height:100%}
.med-skift img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:50% var(--wy,0%);display:block}
.med-type{position:absolute;top:0;display:flex;align-items:center;container-type:inline-size;pointer-events:none}
.med-type[hidden]{display:none} /* display:flex over slår ellers ut hidden-attributtet — modalen skjuler overlegget slik på alt annet enn Medently */
.med-type .mt-ord{font-family:'Clash Grotesk',-apple-system,'system-ui',sans-serif;font-weight:500;color:#125BFC;letter-spacing:-.025em;line-height:1;white-space:pre;font-size:14px;font-size:13.9cqw}
.med-type .mt-caret{flex:none;width:.06em;height:.82em;background:#125BFC;margin-left:.05em;animation:mtBlink 1.1s steps(1) infinite;font-size:14px;font-size:13.9cqw}
@keyframes mtBlink{0%,55%{opacity:1}56%,100%{opacity:0}}
@media (prefers-reduced-motion: reduce){.med-type .mt-caret{animation:none}}


/* Bla-gjennom-modalen: bildet + skrivemaskin-overlegget ligger i en relativ ramme */
.modal-bilde-wrap{position:relative;line-height:0}

/* ===== 31.07.2026 — Riggmann-kortet i hero-rulleringen =====
   Tre lag: statisk skjermbilde i bunn (reserve/plakat), EKTE hero-video fra
   riggmann-siden (kjerneboringen som beveger seg — Amins bestilling: «akkurat
   som på live-siden»), og et gjennomsiktig lag med logo/tekst øverst. */
.rigg-kort{position:relative;display:block;width:100%;height:100%}
.rigg-kort img,.rigg-kort video{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;display:block}
/* iOS-Safari tegner <video> over søsken uten eksplisitt z-index — lås lagene:
   bunnbilde (0) -> video (1) -> logo/tekst-overlegg (2, egen kompositt-flate) */
.rigg-kort img:first-child{z-index:0}
.rigg-kort video{z-index:1}
.rigg-kort img:last-child{z-index:2;transform:translateZ(0)}
@media (prefers-reduced-motion: reduce){.rigg-kort video{display:none}}


/* ===== «Hva trenger du?» 4.0 (28. aug 2026) — premium tekstkort =====
   Amins bestilling: kortene ble for tomme og «enkle» etter at bildene røk
   26. aug. Nå: tettere kort med ekte innhold — nummer, navn, tre haker
   (samme punkter som prissiden), ÉN tydelig pris og en knapp som faktisk
   ser ut som en knapp. «Mest valgt» står i mørk marine (sidens egen farge)
   med den roterende lysringen beholdt — Amin liker den — og blir dermed
   seksjonens naturlige midtpunkt. Deles av index + index-en. */
.tj-liste{margin:34px auto 0;max-width:1040px;text-align:left;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.tj-rad{position:relative;display:flex;flex-direction:column;padding:24px 22px 22px;
  text-decoration:none;background:linear-gradient(180deg,#FBFCFE,#fff 46%);
  border:1px solid #E4E9F3;border-radius:22px;
  box-shadow:0 14px 34px -26px rgba(12,27,62,.22);
  transition:border-color .22s,transform .45s cubic-bezier(.22,1,.36,1),box-shadow .3s}
.tj-rad:hover{border-color:#C4D2F0;transform:translateY(-5px);
  box-shadow:0 30px 60px -28px rgba(12,27,62,.35)}
.tj-topp{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.tj-nr{font-size:12px;font-weight:700;color:#9AA4BD;letter-spacing:.12em;
  font-variant-numeric:tabular-nums}
.tj-navn{display:block;font-family:'Geist',-apple-system,sans-serif;font-size:clamp(20px,1.8vw,24px);
  font-weight:750;letter-spacing:-.02em;color:#0A1B3D;line-height:1.12}
.tj-sub{display:block;margin-top:6px;font-size:13.5px;color:#5B6478;line-height:1.5}
.tj-punkter{display:flex;flex-direction:column;gap:9px;margin-top:16px;padding-top:16px;
  border-top:1px solid #ECF0F7}
.tj-punkter span{position:relative;padding-left:25px;font-size:13.5px;line-height:1.45;color:#39415A}
.tj-punkter span::before{content:'';position:absolute;left:0;top:2px;width:16px;height:16px;
  border-radius:50%;background:#E7F5EC;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.5l2.4 2.4 4.6-5.3' fill='none' stroke='%23189A4A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size:16px 16px}
/* Prisen: én pris, stor og tydelig — «fra» og «kr/mnd» små, chip til høyre */
.tj-pris{margin-top:auto;padding-top:18px;display:flex;align-items:baseline;gap:5px}
.tj-fra,.tj-enhet{font-size:12.5px;font-weight:600;color:#8A93A8;white-space:nowrap}
.tj-belop{font-family:'Geist',-apple-system,sans-serif;font-size:27px;font-weight:800;
  letter-spacing:-.02em;color:#0A1B3D;line-height:1;font-variant-numeric:tabular-nums}
.tj-chip{display:inline-flex;align-items:center;font-size:11px;font-weight:750;letter-spacing:.02em;
  border-radius:999px;padding:4px 10px;white-space:nowrap}
.tj-chip-populaer{background:rgba(66,133,244,.2);color:#9DBAFB}
.tj-chip-spar{background:#FFF1E3;color:#C2601B;margin-left:auto;align-self:center}
/* Knappen nederst — hele kortet er lenka, men dette er «trykk her»-signalet */
.tj-cta{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;
  padding:12px 16px;border-radius:12px;background:#EFF4FE;color:#1E4FD4;
  font-size:14.5px;font-weight:750;transition:background .22s,color .22s}
.tj-cta i{font-style:normal;transition:transform .25s}
.tj-rad:hover .tj-cta{background:#1E4FD4;color:#fff}
.tj-rad:hover .tj-cta i{transform:translateX(4px)}
/* «Mest valgt»: mørk marine + roterende blå lysring rundt kortet */
.tj-rad:has(.tj-chip-populaer){border-color:transparent;overflow:hidden}
.tj-rad:has(.tj-chip-populaer)>*{position:relative;z-index:2}
.tj-rad:has(.tj-chip-populaer)::before{content:'';position:absolute;left:50%;top:50%;
  width:max(240%,760px);aspect-ratio:1;transform:translate(-50%,-50%);z-index:0;
  background:conic-gradient(#DCE6FB 0 22%,#1E4FD4 32%,#7FA4F8 38%,#DCE6FB 48% 72%,
    rgba(30,79,212,.55) 84%,#DCE6FB 92% 100%);
  animation:tjRing 7s linear infinite}
.tj-rad:has(.tj-chip-populaer)::after{content:'';position:absolute;inset:2px;
  border-radius:20px;background:linear-gradient(180deg,#13285A 0%,#0A1B3D 55%);z-index:1}
.tj-rad:has(.tj-chip-populaer):hover::before{animation-duration:2.6s}
.tj-rad:has(.tj-chip-populaer) .tj-nr{color:#7E93C4}
.tj-rad:has(.tj-chip-populaer) .tj-navn{color:#fff}
.tj-rad:has(.tj-chip-populaer) .tj-sub{color:#AEBEE4}
.tj-rad:has(.tj-chip-populaer) .tj-punkter{border-top-color:rgba(255,255,255,.13)}
.tj-rad:has(.tj-chip-populaer) .tj-punkter span{color:#D9E2F6}
.tj-rad:has(.tj-chip-populaer) .tj-punkter span::before{background-color:rgba(52,168,83,.22);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.5l2.4 2.4 4.6-5.3' fill='none' stroke='%235BD98A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.tj-rad:has(.tj-chip-populaer) .tj-fra,
.tj-rad:has(.tj-chip-populaer) .tj-enhet{color:#8FA3CC}
.tj-rad:has(.tj-chip-populaer) .tj-belop{color:#fff}
.tj-rad:has(.tj-chip-populaer) .tj-chip-spar{background:rgba(255,177,102,.18);color:#FFBE85}
.tj-rad:has(.tj-chip-populaer) .tj-cta{background:#2D6BF0;color:#fff;
  box-shadow:0 12px 26px -12px rgba(45,107,240,.8)}
.tj-rad:has(.tj-chip-populaer):hover .tj-cta{background:#3E7BFF}
@keyframes tjRing{to{transform:translate(-50%,-50%) rotate(360deg)}}
/* stille inntog: kortene kommer ett og ett når seksjonen ruller inn */
.home-motion .scroll-reveal:not(.visible) .tj-rad{opacity:0}
.home-motion .scroll-reveal.visible .tj-rad{animation:tjInn .6s cubic-bezier(.22,1,.36,1) backwards}
.home-motion .scroll-reveal.visible .tj-rad:nth-child(2){animation-delay:.12s}
.home-motion .scroll-reveal.visible .tj-rad:nth-child(3){animation-delay:.24s}
@keyframes tjInn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.tj-liste + .bygg-start-hint{margin-top:26px}
@media(max-width:1080px){.tj-liste{gap:14px}
  .tj-rad{padding:20px 18px 18px}
  .tj-sub{font-size:12.5px}.tj-punkter span{font-size:12.5px}
  .tj-belop{font-size:23px}
  .tj-chip{font-size:10px;padding:3px 8px}}
@media(max-width:899px){
  .tj-liste{grid-template-columns:1fr;max-width:480px;gap:14px}
  .tj-rad{padding:22px 20px 20px}
  .tj-navn{font-size:21px}
  .tj-sub{font-size:13px;margin-top:4px}
  .tj-punkter span{font-size:13px}
  .tj-belop{font-size:25px}
}
@media (prefers-reduced-motion: reduce){
  .tj-rad,.tj-cta,.tj-cta i{transition:none}
  .tj-rad:hover{transform:none}
  .tj-rad:has(.tj-chip-populaer)::before{animation:none}
  .home-motion .scroll-reveal:not(.visible) .tj-rad{opacity:1}
  .home-motion .scroll-reveal.visible .tj-rad{animation:none}
}


/* ===== 31.07.2026 — PRISVELGEREN (hva-koster-nettside) =====
   Amins fasit etter to forkastede runder: «så enkelt som en app å bruke».
   Mønsteret alle kjenner fra app-abonnementsskjermer: smale, trykkbare valgkort
   — navn venstre, pris høyre, «Mest valgt» med blå ramme. Ingenting annet. */
.pv-liste{max-width:560px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.pv-rad{position:relative;display:flex;justify-content:space-between;align-items:center;gap:14px;
  background:#fff;border:1.5px solid #E3E8F2;border-radius:16px;padding:15px 18px;
  text-decoration:none;transition:border-color .2s,transform .2s,box-shadow .2s}
.pv-venstre{text-align:left;min-width:0}
.pv-rad:hover{border-color:#B9C6E8;transform:translateY(-1px);box-shadow:0 10px 26px rgba(10,27,61,.08)}
.pv-navn{display:block;font-weight:750;font-size:16.5px;color:#0A1B3D;letter-spacing:-.01em}
.pv-sub{display:block;margin-top:3px;font-size:13px;color:#5B6478}
.pv-hoyre{text-align:right;flex:none}
.pv-pris{display:block;font-weight:800;font-size:16.5px;color:#0A1B3D;white-space:nowrap;font-variant-numeric:tabular-nums}
.pv-detalj{display:block;margin-top:3px;font-size:12px;color:#8A93A8;white-space:nowrap;font-variant-numeric:tabular-nums}
.pv-detalj s{color:#9AA4BD}
.pv-detalj b{color:#C2601B;font-weight:750}
.pv-rad.er-valgt{border:2px solid #2D6BF0;background:linear-gradient(180deg,#F5F8FF,#fff);
  box-shadow:0 12px 30px rgba(45,107,240,.13)}
.pv-merke{position:absolute;top:-11px;left:16px;background:#2D6BF0;color:#fff;font-size:11px;
  font-weight:800;letter-spacing:.04em;border-radius:999px;padding:4px 11px}
.pv-note{text-align:center;font-size:.85rem;color:#8A93A8;margin:14px auto 0;max-width:560px}
@media(max-width:480px){.pv-navn,.pv-pris{font-size:15px}.pv-sub,.pv-detalj{font-size:11.5px}.pv-rad{padding:13px 15px}}
@media (prefers-reduced-motion: reduce){.pv-rad{transition:none}}

/* ===== 31.07.2026 — Mobil-hero 2.0 (Amins tlf-runde med kompis) =====
   Alt midtstilt: kampanjepille -> eyebrow -> H1 (Clash Grotesk 600, større) ->
   Google-rating -> Start-knappen UNDER ratingen. Kun telefon/nettbrett. */
@media (max-width:1199px){
  .hero-night-inner{display:flex;flex-direction:column;align-items:center;text-align:center}
  .hero-night-inner .kamp-pill{order:1;margin-inline:auto}
  .hero-night-inner .hero-eyebrow{order:2}
  .hero.hero-night.hero-animated h1{order:3;font-family:'Clash Grotesk','Geist',-apple-system,sans-serif;
    font-weight:600;font-size:clamp(31px,8.8vw,42px);line-height:1.08;letter-spacing:-.015em;text-align:center}
  .hero-night-inner .hero-trust{order:4}
  .hero-night-inner .hero-actions{order:5;margin-top:18px;width:100%}
}

/* Video-svevebildet (Premium Auto) i tj-lista fjernet 28. aug 2026 — kortene er rene tekstkort */