/* Layout: mørk premium-forside for MobilityX — alle klasser bruker mx-prefiks for konfliktfri Breakdance-port */
:root{
  --mx-bg:#0A0F1E;          /* dyp marine */
  --mx-surface:#1A1F2E;     /* mørk sekundærflate */
  --mx-surface2:#232940;
  --mx-border:#2A3147;
  --mx-accent:#6B4EFF;      /* MobilityX-lilla */
  --mx-accent2:#9B78FF;     /* lys lilla aksent */
  --mx-flow:#3ADBC8;        /* begrenset cyan for aktiv energiflyt */
  --mx-fg:#FFFFFF;
  --mx-fg2:#E8EBF1;
  --mx-muted:#AAB4C8;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--mx-bg);color:var(--mx-fg2);font-family:Inter,system-ui,sans-serif;font-size:16px;line-height:1.6;margin:0}
h1,h2,h3{font-family:Archivo,Inter,sans-serif;line-height:1.15;text-wrap:balance;margin:0 0 .5em;color:var(--mx-fg)}
h1{font-size:clamp(2.1rem,5.5vw,3.8rem);font-weight:700;letter-spacing:-.02em}
h2{font-size:clamp(1.5rem,3.4vw,2.2rem);font-weight:700;letter-spacing:-.01em}
h3{font-size:1.05rem;font-weight:600}
p{margin:0 0 1em}
img{max-width:100%}
a{color:var(--mx-accent2)}
button{font-family:inherit}
.mx-wrap{max-width:1200px;margin-inline:auto;padding-inline:20px}
.mx-section{padding-block:76px;position:relative}
.mx-eyebrow{color:var(--mx-accent2);text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;font-weight:600;margin-bottom:12px}
.mx-lead{color:var(--mx-muted);max-width:64ch}
.mx-btn{display:inline-block;border-radius:9px;padding:13px 24px;font-weight:600;font-size:.95rem;text-decoration:none;cursor:pointer;border:1px solid transparent;color:var(--mx-fg)}
.mx-btn-p{background:var(--mx-accent)}
.mx-btn-p:hover{background:#5b3ff0}
.mx-btn-s{background:transparent;border-color:var(--mx-border)}
.mx-btn-s:hover{border-color:var(--mx-accent)}
:focus-visible{outline:2px solid var(--mx-accent2);outline-offset:2px}
/* Fullbredde-teknikk for Breakdance-container (aktiveres ved port til WordPress):
.mx-fullbleed{width:100vw;max-width:none;margin-left:calc(50% - 50vw)} */

/* Header */
.mx-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(10,15,30,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--mx-border)}
.mx-nav{display:flex;align-items:center;gap:26px;padding-block:12px;flex-wrap:wrap}
.mx-nav img{height:52px;width:auto;display:block}
.mx-nav>a{display:flex;align-items:center}
.mx-nav-links{display:flex;gap:20px;margin-left:auto;flex-wrap:wrap;align-items:center}
.mx-nav-links a{color:var(--mx-muted);text-decoration:none;font-size:.9rem;font-weight:500}
.mx-nav-links a:hover{color:var(--mx-fg)}

/* Hero */
.mx-hero{min-height:100svh;display:flex;align-items:center;overflow:hidden;background:#0A1020;position:relative}
.mx-hero::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,15,30,.82) 0%,rgba(10,15,30,.52) 45%,rgba(10,15,30,.06) 100%),linear-gradient(0deg,var(--mx-bg) 0%,transparent 14%)}
.mx-hero-inner{position:relative;z-index:2;max-width:620px;padding-block:120px}
.mx-hero .mx-lead{color:#c8cede}
.mx-cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}

/* Intro */
.mx-pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:30px}

