/* Edbergs Produktionsteknik v3.3
   Gemensam stylesheet för samtliga sidor. */

html { scroll-behavior: smooth; }

/* Startsida */
body.page-index {
--bg: #0b0e10;
      --bg-soft: #111519;
      --surface: #171c20;
      --surface-2: #1d2328;
      --steel: #9ba4ab;
      --steel-light: #dce1e4;
      --text: #f4f5f6;
      --muted: #a2aab0;
      --muted-2: #7e878e;
      --orange: #ff4b00;
      --orange-2: #ff6a1a;
      --red: #c71318;
      --line: rgba(255,255,255,.10);
      --line-strong: rgba(255,255,255,.18);
      --shadow: 0 28px 80px rgba(0,0,0,.30);
      --max: 1160px;
}
body.page-index, body.page-index * {
box-sizing: border-box;
}
body.page-index {
margin: 0;
      font-family: "Segoe UI Variable", "Segoe UI", Arial, sans-serif;
      color: var(--text);
      background:
        radial-gradient(circle at 82% 12%, rgba(255,75,0,.07), transparent 28rem),
        linear-gradient(180deg, #0b0e10 0%, #0d1114 100%);
      line-height: 1.65;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
}
body.page-index a {
color: inherit;
}
body.page-index img {
max-width: 100%; display: block;
}
body.page-index ::selection {
background: var(--orange); color: #0a0c0e;
}
body.page-index .container {
width: min(calc(100% - 48px), var(--max));
      margin-inline: auto;
}
body.page-index .site-header {
position: sticky;
      top: 0;
      z-index: 50;
      background: rgba(28,33,37,.94);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      border-bottom: 1px solid var(--line);
}
body.page-index .nav {
min-height: 84px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
}
body.page-index .brand {
display: inline-flex;
      align-items: center;
      gap: 14px;
      text-decoration: none;
      min-width: 0;
}
body.page-index .brand-mark {
width: 52px;
      height: 62px;
      object-fit: contain;
      flex: 0 0 auto;
      filter: drop-shadow(0 6px 12px rgba(0,0,0,.25));
}
body.page-index .brand-text {
line-height: 1;
      letter-spacing: .02em;
      white-space: nowrap;
}
body.page-index .brand-text strong {
display: block;
      font-size: 21px;
      letter-spacing: .10em;
      font-weight: 800;
}
body.page-index .brand-text span {
display: block;
      margin-top: 6px;
      color: var(--orange);
      font-size: 13px;
      letter-spacing: .18em;
      font-weight: 800;
}
body.page-index .nav-links {
display: flex;
      align-items: center;
      gap: 28px;
      font-size: 14px;
      font-weight: 600;
}
body.page-index .nav-links a {
text-decoration: none;
      color: #c0c6ca;
      transition: color .2s ease;
}
body.page-index .nav-links a:hover {
color: #fff;
}
body.page-index .nav-cta {
padding: 9px 14px;
      border: 1px solid rgba(255,75,0,.55);
      border-radius: 7px;
      color: #fff !important;
      background: rgba(255,75,0,.08);
}
body.page-index .hero {
position: relative;
      overflow: hidden;
      border-bottom: 1px solid var(--line);
}
body.page-index .hero::before {
content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
      background-size: 44px 44px;
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 90%);
}
body.page-index .hero::after {
content: "";
      position: absolute;
      width: 720px;
      height: 720px;
      right: -340px;
      top: -260px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(255,75,0,.14), rgba(255,75,0,0) 68%);
      pointer-events: none;
}
body.page-index .hero-inner {
position: relative;
      z-index: 1;
      min-height: 680px;
      display: grid;
      grid-template-columns: minmax(0, 1.08fr) minmax(400px, .92fr);
      align-items: center;
      gap: 64px;
      padding-block: 86px 92px;
}
body.page-index .eyebrow {
display: inline-flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 22px;
      color: #d7dbde;
      font-size: 16px;
      font-weight: 800;
      letter-spacing: .16em;
      text-transform: uppercase;
}
body.page-index .eyebrow::before {
content: "";
      width: 42px;
      height: 2px;
      background: var(--orange);
      box-shadow: 40px 0 0 -0.25px var(--red);
}
body.page-index h1,
body.page-index h2,
body.page-index h3 {
letter-spacing: -.025em;
}
body.page-index h1 {
max-width: 760px;
      margin: 0;
      font-size: clamp(40px, 5.3vw, 64px);
      line-height: .98;
      font-weight: 760;
}
body.page-index .hero h1 em {
position: relative;
      color: inherit;
      font-style: normal;
      white-space: nowrap;
}
body.page-index .hero h1 em::after {
content: "";
      position: absolute;
      left: .02em;
      right: -.02em;
      bottom: .02em;
      height: .09em;
      border-radius: 99px;
      background: var(--orange);
      opacity: .95;
      transform: skewX(-18deg);
      z-index: -1;
}
body.page-index .hero-copy {
max-width: 690px;
      margin: 28px 0 0;
      color: #b8c0c5;
      font-size: 19px;
}
body.page-index .hero-actions {
display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 34px;
}
body.page-index .btn {
display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 48px;
      padding: 12px 19px;
      border: 1px solid transparent;
      border-radius: 8px;
      text-decoration: none;
      font-weight: 750;
      transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
body.page-index .btn:hover {
transform: translateY(-2px);
}
body.page-index .btn-primary {
background: var(--orange); color: #101214; box-shadow: 0 14px 32px rgba(255,75,0,.18);
}
body.page-index .btn-primary:hover {
background: var(--orange-2);
}
body.page-index .btn-secondary {
border-color: var(--line-strong); color: #e7e9ea; background: rgba(255,255,255,.025);
}
body.page-index .btn-secondary:hover {
border-color: rgba(255,255,255,.30); background: rgba(255,255,255,.055);
}
body.page-index .hero-note {
margin-top: 38px;
      padding-left: 16px;
      border-left: 2px solid rgba(255,75,0,.75);
      max-width: 560px;
      color: #8e989f;
      font-size: 14px;
}
body.page-index .hero-visual {
position: relative;
      min-height: 500px;
      display: grid;
      place-items: center;
      isolation: isolate;
}
body.page-index .hero-visual::before {
content: "";
      position: absolute;
      inset: 9% 2% 7% 8%;
      border: 1px solid rgba(255,255,255,.09);
      border-radius: 34px;
      background:
        linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.01) 48%, rgba(255,75,0,.045)),
        #12171a;
      box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.05);
      transform: perspective(1000px) rotateY(-5deg) rotateX(2deg);
      z-index: -2;
}
body.page-index .hero-visual::after {
content: "";
      position: absolute;
      width: 64%;
      height: 9px;
      bottom: 10%;
      border-radius: 50%;
      background: rgba(0,0,0,.55);
      filter: blur(15px);
      z-index: -1;
}
body.page-index .hero-e {
width: min(420px, 88%);
      max-height: 500px;
      object-fit: contain;
      transform: translateY(3px);
      filter: drop-shadow(0 28px 28px rgba(0,0,0,.30));
      animation: floatIn .85s cubic-bezier(.2,.75,.25,1) both;
}
body.page-index .visual-tag {
display: none;
}
body.page-index .visual-tag strong {
display: block;
}
body.page-index .visual-tag span {
color: #99a2a8; font-size: 13px;
}
body.page-index section {
padding: 92px 0;
}
body.page-index .section-dark {
background: #0d1114;
}
body.page-index .section-surface {
background: #12171a; border-block: 1px solid var(--line);
}
body.page-index .section-heading {
display: grid;
      grid-template-columns: .8fr 1.2fr;
      gap: 42px;
      align-items: end;
      margin-bottom: 42px;
}
body.page-index .kicker {
margin: 0 0 12px;
      color: var(--orange);
      font-size: 16px;
      font-weight: 800;
      letter-spacing: .16em;
      text-transform: uppercase;
}
body.page-index h2 {
margin: 0;
      font-size: clamp(34px, 4vw, 48px);
      line-height: 1.08;
      font-weight: 730;
}
body.page-index .lead {
margin: 0;
      color: var(--muted);
      font-size: 17px;
}
body.page-index .cards {
display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
}
body.page-index .card {
position: relative;
      min-height: 285px;
      padding: 28px 27px 26px;
      border: 1px solid var(--line);
      border-radius: 13px;
      background: linear-gradient(160deg, #181e22 0%, #13181b 100%);
      overflow: hidden;
      transition: transform .22s ease, border-color .22s ease, background .22s ease;
}
body.page-index .card::before {
content: "";
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 3px;
      background: linear-gradient(90deg, var(--orange), rgba(255,75,0,0) 68%);
      opacity: .9;
}
body.page-index .card:hover {
transform: translateY(-4px);
      border-color: rgba(255,75,0,.28);
      background: linear-gradient(160deg, #1b2226 0%, #151a1e 100%);
}
body.page-index .card-index {
display: none;
}
body.page-index .card h3 {
margin: 0 0 12px;
      font-size: 22px;
      font-weight: 700;
}
body.page-index .card p {
margin: 0; color: #9ca5ab;
}
body.page-index .work-grid {
display: grid;
      grid-template-columns: .83fr 1.17fr;
      gap: 76px;
      align-items: start;
}
body.page-index .work-copy {
position: sticky;
      top: 118px;
}
body.page-index .work-copy .lead {
margin-top: 18px;
}
body.page-index .steps {
display: grid; gap: 12px;
}
body.page-index .step {
display: grid;
      grid-template-columns: 52px 1fr;
      gap: 16px;
      align-items: start;
      padding: 22px 23px;
      border: 1px solid var(--line);
      border-radius: 11px;
      background: rgba(255,255,255,.018);
}
body.page-index .step-number {
width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border: 1px solid rgba(255,75,0,.40);
      border-radius: 8px;
      color: var(--orange);
      font-weight: 800;
      font-family: Consolas, "Courier New", monospace;
}
body.page-index .step strong {
display: block; margin-bottom: 3px; font-size: 17px;
}
body.page-index .step p {
margin: 0; color: #949da3;
}
body.page-index .about-grid {
display: grid;
      grid-template-columns: .78fr 1.22fr;
      gap: 74px;
      align-items: center;
}
body.page-index .about-signature {
position: relative;
      padding: 30px;
      border-radius: 16px;
      background: linear-gradient(145deg, #f7f7f5, #dfe3e5);
      box-shadow: 0 28px 70px rgba(0,0,0,.26);
      overflow: hidden;
}
body.page-index .about-signature::after {
content: "";
      position: absolute;
      width: 180px;
      height: 180px;
      right: -100px;
      bottom: -95px;
      border-radius: 50%;
      background: rgba(255,75,0,.13);
}
body.page-index .about-signature img {
position: relative;
      z-index: 1;
      width: 100%;
      height: auto;
}
body.page-index .about-copy p {
margin: 18px 0 0; color: #a7afb4;
}
body.page-index .about-copy .lead {
color: #c0c6ca; font-size: 18px;
}
body.page-index .contact {
position: relative;
      overflow: hidden;
      background:
        linear-gradient(135deg, rgba(255,75,0,.13), transparent 36%),
        #0a0d0f;
}
body.page-index .contact::after {
content: "";
      position: absolute;
      right: -120px;
      top: 50%;
      width: 520px;
      height: 520px;
      transform: translateY(-50%);
      border-radius: 50%;
      border: 1px solid rgba(255,75,0,.15);
      box-shadow:
        0 0 0 70px rgba(255,75,0,.028),
        0 0 0 140px rgba(255,75,0,.018);
      pointer-events: none;
}
body.page-index .contact-grid {
position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: 1.05fr .95fr;
      gap: 70px;
      align-items: center;
}
body.page-index .contact .lead {
margin-top: 16px; max-width: 680px;
}
body.page-index .about-actions {
margin-top: 28px;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
}
body.page-index .btn-recruit {
border-color: rgba(255,75,0,.48);
      color: #f2f4f5;
      background: rgba(255,75,0,.055);
}
body.page-index .btn-recruit:hover {
border-color: rgba(255,75,0,.78);
      background: rgba(255,75,0,.11);
}
body.page-index .contact-box {
padding: 25px;
      border: 1px solid rgba(255,255,255,.14);
      border-radius: 12px;
      background: rgba(255,255,255,.035);
      box-shadow: 0 22px 60px rgba(0,0,0,.18);
}
body.page-index .contact-label {
margin-bottom: 15px;
      color: var(--orange);
      font-size: 15px;
      font-weight: 800;
      letter-spacing: .15em;
      text-transform: uppercase;
}
body.page-index .contact-key {
color: var(--orange);
      font-weight: 700;
}
body.page-index .contact-box strong {
display: block; margin-bottom: 13px; font-size: 19px;
}
body.page-index .contact-box a {
text-decoration: none;
      color: #edf0f1;
      border-bottom: 1px solid rgba(255,255,255,.22);
}
body.page-index .contact-box a:hover {
border-color: var(--orange);
}
body.page-index footer {
padding: 28px 0 34px;
      border-top: 1px solid var(--line);
      background: #080b0d;
      color: #727b82;
      font-size: 13px;
}
body.page-index .footer-inner {
display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
}
body.page-index .footer-accent {
color: #969fa5;
}
@keyframes floatIn {
      from { opacity: 0; transform: translateY(24px) scale(.97); }
      to { opacity: 1; transform: translateY(3px) scale(1); }
    }
@media (prefers-reduced-motion: reduce) {
body.page-index, body.page-index * {
scroll-behavior: auto !important; animation: none !important; transition: none !important;
}
}
@media (max-width: 960px) {
body.page-index .hero-inner {
grid-template-columns: 1fr;
        gap: 28px;
        padding-block: 70px 78px;
}
body.page-index .hero-visual {
min-height: 430px;
}
body.page-index .hero-e {
width: min(360px, 74vw);
}
body.page-index .visual-tag {
right: 6%;
}
body.page-index .cards {
grid-template-columns: 1fr;
}
body.page-index .card {
min-height: 0;
}
body.page-index .card-index {
margin-bottom: 25px;
}
body.page-index .section-heading,
body.page-index .work-grid,
body.page-index .about-grid,
body.page-index .contact-grid {
grid-template-columns: 1fr; gap: 34px;
}
body.page-index .work-copy {
position: static;
}
body.page-index .about-signature {
max-width: 720px;
}
}
@media (max-width: 760px) {
body.page-index .container {
width: min(calc(100% - 34px), var(--max));
}
body.page-index .nav {
min-height: 72px;
}
body.page-index .nav-links a:not(.nav-cta) {
display: none;
}
body.page-index .brand-text strong {
font-size: 17px; letter-spacing: .08em;
}
body.page-index .brand-text span {
font-size: 10px;
}
body.page-index .brand-mark {
width: 42px; height: 50px;
}
body.page-index h1 {
font-size: clamp(36px, 11vw, 54px);
}
body.page-index .hero-copy {
font-size: 17px;
}
body.page-index section {
padding: 72px 0;
}
body.page-index .hero-visual {
min-height: 360px;
}
body.page-index .hero-visual::before {
inset: 8% 0 8% 0;
}
body.page-index .visual-tag {
width: 76%; right: 0; bottom: 2%;
}
body.page-index .step {
grid-template-columns: 46px 1fr; padding: 19px;
}
body.page-index .step-number {
width: 38px; height: 38px;
}
body.page-index .footer-inner {
display: block;
}
body.page-index .footer-inner > div + div {
margin-top: 7px;
}
}
/* V2.7 – sammanhängande teknisk bakgrund */
body.page-index {
position: relative;
      background:
        radial-gradient(ellipse at 92% 7%, rgba(255,75,0,.095), transparent 31rem),
        radial-gradient(ellipse at 7% 39%, rgba(255,255,255,.018), transparent 34rem),
        radial-gradient(ellipse at 91% 57%, rgba(255,75,0,.072), transparent 34rem),
        radial-gradient(ellipse at 13% 78%, rgba(255,75,0,.052), transparent 30rem),
        radial-gradient(ellipse at 82% 94%, rgba(255,75,0,.060), transparent 34rem),
        linear-gradient(180deg, #0a0d0f 0%, #0d1215 48%, #090c0e 100%);
      background-attachment: fixed;
}
body.page-index::before {
content: "";
      position: fixed;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.020) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
      background-size: 52px 52px;
      opacity: .52;
      -webkit-mask-image: linear-gradient(to bottom,
        rgba(0,0,0,.40) 0%,
        rgba(0,0,0,.18) 22%,
        rgba(0,0,0,.32) 48%,
        rgba(0,0,0,.14) 70%,
        rgba(0,0,0,.42) 100%);
      mask-image: linear-gradient(to bottom,
        rgba(0,0,0,.40) 0%,
        rgba(0,0,0,.18) 22%,
        rgba(0,0,0,.32) 48%,
        rgba(0,0,0,.14) 70%,
        rgba(0,0,0,.42) 100%);
}
body.page-index main,
body.page-index footer {
position: relative; z-index: 1;
}
body.page-index .site-header {
position: sticky; top: 0; z-index: 50;
}
body.page-index .hero {
background: linear-gradient(180deg, rgba(10,13,15,.92), rgba(11,15,18,.86));
}
body.page-index .section-dark,
body.page-index .section-surface {
position: relative;
      overflow: hidden;
}
body.page-index .section-dark {
background: linear-gradient(180deg, rgba(13,17,20,.86), rgba(10,14,17,.82));
}
body.page-index .section-surface {
background: linear-gradient(180deg, rgba(18,23,26,.88), rgba(14,19,22,.84));
}
body.page-index #tjanster::before,
body.page-index #arbetssatt::before,
body.page-index #om::before {
content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 0;
}
body.page-index #tjanster::before {
background:
        radial-gradient(ellipse at 88% 82%, rgba(255,75,0,.080), transparent 29rem),
        linear-gradient(115deg, transparent 0 64%, rgba(255,255,255,.012) 64.2%, transparent 64.6%);
}
body.page-index #arbetssatt::before {
background:
        radial-gradient(ellipse at 10% 48%, rgba(255,75,0,.060), transparent 29rem),
        radial-gradient(ellipse at 88% 78%, rgba(255,75,0,.042), transparent 25rem),
        radial-gradient(ellipse at 86% 18%, rgba(185,195,201,.025), transparent 22rem);
}
body.page-index #om::before {
background:
        radial-gradient(ellipse at 82% 14%, rgba(255,75,0,.085), transparent 30rem),
        linear-gradient(68deg, transparent 0 72%, rgba(255,255,255,.012) 72.2%, transparent 72.6%);
}
body.page-index #tjanster > .container,
body.page-index #arbetssatt > .container,
body.page-index #om > .container {
position: relative; z-index: 1;
}
body.page-index .card {
background: linear-gradient(160deg, rgba(24,30,34,.93) 0%, rgba(19,24,27,.91) 100%);
      box-shadow: 0 20px 55px rgba(0,0,0,.12);
}
body.page-index .step {
background: linear-gradient(145deg, rgba(255,255,255,.026), rgba(255,255,255,.012));
      box-shadow: 0 16px 45px rgba(0,0,0,.08);
}
body.page-index .contact {
background:
        linear-gradient(135deg, rgba(255,75,0,.135), transparent 36%),
        radial-gradient(ellipse at 88% 55%, rgba(255,75,0,.055), transparent 29rem),
        rgba(10,13,15,.91);
}
body.page-index footer {
background: rgba(8,11,13,.95);
}
@media (max-width: 760px) {
body.page-index::before {
background-size: 38px 38px; opacity: .38;
}
body.page-index #tjanster::before,
body.page-index #arbetssatt::before,
body.page-index #om::before {
opacity: .8;
}
}

