:root{
      --bg:#1C1B22;
      --surface:#26252E;
      --card:#2F2D39;

      --primary:#7A5CFF;
      --primaryHover:#927CFF;
      --primaryActive:#5E44E8;

      --secondary:#7FAF9B;
      --secondaryHover:#96C5B0;

      --text:#F2F1F7;
      --text2:#B7B4C9;
      --muted:#8A8799;

      --ring: rgba(122,92,255,.55);
      --glow: rgba(122,92,255,.25);
      --glow2: rgba(127,175,155,.18);

      --radius: 18px;
      --radius2: 24px;
      --shadow: 0 18px 60px rgba(0,0,0,.55);
      --shadow2: 0 12px 40px rgba(0,0,0,.45);

      --border: rgba(242,241,247,.08);
      --border2: rgba(242,241,247,.12);

      --max: 1120px;
    }

    *{ box-sizing:border-box; }
    html,body{ height:100%; }
    body{
      margin:0;
      font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
      background: var(--bg);
      color: var(--text);
      overflow-x:hidden;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
	.brandHero{

	display:flex;
	align-items:center;

	}

	.logoHero{

	height:64px;
	width:auto;

	display:block;

	filter: drop-shadow(0 10px 30px rgba(122,92,255,.35));

	transition: 0.3s;

	}

	.logoHero:hover{

	filter: drop-shadow(0 18px 60px rgba(122,92,255,.55));

	transform: translateY(-1px);

	}
    /* Controlled background: no harsh gradients, only soft “aurora” glows */
    .bg{
      position: fixed;
      inset: 0;
      z-index: -2;
      background: var(--bg);
    }
    .glow{
      position: fixed;
      inset: -20vh -20vw auto auto;
      width: 70vw;
      height: 70vw;
      background: radial-gradient(circle at 30% 30%, rgba(122,92,255,.26), transparent 60%);
      filter: blur(30px);
      z-index: -1;
      pointer-events:none;
    }
    .glow2{
      position: fixed;
      inset: auto auto -25vh -25vw;
      width: 70vw;
      height: 70vw;
      background: radial-gradient(circle at 60% 60%, rgba(127,175,155,.18), transparent 62%);
      filter: blur(34px);
      z-index: -1;
      pointer-events:none;
    }

    a{ color: inherit; }
    .wrap{
      max-width: var(--max);
      margin: 0 auto;
      padding: 28px 18px 64px;
    }

    /* Topbar */
    .topbar{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:16px;
      padding: 14px 0 26px;
    }
    .brand{
      display:flex;
      align-items:center;
      gap:12px;
      text-decoration:none;
    }
    .brandMark{
      width: 36px; height: 36px;
      border-radius: 12px;
      background: linear-gradient(135deg, rgba(122,92,255,.22), rgba(127,175,155,.14));
      border: 1px solid var(--border);
      box-shadow: 0 0 0 6px rgba(122,92,255,.06);
      display:grid;
      place-items:center;
      overflow:hidden;
    }
    .brandMark img{
      width: 100%;
      height: 100%;
      object-fit: contain;
      padding: 6px;
      display:block;
    }
    .brandText{
      display:flex;
      flex-direction:column;
      line-height:1.1;
    }
    .brandText strong{
      letter-spacing: .10em;
      font-size: 12px;
      text-transform: uppercase;
      color: var(--text);
      opacity: .92;
    }
    .brandText span{
      font-size: 12px;
      color: var(--muted);
      margin-top: 2px;
    }

    /* Hero */
    .hero{
      padding: 22px 0 10px;
      display:grid;
      grid-template-columns: 1.15fr .85fr;
      gap: 22px;
      align-items: stretch;
    }
    @media (max-width: 980px){
      .hero{ grid-template-columns: 1fr; }
    }

    .heroCard{
      position: relative;
      border-radius: var(--radius2);
      background: linear-gradient(180deg, rgba(47,45,57,.86), rgba(38,37,46,.66));
      border: 1px solid var(--border);
      box-shadow: var(--shadow);
      overflow:hidden;
    }
    .heroInner{
      padding: 34px 30px 28px;
    }
    @media (max-width: 640px){
      .heroInner{ padding: 26px 18px 20px; }
    }

    .kicker{
      display:inline-flex;
      align-items:center;
      gap:10px;
      padding: 8px 12px;
      border-radius: 999px;
      background: rgba(122,92,255,.10);
      border: 1px solid rgba(122,92,255,.20);
      color: var(--text2);
      font-size: 12px;
      letter-spacing:.06em;
      text-transform: uppercase;
    }

    h1{
      margin: 16px 0 10px;
      font-size: clamp(2.2rem, 4.8vw, 3.35rem);
      letter-spacing: -0.02em;
      line-height: 1.06;
    }
    .lead{
      margin: 0 0 18px;
      font-size: 1.08rem;
      line-height: 1.55;
      color: var(--text2);
      max-width: 62ch;
    }

    .ctaRow{
      display:flex;
      flex-wrap:wrap;
      gap: 12px;
      margin-top: 18px;
      align-items:center;
    }
    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      padding: 12px 16px;
      border-radius: 14px;
      text-decoration:none;
      border: 1px solid var(--border);
      background: rgba(38,37,46,.55);
      color: var(--text);
      transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
      user-select:none;
      cursor:pointer;
      font-weight: 600;
      letter-spacing:.02em;
    }
    .btn:hover{
      transform: translateY(-1px);
      border-color: var(--border2);
      box-shadow: 0 16px 44px rgba(0,0,0,.35);
      background: rgba(47,45,57,.62);
    }
    .btnPrimary{
      background: linear-gradient(135deg, rgba(122,92,255,.92), rgba(94,68,232,.92));
      border-color: rgba(122,92,255,.40);
      box-shadow: 0 0 0 6px rgba(122,92,255,.08), 0 18px 60px rgba(122,92,255,.18);
    }
    .btnPrimary:hover{
      background: linear-gradient(135deg, rgba(146,124,255,.95), rgba(94,68,232,.95));
      box-shadow: 0 0 0 6px rgba(122,92,255,.10), 0 18px 60px rgba(122,92,255,.22);
    }

    .metaRow{
      display:flex;
      flex-wrap:wrap;
      gap: 10px;
      margin-top: 18px;
      color: var(--muted);
      font-size: 12px;
    }
    .metaRow span{
      display:inline-flex;
      align-items:center;
      gap: 8px;
      padding: 8px 10px;
      border-radius: 999px;
      background: rgba(38,37,46,.45);
      border: 1px solid var(--border);
    }
    .metaRow i{
      display:inline-block;
      width: 8px; height: 8px;
      border-radius: 999px;
      background: rgba(242,241,247,.18);
    }

    /* Side panel card */
    .panel{
      border-radius: var(--radius2);
      background: linear-gradient(180deg, rgba(47,45,57,.68), rgba(38,37,46,.52));
      border: 1px solid var(--border);
      box-shadow: var(--shadow2);
      overflow:hidden;
    }
    .panelInner{
      padding: 24px 22px;
    }
    .panel h2{
      margin: 0 0 10px;
      font-size: 16px;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text);
      opacity: .92;
    }
    .panel p{
      margin: 0 0 14px;
      color: var(--text2);
      line-height: 1.55;
      font-size: 14px;
    }

    .list{
      display:flex;
      flex-direction:column;
      gap: 10px;
      margin-top: 12px;
    }
    .li{
      display:flex;
      gap: 12px;
      padding: 12px 12px;
      border-radius: 14px;
      background: rgba(47,45,57,.55);
      border: 1px solid var(--border);
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    }
    .li:hover{
      transform: translateY(-1px);
      border-color: var(--border2);
      box-shadow: 0 16px 44px rgba(0,0,0,.25);
    }
    .badge{
      width: 30px; height: 30px;
      border-radius: 12px;
      background: rgba(122,92,255,.12);
      border: 1px solid rgba(122,92,255,.20);
      display:grid;
      place-items:center;
      box-shadow: 0 0 0 6px rgba(122,92,255,.06);
      flex: 0 0 auto;
      color: var(--text);
      font-weight: 700;
      font-size: 12px;
    }
    .li strong{
      display:block;
      font-size: 13px;
      margin-bottom: 2px;
    }
    .li span{
      display:block;
      font-size: 12px;
      color: var(--muted);
      line-height: 1.45;
    }

    /* Sections */
    .section{
      margin-top: 22px;
      padding: 22px;
      border-radius: var(--radius2);
      background: rgba(38,37,46,.42);
      border: 1px solid var(--border);
      box-shadow: 0 10px 40px rgba(0,0,0,.24);
    }

    .sectionHead{
      display:flex;
      justify-content:space-between;
      align-items:flex-end;
      gap: 14px;
      margin-bottom: 14px;
      flex-wrap:wrap;
    }
    .sectionHead h3{
      margin:0;
      font-size: 18px;
      letter-spacing: .04em;
    }
    .sectionHead .hint{
      color: var(--muted);
      font-size: 12px;
    }

    .grid3{
      display:grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }
    @media (max-width: 980px){
      .grid3{ grid-template-columns: 1fr; }
    }

    .feat{
      border-radius: var(--radius);
      background: linear-gradient(180deg, rgba(47,45,57,.62), rgba(38,37,46,.50));
      border: 1px solid var(--border);
      padding: 16px 16px 14px;
      transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
      position: relative;
      overflow:hidden;
    }
    .feat:before{
      content:"";
      position:absolute;
      inset:-40% -40% auto auto;
      width: 220px;
      height: 220px;
      background: radial-gradient(circle at 30% 30%, rgba(122,92,255,.22), transparent 60%);
      filter: blur(20px);
      opacity:.7;
      pointer-events:none;
    }
    .feat:hover{
      transform: translateY(-2px);
      border-color: rgba(122,92,255,.28);
      box-shadow: 0 18px 56px rgba(0,0,0,.38), 0 0 0 6px rgba(122,92,255,.06);
    }
    .feat h4{
      margin: 0 0 8px;
      font-size: 14px;
      letter-spacing: .06em;
      text-transform: uppercase;
      color: var(--text);
      opacity: .95;
    }
    .feat p{
      margin:0;
      color: var(--text2);
      font-size: 13px;
      line-height: 1.55;
      max-width: 70ch;
    }

    .divider{
      height:1px;
      background: rgba(242,241,247,.08);
      margin: 18px 0;
    }

    /* Name story */
    .story{
      display:grid;
      grid-template-columns: 1fr;
      gap: 10px;
    }
    .story p{
      margin:0;
      color: var(--text2);
      line-height: 1.7;
      font-size: 14px;
      max-width: 92ch;
    }
    .story p strong{
      color: var(--text);
      font-weight: 700;
    }

    /* Footer */
    footer{
      max-width: var(--max);
      margin: 22px auto 0;
      padding: 18px 18px 30px;
      color: var(--muted);
      text-align:center;
      font-size: 12px;
    }
    footer a{
      color: var(--text2);
      text-decoration:none;
    }
    footer a:hover{ color: var(--text); }

    /* Utility */
    .srOnly{
      position:absolute !important;
      width:1px !important;
      height:1px !important;
      padding:0 !important;
      margin:-1px !important;
      overflow:hidden !important;
      clip:rect(0,0,0,0) !important;
      white-space:nowrap !important;
      border:0 !important;
    }
	.heroBrandRow{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:clamp(12px,2.4vw,28px);
	padding:0 0 clamp(10px,1.6vw,18px);
	}

	.logoHeroBig{
	height:clamp(70px,8.4vw,88px);
	width:auto;
	display:block;
	filter:drop-shadow(0 clamp(12px,2vw,28px) clamp(30px,4vw,70px) rgba(122,92,255,.30));
	}

	.heroKickerOut{
	text-align:right;
	font-size:clamp(12px,1.24vw,14px);
	letter-spacing:0.08em;
	text-transform:uppercase; /* kicker label, ikke brødtekst */
	color:var(--text2);
	padding:6px 12px;
	border-radius:999px;
	background:rgba(122,92,255,.10);
	border:1px solid rgba(122,92,255,.22);
	white-space:nowrap;
	margin-bottom:24px;
	}

	@media (max-width:768px){
	.heroBrandRow{flex-direction:column;align-items:flex-start;gap:clamp(8px,1.6vw,14px);}
	.heroKickerOut{text-align:left;white-space:normal;font-size:clamp(8px,1.24vw,10px);padding:4px 8px;margin-bottom:0;}
	}