/* Kort */
.mx-grid{display:grid;gap:16px}
.mx-g3{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.mx-card{background:var(--mx-surface);border:1px solid var(--mx-border);border-radius:14px;padding:30px 28px;transition:border-color .25s,box-shadow .25s,transform .25s}
.mx-card h3{margin-bottom:8px;font-size:1.22rem;hyphens:auto;overflow-wrap:anywhere}
.mx-card p{color:var(--mx-muted);font-size:.95rem;margin:0;line-height:1.65}
.mx-glow:hover{border-color:var(--mx-accent2);box-shadow:0 0 0 1px var(--mx-accent),0 0 30px rgba(107,78,255,.45),inset 0 0 20px rgba(107,78,255,.06);transform:translateY(-4px)}
.mx-ico{width:58px;height:58px;border-radius:14px;background:linear-gradient(135deg,rgba(107,78,255,.3),rgba(107,78,255,.08));border:1px solid rgba(155,120,255,.55);box-shadow:0 0 20px rgba(107,78,255,.3);display:grid;place-items:center;margin-bottom:18px;color:#CDBAFF}
.mx-ico svg{width:30px;height:30px}

/* Produkter */
.mx-filter{display:flex;gap:8px;flex-wrap:wrap;margin:30px 0 20px}
.mx-filter button{background:var(--mx-surface);border:1px solid var(--mx-border);color:var(--mx-muted);border-radius:99px;padding:8px 16px;font-size:.85rem;font-weight:500;cursor:pointer}
.mx-filter button:hover{color:var(--mx-fg)}
.mx-filter button[aria-pressed=true]{background:var(--mx-accent);border-color:var(--mx-accent);color:#fff}
.mx-pcard{background:var(--mx-surface);border:1px solid var(--mx-border);border-radius:14px;transition:border-color .25s,box-shadow .25s,transform .25s;overflow:hidden;display:flex;flex-direction:column;text-align:left;padding:0;cursor:pointer;transition:border-color .15s}

.mx-pimg{background:#fff;height:200px;position:relative;flex:none}
.mx-pimg>img{position:absolute;inset:16px;width:calc(100% - 32px);height:calc(100% - 32px);object-fit:contain}
.mx-badge{position:absolute;top:10px;left:10px;display:flex;align-items:center;gap:6px;background:var(--mx-bg);color:#fff;font-size:.63rem;font-weight:600;letter-spacing:.06em;border-radius:6px;padding:4px 9px 4px 5px;z-index:1}
.mx-badge img{height:15px;width:15px;border-radius:4px}
.mx-pbody{padding:16px 18px 18px;display:flex;flex-direction:column;gap:8px;flex:1;color:var(--mx-fg2)}
.mx-pcat{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--mx-accent2);font-weight:600}
.mx-pbody h3{margin:0;font-size:1.18rem}
.mx-pbody .mx-pdesc{color:var(--mx-muted);font-size:.93rem;margin:0;flex:1;line-height:1.6}
.mx-chips{display:flex;gap:6px;flex-wrap:wrap}
.mx-chip{font-size:.71rem;color:#e9ebf4;background:rgba(107,78,255,.14);border:1px solid rgba(107,78,255,.4);border-radius:99px;padding:3px 9px;font-variant-numeric:tabular-nums}
.mx-plink{display:flex;align-items:center;justify-content:center;gap:8px;background:rgba(107,78,255,.18);border:1px solid var(--mx-accent);border-radius:9px;padding:11px 14px;color:#fff;font-weight:600;font-size:.92rem;margin-top:10px;transition:background .2s}
.mx-pcard:hover .mx-plink{background:var(--mx-accent)}

/* Modal */
.mx-modal-bg{position:fixed;inset:0;background:rgba(6,9,18,.78);z-index:90;display:grid;place-items:center;padding:20px}
.mx-modal{background:var(--mx-surface);border:1px solid var(--mx-border);border-radius:14px;max-width:760px;width:100%;max-height:88vh;overflow-y:auto;position:relative}
.mx-modal-grid{display:grid;grid-template-columns:280px 1fr;gap:0}
.mx-modal-img{background:#fff;position:relative;min-height:280px}
.mx-modal-img>img{position:absolute;inset:20px;width:calc(100% - 40px);height:calc(100% - 40px);object-fit:contain}
.mx-modal-body{padding:26px 28px}
.mx-modal-close{position:absolute;top:12px;right:12px;background:var(--mx-surface2);border:1px solid var(--mx-border);color:var(--mx-fg);border-radius:8px;width:34px;height:34px;cursor:pointer;font-size:1rem;z-index:2}
.mx-spec{width:100%;border-collapse:collapse;font-size:.82rem;margin-top:14px}
.mx-spec td{padding:6px 0;border-bottom:1px solid var(--mx-border);vertical-align:top}
.mx-spec td:first-child{color:var(--mx-muted);padding-right:12px;white-space:nowrap}

/* Prosess */
.mx-proc{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;position:relative;margin-top:48px;text-align:center}
.mx-proc::before{content:"";position:absolute;top:28px;left:7%;right:7%;height:2px;background:linear-gradient(90deg,transparent,var(--mx-accent) 12%,var(--mx-accent2) 88%,transparent);opacity:.6}
.mx-proc>div{position:relative}
.mx-pn{width:56px;height:56px;border-radius:50%;border:1px solid var(--mx-accent2);background:var(--mx-surface);display:grid;place-items:center;margin:0 auto 18px;font-family:Archivo,sans-serif;font-weight:700;color:#CDBAFF;box-shadow:0 0 22px rgba(107,78,255,.4);position:relative}
.mx-proc h3{font-size:1rem;margin:0 0 6px}
.mx-proc p{color:var(--mx-muted);font-size:.84rem;margin:0;line-height:1.55}
@media(max-width:980px){.mx-proc{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:34px}.mx-proc::before{display:none}}
@media(max-width:560px){.mx-proc{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* EnergyLab */
.mx-panel{background:var(--mx-surface);border:1px solid var(--mx-border);border-radius:14px;padding:22px}
.mx-scenarios{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.mx-scenarios button{background:var(--mx-surface2);border:1px solid var(--mx-border);color:var(--mx-fg2);border-radius:9px;padding:10px 16px;font-size:.87rem;font-weight:600;cursor:pointer}
.mx-scenarios button[aria-pressed=true]{background:var(--mx-accent);border-color:var(--mx-accent);color:#fff}
.mx-simsvg{width:100%;height:auto;display:block;background:#0C1222;border:1px solid var(--mx-border);border-radius:10px}
.mx-readouts{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:16px}
.mx-ro{background:var(--mx-surface2);border:1px solid var(--mx-border);border-radius:9px;padding:12px 14px}
.mx-ro b{display:block;font-family:Archivo,sans-serif;font-size:1.25rem;font-variant-numeric:tabular-nums;color:var(--mx-fg)}
.mx-ro span{color:var(--mx-muted);font-size:.74rem}
.mx-ro-hl{border-color:var(--mx-accent)}
.mx-ro-hl b{color:var(--mx-accent2)}
.mx-scen-desc{color:var(--mx-muted);font-size:.88rem;margin:14px 0 0;min-height:2.6em}
.mx-fineprint{color:var(--mx-muted);font-size:.74rem;margin-top:14px}

/* Kalkulator */
.mx-calc{display:grid;grid-template-columns:1.1fr 1fr;gap:22px}
.mx-calc label{display:block;font-size:.84rem;color:var(--mx-muted);margin-bottom:13px}
.mx-calc label span{display:flex;justify-content:space-between;margin-bottom:4px}
.mx-calc output{color:var(--mx-fg);font-weight:600;font-variant-numeric:tabular-nums}
.mx-calc input[type=range]{accent-color:var(--mx-accent);width:100%}
.mx-calc select{width:100%;background:var(--mx-surface2);border:1px solid var(--mx-border);color:var(--mx-fg);border-radius:8px;padding:10px;font-size:.9rem;font-family:inherit}
.mx-out{display:flex;flex-direction:column;gap:11px}
.mx-big{background:var(--mx-surface2);border:1px solid var(--mx-accent);border-radius:11px;padding:16px 18px}
.mx-big b{font-family:Archivo,sans-serif;font-size:1.55rem;color:var(--mx-accent2);font-variant-numeric:tabular-nums;display:block}
.mx-big span{color:var(--mx-muted);font-size:.8rem}
.mx-minis{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.mx-mini{background:var(--mx-surface2);border:1px solid var(--mx-border);border-radius:10px;padding:12px 14px}
.mx-mini b{font-family:Archivo,sans-serif;font-size:1.1rem;color:var(--mx-fg);display:block;font-variant-numeric:tabular-nums}
.mx-mini span{color:var(--mx-muted);font-size:.73rem}
.mx-sysdir{background:rgba(107,78,255,.12);border:1px solid rgba(107,78,255,.4);border-radius:10px;padding:12px 14px;font-size:.86rem}

/* Om + kontakt */
.mx-om{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-top:26px}
.mx-contact{display:grid;grid-template-columns:1fr 1.1fr;gap:22px;align-items:start}
.mx-kv{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--mx-border);padding-block:11px;font-size:.95rem}
.mx-kv .mx-v{font-weight:600;user-select:all}
.mx-copy{background:var(--mx-surface2);border:1px solid var(--mx-border);color:var(--mx-accent2);border-radius:7px;padding:5px 12px;font-size:.75rem;cursor:pointer}
.mx-copy:hover{border-color:var(--mx-accent)}
.mx-form label{display:block;font-size:.84rem;color:var(--mx-muted);margin-bottom:12px}
.mx-form input,.mx-form textarea{width:100%;background:var(--mx-surface2);border:1px solid var(--mx-border);color:var(--mx-fg);border-radius:8px;padding:11px;font-size:.92rem;font-family:inherit;margin-top:4px}
.mx-form textarea{min-height:110px;resize:vertical}
.mx-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.mx-form-msg{font-size:.88rem;margin-top:10px;min-height:1.4em}
.mx-footer{border-top:1px solid var(--mx-border);padding-block:34px;color:var(--mx-muted);font-size:.85rem}
.mx-footer-row{display:flex;gap:18px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.mx-footer img{height:24px;opacity:.9}

@media(max-width:860px){
  .mx-calc,.mx-contact{grid-template-columns:1fr}
  .mx-modal-grid{grid-template-columns:1fr}
  .mx-modal-img{min-height:220px}
  .mx-hero-inner{padding-block:90px}
}

/* ===== Harbor EnergyLab (scrolldrevet) ===== */
.mx-el{background:var(--mx-surface);border-block:1px solid var(--mx-border)}
.mx-el-wrap{max-width:1400px;margin-inline:auto;padding-inline:20px;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);column-gap:clamp(28px,4vw,70px);align-items:start}
.mx-el-story{min-width:0}
.mx-el-stage{position:sticky;top:calc(env(safe-area-inset-top,0px) + 76px);min-width:0;padding-block:26px 20px}
.mx-el-step{min-height:86vh;display:flex;flex-direction:column;justify-content:center;padding-block:70px;opacity:1;transition:opacity .6s}
.mx-el-step.is-past{opacity:.22}
.mx-el-step .mx-kick{font-size:.72rem;letter-spacing:.16em;color:var(--mx-accent2);font-weight:600;margin-bottom:18px;text-transform:uppercase}
.mx-el-step h3{font-size:clamp(1.6rem,3vw,2.4rem);font-weight:700;letter-spacing:-.02em;line-height:1.1;margin-bottom:18px}
.mx-el-step h3 em{font-style:normal;color:var(--mx-accent2)}
.mx-el-step p{color:var(--mx-fg2);max-width:44ch}
.mx-el-step .mx-el-sec{color:var(--mx-muted);font-size:.92rem}
.mx-el-step .mx-btn{margin-top:14px;align-self:flex-start}
.mx-el-spec{display:flex;gap:34px;margin-top:26px}
.mx-el-spec strong{display:block;font-family:Archivo,sans-serif;font-size:1.7rem;font-weight:700;letter-spacing:-.02em}
.mx-el-spec small{font-size:.95rem;color:var(--mx-muted);font-weight:400}
.mx-el-spec span{display:block;font-size:.74rem;color:var(--mx-muted)}
.mx-el-scenehead{display:flex;align-items:center;gap:8px;color:var(--mx-muted);font-size:.74rem;letter-spacing:.04em}
.mx-el-dot{width:6px;height:6px;border-radius:50%;background:var(--mx-flow);box-shadow:0 0 10px var(--mx-flow)}
.mx-el-tag{margin-left:auto;font-size:.62rem;letter-spacing:.14em;color:var(--mx-muted)}
.mx-el-scene{position:relative;margin-top:12px;border:1px solid var(--mx-border);border-radius:12px;overflow:hidden;background:#0A1020}
.mx-el-world{transform-origin:52% 55%;transition:transform 1.4s cubic-bezier(.22,.7,.25,1)}
.mx-el-scene[data-phase="1"] .mx-el-world{transform:translate(3%,2%) scale(1.07)}
.mx-el-scene[data-phase="2"] .mx-el-world{transform:translate(-5%,-1%) scale(1.09)}
.mx-el-scene[data-phase="3"] .mx-el-world{transform:translate(-7%,-7%) scale(1.12)}
.mx-el-scene[data-phase="4"] .mx-el-world{transform:scale(1.03)}
.mx-el-svg{width:100%;height:auto;display:block}
.mx-el-flow{fill:none;stroke-linecap:round}
.mx-el-bed{opacity:.16;transition:opacity .6s}
.mx-el-pulse{stroke-dasharray:5 12;animation:mxeldash 1.1s linear infinite;transition:opacity .6s,stroke-width .6s}
@keyframes mxeldash{to{stroke-dashoffset:-34}}
.mx-el-ship{transition:transform 2.6s cubic-bezier(.22,.7,.2,1),opacity 1s}
.mx-el-ship.is-away{transform:translateX(340px);opacity:0}
.mx-el-truck{transition:transform 1.4s cubic-bezier(.2,.7,.25,1),opacity .7s;transition-delay:var(--d,0ms)}
.mx-el-truck.is-away{transform:translateX(180px);opacity:0}
.mx-el-smoke{opacity:0;transition:opacity .8s}
.mx-el-smoke.is-on{opacity:1}
.mx-el-smoke circle{animation:mxelsmoke 2.4s ease-out infinite}
.mx-el-smoke circle:nth-child(2){animation-delay:.8s}
.mx-el-smoke circle:nth-child(3){animation-delay:1.6s}
@keyframes mxelsmoke{0%{transform:translateY(0);opacity:.5}100%{transform:translateY(-26px);opacity:0}}
.mx-el-hot{position:absolute;z-index:4;display:flex;align-items:center;gap:7px;background:rgba(10,15,30,.9);border:1px solid #3a4258;border-radius:7px;padding:6px 10px;color:var(--mx-fg2);font-size:.7rem;line-height:1.35;cursor:pointer;transition:border-color .25s,transform .25s;text-align:left}
.mx-el-hot:hover,.mx-el-hot[aria-expanded=true]{border-color:var(--mx-accent);transform:translateY(-2px)}
.mx-el-hot b{display:block;font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
.mx-el-hot i{width:5px;height:5px;border-radius:50%;background:var(--mx-accent2);flex:none}
.mx-el-info{position:absolute;left:4%;right:4%;bottom:12px;z-index:6;background:rgba(16,20,36,.97);border:1px solid #4a5270;border-radius:10px;padding:14px 16px;display:flex;gap:14px;font-size:.82rem}
.mx-el-info strong{color:#fff}
.mx-el-info p{color:var(--mx-muted);margin:.2em 0 0}
.mx-el-info button{background:none;border:0;color:#fff;font-size:1.1rem;cursor:pointer;align-self:flex-start}
.mx-el-read{margin-top:14px;border:1px solid var(--mx-border);border-radius:12px;padding:16px 18px;background:linear-gradient(135deg,#1d2338,#141a2b)}
.mx-el-meterhead{display:flex;justify-content:space-between;align-items:baseline;font-size:.8rem;color:var(--mx-muted)}
.mx-el-meterhead strong{font-family:Archivo,sans-serif;font-size:1.35rem;color:#fff;font-variant-numeric:tabular-nums}
.mx-el-meter{position:relative;height:6px;background:#2a3147;border-radius:3px;margin:10px 0 6px;--demand:30%;--cap:44%}
.mx-el-meter>span{position:absolute;inset:0 auto 0 0;width:var(--demand);max-width:100%;background:var(--mx-accent);border-radius:3px;transition:width .5s,background .4s}
.mx-el-meter>i{position:absolute;left:var(--cap);top:-4px;height:14px;width:2px;background:#fff;transition:left .5s}
.mx-el-scale{display:flex;justify-content:space-between;font-size:.66rem;color:var(--mx-muted)}
.mx-el-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:14px}
.mx-el-stats>div{min-width:0}
.mx-el-stats span{display:block;font-size:.62rem;color:var(--mx-muted);line-height:1.3}
.mx-el-stats strong{display:block;font-family:Archivo,sans-serif;font-size:1.05rem;font-weight:600;font-variant-numeric:tabular-nums;color:#fff;transition:color .3s}
.mx-el-note{font-size:.78rem;margin-top:12px;padding-top:10px;border-top:1px solid var(--mx-border);color:var(--mx-flow);min-height:2.2em}
.mx-el-note.is-warn{color:#FFB86B}
.mx-el-foot{display:flex;justify-content:space-between;margin-top:10px;font-size:.66rem;letter-spacing:.1em;color:var(--mx-muted)}
.mx-el-soc{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:.7rem;color:var(--mx-muted)}
.mx-el-socbar{position:relative;flex:1;height:5px;background:#2a3147;border-radius:3px}
.mx-el-socbar>span{position:absolute;inset:0 auto 0 0;width:60%;background:var(--mx-flow);border-radius:3px;transition:width .5s}
.mx-el-socbar>i{position:absolute;left:10%;top:-3px;width:1px;height:11px;background:#8a93a8}
/* Lab */
.mx-el-lab .mx-scenarios{margin-bottom:14px}
.mx-el-tgl{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid var(--mx-border);cursor:pointer;font-size:.9rem}
.mx-el-tgl small{display:block;color:var(--mx-muted);font-size:.76rem}
.mx-el-tgl input{position:absolute;opacity:0}
.mx-el-sw{flex:none;width:42px;height:24px;border-radius:20px;background:#2a3147;border:1px solid #454e66;position:relative;transition:background .2s}
.mx-el-sw::after{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#c9cfdd;transition:transform .2s}
.mx-el-tgl input:checked~.mx-el-sw{background:var(--mx-accent);border-color:var(--mx-accent2)}
.mx-el-tgl input:checked~.mx-el-sw::after{transform:translateX(18px);background:#fff}
.mx-el-tgl input:focus-visible~.mx-el-sw{outline:2px solid var(--mx-accent2);outline-offset:3px}
.mx-el-time{margin-top:16px;border-top:1px solid var(--mx-border);padding-top:14px}
.mx-el-time label{display:flex;justify-content:space-between;font-size:.85rem}
.mx-el-time strong{color:var(--mx-accent2);font-variant-numeric:tabular-nums}
.mx-el-time input{width:100%;margin-top:10px;accent-color:var(--mx-accent)}
.mx-el-ticks{display:flex;justify-content:space-between;font-size:.64rem;color:var(--mx-muted)}
.mx-el-fleet{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:14px}
.mx-el-veh{position:relative;background:var(--mx-surface2);border:1px solid var(--mx-border);border-radius:6px;padding:7px 6px 9px;text-align:center;overflow:hidden}
.mx-el-veh.is-prio{border-color:#6a5aa8}
.mx-el-veh.is-done{border-color:#2f8f7a}
.mx-el-veh b{display:block;font-size:.68rem;font-weight:600;color:var(--mx-fg2)}
.mx-el-veh small{display:block;font-size:.62rem;color:var(--mx-muted);font-variant-numeric:tabular-nums}
.mx-el-veh i{position:absolute;left:0;bottom:0;height:3px;background:var(--mx-accent);transition:width .4s}
.mx-el-veh.is-done i{background:var(--mx-flow)}
.mx-el-cmp{margin-top:20px;border-top:1px solid var(--mx-border);padding-top:16px}
.mx-el-cmp h4{margin:0 0 10px;font-family:Archivo,sans-serif;font-size:1rem;color:#fff}
.mx-el-cmp table{width:100%;border-collapse:collapse;font-size:.78rem}
.mx-el-cmp td,.mx-el-cmp th{padding:8px 4px;border-bottom:1px solid var(--mx-border);text-align:right;font-weight:400}
.mx-el-cmp th:first-child,.mx-el-cmp td:first-child{text-align:left;color:var(--mx-muted)}
.mx-el-cmp td:last-child{color:var(--mx-flow);font-weight:600;font-variant-numeric:tabular-nums}
.mx-el-cmp thead th{font-size:.66rem;color:var(--mx-muted)}
@media(max-width:980px){
  .mx-el-wrap{display:block}
  .mx-el-stage{position:sticky;top:calc(env(safe-area-inset-top,0px) + 58px);z-index:30;background:var(--mx-surface);border-bottom:1px solid var(--mx-border);padding-block:10px;margin-inline:-20px;padding-inline:20px}
  .mx-el-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mx-el-step{min-height:64vh;padding-block:52px}
  .mx-el-read{padding:12px 14px}
  .mx-el-fleet{grid-template-columns:repeat(4,minmax(0,1fr))}
}
/* Footer-tillegg */
.mx-footer-row .mx-some{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;border:1px solid var(--mx-border);color:var(--mx-muted);transition:color .2s,border-color .2s}
.mx-footer-row .mx-some:hover{color:var(--mx-fg);border-color:var(--mx-accent2)}
.mx-footer-row .mx-some svg{width:17px;height:17px}
.mx-footer-sub{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--mx-border);color:var(--mx-muted);font-size:.74rem}
.mx-footer-sub a{color:var(--mx-fg2);text-decoration:none;border-bottom:1px solid var(--mx-border)}
.mx-footer-sub a:hover{color:var(--mx-fg)}
.mx-sertrow{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--mx-border)}
.mx-sertrow img{height:32px;width:auto;opacity:.85}
.mx-sertlabel{font-size:.7rem;color:var(--mx-muted);letter-spacing:.09em;text-transform:uppercase;margin-right:4px}
.mx-empty{color:var(--mx-muted);padding:22px 2px}
.mx-seallewrap{grid-column:1/-1;display:flex;justify-content:center;padding-top:18px}
.mx-el-mobilemsg{display:none}

/* Mobil: skjul EnergyLab + kompakte tjenestekort */
@media(max-width:860px){
  .mx-el{display:none}
  .mx-el.mx-el-solo{display:block;padding-block:80px 60px}
  .mx-el.mx-el-solo .mx-el-wrap{display:none}
  .mx-el.mx-el-solo .mx-el-mobilemsg{display:block}
  .mx-nav-links a[href*="energylab"]{display:none}
  #tjenester .mx-card,.mx-pillars .mx-card{display:grid;grid-template-columns:76px 1fr;column-gap:16px;align-items:start;padding:18px 16px}
  #tjenester .mx-ico,.mx-pillars .mx-ico{width:76px;height:76px;margin-bottom:0;grid-row:span 2}
  #tjenester .mx-ico svg,.mx-pillars .mx-ico svg{width:40px;height:40px}
  #tjenester .mx-card h3,.mx-pillars .mx-card h3{grid-column:2;margin-top:4px}
  #tjenester .mx-card p,.mx-pillars .mx-card p{grid-column:2}
}

/* Hero: animerte energilinjer */
.mx-hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.mx-hero-bg svg{width:100%;height:100%;display:block;transform-origin:72% 38%;animation:mxherozoom 26s ease-in-out infinite alternate;will-change:transform}
@keyframes mxherozoom{from{transform:scale(1)}to{transform:scale(1.055)}}
.mx-hk-glow{stroke:#B592FF;stroke-width:11;stroke-dasharray:56 194;animation:mxpuls var(--d,5s) linear infinite;animation-delay:var(--dl,0s);opacity:.95;mix-blend-mode:screen}
.mx-hk-core{stroke:#FFFFFF;stroke-width:3.4;stroke-dasharray:34 216;animation:mxpuls var(--d,5s) linear infinite;animation-delay:var(--dl,0s);mix-blend-mode:screen;filter:drop-shadow(0 0 7px #D9C6FF)}
.mx-hk-tak{stroke:#5FEEDC;stroke-width:4;opacity:.75;stroke-dasharray:70 180;animation:mxpuls var(--d,9s) linear infinite;mix-blend-mode:screen}
@keyframes mxpuls{from{stroke-dashoffset:1000}to{stroke-dashoffset:750}}
.mx-hk-core2{stroke-width:2.6;opacity:.75}
.mx-hk-noder circle{fill:#C9B4FF;mix-blend-mode:screen;animation:mxnode 2.8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes mxnode{0%,100%{opacity:.2;transform:scale(.6)}50%{opacity:.85;transform:scale(1.35)}}
.mx-hk-orbs circle{mix-blend-mode:screen;filter:drop-shadow(0 0 10px #B592FF)}

/* Glødende X i utleie */
.mx-xglow{position:absolute;top:50%;right:-110px;transform:translateY(-50%);width:min(680px,74vw);aspect-ratio:1;pointer-events:none;opacity:.85}
.mx-xglow svg{width:100%;height:100%;overflow:visible}
.mx-xglow .xg-arm{animation:xgpust 7s ease-in-out infinite alternate}
.mx-xglow .xg-arm2{animation-delay:-3.5s}
@keyframes xgpust{from{opacity:.72}to{opacity:1}}

/* Utleieenheter */
.mx-uhero{margin-top:26px}
.mx-uhero img{width:100%;display:block;border-radius:14px;border:1px solid var(--mx-border)}
.mx-ugrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:16px;margin-top:26px}
.mx-ucard{background:var(--mx-bg);border:1px solid var(--mx-border);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.mx-uimg{background:#fff;height:220px;display:flex;align-items:center;justify-content:center;padding:18px}
.mx-uimg img{max-width:100%;max-height:100%;object-fit:contain}
.mx-ubody{padding:20px 22px 24px}
.mx-ubody h3{margin:0 0 6px}
.mx-udesc{color:var(--mx-muted);font-size:.88rem;margin:0 0 12px}

/* Om oss */
.mx-omblokk{margin-top:84px}
.mx-omh3{font-size:clamp(1.3rem,2.4vw,1.8rem);margin:0 0 16px}
.mx-omtekst{max-width:760px;color:var(--mx-fg2)}
.mx-omtekst p+p{margin-top:14px}
.mx-omjobb .mx-card h3{font-size:1.02rem}
.mx-team{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:26px}
.mx-avatar{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(107,78,255,.35),rgba(107,78,255,.1));border:1px solid rgba(155,120,255,.55);color:#CDBAFF;font-family:Archivo,sans-serif;font-weight:600;margin-bottom:14px}
.mx-foto{width:100%;height:auto;aspect-ratio:520/580;border-radius:12px;object-fit:cover;object-position:bottom;background:linear-gradient(160deg,rgba(107,78,255,.28),rgba(10,15,30,.9) 70%);border:1px solid rgba(155,120,255,.35);margin-bottom:16px;display:block}
.mx-ombanner{margin-top:38px}
.mx-ombanner img,.mx-omto img{width:100%;display:block;border-radius:14px;border:1px solid var(--mx-border)}
.mx-omto{display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:center}
@media(max-width:860px){.mx-omto{grid-template-columns:1fr}}
.mx-omkort{padding-top:0;overflow:hidden}
.mx-omkortbilde{width:calc(100% + 56px);max-width:none;margin:0 -28px 18px;display:block;height:160px;object-fit:cover}
.mx-rolle{display:block;color:var(--mx-accent2);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;margin:2px 0 10px}

@media(prefers-reduced-motion:reduce){
  .mx-hk path{animation:none!important;stroke-dasharray:none;opacity:0}
  .mx-hk-orbs,.mx-hk-noder{display:none}
  .mx-hero-bg svg{animation:none!important;transform:none!important}
  .mx-flow{animation:none!important}
  .mx-el-pulse{animation:none!important}
  .mx-el-world{transition:none!important;transform:none!important}
  .mx-el-ship,.mx-el-truck{transition:none!important}
  .mx-el-smoke circle{animation:none!important}
}

/* Produktmal [mobilityx_product_detail] */
.mx-detail{display:grid;grid-template-columns:380px 1fr;gap:26px;max-width:1100px;margin-inline:auto;padding:48px 20px}
.mx-detail-img{background:#fff;border-radius:14px;position:relative;min-height:360px}
.mx-detail-img img{position:absolute;inset:24px;width:calc(100% - 48px);height:calc(100% - 48px);object-fit:contain}
.mx-detail-body h1{font-size:clamp(1.6rem,3vw,2.2rem)}
.mx-detail-desc{color:var(--mx-muted)}
.mx-benefits{margin:0 0 1em;padding-left:0;list-style:none}
.mx-benefits li{position:relative;padding-left:26px;margin-bottom:8px;color:var(--mx-fg2)}
.mx-benefits li::before{content:"";position:absolute;left:0;top:4px;width:16px;height:16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239B78FF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 12.5l2.5 2.5L16 9.5'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat}
.mx-detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}
@media(max-width:820px){.mx-detail{grid-template-columns:1fr}}
.mx-detail-spechead{font-size:1.02rem;margin:22px 0 10px;letter-spacing:.01em}
.mx-detail .mx-chips .mx-chip{font-size:.78rem;padding:5px 12px}
.mx-detail-body .mx-pcat{color:var(--mx-accent2);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:6px}
.mx-detail-note{color:var(--mx-fg2);font-size:.88rem;margin:0 0 .6em;line-height:1.55}