/* Medarbetare / Jobba hos oss */
body.page-team {
--bg: #0b0e10;
      --surface: #12171a;
      --surface-2: #0f1316;
      --text: #f1f3f4;
      --muted: #a7b0b6;
      --line: rgba(255,255,255,.10);
      --line-strong: rgba(255,255,255,.18);
      --orange: #ff4b00;
      --orange-2: #ff6a1a;
      --max: 1160px;
}
body.page-team, body.page-team * {
box-sizing: border-box;
}
body.page-team {
margin: 0;
      background: var(--bg);
      color: var(--text);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height: 1.6;
}
body.page-team .container {
width: min(var(--max), calc(100% - 48px)); margin: 0 auto;
}
body.page-team .site-header {
border-bottom: 1px solid var(--line); background: rgba(11,14,16,.94); position: sticky; top: 0; z-index: 20; backdrop-filter: blur(14px);
}
body.page-team .nav {
min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 30px;
}
body.page-team .brand {
display: inline-flex; align-items: center; gap: 14px; text-decoration: none; color: #fff;
}
body.page-team .brand-mark {
width: 52px; height: 62px; object-fit: contain;
}
body.page-team .brand-text strong {
display:block; font-size:21px; letter-spacing:.10em; font-weight:800;
}
body.page-team .brand-text span {
display:block; margin-top:6px; color:var(--orange); font-size:13px; letter-spacing:.18em; font-weight:800;
}
body.page-team .nav-links {
display:flex; align-items:center; gap:28px; font-size:14px; font-weight:600;
}
body.page-team .nav-links a {
color:#c0c6ca; text-decoration:none;
}
body.page-team .nav-links a:hover {
color:#fff;
}
body.page-team .nav-links a.nav-active {
color:var(--orange);
}
body.page-team .nav-cta {
padding:9px 14px; border:1px solid rgba(255,75,0,.55); border-radius:7px; color:#fff !important; background:rgba(255,75,0,.08);
}
body.page-team .page-hero {
padding: 92px 0 60px; border-bottom:1px solid var(--line); background: radial-gradient(circle at 82% 8%, rgba(255,75,0,.12), transparent 34%);
}
body.page-team .kicker {
margin:0 0 12px; color:var(--orange); font-size:16px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
}
body.page-team h1,
body.page-team h2,
body.page-team h3 {
letter-spacing:-.025em;
}
body.page-team h1 {
margin:0; max-width:850px; font-size:clamp(44px,6vw,72px); line-height:1.02;
}
body.page-team .lead {
max-width:820px; margin:22px 0 0; color:#b8c0c5; font-size:19px;
}
body.page-team main section {
padding:72px 0;
}
body.page-team .section-surface {
background:var(--surface); border-block:1px solid var(--line);
}
body.page-team .btn {
display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 17px; border:1px solid var(--line-strong); border-radius:8px; color:#edf0f1; text-decoration:none; font-weight:750; background:rgba(255,255,255,.025);
}
body.page-team .btn:hover {
border-color:rgba(255,255,255,.32); background:rgba(255,255,255,.055);
}
body.page-team .btn-primary {
background:var(--orange); color:#101214; border-color:transparent;
}
body.page-team .btn-primary:hover {
background:var(--orange-2);
}
body.page-team footer {
padding:28px 0 34px; border-top:1px solid var(--line); color:#727b82; font-size:13px; background:#080b0d;
}
body.page-team .footer-inner {
display:flex; justify-content:space-between; gap:20px;
}
body.page-team .footer-accent {
color:#969fa5;
}
@media (max-width: 840px) {
body.page-team .container {
width:min(var(--max), calc(100% - 30px));
}
body.page-team .nav-links a:not(.nav-cta) {
display:none;
}
body.page-team .brand-mark {
width:42px; height:50px;
}
body.page-team .brand-text strong {
font-size:17px;
}
body.page-team .brand-text span {
font-size:10px;
}
body.page-team .page-hero {
padding-top:68px;
}
body.page-team h1 {
font-size:clamp(38px,12vw,58px);
}
body.page-team .footer-inner {
display:block;
}
body.page-team .footer-inner > div + div {
margin-top:7px;
}
}
body.page-team .notice {
margin-top:28px; padding:16px 18px; border-left:2px solid var(--orange); background:rgba(255,75,0,.055); color:#b8c0c5; border-radius:0 8px 8px 0;
}
body.page-team .team-grid {
display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; max-width:960px;
}
body.page-team .single-team {
grid-template-columns:minmax(0,470px); max-width:470px;
}
body.page-team .position-card {
border-color:rgba(255,75,0,.24); background:linear-gradient(145deg,rgba(255,75,0,.055),rgba(255,255,255,.012));
}
body.page-team .vacancy-avatar {
color:var(--orange); font-size:36px; font-weight:700;
}
body.page-team .position-badge {
display:inline-flex; width:max-content; margin-top:18px; padding:4px 8px; border:1px solid rgba(255,75,0,.42); border-radius:99px; color:#ff8a55; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
body.page-team .person-card {
min-height:100%; padding:26px; border:1px solid var(--line); border-radius:14px; background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015)); display:flex; flex-direction:column;
}
body.page-team .avatar {
width:78px; height:78px; display:grid; place-items:center; border:1px solid rgba(255,75,0,.45); border-radius:14px; background:#171d20; color:var(--orange); font-size:26px; font-weight:850; letter-spacing:.04em;
}
body.page-team .demo-badge {
display:inline-flex; width:max-content; margin-top:18px; padding:4px 8px; border:1px solid rgba(255,75,0,.42); border-radius:99px; color:#ff8a55; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
body.page-team .person-card h2 {
margin:22px 0 4px; font-size:28px;
}
body.page-team .role {
margin:0; color:#d3d8db; font-weight:700;
}
body.page-team .summary {
margin:16px 0 0; color:var(--muted);
}
body.page-team .tags {
display:flex; flex-wrap:wrap; gap:7px; margin:20px 0 24px;
}
body.page-team .tag {
padding:5px 8px; border:1px solid var(--line); border-radius:6px; color:#9fa8ae; font-size:12px;
}
body.page-team .person-card .btn {
margin-top:auto; align-self:flex-start;
}
@media (max-width:960px) {
body.page-team .team-grid {
grid-template-columns:1fr 1fr; max-width:none;
}
}
@media (max-width:640px) {
body.page-team .team-grid {
grid-template-columns:1fr;
}
}
/* V2.7 – sammanhängande teknisk bakgrund */
body.page-team {
position: relative;
      background:
        radial-gradient(ellipse at 90% 7%, rgba(255,75,0,.090), transparent 30rem),
        radial-gradient(ellipse at 8% 46%, rgba(255,255,255,.018), transparent 32rem),
        radial-gradient(ellipse at 88% 76%, rgba(255,75,0,.045), transparent 30rem),
        linear-gradient(180deg, #0a0d0f 0%, #0d1215 52%, #090c0e 100%);
      background-attachment: fixed;
}
body.page-team::before {
content: "";
      position: fixed;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.020) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
      background-size: 52px 52px;
      opacity: .50;
      -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.16) 35%, rgba(0,0,0,.28) 68%, rgba(0,0,0,.40));
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.16) 35%, rgba(0,0,0,.28) 68%, rgba(0,0,0,.40));
}
body.page-team main,
body.page-team footer {
position: relative; z-index: 1;
}
body.page-team .site-header {
position: sticky; top: 0; z-index: 50;
}
body.page-team .page-hero {
position: relative;
      overflow: hidden;
      background:
        radial-gradient(ellipse at 82% 8%, rgba(255,75,0,.12), transparent 34%),
        linear-gradient(180deg, rgba(11,14,16,.90), rgba(12,16,19,.84));
}
body.page-team .page-hero::before {
content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
      background-size: 46px 46px;
      -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 92%);
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 92%);
}
body.page-team .page-hero > .container {
position: relative; z-index: 1;
}
body.page-team main > section:not(.page-hero) {
position: relative;
      overflow: hidden;
      background: linear-gradient(180deg, rgba(17,22,25,.86), rgba(11,15,18,.82));
}
body.page-team main > section:not(.page-hero)::before {
content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(ellipse at 92% 30%, rgba(255,75,0,.040), transparent 27rem),
        radial-gradient(ellipse at 8% 88%, rgba(255,75,0,.025), transparent 25rem);
}
body.page-team main > section:not(.page-hero) > .container {
position: relative; z-index: 1;
}
body.page-team .person-card,
body.page-team .skill-list li {
background: linear-gradient(145deg, rgba(24,30,34,.88), rgba(17,22,25,.78));
      box-shadow: 0 18px 50px rgba(0,0,0,.10);
}
body.page-team .profile-avatar,
body.page-team .avatar {
background: linear-gradient(145deg, rgba(28,34,38,.96), rgba(19,24,27,.96));
      box-shadow: inset 0 1px rgba(255,255,255,.035), 0 16px 45px rgba(0,0,0,.12);
}
body.page-team footer {
background: rgba(8,11,13,.95);
}
@media (max-width: 760px) {
body.page-team::before {
background-size: 38px 38px; opacity: .36;
}
}