/* Shared App Theme (Admin + Tenant) */
body.theme-app{
  background: var(--bg);
  color: var(--text);
}

.theme-app .container{
  max-width: 1180px;
  margin: 2rem auto;
  padding: 0 1rem;
}

.theme-app .narrow{
  max-width: 460px;
}

.theme-app .header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
}

.theme-app .grid{
  display:grid;
  gap:1rem;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
}

.theme-app .card{
  background: linear-gradient(180deg, rgba(47,45,57,.90), rgba(38,37,46,.74));
  border: 1px solid var(--border2);
  border-radius: 14px;
  box-shadow: var(--shadow2);
  padding: 1rem;
}

.theme-app .card h2{
  margin: 0 0 .55rem;
  line-height: 1.2;
}

.theme-app main.container > .card{
  margin-top: 1.2rem;
}

.theme-app label{
  display:block;
  margin-bottom:.75rem;
  color: var(--text2);
  font-weight:600;
}

.theme-app input,
.theme-app textarea,
.theme-app select{
  width:100%;
  margin-top:.25rem;
  padding:.65rem;
  border-radius:10px;
  border:1px solid var(--border2);
  background: rgba(28,27,34,.72);
  color: var(--text);
}

.theme-app button,
.theme-app .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height: 36px;
  padding:.55rem .95rem;
  border:1px solid transparent;
  border-radius:10px;
  cursor:pointer;
  text-decoration:none;
  background: linear-gradient(180deg, var(--primary), var(--primaryActive));
  color:#fff;
  font-weight: 600;
  white-space: nowrap;
  line-height: 1;
}

.theme-app .card .btn,
.theme-app .card button{
  margin-right: .45rem;
  margin-bottom: .45rem;
}

.theme-app .form-actions{
  display:flex;
  align-items:stretch;
  gap:.55rem;
  flex-wrap:wrap;
}

.theme-app .form-actions .btn,
.theme-app .form-actions button{
  margin:0;
}

.theme-app table{
  width:100%;
  border-collapse:collapse;
}

.theme-app th,
.theme-app td{
  text-align:left;
  border-bottom:1px solid var(--border);
  padding:.55rem;
  font-size:.95rem;
}

.theme-app .compact-table{
  table-layout: auto;
}

.theme-app .compact-table th:first-child,
.theme-app .compact-table td:first-child{
  width: auto;
  padding-right: .45rem;
}

.theme-app .compact-table th:nth-child(2),
.theme-app .compact-table td:nth-child(2){
  width: 9%;
  white-space: nowrap;
  padding-left: .2rem;
  padding-right: .2rem;
}

.theme-app .compact-table th:nth-child(3),
.theme-app .compact-table td:nth-child(3){
  width: 7%;
  white-space: nowrap;
  padding-left: .2rem;
  padding-right: 0;
  text-align: right;
}

.theme-app .compact-table th:nth-child(2),
.theme-app .compact-table th:nth-child(3),
.theme-app .compact-table td:nth-child(2),
.theme-app .compact-table td:nth-child(3){
  vertical-align: middle;
}