/* Profil / Annonsdetalj */
body.page-profile {
--bg: #0b0e10;
      --surface: #12171a;
      --surface-2: #0f1316;
      --text: #f1f3f4;
      --muted: #a7b0b6;
      --line: rgba(255,255,255,.10);
      --line-strong: rgba(255,255,255,.18);
      --orange: #ff4b00;
      --orange-2: #ff6a1a;
      --max: 1160px;
}
body.page-profile, body.page-profile * {
box-sizing: border-box;
}
body.page-profile {
margin: 0;
      background: var(--bg);
      color: var(--text);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height: 1.6;
}
body.page-profile .container {
width: min(var(--max), calc(100% - 48px)); margin: 0 auto;
}
body.page-profile .site-header {
border-bottom: 1px solid var(--line); background: rgba(11,14,16,.94); position: sticky; top: 0; z-index: 20; backdrop-filter: blur(14px);
}
body.page-profile .nav {
min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 30px;
}
body.page-profile .brand {
display: inline-flex; align-items: center; gap: 14px; text-decoration: none; color: #fff;
}
body.page-profile .brand-mark {
width: 52px; height: 62px; object-fit: contain;
}
body.page-profile .brand-text strong {
display:block; font-size:21px; letter-spacing:.10em; font-weight:800;
}
body.page-profile .brand-text span {
display:block; margin-top:6px; color:var(--orange); font-size:13px; letter-spacing:.18em; font-weight:800;
}
body.page-profile .nav-links {
display:flex; align-items:center; gap:28px; font-size:14px; font-weight:600;
}
body.page-profile .nav-links a {
color:#c0c6ca; text-decoration:none;
}
body.page-profile .nav-links a:hover {
color:#fff;
}
body.page-profile .nav-links a.nav-active {
color:var(--orange);
}
body.page-profile .nav-cta {
padding:9px 14px; border:1px solid rgba(255,75,0,.55); border-radius:7px; color:#fff !important; background:rgba(255,75,0,.08);
}
body.page-profile .page-hero {
padding: 92px 0 60px; border-bottom:1px solid var(--line); background: radial-gradient(circle at 82% 8%, rgba(255,75,0,.12), transparent 34%);
}
body.page-profile .kicker {
margin:0 0 12px; color:var(--orange); font-size:16px; font-weight:800; letter-spacing:.16em; text-transform:uppercase;
}
body.page-profile h1,
body.page-profile h2,
body.page-profile h3 {
letter-spacing:-.025em;
}
body.page-profile h1 {
margin:0; max-width:850px; font-size:clamp(44px,6vw,72px); line-height:1.02;
}
body.page-profile .lead {
max-width:820px; margin:22px 0 0; color:#b8c0c5; font-size:19px;
}
body.page-profile main section {
padding:72px 0;
}
body.page-profile .section-surface {
background:var(--surface); border-block:1px solid var(--line);
}
body.page-profile .btn {
display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 17px; border:1px solid var(--line-strong); border-radius:8px; color:#edf0f1; text-decoration:none; font-weight:750; background:rgba(255,255,255,.025);
}
body.page-profile .btn:hover {
border-color:rgba(255,255,255,.32); background:rgba(255,255,255,.055);
}
body.page-profile .btn-primary {
background:var(--orange); color:#101214; border-color:transparent;
}
body.page-profile .btn-primary:hover {
background:var(--orange-2);
}
body.page-profile footer {
padding:28px 0 34px; border-top:1px solid var(--line); color:#727b82; font-size:13px; background:#080b0d;
}
body.page-profile .footer-inner {
display:flex; justify-content:space-between; gap:20px;
}
body.page-profile .footer-accent {
color:#969fa5;
}
@media (max-width: 840px) {
body.page-profile .container {
width:min(var(--max), calc(100% - 30px));
}
body.page-profile .nav-links a:not(.nav-cta) {
display:none;
}
body.page-profile .brand-mark {
width:42px; height:50px;
}
body.page-profile .brand-text strong {
font-size:17px;
}
body.page-profile .brand-text span {
font-size:10px;
}
body.page-profile .page-hero {
padding-top:68px;
}
body.page-profile h1 {
font-size:clamp(38px,12vw,58px);
}
body.page-profile .footer-inner {
display:block;
}
body.page-profile .footer-inner > div + div {
margin-top:7px;
}
}
body.page-profile .profile-hero {
display:grid; grid-template-columns:150px 1fr; gap:34px; align-items:center;
}
body.page-profile .profile-avatar {
width:140px; height:140px; display:grid; place-items:center; border:1px solid rgba(255,75,0,.45); border-radius:20px; background:#171d20; color:var(--orange); font-size:42px; font-weight:850;
}
body.page-profile .profile-role {
margin:10px 0 0; color:#c7cdd1; font-size:20px; font-weight:700;
}
body.page-profile .profile-grid {
display:grid; grid-template-columns:1.1fr .9fr; gap:54px;
}
body.page-profile .profile-grid h2 {
margin:0 0 16px; font-size:30px;
}
body.page-profile .profile-grid p {
color:var(--muted);
}
body.page-profile .skill-list {
display:grid; gap:10px; margin:0; padding:0; list-style:none;
}
body.page-profile .skill-list li {
padding:13px 15px; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,.025);
}
body.page-profile .back {
margin-top:28px;
}
body.page-profile .profile-links {
display:flex; gap:10px; flex-wrap:wrap;
}
body.page-profile .demo-note {
margin:22px 0 0; padding:14px 16px; border-left:2px solid var(--orange); background:rgba(255,75,0,.055); color:#b8c0c5;
}
@media (max-width:760px) {
body.page-profile .profile-hero {
grid-template-columns:1fr
}
body.page-profile .profile-grid {
grid-template-columns:1fr
}
body.page-profile .profile-avatar {
width:110px;height:110px
}
}
/* V2.7 – sammanhängande teknisk bakgrund */
body.page-profile {
position: relative;
      background:
        radial-gradient(ellipse at 90% 7%, rgba(255,75,0,.090), transparent 30rem),
        radial-gradient(ellipse at 8% 46%, rgba(255,255,255,.018), transparent 32rem),
        radial-gradient(ellipse at 88% 76%, rgba(255,75,0,.045), transparent 30rem),
        linear-gradient(180deg, #0a0d0f 0%, #0d1215 52%, #090c0e 100%);
      background-attachment: fixed;
}
body.page-profile::before {
content: "";
      position: fixed;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.020) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px);
      background-size: 52px 52px;
      opacity: .50;
      -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.16) 35%, rgba(0,0,0,.28) 68%, rgba(0,0,0,.40));
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,.16) 35%, rgba(0,0,0,.28) 68%, rgba(0,0,0,.40));
}
body.page-profile main,
body.page-profile footer {
position: relative; z-index: 1;
}
body.page-profile .site-header {
position: sticky; top: 0; z-index: 50;
}
body.page-profile .page-hero {
position: relative;
      overflow: hidden;
      background:
        radial-gradient(ellipse at 82% 8%, rgba(255,75,0,.12), transparent 34%),
        linear-gradient(180deg, rgba(11,14,16,.90), rgba(12,16,19,.84));
}
body.page-profile .page-hero::before {
content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
      background-size: 46px 46px;
      -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 92%);
      mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 92%);
}
body.page-profile .page-hero > .container {
position: relative; z-index: 1;
}
body.page-profile main > section:not(.page-hero) {
position: relative;
      overflow: hidden;
      background: linear-gradient(180deg, rgba(17,22,25,.86), rgba(11,15,18,.82));
}
body.page-profile main > section:not(.page-hero)::before {
content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(ellipse at 92% 30%, rgba(255,75,0,.040), transparent 27rem),
        radial-gradient(ellipse at 8% 88%, rgba(255,75,0,.025), transparent 25rem);
}
body.page-profile main > section:not(.page-hero) > .container {
position: relative; z-index: 1;
}
body.page-profile .person-card,
body.page-profile .skill-list li {
background: linear-gradient(145deg, rgba(24,30,34,.88), rgba(17,22,25,.78));
      box-shadow: 0 18px 50px rgba(0,0,0,.10);
}
body.page-profile .profile-avatar,
body.page-profile .avatar {
background: linear-gradient(145deg, rgba(28,34,38,.96), rgba(19,24,27,.96));
      box-shadow: inset 0 1px rgba(255,255,255,.035), 0 16px 45px rgba(0,0,0,.12);
}
body.page-profile footer {
background: rgba(8,11,13,.95);
}
@media (max-width: 760px) {
body.page-profile::before {
background-size: 38px 38px; opacity: .36;
}
}

/* Gemensam headerfärg – samma på hela webbplatsen. */
body.page-index .site-header,
body.page-team .site-header,
body.page-profile .site-header {
  background: rgba(28,33,37,.94);
}