.theme-app .compact-table td:nth-child(3) a,
.theme-app .compact-table td:nth-child(3) .btn{
  margin-left: auto;
}

@media (max-width: 720px){
  .theme-app .compact-table th,
  .theme-app .compact-table td,
  .theme-app .compact-table th:first-child,
  .theme-app .compact-table td:first-child,
  .theme-app .compact-table th:nth-child(2),
  .theme-app .compact-table td:nth-child(2),
  .theme-app .compact-table th:nth-child(3),
  .theme-app .compact-table td:nth-child(3),
  .theme-app .compact-table th:nth-child(4),
  .theme-app .compact-table td:nth-child(4){
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: left !important;
  }

  .theme-app .header{
    align-items: flex-start;
    flex-direction: column;
    gap: .75rem;
  }

  .theme-app .auth-title{
    font-size: 1.3rem;
    flex-wrap: wrap;
  }

  .theme-app .auth-title img{
    width: 140px;
  }

  .theme-app .header > .btn,
  .theme-app .header > div > .btn{
    width: auto;
    max-width: none;
    align-self: flex-end;
  }

  .theme-app .compact-table thead{
    display: none;
  }

  .theme-app .compact-table,
  .theme-app .compact-table tbody,
  .theme-app .compact-table tr,
  .theme-app .compact-table td{
    display: block;
    width: 100%;
  }

  .theme-app .compact-table tr{
    display: flex;
    flex-wrap: wrap;
    border: 1px solid var(--border2);
    border-radius: 12px;
    padding: .55rem .75rem;
    margin-bottom: .75rem;
    background: rgba(255,255,255,.02);
  }

  .theme-app .compact-table td{
    display: block;
    border: 0;
    width: 100%;
    padding: .42rem 0;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .theme-app .compact-table td::before{
    content: attr(data-label);
    display: block;
    color: var(--text2);
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    text-align: left;
    margin-bottom: .16rem;
  }

  .theme-app .compact-table td > *{
    display: inline-block;
    min-width: 0;
    text-align: left;
  }

  .theme-app .compact-table td:first-child{
    flex: 0 0 100%;
    text-align: center !important;
  }

  .theme-app .compact-table td:first-child::before{
    text-align: center;
  }

  .theme-app .compact-table td:first-child > *{
    display: block;
    text-align: center;
  }

  .theme-app .compact-table td:nth-child(2),
  .theme-app .compact-table td:nth-child(3){
    flex: 0 0 50%;
    width: 50% !important;
    text-align: center !important;
  }

  .theme-app .compact-table td:nth-child(2)::before,
  .theme-app .compact-table td:nth-child(3)::before{
    text-align: center;
  }

  .theme-app .compact-table td:nth-child(2) > *,
  .theme-app .compact-table td:nth-child(3) > *{
    display: block;
    text-align: center;
  }

  .theme-app .compact-table td:last-child a,
  .theme-app .compact-table td:last-child .btn{
    width: auto;
    min-width: 0;
    justify-content: center;
  }

  .theme-app .compact-table td:nth-child(3) a,
  .theme-app .compact-table td:nth-child(3) .btn{
    margin-left: 0;
  }
}

.theme-app fieldset{
  border:1px solid var(--border2);
  border-radius:10px;
  margin-bottom:.8rem;
}

.theme-app legend{
  color:var(--text2);
}

.theme-app .check{
  font-weight:500;
  display:block;
}

.theme-app .check input{
  width:auto;
  margin-right:.4rem;
}

.theme-app .muted{
  color:var(--muted);
}

.theme-app .alert{
  border-radius:10px;
  padding:.65rem .85rem;
  margin:.75rem 0;
  border:1px solid var(--border2);
}

.theme-app .alert.ok{
  background: rgba(127,175,155,.16);
  color: #C9EBDD;
}

.theme-app .alert.error{
  background: rgba(186,75,110,.18);
  color: #FFD8E5;
}

.theme-app .auth-logo{
  text-align:center;
  margin: 0 0 1rem;
}

.theme-app .auth-logo img{
  width: min(320px, 90%);
  height: auto;
  display: inline-block;
}

.theme-app .auth-title{
  display:flex;
  align-items:center;
  gap:.65rem;
  font-size: 1.55rem;
  line-height: 1.1;
  min-width: 0;
}

.theme-app .auth-title img{
  width: 170px;
  height: auto;
}

.flash-inline-wrap{
  margin: .9rem 0 1.1rem;
}

.flash-panel{
  position: relative;
  width: 100%;
  padding: 1.1rem 1.2rem 1rem;
  border-radius: 16px;
  border: 1px solid var(--border2);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .45);
  background: linear-gradient(180deg, rgba(47,45,57,.98), rgba(38,37,46,.96));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.flash-panel.flash-ok{
  border-color: rgba(127,175,155,.45);
  background: linear-gradient(180deg, rgba(54, 86, 76, .98), rgba(38, 37, 46, .96));
  color: #d8f3e8;
}

.flash-panel.flash-error{
  border-color: rgba(186,75,110,.45);
  background: linear-gradient(180deg, rgba(96, 42, 58, .98), rgba(38, 37, 46, .96));
  color: #ffe0ea;
}

.flash-message{
  font-size: 1rem;
  line-height: 1.45;
  text-align: left;
  flex: 1 1 auto;
}

.flash-actions{
  display: flex;
  justify-content: flex-end;
  flex: 0 0 auto;
  margin-top: 0;
}

.flash-ok{
  min-width: 110px;
  margin: 0;
}

.flash-panel.flash-ok .flash-ok{
  background: linear-gradient(180deg, #6fa991, #4f7d6c);
  border-color: rgba(201, 235, 221, .22);
  color: #f5fff9;
}

.flash-panel.flash-error .flash-ok{
  background: linear-gradient(180deg, #b85b78, #8e435a);
  border-color: rgba(255, 224, 234, .22);
  color: #fff7fa;
}