:root{--ink:#07090d;--paper:#e8e5df;--muted:#91969d;--line:rgba(232,229,223,.14);--accent:#c7ff54;--blue:#83b9ff;font-family:Manrope,system-ui,sans-serif;color:var(--paper);background:var(--ink)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);overflow-x:hidden}.grain{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}.boot{position:fixed;inset:0;background:#050609;z-index:50;display:flex;align-items:center;justify-content:center;gap:10px;font:11px 'DM Mono',monospace;letter-spacing:.12em;color:#bbb;transition:opacity 1s ease,visibility 1s}.boot.is-done{opacity:0;visibility:hidden}.boot-mark{color:var(--accent);font-size:18px}.dots{color:var(--accent)}.site-header{height:76px;position:absolute;z-index:10;top:0;left:0;right:0;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.1)}.brand{display:flex;align-items:center;gap:9px;color:var(--paper);text-decoration:none;font-weight:700;letter-spacing:-.04em;font-size:16px}.brand i{font-style:normal;color:var(--accent);font-weight:500}.brand-orbit{font-size:24px;line-height:0;color:var(--accent);font-weight:400}.main-nav{display:flex;gap:30px;margin-left:90px}.main-nav a,.header-cta{font:10px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em;text-decoration:none;color:#babdc1}.main-nav a:hover{color:var(--accent)}.header-cta{border:1px solid var(--line);padding:12px 15px;color:var(--paper);transition:.3s}.header-cta:hover{background:var(--accent);border-color:var(--accent);color:var(--ink)}.header-cta span,.button span,.text-link span{color:var(--accent);margin-left:11px}.hero{height:100svh;min-height:680px;position:relative;overflow:hidden;background:#050608}.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.93}.hero-vignette{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,8,.95) 0%,rgba(5,6,8,.55) 37%,transparent 74%),linear-gradient(0deg,rgba(5,6,8,.9),transparent 38%,rgba(5,6,8,.35))}.hero-copy{position:absolute;z-index:2;left:8vw;top:29%;max-width:640px}.eyebrow,.section-kicker,.hero-meta,.hero-note,.hero-scroll,.signal-caption,.metrics-note{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}.eyebrow{display:flex;align-items:center;gap:9px;color:#c4c7ca}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(199,255,84,.1);animation:pulse 2s infinite}h1,h2,h3,p{margin:0}h1{margin-top:24px;font-size:clamp(54px,8vw,122px);line-height:.92;letter-spacing:-.08em;font-weight:600}h1 em,h2 span{color:var(--accent);font-style:normal}.hero-lede{margin-top:30px;max-width:380px;color:#c2c4c8;font-size:15px;line-height:1.65}.hero-actions{display:flex;align-items:center;gap:20px;margin-top:36px}.button{display:inline-flex;align-items:center;text-decoration:none;text-transform:uppercase;font:10px 'DM Mono',monospace;letter-spacing:.09em;padding:15px 18px;transition:.3s}.button-light{color:var(--ink);background:var(--paper)}.button-light:hover{background:var(--accent);transform:translateY(-2px)}.button-accent{color:var(--ink);background:var(--accent);margin-top:28px}.button-accent:hover{background:#e6ffae;transform:translateY(-2px)}.hero-note{color:#7d8289}.hero-meta{position:absolute;right:5vw;bottom:36px;display:flex;gap:24px;color:#7c8289}.hero-scroll{position:absolute;bottom:35px;left:8vw;color:#8f949a;display:flex;align-items:center;gap:14px}.scroll-line{width:42px;height:1px;background:var(--accent)}.section-pad{padding:140px 8vw}.statement{background:var(--paper);color:var(--ink)}.section-kicker{color:#8d9298}.statement .section-kicker,.use-cases .section-kicker{color:#676c70}.statement-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;margin-top:65px;align-items:end}.statement h2,.signals h2,.use-cases h2,.contact h2{font-size:clamp(48px,7vw,100px);line-height:.94;letter-spacing:-.08em;font-weight:600}.statement h2 span{color:#7b8d67}.statement-body{max-width:390px}.statement-body p,.contact p,.signals-head>p,.use-head>p{font-size:16px;line-height:1.7;color:#5c6266}.text-link{display:inline-flex;margin-top:30px;color:var(--ink);font:11px 'DM Mono',monospace;text-decoration:none;text-transform:uppercase;border-bottom:1px solid #aaa;padding-bottom:9px}.text-link span{color:#687c54}.signals{background:#0b0f14;min-height:930px}.signals-head{padding-bottom:40px;display:flex;justify-content:space-between;align-items:end}.signals-head>p{max-width:290px;color:#969ba2}.signal-stage{height:570px;max-width:980px;margin:0 auto;position:relative;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:radial-gradient(ellipse at center,rgba(73,102,135,.16),transparent 60%)}.signal-stage:before,.signal-stage:after{content:"";position:absolute;inset:12% 24%;border:1px solid rgba(131,185,255,.12);transform:rotate(26deg) skewX(-24deg);border-radius:50%;animation:rotate 26s linear infinite}.signal-stage:after{inset:23% 11%;transform:rotate(-18deg) skewX(-23deg);border-color:rgba(199,255,84,.1);animation-duration:35s;animation-direction:reverse}.signal-orbit{position:absolute;border:1px solid rgba(199,255,84,.24);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%) rotate(25deg) skewX(-25deg);pointer-events:none}.orbit-a{width:390px;height:170px}.orbit-b{width:650px;height:270px;border-color:rgba(131,185,255,.18);transform:translate(-50%,-50%) rotate(-24deg) skewX(-25deg)}.signal-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:132px;height:132px;border:1px solid var(--accent);border-radius:50%;display:grid;place-content:center;text-align:center;background:rgba(7,9,13,.82);z-index:2}.signal-center strong{font:12px 'DM Mono',monospace;line-height:1.3;letter-spacing:.08em}.signal-center small{font:8px 'DM Mono',monospace;color:#858c91;margin-top:8px}.center-pulse{position:absolute;inset:-12px;border:1px solid rgba(199,255,84,.18);border-radius:50%;animation:pulse 3s infinite}.signal-node{position:absolute;z-index:3;background:#0e141b;color:var(--paper);border:1px solid rgba(255,255,255,.18);padding:12px 14px;font:10px 'DM Mono',monospace;letter-spacing:.06em;cursor:pointer;transition:.35s}.signal-node span{color:var(--accent);margin-right:7px}.signal-node:hover{border-color:var(--accent);transform:translateY(-4px);color:var(--accent)}.node-a{top:22%;left:12%}.node-b{top:20%;right:12%}.node-c{bottom:22%;left:17%}.node-d{bottom:18%;right:15%}.signal-caption{position:absolute;left:50%;bottom:23px;transform:translateX(-50%);color:#747c85;white-space:nowrap}.use-cases{background:#11161c}.use-head{display:flex;justify-content:space-between;align-items:end;margin:65px 0 50px}.use-head>p{max-width:220px;color:#8c949c}.case-list{border-top:1px solid var(--line)}.case-row{display:grid;grid-template-columns:90px 1fr 40px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);transition:.35s}.case-row:hover{padding-left:12px;color:var(--accent)}.case-no,.case-arrow{font:10px 'DM Mono',monospace;color:#8e959d}.case-row h3{font-size:22px;font-weight:500;letter-spacing:-.04em}.case-row p{margin-top:7px;font-size:13px;color:#8e959d}.case-arrow{font-size:17px;color:var(--accent);text-align:right}.metrics{background:#e8e5df;color:var(--ink)}.metrics .section-kicker{color:#747a7d}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:80px;border-top:1px solid rgba(7,9,13,.2);border-bottom:1px solid rgba(7,9,13,.2)}.metric-grid div{padding:38px 0;display:flex;flex-direction:column;gap:9px}.metric-grid div+div{border-left:1px solid rgba(7,9,13,.2);padding-left:30px}.metric-grid strong{font-size:clamp(44px,6vw,85px);letter-spacing:-.08em;font-weight:600}.metric-grid span{font:10px 'DM Mono',monospace;text-transform:uppercase;color:#6c7276}.metrics-note{margin-top:18px;color:#81878a}.contact{min-height:680px;position:relative;overflow:hidden;background:#0a0c10}.contact-inner{position:relative;z-index:1;max-width:620px}.contact h2{margin-top:65px}.contact p{max-width:380px;color:#969da5;margin-top:30px}.contact-mark{position:absolute;right:12vw;top:50%;transform:translateY(-50%);font-size:clamp(220px,32vw,500px);line-height:1;color:rgba(199,255,84,.07);animation:float 8s ease-in-out infinite}.site-footer{display:flex;justify-content:space-between;padding:24px 8vw;border-top:1px solid var(--line);color:#707780;font:10px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.08em}@keyframes pulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.14)}}@keyframes rotate{to{transform:rotate(385deg) skewX(-25deg)}}@keyframes float{50%{transform:translateY(-54%) rotate(8deg)}}@media(max-width:700px){.site-header{height:64px;padding:0 6vw}.main-nav{display:none}.header-cta{padding:10px;font-size:8px}.hero{min-height:650px}.hero-copy{left:6vw;right:6vw;top:23%}.hero-lede{font-size:14px}.hero-actions{align-items:flex-start;flex-direction:column;gap:14px}.hero-meta{left:6vw;right:auto;bottom:25px;gap:10px;font-size:8px}.hero-scroll{display:none}.section-pad{padding:92px 6vw}.statement-grid,.signals-head,.use-head{display:block}.statement-grid{margin-top:42px}.statement-body{margin-top:35px}.signals-head>p,.use-head>p{margin-top:25px}.signals{min-height:830px}.signal-stage{height:470px;margin-top:45px}.signal-caption{font-size:8px;bottom:15px}.signal-node{font-size:8px;padding:10px}.node-a{left:6%;top:19%}.node-b{right:6%;top:19%}.node-c{left:7%;bottom:20%}.node-d{right:7%;bottom:17%}.orbit-a{width:270px;height:135px}.orbit-b{width:430px;height:220px}.metric-grid{margin-top:48px;grid-template-columns:1fr}.metric-grid div+div{border-left:0;border-top:1px solid rgba(7,9,13,.2);padding-left:0}.metric-grid div{padding:25px 0}.contact{min-height:600px}.contact-mark{right:-13vw;font-size:280px}.site-footer{padding:22px 6vw;gap:20px;flex-wrap:wrap}.site-footer span:nth-child(2){display:none}}

/* =========================================================================
   TILLÄGG — logotyp, hero-film och kombinationssektion.
   Enbart nya regler. Inget ovanför denna kommentar är ändrat.
   ========================================================================= */

/* Logotyp i headern. Ersätter ◎-glyfen; märket är beskuret ur
   'Logo GeoFlow AI (Final).png' med transparent bakgrund. */
.brand-logo{height:34px;width:auto;display:block;flex:none}

/* Headern ska bära avsändaren även när hero-filmen byter bildton. */
.site-header{background:#07090d;border-bottom-color:rgba(255,255,255,.12)}

/* Logotypen får mer plats i desktophuvudet så att både märke och ordmärke
   läses som en tydlig avsändare. */
@media(min-width:701px){
  .site-header{height:92px}
  .brand{gap:12px;font-size:19px}
  .brand-logo{height:58px}
}

/* Hero-film. Ligger under canvas-animationen så att de två lagren blandas
   i stället för att det ena döljer det andra. */
.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  background:#050608;pointer-events:none;
  /* Filmen är ljusare än den canvas den ersätter som bakgrund. Utan dämpning
     tappar hero-lede, hero-meta och scroll-hinten kontrast mot de vita
     byggnaderna. Dämpningen ligger på filmen, inte på befintliga regler. */
  filter:brightness(.66) contrast(1.06) saturate(1.08)}
/* Canvas läggs ovanpå filmen med screen-blandning: flödeslinjerna lyser
   igenom bilden i stället för att lägga en matta över den. */
.hero canvas{z-index:1;opacity:.5;mix-blend-mode:screen}
/* Vignetten måste ligga över båda för att texten ska hålla kontrast. */
.hero-vignette{z-index:1}

/* Kombinationssektionen — tre datakällor och vad de blir tillsammans. */
.combo{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);margin:0 0 70px}
.combo-layer,.combo-sum{background:#0d1319;padding:32px 28px}
.combo-sum{grid-column:1/-1;background:#141d12;border-top:2px solid var(--accent)}
.combo-tag{display:block;font:10px 'DM Mono',monospace;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.combo-sum .combo-tag{color:var(--accent)}
.combo-layer strong{display:block;font-size:19px;font-weight:600;letter-spacing:-.04em;
  color:var(--paper);margin-bottom:14px}
.combo-layer p,.combo-sum p{font-size:14px;line-height:1.7;color:#8e959d}
.combo-sum p{font-size:16px;color:#b3b9bf;max-width:760px}
.combo-sum p strong{color:var(--accent);font-weight:600}

/* Use case-raderna rymmer längre beskrivningar efter omskrivningen. */
.case-row p{max-width:720px}

/* Sekundärknapp i hero. Kontur i stället för fylld yta så att den inte
   konkurrerar med primärknappen — designsystemet tillåter en accent per vy. */
.button-ghost{color:var(--paper);background:transparent;border:1px solid rgba(232,229,223,.34)}
.button-ghost:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px)}
.button-ghost span{color:var(--accent)}

/* Textspalten i 01. Den gamla regeln kapade bredden till 290 px, vilket inte
   rymmer den utförligare texten. Kolumnen är breddad, inte omdesignad. */
.signals-copy{max-width:430px}
.signals-copy p{font-size:16px;line-height:1.7;color:#969ba2}
.signals-copy p + p{margin-top:16px}
.signals-copy .signals-kicker-line{margin-top:20px;color:var(--paper);
  font-size:15px;line-height:1.6}

/* =========================================================================
   Sektion 03 — jordklot med satelliter i omloppsbana.
   Sektionen är vänd till mörkt läge: den limegröna accenten kräver mörk
   botten enligt designsystemet, och animationen bygger på självlysande
   linjer som inte fungerar mot #e8e5df.
   ========================================================================= */
/* Scenen i 01: Titan Engine som nav, datakällorna i omloppsbana. */
.engine-stage{position:relative;height:660px;overflow:hidden;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:radial-gradient(ellipse at 50% 42%,rgba(73,102,135,.14),transparent 62%)}
.engine-hub{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);
  width:150px;height:150px;border:1px solid var(--accent);border-radius:50%;
  display:grid;place-content:center;text-align:center;background:rgba(7,9,13,.86);z-index:3}
.engine-hub strong{font:13px 'DM Mono',monospace;line-height:1.35;letter-spacing:.08em;
  color:var(--paper)}
.engine-hub small{display:block;font:8px 'DM Mono',monospace;color:#858c91;margin-top:8px;
  letter-spacing:.06em}
.engine-caption{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);
  font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  color:#747c85;white-space:nowrap;z-index:3}
@media(max-width:900px){
  .engine-stage{height:470px}
  .engine-hub{width:112px;height:112px}
  .engine-hub strong{font-size:10px}
  .engine-caption{font-size:8px;bottom:14px}
}

/* Mjuk uttoning i alla kanter så banorna inte klipps av tvärt mot
   sektionsgränsen. */
.globe-stage{position:absolute;inset:0;z-index:0;pointer-events:none;
  -webkit-mask-image:radial-gradient(ellipse 78% 72% at 50% 42%,#000 55%,transparent 100%);
  mask-image:radial-gradient(ellipse 78% 72% at 50% 42%,#000 55%,transparent 100%)}

/* Bakgrundsrutnät som driver långsamt */
.globe-grid{position:absolute;inset:-10%;opacity:.16;
  background-image:repeating-linear-gradient(to right,rgba(131,185,255,.5) 0 1px,transparent 1px 44px),
                   repeating-linear-gradient(to bottom,rgba(131,185,255,.5) 0 1px,transparent 1px 44px);
  animation:globe-pan 180s linear infinite}
@keyframes globe-pan{to{transform:translate3d(44px,44px,0)}}

/* Volymetriskt dis + kärnljus */
.globe-haze{position:absolute;left:50%;top:42%;width:900px;height:900px;
  transform:translate(-50%,-50%);border-radius:50%;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(131,185,255,.16) 0%,transparent 55%);
  filter:blur(90px)}
.globe-core{position:absolute;left:50%;top:42%;width:360px;height:360px;
  transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(199,255,84,.30) 0%,rgba(131,185,255,.16) 45%,transparent 70%);
  filter:blur(70px);animation:globe-pulse 25s ease-in-out infinite}
@keyframes globe-pulse{0%,100%{opacity:.65;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}

/* Trådramssfären: meridianer (i) och breddgrader (b) */
.globe-wire{position:absolute;left:50%;top:42%;width:420px;height:420px;
  transform:translate(-50%,-50%);transform-style:preserve-3d;
  animation:globe-spin 240s linear infinite}
@keyframes globe-spin{to{transform:translate(-50%,-50%) rotateY(360deg)}}
.globe-wire i,.globe-wire b{position:absolute;inset:0;border-radius:50%;
  border:1px solid rgba(131,185,255,.30);box-shadow:0 0 22px rgba(131,185,255,.12)}
.globe-wire i{transform:rotateY(var(--a))}
.globe-wire b{border-color:rgba(199,255,84,.22);
  transform:rotateX(90deg) scale(var(--s)) translateZ(0);
  top:calc(50% - 210px * var(--s) * 0 - 0px)}

/* Satelliter. Varje lager gör exakt en sak, annars skriver
   animationens transform över den statiska. */
/* Banorna skalas ned på smalare skärmar, annars hamnar etiketterna
   utanför sidkanten. Skalningen sker från centrum så geometrin håller. */
.sat-field{position:absolute;left:0;right:0;top:0;bottom:0;
  transform:scale(var(--sf,1));transform-origin:50% 42%}
@media(max-width:1400px){.sat-field{--sf:.82}}
@media(max-width:1150px){.sat-field{--sf:.66}}
@media(max-width:900px){.sat-field{--sf:.52}}
.sat-orbit{position:absolute;left:50%;top:42%;width:0;height:0;
  transform:rotate(var(--tilt)) scaleY(var(--sq))}
.sat-orbit:before{content:"";position:absolute;left:50%;top:50%;
  width:calc(var(--r)*2);height:calc(var(--r)*2);margin:calc(var(--r)*-1) 0 0 calc(var(--r)*-1);
  border:1px solid rgba(232,229,223,.10);border-radius:50%}
.sat-spin{position:absolute;left:0;top:0;animation:sat-spin var(--dur) linear infinite;
  animation-delay:var(--d)}
.sat-pos{position:absolute;transform:translateX(var(--r))}
.sat-counter{animation:sat-spin-rev var(--dur) linear infinite;animation-delay:var(--d)}
.sat-fix{transform:scaleY(calc(1 / var(--sq))) rotate(calc(-1 * var(--tilt)));
  display:flex;align-items:center;gap:9px;white-space:nowrap}
@keyframes sat-spin{to{transform:rotate(360deg)}}
@keyframes sat-spin-rev{to{transform:rotate(-360deg)}}
.sat-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none;
  box-shadow:0 0 0 4px rgba(199,255,84,.14),0 0 16px rgba(199,255,84,.7)}
.sat-dot.dim{background:#7c838a;box-shadow:0 0 0 4px rgba(124,131,138,.12)}
.sat-tag{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  color:var(--paper);text-shadow:0 0 14px rgba(5,6,9,.95),0 2px 6px rgba(5,6,9,.9)}
.sat-tag.dim{color:#8b9299}

@media(max-width:900px){
  .metrics{min-height:640px}
  .globe-wire{width:260px;height:260px}
  .globe-core{width:220px;height:220px}
  .sat-tag{font-size:8px}
}

/* Respektera användarens inställning för minskad rörelse. */
@media(prefers-reduced-motion:reduce){
  /* 2026-08-30: '.hero-film{display:none}' slog av herofilmen helt. Filmen ligger under canvas-lagret och ska synas. */
.hero-film{display:block}
  .hero canvas{opacity:.9;mix-blend-mode:normal}
  .globe-grid,.globe-core,.globe-wire,.sat-spin,.sat-counter{animation:none}
}

@media(max-width:700px){
  .brand-logo{height:26px}
  .combo{grid-template-columns:1fr;margin-bottom:52px}
  .combo-layer,.combo-sum{padding:26px 22px}
  .combo-sum p{font-size:15px}
}

/* --- Sektion 04: Produkter ---------------------------------------------- */
.products{background:#0b0f14}
.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border:1px solid var(--line);margin-top:20px}
.product-card{background:#0d1319;padding:38px 34px;display:flex;flex-direction:column}
.product-card.accent{background:#141d12;border-top:2px solid var(--accent)}
.product-head{display:flex;flex-direction:column;gap:14px}
.product-tag{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  align-self:flex-start;padding:6px 10px;border:1px solid var(--line)}
.product-tag.live{color:var(--accent);border-color:rgba(199,255,84,.4)}
.product-tag.build{color:var(--blue);border-color:rgba(131,185,255,.4)}
.product-card h3{font-size:26px;font-weight:600;letter-spacing:-.04em;color:var(--paper)}
.product-card p{margin-top:18px;font-size:15px;line-height:1.7;color:#8e959d}
.product-card ul{margin:22px 0 0;padding:0;list-style:none;flex:1}
.product-card li{font-size:14px;line-height:1.6;color:#a9aeb4;padding:11px 0 11px 22px;
  position:relative;border-bottom:1px solid rgba(232,229,223,.07)}
.product-card li:last-child{border-bottom:none}
.product-card li:before{content:"↗";position:absolute;left:0;color:var(--accent)}
.product-card .text-link{color:var(--paper);border-bottom-color:rgba(232,229,223,.3);
  align-self:flex-start}
.report-card{padding-bottom:34px}
.report-intro{max-width:520px}
.report-tiers{margin-top:24px;border-top:1px solid rgba(232,229,223,.13)}
.report-tier{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:14px;
  align-items:start;padding:14px 0;border-bottom:1px solid rgba(232,229,223,.1)}
.report-no,.report-delivery{font:10px 'DM Mono',monospace;letter-spacing:.08em;
  text-transform:uppercase}
.report-no{color:var(--accent);padding-top:4px}
.report-tier h4{margin:0;color:var(--paper);font-size:16px;line-height:1.25;
  font-weight:600;letter-spacing:-.025em}
.product-card .report-tier p{margin:4px 0 0;font-size:12px;line-height:1.5;color:#9299a2}
.report-delivery{align-self:center;white-space:nowrap;color:var(--accent);text-align:right}
.report-delivery.scheduled{color:#9aa1a9}
.product-card .report-renewal{margin-top:18px;font-size:12px;line-height:1.55;color:#a7adb4}

/* --- Sektion 06: Om oss (ljust läge, som metrics) ----------------------- */
.about{background:#e8e5df;color:var(--ink)}
.about .section-kicker{color:#676c70}
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:7vw;margin-top:60px;
  align-items:start}
.about h2{font-size:clamp(34px,4.4vw,60px);line-height:.98;letter-spacing:-.06em;
  font-weight:600}
.about h2 span{color:#7b8d67}
.about p{margin-top:26px;font-size:16px;line-height:1.7;color:#5c6266;max-width:520px}
.about .cv{border-top:1px solid rgba(7,9,13,.2)}
.about .cv div{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:16px 0;
  border-bottom:1px solid rgba(7,9,13,.2);font-size:14px;line-height:1.6;color:#5c6266}
.about .cv b{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  color:#676c70;font-weight:400;padding-top:3px}

/* --- Sidfot med finstilt ------------------------------------------------ */
.site-footer{display:block;padding:30px 8vw 40px}
.foot-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:18px}
.foot-fine{margin-top:26px;padding-top:22px;border-top:1px solid rgba(232,229,223,.07)}
.foot-fine p{font-family:Manrope,sans-serif;font-size:12px;line-height:1.75;color:#6a7079;
  text-transform:none;letter-spacing:0;max-width:960px}
.foot-fine p+p{margin-top:12px}
.foot-fine strong{color:#8e959d;font-weight:600}
.foot-fine a{color:#8e959d;text-decoration:none;border-bottom:1px solid rgba(142,149,157,.35)}
.foot-fine a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.foot-social{display:flex;align-items:center;flex-wrap:wrap;gap:10px 22px;margin-top:24px}
.foot-social a{display:inline-flex;align-items:center;gap:9px;color:#8e959d;text-decoration:none;
  font:10px 'DM Mono',monospace;letter-spacing:.075em;text-transform:uppercase;
  transition:color .22s ease,transform .22s ease}
.foot-social svg{width:19px;height:19px;flex:none;fill:currentColor}
.foot-social a:hover{color:var(--accent);transform:translateY(-2px)}
.foot-social a:focus-visible{color:var(--accent);outline:1px solid var(--accent);
  outline-offset:6px}
.foot-trust{margin-top:30px;padding-top:24px;border-top:1px solid rgba(232,229,223,.08)}
.foot-trust-row{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.foot-trust-row+.foot-trust-row{margin-top:18px}
.foot-trust-label{min-width:130px;color:#707780;font:9px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
.trust-marks{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.trust-mark{display:inline-flex;align-items:baseline;gap:8px;min-height:34px;padding:8px 11px;border:1px solid rgba(232,229,223,.12);color:#aeb4ba}
.trust-mark strong{font:11px 'DM Mono',monospace;letter-spacing:.06em;text-transform:uppercase;color:#d9dce0}
.trust-mark small{font:10px Manrope,sans-serif;color:#737b83}
.trust-mark-sponsor{border-color:rgba(199,255,84,.3);background:rgba(199,255,84,.04)}
.trust-mark-sponsor strong{color:var(--accent);font-family:Manrope,sans-serif;letter-spacing:-.02em;text-transform:none}
.trust-mark-sponsor small{color:#b4bd9e}
.site-footer .foot-trust span:nth-child(2){display:inline-flex}

@media(max-width:900px){
  .product-grid{grid-template-columns:1fr}
  .report-tier{grid-template-columns:30px minmax(0,1fr)}
  .report-delivery{grid-column:2;text-align:left;align-self:start}
  .about-grid{grid-template-columns:1fr;gap:38px}
  .site-footer{padding:26px 6vw 34px}
}
/* --- Datakällor: smal grå remsa längst ned -------------------------------
   Referensen (prospectmapping.se) kör en bred logotypvägg. Den här är
   medvetet smalare och tätare: raden ska läsas som en fotnot med tyngd,
   inte som ett partnergalleri. Ordmärken är satta i text — inga
   leverantörslogotyper, som kräver tillstånd. */
.sources{background:#dcdad4;color:var(--ink);padding:64px 8vw 58px}
.sources-inner{max-width:1000px}
.sources .section-kicker{color:#6d7276}
.sources h2{margin-top:16px;font-size:clamp(26px,2.9vw,38px);line-height:1.02;
  letter-spacing:-.05em;font-weight:600;color:var(--ink)}
.sources h2 span{color:#7b8d67}

.source-row{margin-top:34px;display:flex;flex-wrap:wrap;gap:1px;
  background:rgba(7,9,13,.14);border:1px solid rgba(7,9,13,.14)}
.source{flex:1 1 168px;min-width:150px;background:#dcdad4;padding:18px 20px;
  text-decoration:none;display:block;transition:.3s cubic-bezier(.4,0,.2,1)}
a.source:hover{background:#e6e4de}
.source b{display:block;font-size:14px;font-weight:600;letter-spacing:-.02em;
  color:var(--ink);line-height:1.3}
.source span{display:block;margin-top:7px;font:9px 'DM Mono',monospace;
  letter-spacing:.11em;text-transform:uppercase;color:#7b8d67}
.source.muted b{color:#797e82;font-weight:500}
.source.muted span{color:#8b9095}

.sources-note{margin-top:22px;max-width:640px;font-size:12px;line-height:1.7;
  color:#6d7276}

@media(max-width:700px){
  .sources{padding:46px 6vw 42px}
  .source{flex:1 1 100%}
}

/* Logotyper i datakällsraden.
   Bilden döljer sig själv via onerror om filen saknas, så raden faller
   tillbaka på ordmärket. Lägg logotypen i assets/logos/ med rätt filnamn
   så dyker den upp — ingen kodändring behövs.
   Logotyper är skyddade verk. Lägg inte in en fil du inte har tillstånd
   att publicera. */
.source-logo{display:block;max-height:26px;max-width:130px;width:auto;
  margin-bottom:12px;object-fit:contain;object-position:left center;
  /* Neutraliserar leverantörernas egna färger så raden håller ihop
     visuellt. Ta bort raden om avtalet kräver originalfärg. */
  filter:grayscale(1) contrast(.9);opacity:.78;
  transition:.3s cubic-bezier(.4,0,.2,1)}
a.source:hover .source-logo{filter:grayscale(0) contrast(1);opacity:1}
.source-logo + b{font-size:12px;font-weight:500;color:#6d7276;letter-spacing:0}
.source-logo + b + span{margin-top:4px}

/* --- Sektion 05: kontaktmatris ------------------------------------------ */
.contact{display:flex;align-items:center;gap:4vw}
.contact .contact-inner{flex:1 1 560px;max-width:620px}
.contact-list{flex:1 1 460px;max-width:520px;margin:0;padding:0;
  border:1px solid rgba(232,229,223,.22);background:rgba(13,19,25,.54)}
.contact-list div{display:grid;grid-template-columns:minmax(100px,.72fr) 1.28fr;
  gap:24px;align-items:center;padding:21px 24px}
.contact-list div+div{border-top:1px solid rgba(232,229,223,.16)}
.contact-list dt{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  color:#88a3c5}
.contact-list dd{margin:0;text-align:right;color:var(--paper);
  font:600 14px/1.45 Manrope,system-ui,sans-serif;letter-spacing:-.015em}
.contact-list a{color:inherit;text-decoration:none}
.contact-list a:hover{color:var(--accent)}

@media(max-width:1100px){
  .contact{display:block}
  .contact .contact-inner{max-width:620px}
  .contact-list{max-width:620px;margin-top:52px}
}

/* --- Hero: de tre källorna som modellen förstår -------------------------
   Korten är avsiktligt få och informationsbärande: de visar insatsen i
   modellen, medan rubriken till vänster visar utfallet. */
.hero-data-cards{position:absolute;z-index:2;top:50%;right:clamp(5vw,8vw,10vw);
  width:min(29vw,405px);display:grid;gap:13px;transform:translateY(-44%)}
.hero-data-card{--card-offset:0px;--card-tilt:0deg;position:relative;min-height:142px;
  overflow:hidden;padding:19px 22px 20px;border:1px solid rgba(232,229,223,.24);
  background:linear-gradient(118deg,rgba(15,21,28,.86),rgba(9,13,18,.64));
  box-shadow:0 20px 54px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.06);
  backdrop-filter:blur(13px);transform:translateX(var(--card-offset)) rotate(var(--card-tilt));
  transition:transform .42s cubic-bezier(.2,.8,.2,1),border-color .35s ease,background .35s ease;
  animation:hero-data-card-in .75s cubic-bezier(.2,.8,.2,1) both}
.hero-data-card:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(112deg,rgba(199,255,84,.11),transparent 36%);opacity:.72}
.hero-data-card:after{content:"";position:absolute;right:-26px;bottom:-42px;width:120px;height:120px;
  border:1px solid rgba(131,185,255,.18);border-radius:50%;box-shadow:0 0 0 20px rgba(131,185,255,.025)}
.people-card{--card-offset:-20px;--card-tilt:-3deg;z-index:1;animation-delay:.08s}
.place-card{--card-offset:5px;--card-tilt:1deg;z-index:2;animation-delay:.18s}
.weather-card{--card-offset:-9px;--card-tilt:-1.5deg;z-index:3;animation-delay:.28s}
.hero-data-card:hover{border-color:rgba(199,255,84,.7);background:linear-gradient(118deg,rgba(18,27,29,.93),rgba(9,14,18,.78));
  transform:translateX(calc(var(--card-offset) - 12px)) rotate(0deg)}
.hero-data-card-head{position:relative;z-index:1;display:grid;grid-template-columns:28px 1fr auto;
  gap:10px;align-items:center;padding-bottom:12px;border-bottom:1px solid rgba(232,229,223,.16)}
.hero-data-card-head span{font:10px 'DM Mono',monospace;letter-spacing:.1em;color:var(--accent)}
.hero-data-card h2{font-size:20px;line-height:1;font-weight:600;letter-spacing:-.045em}
.hero-data-card-head i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 13px rgba(199,255,84,.76)}
.place-card .hero-data-card-head i{background:var(--blue);box-shadow:0 0 13px rgba(131,185,255,.76)}
.weather-card .hero-data-card-head i{background:#e8e5df;box-shadow:0 0 13px rgba(232,229,223,.6)}
.hero-data-card p{position:relative;z-index:1;margin-top:13px;color:#d3d6d7;font-size:12px;line-height:1.55}
@keyframes hero-data-card-in{from{opacity:0;transform:translate3d(calc(var(--card-offset) + 42px),20px,0) rotate(var(--card-tilt))}to{opacity:1;transform:translateX(var(--card-offset)) rotate(var(--card-tilt))}}

@media(max-width:1050px) and (min-width:701px){
  .hero-data-cards{width:min(32vw,330px);right:5vw}
  .hero-data-card{min-height:132px;padding:16px 18px}
  .hero-data-card p{font-size:11px;line-height:1.48}
}
@media(max-width:700px){
  .hero{height:auto;min-height:1120px}
  .hero-lede{display:none}
  .hero-data-cards{top:620px;right:6vw;left:6vw;width:auto;gap:12px;transform:none}
  .hero-data-card{min-height:0;padding:17px 18px;transform:none}
  .people-card,.place-card,.weather-card{--card-offset:0px;--card-tilt:0deg}
  .hero-data-card:hover{transform:translateY(-4px)}
  .hero-meta{display:none}
}
@media(prefers-reduced-motion:reduce){.hero-data-card{animation:none;transition:none}}

/* --- Titan Engine: texten följer motorn, inte rubriken ------------------ */
.signals-head{display:block;padding-bottom:58px}
.engine-stage{--engine-axis:42%}
.engine-stage .globe-stage{transform:translateX(-8%)}
.engine-stage .engine-hub{left:var(--engine-axis)}
.engine-stage .engine-caption{left:var(--engine-axis)}
.engine-stage .signals-copy{position:absolute;z-index:4;top:50%;right:8vw;
  width:min(31vw,430px);padding:24px 0 24px 27px;border-left:1px solid rgba(232,229,223,.18);
  background:linear-gradient(90deg,rgba(11,15,20,.84),rgba(11,15,20,.16));
  transform:translateY(-50%)}
.engine-stage .signals-copy strong{color:var(--paper);font-weight:700}

/* Produkten använder samma rubrikskala som övriga sektionslöften. */
.products .use-head h2{font-size:clamp(48px,7vw,100px);line-height:.94;
  letter-spacing:-.08em;font-weight:600}

@media(max-width:1050px) and (min-width:701px){
  .engine-stage{--engine-axis:38%}
  .engine-stage .signals-copy{right:5vw;width:min(38vw,385px);padding-left:21px}
  .engine-stage .signals-copy p{font-size:14px;line-height:1.58}
}
@media(max-width:700px){
  .hero{min-height:1420px}
  .hero-lede{display:block;max-width:none;margin-top:24px;font-size:13px;line-height:1.5}
  .hero-data-cards{top:915px}
  .signals-head{padding-bottom:48px}
  .engine-stage{--engine-axis:50%;height:1280px;min-height:0}
  .engine-stage .globe-stage{transform:none}
  .engine-stage .engine-hub{top:230px}
  .engine-stage .engine-caption{top:440px;bottom:auto}
  .engine-stage .signals-copy{top:515px;right:6vw;left:6vw;width:auto;padding:22px 0 0;
    border-left:0;border-top:1px solid rgba(232,229,223,.18);background:none;transform:none}
}

@media(min-width:701px){
  .hero-copy{top:22%;max-width:720px}
  .hero-lede{max-width:440px;font-size:14px;line-height:1.5}
  .hero-actions{margin-top:24px}
}

@media(max-width:700px){
  .brand{gap:9px;font-size:17px}
  .brand-logo{height:38px}
  .contact-list div{grid-template-columns:1fr;gap:7px;padding:18px 20px}
  .contact-list dd{text-align:left}
}

/* =========================================================================
   VIDARELÄNK — den återkommande "läs vidare"-länken.
   Egen klass därför att .text-link har color:var(--ink) och alltså är
   osynlig på mörk botten. Den fungerar idag bara inuti .product-card, som
   skriver över färgen. Använd .link-onward överallt utanför det kortet.
   ========================================================================= */
.link-onward{display:inline-flex;align-items:center;margin-top:26px;
  color:var(--paper);font:11px 'DM Mono',monospace;text-transform:uppercase;
  letter-spacing:.09em;text-decoration:none;padding-bottom:9px;
  border-bottom:1px solid rgba(232,229,223,.3);
  transition:color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1)}
.link-onward:hover{color:var(--accent);border-bottom-color:var(--accent)}
.link-onward span{color:var(--accent);margin-left:11px}

/* =========================================================================
   SIDFOTSNAVIGATION
   Riktiga länkar i sidfoten är enda navigationen om JS inte kör — MENY-knappen
   är då död. De bär också det interna länknätet mellan sidorna.
   ========================================================================= */
.foot-nav{display:flex;flex-wrap:wrap;gap:28px;padding:34px 8vw;
  border-top:1px solid var(--line)}
.foot-nav a{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  color:#8e959d;text-decoration:none;transition:color .3s cubic-bezier(.4,0,.2,1)}
.foot-nav a:hover{color:var(--accent)}
@media(max-width:700px){
  .foot-nav{padding:26px 6vw;gap:18px}
}

/* =========================================================================
   MEDIESEKTION — sektion med fotografisk bakgrund
   Sektion 03 var tre siffror på en beige platta och bar inte sin vikt bredvid
   heron och motorsektionen. Den blir i stället mörk med bild, och fungerar som
   ingång till metodsidan.

   Bilden sätts per sektion via --media, så filnamnet står på ett ställe i
   HTML:en. Laddar den inte återstår bottenfärgen och en läsbar sektion.
   Två lager ovanpå bilden: en horisontell gradient som håller vänsterkanten
   mörk där texten står, och en svag heltäckande dämpning.
   ========================================================================= */
.media-section{position:relative;overflow:hidden;background:var(--ink);color:var(--paper);
  isolation:isolate}
.media-section:before{content:"";position:absolute;inset:-4%;z-index:-2;
  background-image:var(--media);background-size:cover;background-position:center 48%;
  opacity:.82;transform:scale(1.08)}
.media-section:after{content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(180deg,#0d1319 0%,rgba(13,19,25,.72) 7%,transparent 18%,transparent 80%,rgba(17,22,28,.7) 93%,#11161c 100%),
    linear-gradient(100deg,rgba(7,9,13,.91) 0%,rgba(7,9,13,.62) 45%,rgba(7,9,13,.16) 100%)}
.media-inner{position:relative;max-width:1100px}
.media-section h2{margin-top:26px;font-size:clamp(34px,4.6vw,62px);line-height:.96;
  letter-spacing:-.07em;font-weight:600;color:var(--paper);max-width:15ch}
.media-section h2 span{color:var(--accent)}

/* Sektionen var ljus tidigare — hårlinjer och textfärger var satta för svart
   på beige och måste vändas. */
.metrics.media-section .section-kicker{color:#9aa1a8}
.metrics.media-section .metric-grid{border-top-color:var(--line);
  border-bottom-color:var(--line);margin-top:52px}
.metrics.media-section .metric-grid div+div{border-left-color:var(--line)}
.metrics.media-section .metric-grid strong{color:var(--paper)}
.metrics.media-section .metric-grid span{color:#a9aeb4}
.metrics.media-section .metrics-note{color:#9aa1a8}

@media(max-width:700px){
  .media-section:before{inset:-2%;background-position:62% center;opacity:.76;transform:scale(1.04)}
  .media-section:after{
    background:
      linear-gradient(180deg,#0d1319 0%,transparent 12%,transparent 86%,#11161c 100%),
      linear-gradient(180deg,rgba(7,9,13,.72) 0%,rgba(7,9,13,.48) 100%)}
  .media-section h2{max-width:none}
}

/* =========================================================================
   NIVÅGRUPP — primärt spår / sekundärt spår / angränsande
   Bär hierarkin ur beslutsdokumentet 2026-08-03: fastighet leder, retail är
   sekundärt, resten levereras på förfrågan. Nivåskillnaden ska läsas i
   typografin, inte i ramar — rubriken är en hårfin etikettrad, inget kort.
   Ligger i styles.css och inte i pages.css eftersom startsidan också bär den.
   ========================================================================= */
.tier{margin-top:56px}
.tier:first-of-type{margin-top:30px}
.tier-head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;
  padding-bottom:14px;border-bottom:1px solid var(--line)}
.tier-head b{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  color:var(--accent);font-weight:400}
.tier-head span{font:10px 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase;
  color:#707780}
.tier-head.secondary b{color:var(--blue)}
.tier-head.adjacent b{color:#8d9298}
.tier .case-list{border-top:none}

/* Use case-raderna är länkar sedan tillämpningarna fick egna sidor.
   .case-row:hover i grundfilen ger redan färg och indrag — här nollas bara
   ankarets standardutseende så raden ser ut precis som förut. */
a.case-row{text-decoration:none;color:inherit}

/* =========================================================================
   MOBILNAVIGATION
   Sajten hade ingen — .main-nav är display:none under 700px och det fanns
   ingen ersättare. Det gick an när allt låg på en sida och man kunde scrolla,
   men inte med riktiga undersidor.

   Två saker styr konstruktionen:
   1. Panelen ligger som SYSKON till <header>, aldrig inuti. Undersidornas
      header har backdrop-filter, vilket gör den till containing block för
      position:fixed. En panel inuti headern hade fungerat på startsidan och
      varit trasig på varje undersida.
   2. Stängknappen ligger i panelen, inte i headern. Startsidans header är
      position:absolute och ligger utanför skärmen så fort man scrollat.

   Ingen hamburgarikon: headern är redan ren text i DM Mono, och en textknapp
   håller radie 0 och slipper ikonanimation.
   ========================================================================= */
.nav-toggle,.nav-scrim,.nav-panel{display:none}

@media(max-width:700px){
  /* Headern måste följa med i scroll på mobil. Startsidans header är
     position:absolute, så MENY-knappen låg utanför skärmen så fort man
     scrollat — menyn gick helt enkelt inte att öppna. Bakgrunden tänds först
     vid scroll, så heron ser likadan ut som förut i viloläge. */
  .site-header{position:fixed;left:0;right:0;
    transition:background .3s cubic-bezier(.4,0,.2,1)}
  body.is-scrolled .site-header{background:rgba(7,9,13,.93);backdrop-filter:blur(12px)}

  /* CTA:n låg här som en 8px-chip bredvid loggan. Den flyttar ned i panelen
     som fullbred knapp i stället — och måste därför bära .button.button-accent,
     inte .header-cta, annars ärver den bort sig själv. */
  .header-cta{display:none}

  .nav-toggle{display:inline-flex;align-items:center;background:transparent;
    border:1px solid var(--line);color:var(--paper);cursor:pointer;
    font:10px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em;
    padding:11px 14px;transition:color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1)}
  .nav-toggle:hover,.nav-toggle:focus-visible{border-color:var(--accent);color:var(--accent)}

  .nav-scrim{display:block;position:fixed;inset:0;z-index:30;
    background:rgba(5,6,9,.72);opacity:0;visibility:hidden;
    pointer-events:none;
    transition:opacity .3s cubic-bezier(.4,0,.2,1),visibility 0s .3s}

  .nav-panel{display:flex;flex-direction:column;position:fixed;z-index:31;
    top:0;right:0;bottom:0;width:min(84vw,340px);
    background:#050609;border-left:1px solid var(--line);
    padding:22px 0 30px;overflow-y:auto;overscroll-behavior:contain;
    visibility:hidden;transform:translateX(100%);pointer-events:none;
    transition:transform .3s cubic-bezier(.4,0,.2,1),visibility 0s .3s}

  .nav-open .nav-scrim{opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
  .nav-open .nav-panel{transform:none;visibility:visible;pointer-events:auto;transition-delay:0s}
  body.nav-open{overflow:hidden}

  .nav-close{align-self:flex-end;margin:0 20px 20px;background:transparent;
    border:1px solid var(--line);color:var(--paper);cursor:pointer;
    font:10px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em;
    padding:11px 14px;transition:color .3s cubic-bezier(.4,0,.2,1),border-color .3s cubic-bezier(.4,0,.2,1)}
  .nav-close:hover,.nav-close:focus-visible{border-color:var(--accent);color:var(--accent)}

  .nav-panel nav{display:flex;flex-direction:column;border-top:1px solid var(--line)}
  .nav-panel nav a{display:grid;grid-template-columns:34px 1fr;align-items:baseline;
    padding:21px 24px;text-decoration:none;color:#babdc1;
    border-bottom:1px solid rgba(232,229,223,.07);
    font:11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.1em;
    transition:color .3s cubic-bezier(.4,0,.2,1)}
  .nav-panel nav a span{color:#707780}
  .nav-panel nav a:hover,.nav-panel nav a:focus-visible{color:var(--accent)}
  .nav-panel-cta{margin:30px 24px 0;justify-content:center;padding:16px 18px}
}

@media(prefers-reduced-motion:reduce){
  .nav-scrim,.nav-panel{transition:none}
}

/* =========================================================================
   AKTIV SIDA I NAVIGATIONEN
   Headern måste vara byte-identisk mellan sidor (drift-kontrollen i
   tools/publish.py), så markeringen kan inte ligga som klass i navet. Den
   hänger i stället på <body data-page>. CSS kan inte jämföra två
   attributvärden med varandra, därav parlistan — men den stannar på fyra
   rader: alla tillampning-*.html sätter data-page="tillampningar" och
   tänder föräldraposten utan en enda ny regel.
   ========================================================================= */
body[data-page="tillampningar"] [data-nav="tillampningar"],
body[data-page="metod"]         [data-nav="metod"],
body[data-page="produkter"]     [data-nav="produkter"],
body[data-page="om-oss"]        [data-nav="om-oss"]{color:var(--accent)}
body[data-page="tillampningar"] .nav-panel [data-nav="tillampningar"] span,
body[data-page="metod"]         .nav-panel [data-nav="metod"] span,
body[data-page="produkter"]     .nav-panel [data-nav="produkter"] span,
body[data-page="om-oss"]        .nav-panel [data-nav="om-oss"] span{color:var(--accent)}

/* =========================================================================
   2026-08-17 — publik lanseringsyta
   En beslutsidé per sektion, leverantörsneutral copy och en hero som ryms i
   första viewporten. Dessa regler ersätter de tidigare teknikkorten.
   ========================================================================= */
.site-header{background:#07090d;border-bottom-color:rgba(255,255,255,.06)}
.brand-logo{padding:3px 2px 7px;object-fit:contain}
.brand-logo-horizontal{width:180px;height:53px;padding:4px 0;object-position:left center;
  filter:brightness(1.55) contrast(1.06) saturate(1.05) drop-shadow(0 0 16px rgba(199,255,84,.42))}
.header-actions{display:flex;align-items:center;gap:10px}
.header-queue{font:10px 'DM Mono',monospace;text-transform:uppercase;
  letter-spacing:.1em;text-decoration:none;color:var(--accent);padding:12px 6px}
.header-queue:hover{color:var(--paper)}
.main-nav{margin-left:auto;margin-right:22px}

.hero-reduced{height:auto;min-height:100svh;overflow:visible}
/* Bredden galler kortraden. Rubrik och ingress har egna max-width och blir
   inte langre av detta - men de tre korten far plats pa en rad i stallet for
   att brytas till 2+1 i en 760 px-spalt. */
.hero-reduced .hero-copy{position:relative;left:auto;top:auto;z-index:2;
  max-width:min(1180px,86vw);margin-left:8vw;padding:196px 0 110px}
/* Bara kortraden ar full bredd. Eyebrow-raden hade annars spant hela 1180 px
   och lagt sin ruta under filmen uppe till hoger. Rubrik och ingress ror jag
   inte - de har egna max-width och sina radbrytningar ska sta kvar. */
.hero-reduced .eyebrow{max-width:760px}
.hero-reduced h1{font-size:clamp(52px,6vw,88px);max-width:9.7em}
.hero-reduced .hero-lede{max-width:500px;font-size:16px;line-height:1.65}
.hero-reduced .hero-actions{align-items:stretch;gap:12px}
.hero-reduced .hero-actions .button{min-width:235px;justify-content:space-between}
.hero-advisory{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-top:20px;max-width:520px;padding:18px 20px;border:1px solid rgba(232,229,223,.24);background:rgba(7,9,13,.58);box-shadow:0 1rem 2rem -1rem #000}
.hero-advisory-copy{display:flex;flex-direction:column;gap:8px}
.hero-advisory .section-kicker{color:#a4abb2}
.hero-advisory strong{font-size:15px;font-weight:600;letter-spacing:-.03em;color:var(--paper)}
.hero-advisory-copy p{max-width:270px;color:#aeb4ba;font-size:12px;line-height:1.5}
.hero-advisory .button{flex:none;margin:0;white-space:nowrap}
.hero-reduced .hero-vignette{background:
  linear-gradient(90deg,rgba(5,6,8,.96) 0%,rgba(5,6,8,.56) 37%,transparent 74%),
  linear-gradient(0deg,#07090d 0%,rgba(7,9,13,.98) 5%,rgba(7,9,13,.72) 15%,
    rgba(7,9,13,.18) 31%,transparent 47%,rgba(5,6,8,.35) 100%)}
/* 2026-09-01: forankrad vid rubriken i stallet for centrerad. Med top:50 % foljde
   filmen sektionens mitt, och eftersom sektionen numera vaxer med innehallet
   hamnade den 3 px fran kortraden vid 1280 px - de missade varandra av ren tur.
   Ovanfor korten ar avstandet i stallet givet av layouten. */
.hero-right-stack{position:absolute;z-index:3;right:6vw;top:196px;transform:none;
  width:min(33vw,450px);display:grid;gap:12px}
.hero-explainer{margin:0;border:1px solid rgba(232,229,223,.24);background:rgba(7,9,13,.78);
  box-shadow:0 1rem 2rem -1rem #000;overflow:hidden}
.hero-explainer video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#050609}
.hero-explainer figcaption{padding:10px 12px;color:#aeb4ba;font:9px 'DM Mono',monospace;
  letter-spacing:.06em;text-transform:uppercase}
.hero-decision{position:relative;z-index:1;right:auto;top:auto;transform:none;
  width:auto;padding:24px 20px;border-top:1px solid rgba(232,229,223,.34);
  border-bottom:1px solid rgba(232,229,223,.34);display:flex;align-items:center;
  justify-content:space-between;gap:12px;background:rgba(7,9,13,.48);
  backdrop-filter:blur(10px);font:10px 'DM Mono',monospace;letter-spacing:.1em;
  text-transform:uppercase;color:var(--paper);animation:decision-in .7s .18s both}
.hero-decision i{width:18px;height:1px;background:var(--accent);flex:none}
@keyframes decision-in{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}

.public-thesis{background:#07090d;color:var(--paper)}
.public-thesis .section-kicker{color:#8d9298}
.editorial-split{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:9vw;align-items:end;margin-top:68px}
.editorial-split h2,.solution-index h2,.method-public h2,.platform-public h2,
.faq-section h2,.access-section h2{font-size:clamp(44px,6.3vw,90px);line-height:.95;
  letter-spacing:-.075em;font-weight:600}
.editorial-split h2 span{color:var(--accent)}
.editorial-copy{max-width:430px}
.editorial-copy p{font-size:16px;line-height:1.75;color:#b2b7bc}
.editorial-copy p+p{margin-top:18px}

.offer-intro{display:flex;justify-content:space-between;align-items:end;gap:32px;
  margin-top:110px;padding-top:36px;border-top:1px solid rgba(232,229,223,.14)}
.offer-intro p{max-width:520px;color:#aeb4ba;font-size:15px;line-height:1.7}
/* 2026-09-01: sektionen heter "Tre satt att arbeta med GeoFlow" och har tre
   kort, men gridet var hardkodat till tva kolumner - tredje kortet hamnade
   ensamt pa rad tva med ett tomt falt bredvid. */
.offer-paths{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:18px;margin-top:34px}
.offer-path{--glow-x:50%;--glow-y:50%;position:relative;isolation:isolate;overflow:hidden;
  padding:42px;display:flex;flex-direction:column;min-height:430px;border-radius:14px;
  border:1px solid rgba(232,229,223,.14);background:
    radial-gradient(260px circle at var(--glow-x) var(--glow-y),rgba(199,255,84,.14),transparent 68%),
    rgba(10,13,17,.94);box-shadow:0 1rem 2rem -1rem #000;backdrop-filter:blur(5px);
  touch-action:none}
.offer-path::before{content:"";pointer-events:none;position:absolute;inset:-1px;padding:1px;
  border-radius:inherit;background:radial-gradient(190px circle at var(--glow-x) var(--glow-y),
    rgba(199,255,84,1),rgba(199,255,84,.28) 38%,transparent 72%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude}
.offer-path::after{content:"";pointer-events:none;position:absolute;inset:-16px;z-index:-1;
  background:radial-gradient(160px circle at var(--glow-x) var(--glow-y),
    rgba(199,255,84,.22),transparent 72%);filter:blur(18px)}
.offer-path>*{position:relative;z-index:1}
.offer-no{font:10px 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#b3d977}
.offer-path h3{margin-top:24px;font-size:clamp(28px,3vw,42px);line-height:1;
  letter-spacing:-.055em;font-weight:600;color:var(--paper)}
.offer-path ul{list-style:none;margin:34px 0 42px;padding:0}
.offer-path li{position:relative;padding:11px 0 11px 22px;border-bottom:1px solid rgba(232,229,223,.12);
  color:#adb3b8;font-size:14px;line-height:1.55}
.offer-path li:before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;
  border-radius:50%;background:var(--accent);box-shadow:0 0 12px rgba(199,255,84,.4)}
.offer-path .button{margin-top:auto;align-self:flex-start}
.button-dark{color:var(--ink);background:var(--accent)}
.button-dark:hover{color:var(--ink);background:#e6ffae;transform:translateY(-2px)}
:where(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.public-thesis :where(a,button,input,select,textarea,summary):focus-visible,
.faq-section :where(a,button,input,select,textarea,summary):focus-visible{outline-color:var(--accent)}

.solution-index{background:linear-gradient(180deg,#07090d 0,#0d1319 120px)}
.solution-index .use-head{margin-top:65px}
.solution-lines{border-top:1px solid var(--line)}
.solution-lines>a{display:grid;grid-template-columns:70px 1fr 32px;gap:24px;
  align-items:center;padding:28px 0;border-bottom:1px solid var(--line);
  text-decoration:none;color:inherit;transition:padding .28s ease,color .28s ease}
.solution-lines>a>span{font:10px 'DM Mono',monospace;color:#737b83}
.solution-lines h3{font-size:24px;font-weight:550;letter-spacing:-.045em}
.solution-lines p{margin-top:7px;color:#8e959d;font-size:14px;line-height:1.55}
.solution-lines b{font:18px 'DM Mono',monospace;color:var(--accent);text-align:right}
.solution-lines>a:hover{padding-left:12px;color:var(--accent)}
.form-fallback{margin:12px 0 0;color:#8e959d;font-size:12px;line-height:1.5}.form-fallback a{color:var(--paper);text-underline-offset:3px}.form-fallback a:hover,.form-fallback a:focus-visible{color:var(--accent)}
.method-public{min-height:760px}
.method-public .media-inner{max-width:960px}
.platform-visual figcaption{padding:12px 16px;color:#9aa1a8;font:10px 'DM Mono',monospace;letter-spacing:.06em;text-transform:uppercase}
.principle-lines{list-style:none;margin:52px 0 0;padding:0;max-width:760px;
  border-top:1px solid rgba(232,229,223,.24)}
.principle-lines li{display:grid;grid-template-columns:54px 1fr;gap:18px;padding:22px 0;
  border-bottom:1px solid rgba(232,229,223,.18)}
.principle-lines li>span{font:10px 'DM Mono',monospace;color:var(--accent);padding-top:4px}
.principle-lines strong{font-size:18px;font-weight:600}
.principle-lines p{margin-top:6px;color:#a8adb2;font-size:14px;line-height:1.6}

.platform-public{background:linear-gradient(180deg,#11161c 0,#11161c calc(100% - 120px),#07090d 100%)}
.platform-public .editorial-split h2 span{color:var(--accent)}
.platform-public .editorial-copy p{color:#a9aeb4}
.platform-offerings{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;list-style:none;margin:24px 0 0;padding:0;border-top:1px solid rgba(232,229,223,.14)}
.platform-offerings li{padding:11px 0;border-bottom:1px solid rgba(232,229,223,.12);color:#aeb4ba;font-size:13px;line-height:1.45}
.platform-offerings li::before{content:"+";margin-right:8px;color:var(--accent);font-family:'DM Mono',monospace}
.platform-visual{max-width:980px;margin:72px auto 0;background:transparent}
.platform-visual img{display:block;width:100%;height:auto;filter:drop-shadow(0 1.5rem 2.5rem rgba(0,0,0,.6))}
.inline-actions{display:flex;gap:14px;align-items:center;margin-top:28px}

.faq-section{background:#07090d;color:var(--paper)}
.faq-section .section-kicker{color:#8d9298}
.faq-section h2{margin-top:54px}
.faq-section h2 span{color:var(--accent)}
.faq-list{margin-top:60px;border-top:1px solid rgba(232,229,223,.16)}
.faq-list details{border-bottom:1px solid rgba(232,229,223,.14)}
.faq-list summary{list-style:none;cursor:pointer;padding:24px 48px 24px 0;
  position:relative;font-size:20px;font-weight:600;letter-spacing:-.03em;color:var(--paper)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:"+";position:absolute;right:2px;top:21px;
  font:24px 'DM Mono',monospace;color:var(--accent)}
.faq-list details[open] summary:after{content:"−"}
.faq-list details p{max-width:720px;padding:0 0 25px;color:#aeb4ba;
  font-size:15px;line-height:1.7}

.access-section{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(420px,1.28fr);
  gap:8vw;background:linear-gradient(180deg,#07090d 0,#0b0f14 120px,
  #0b0f14 calc(100% - 120px),#0a0c10 100%)}
.access-copy h2{margin-top:42px;color:var(--accent)}
.access-copy p{max-width:410px;margin-top:24px;color:#9ba1a8;font-size:16px;line-height:1.7}
.access-form{align-self:start;border-top:1px solid var(--line);padding-top:24px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.access-form>label,.form-grid label{display:flex;flex-direction:column;gap:9px;
  font:10px 'DM Mono',monospace;letter-spacing:.09em;text-transform:uppercase;color:#9299a1}
.access-form>label{margin-top:20px}
.access-form input,.access-form select,.access-form textarea{width:100%;border:1px solid rgba(232,229,223,.25);
  border-radius:0;background:#0d1319;color:var(--paper);padding:13px 14px;
  font:14px Manrope,system-ui,sans-serif;outline:none}
.access-form input:focus,.access-form select:focus,.access-form textarea:focus{border-color:var(--accent)}
.access-form textarea{resize:vertical;min-height:108px}
.field-optional{font-size:8px;color:#67707a;margin-left:5px}
.access-form .form-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.access-form .form-consent{display:grid;grid-template-columns:18px 1fr;align-items:start;
  gap:11px;text-transform:none;letter-spacing:0;font:13px/1.55 Manrope,system-ui,sans-serif}
.form-consent input{width:16px;height:16px;margin:2px 0 0;accent-color:var(--accent)}
.form-consent a{color:var(--accent)}
.form-submit{display:flex;align-items:center;gap:20px;margin-top:22px}
.form-submit .button{border:0;cursor:pointer;margin:0}
.form-submit .button:disabled{opacity:.55;cursor:wait}
.form-status{font-size:13px;line-height:1.5;color:#a9aeb4}
.form-status[data-state="error"]{color:#f1a490}
.form-status[data-state="success"]{color:var(--accent)}

@media(max-width:1180px){
  .main-nav{gap:19px;margin-right:12px}
  .hero-reduced .hero-copy{left:auto;margin-left:6vw;max-width:590px}
  .hero-right-stack{right:4vw;width:min(30vw,330px)}
}
@media(max-width:820px) and (min-width:701px){.header-queue{display:none}}
@media(max-width:900px) and (min-width:701px){
  .main-nav a:nth-child(2){display:none}
  /* 2026-09-01: filmen lag med bottom:26px mot heroens nederkant. Nu nar
     sektionen vaxer med innehallet hamnade den ovanpa kortraden. Har finns
     anda inte plats for tva spalter, sa filmen far folja normalflodet och
     lagga sig under texten - och da behover hero-copy inte langre lamna
     plats at den vid sidan. */
  .hero-reduced .hero-copy{max-width:88vw;padding-bottom:40px}
  .hero-right-stack{position:static;top:auto;bottom:auto;right:auto;left:auto;
    transform:none;width:auto;max-width:min(560px,88vw);margin:0 6vw 90px}
  .hero-decision{flex-direction:row;align-items:center;padding:20px 16px;background:rgba(7,9,13,.78)}
  .hero-decision i{width:42px}
  .editorial-split{grid-template-columns:1fr;gap:34px}
  .offer-path{padding:32px}
  .access-section{grid-template-columns:1fr}
}
@media(max-width:700px){
  .header-actions{display:none}
  .brand-logo-horizontal{width:148px;height:44px;padding:3px 0}
  .hero-reduced{height:auto;min-height:940px}
  .hero-reduced .hero-copy{top:auto;left:auto;right:auto;margin:0 6vw;max-width:none;padding:140px 0 72px}
  .hero-reduced h1{font-size:clamp(48px,15vw,68px)}
  .hero-reduced .hero-lede{font-size:14px;line-height:1.6;max-width:440px}
  .hero-reduced .hero-actions{flex-direction:row;flex-wrap:wrap}
  .hero-advisory{align-items:flex-start;flex-direction:column;gap:12px;margin-top:20px}
  .hero-advisory{padding:16px 18px}
  .hero-advisory .button{align-self:flex-start}
  /* Samma sak pa mobil: normalflode i stallet for bottom-forankring. */
  .hero-right-stack{position:static;top:auto;bottom:auto;left:auto;right:auto;
    transform:none;width:auto;margin:0 6vw 76px;gap:10px}
  .hero-explainer figcaption{display:none}
  .hero-decision{padding:18px 0;background:rgba(7,9,13,.72);backdrop-filter:blur(8px)}
  .hero-decision i{width:24px}
  .hero-reduced .hero-meta{display:none}
  .editorial-split{grid-template-columns:1fr;gap:34px;margin-top:45px}
  .offer-intro{display:block;margin-top:72px;padding-top:28px}
  .offer-intro p{margin-top:16px}
  .offer-paths{grid-template-columns:1fr}
  .offer-path{min-height:0;padding:30px 24px}
  .offer-path+.offer-path{border-left:1px solid rgba(232,229,223,.14)}
  .offer-path ul{margin:26px 0 34px}
  .solution-index .use-head{margin-top:44px}
  .solution-lines>a{grid-template-columns:38px 1fr 22px;gap:12px;padding:22px 0}
  .solution-lines h3{font-size:20px}
  .solution-lines p{font-size:13px}
  .inline-actions{align-items:flex-start;flex-direction:column}
  .platform-offerings{grid-template-columns:1fr}
  .platform-visual{margin-top:48px}
  .access-section{grid-template-columns:1fr;gap:48px}
  .form-grid{grid-template-columns:1fr}
  .form-submit{align-items:flex-start;flex-direction:column}
  .faq-list summary{font-size:18px}
  .public-thesis{background:#07090d}
  .platform-public{background:linear-gradient(180deg,#11161c 0,#11161c calc(100% - 72px),#07090d 100%)}
  .faq-section{background:#07090d}
  .access-section{background:linear-gradient(180deg,#07090d 0,#0b0f14 72px,
    #0b0f14 calc(100% - 72px),#0a0c10 100%)}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-decision{animation:none}
  .media-section:before{transform:none}
  .offer-path{background:rgba(10,13,17,.94)}
  .foot-social a{transition:none}
  .foot-social a:hover{transform:none}
  .foot-trust-row{align-items:flex-start;flex-direction:column;gap:12px}
  .foot-trust-label{min-width:0}
}


/* --- Traffytor -----------------------------------------------------------
   WCAG 2.2 AA (2.5.8 Target Size, Minimum) kraver 24x24 CSS-px for klickmal
   som inte ligger inbaddade i en lopande textmening. Huvudnavigationen och
   sidfotslankarna lag pa 13-19 px hojd. Padding hojer traffytan utan att
   flytta texten, eftersom bada raderna ar flex med centrerad justering.
   Lankar inuti brodtext (t.ex. "integritetspolicyn") ar undantagna i
   standarden och lamnas ororda. ------------------------------------------ */
.main-nav a,
.foot-nav a,
.foot-row a{display:inline-flex;align-items:center;min-height:24px}
.foot-social a{min-height:24px}
.nav-panel a{min-height:44px}

.pay-marks .trust-mark{background:#fff;border-color:rgba(232,229,223,.22);align-items:center;gap:7px;padding:7px 12px}
.pay-marks .trust-mark strong{font:800 13px Manrope,sans-serif;letter-spacing:.03em;text-transform:none;color:#14181c}
.pay-marks .pay-visa strong{color:#1434cb;font-style:italic;letter-spacing:.06em}
.pay-marks svg{height:18px;width:auto;display:block;flex:0 0 auto}

/* 2026-08-30: ny huvudrubrik i hero - Michroma versalt, underrubrik gemener. */
.hero-title-lockup{display:flex;flex-direction:column;gap:14px;max-width:14em}
.hero-title-main{font-family:Michroma,Manrope,sans-serif;text-transform:uppercase;
  font-size:clamp(34px,5.4vw,78px);line-height:1.06;letter-spacing:-.015em;
  color:var(--accent);font-weight:400;
  text-shadow:0 0 34px rgba(199,255,84,.22)}
.hero-title-sub{font-family:Manrope,sans-serif;text-transform:none;font-weight:800;
  font-size:clamp(18px,2vw,29px);line-height:1.3;letter-spacing:-.015em;color:var(--paper);
  max-width:22em}
.hero-reduced h1.hero-title-lockup{font-size:inherit;max-width:15em}

/* 2026-08-30: human flows lyft fram i forfragan om konsultrapport. */
.flow-panel{margin-top:26px;padding:22px 22px 24px;border:1px solid rgba(232,229,223,.14);
  background:rgba(199,255,84,.035)}
.flow-panel h3{margin:10px 0 12px;font-size:clamp(19px,2vw,25px);letter-spacing:-.02em;color:var(--paper)}
.flow-panel p{margin:0 0 14px;max-width:52ch;color:#b6bcc3;font-size:14px;line-height:1.65}
.flow-list{margin:0 0 16px;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.flow-list li{position:relative;padding-left:18px;font-size:14px;color:#c9ced4;line-height:1.5}
.flow-list li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:1px;background:var(--accent)}
.flow-list strong{color:var(--paper)}
.flow-limit{font-size:13px;color:#8d949c;border-top:1px solid rgba(232,229,223,.1);padding-top:14px;margin:0}
.flow-topics{margin:0 0 4px;padding:0;border:0}
.flow-topics legend{padding:0;margin-bottom:10px;font:10px 'DM Mono',monospace;
  letter-spacing:.1em;text-transform:uppercase;color:#8d949c}
.flow-topic-grid{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.flow-topic{display:flex;align-items:center;gap:9px;min-height:44px;padding:8px 12px;
  border:1px solid rgba(232,229,223,.14);font-size:13px;color:#c9ced4;cursor:pointer}
.flow-topic:hover{border-color:rgba(199,255,84,.45)}
.flow-topic input{width:16px;height:16px;accent-color:var(--accent);flex:0 0 auto}
.flow-topic:has(input:checked){border-color:var(--accent);background:rgba(199,255,84,.07);color:var(--paper)}

/* 2026-08-30: forklarande Advisors Intelligence-sektion pa startsidan. */
.adv-section{display:flex;flex-direction:column;gap:34px}
.adv-head h2{margin:8px 0 14px;font-size:clamp(28px,3.6vw,46px);letter-spacing:-.03em;color:var(--paper)}
.adv-lede{margin:0;max-width:62ch;font-size:16px;line-height:1.7;color:#b6bcc3}
.adv-lede strong{color:var(--paper)}
/* 2026-09-01: sex grupper i fyra kolumner gav en ojamn 4+2-rad. Nu 3+3. */
.adv-groups{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
/* Explicit tre kolumner over 1000 px: med auto-fit blev det fyra pa breda
   skarmar (1920 px) och den ojamna 4+2-raden kom tillbaka. */
@media (min-width:1000px){.adv-groups{grid-template-columns:repeat(3,minmax(0,1fr))}}
.adv-group{border:1px solid rgba(232,229,223,.13);padding:18px 18px 20px;
  display:flex;flex-direction:column;gap:10px;min-width:0}
.adv-group:hover{border-color:rgba(199,255,84,.4)}
.adv-group header{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.adv-group-key{font:11px 'DM Mono',monospace;color:var(--accent);letter-spacing:.1em}
.adv-group h3{margin:0;font-size:17px;letter-spacing:-.01em;color:var(--paper);flex:1;min-width:0}
.adv-group-count{font:10px 'DM Mono',monospace;color:#7d848c;letter-spacing:.08em;text-transform:uppercase}
.adv-group p{margin:0;font-size:13.5px;line-height:1.6;color:#a8aeb5}
.adv-cols{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.adv-col h3{margin:0 0 14px;font-size:19px;letter-spacing:-.02em;color:var(--paper)}
.adv-note{margin:0 0 14px;font-size:13.5px;line-height:1.6;color:#8d949c;max-width:46ch}
.adv-steps{margin:0;padding:0;list-style:none;counter-reset:advstep;
  display:flex;flex-direction:column;gap:12px}
.adv-steps li{counter-increment:advstep;position:relative;padding-left:38px;min-width:0}
.adv-steps li::before{content:counter(advstep,decimal-leading-zero);position:absolute;left:0;top:1px;
  font:11px 'DM Mono',monospace;color:var(--accent);letter-spacing:.06em}
.adv-steps strong{display:block;font-size:14.5px;color:var(--paper);margin-bottom:2px}
.adv-steps span{display:block;font-size:13.5px;line-height:1.6;color:#a8aeb5}
.adv-status{margin:0 0 20px;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.adv-status li{position:relative;padding-left:20px;min-width:0}
.adv-status li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;border-radius:50%}
.adv-status li[data-state="ok"]::before{background:#8fd98a}
.adv-status li[data-state="warn"]::before{background:#ffc24d}
.adv-status li[data-state="bad"]::before{background:#ff6b5a}
.adv-status li[data-state="idle"]::before{background:#6b737b}
.adv-status strong{display:block;font-size:14px;color:var(--paper)}
.adv-status span{display:block;font-size:13px;line-height:1.55;color:#8d949c}
.adv-cta{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:620px){.adv-cta .button{width:100%;justify-content:space-between}}


/* 2026-08-30: beslutsintelligens-band med interaktiv glob (cobe). */
.intelligence-band{display:grid;gap:38px;align-items:center;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.intel-copy h2{margin:8px 0 16px;font-size:clamp(28px,3.6vw,46px);line-height:1.08;
  letter-spacing:-.03em;color:var(--paper)}
.intel-copy h2 span{color:var(--accent)}
.intel-copy p{margin:0 0 14px;max-width:46ch;font-size:15px;line-height:1.7;color:#b6bcc3}
.intel-figure{margin:0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px}
#geo-globe{width:100%;max-width:560px;aspect-ratio:1;cursor:grab;opacity:0;
  transition:opacity 1.1s ease;touch-action:none;contain:layout paint}
.intel-figure figcaption{font:10px 'DM Mono',monospace;letter-spacing:.1em;
  text-transform:uppercase;color:#7d848c;text-align:center}
@media (max-width:900px){.intelligence-band{grid-template-columns:1fr;gap:26px}
  #geo-globe{max-width:420px}}
@media (prefers-reduced-motion:reduce){#geo-globe{transition:none}}

/* 2026-08-30: punkt 12 - losningarna som glasytor. */
.solution-glass a{position:relative;border:1px solid rgba(232,229,223,.14);
  background:linear-gradient(140deg,rgba(255,255,255,.055),rgba(255,255,255,.012));
  backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 34px rgba(0,0,0,.28)}
.solution-glass a:hover{border-color:rgba(199,255,84,.42);
  background:linear-gradient(140deg,rgba(199,255,84,.09),rgba(255,255,255,.02))}
.solution-glass a+a{margin-top:10px}

/* 2026-08-30: punkt 13 - bantad publik arkitektur. */
.platform-visual-slim svg{width:100%;height:auto;display:block}
.platform-visual-slim figcaption{margin-top:12px;font:10px 'DM Mono',monospace;
  letter-spacing:.1em;text-transform:uppercase;color:#7d848c}
@media (max-width:760px){.platform-visual-slim svg{min-width:640px}
  .platform-visual-slim{overflow-x:auto}}

/* 2026-08-30: sprakvaljare i headern. Inline-SVG-flaggor - emoji-flaggor
   renderas inte alls pa Windows. */
.lang-switch{position:relative;margin-left:auto;margin-right:14px}
.lang-trigger{display:flex;align-items:center;gap:8px;min-height:36px;padding:6px 10px;
  background:rgba(7,9,13,.55);border:1px solid rgba(232,229,223,.16);color:#c9ced4;
  font:12px Manrope,sans-serif;cursor:pointer;border-radius:2px}
.lang-trigger:hover{border-color:rgba(199,255,84,.4)}
.lang-label{font:9px 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#7d848c}
.lang-current{color:#e8e5df}
.lang-trigger b{color:#7d848c;font-size:10px}
.flag{display:block;width:18px;height:12px;flex:none;overflow:hidden;border-radius:1px;
  box-shadow:0 0 0 1px rgba(0,0,0,.35)}
.flag svg{width:100%;height:100%;display:block}
.lang-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:184px;z-index:60;
  display:none;flex-direction:column;padding:5px;
  background:#0d1014;border:1px solid rgba(232,229,223,.16);
  box-shadow:0 18px 44px rgba(0,0,0,.5)}
.lang-switch[data-open="true"] .lang-menu{display:flex}
.lang-menu button{display:flex;align-items:center;gap:10px;min-height:40px;padding:8px 10px;
  background:none;border:0;color:#c9ced4;font:13px Manrope,sans-serif;cursor:pointer;text-align:left}
.lang-menu button:hover:not(:disabled){background:rgba(199,255,84,.09);color:#e8e5df}
.lang-menu button[aria-checked="true"]{color:var(--accent)}
.lang-menu button:disabled{opacity:.42;cursor:not-allowed}
.lang-menu button:disabled span::after{content:" \2022 kommer";font-size:10px;color:#7d848c}
@media (max-width:760px){.lang-label{display:none}.lang-switch{margin-right:8px}}

/* 2026-08-30: Titan-maskoten pa Enterprise AI. Rullar in nar sektionen syns.
   Saknas bildfilen tar onerror bort hela blocket - ingen trasig ikon. */
.titan-mascot{position:fixed;right:26px;bottom:26px;z-index:40;
  display:flex;align-items:flex-end;gap:10px;pointer-events:none;
  transform:translateX(140%);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.titan-mascot.is-in{transform:translateX(0)}
.titan-mascot img{width:112px;height:auto;display:block;
  filter:drop-shadow(0 10px 26px rgba(0,0,0,.55));
  animation:titan-bob 4.5s ease-in-out infinite}
.titan-bubble{position:relative;margin-bottom:34px;padding:9px 13px;
  background:var(--accent);color:#07090d;font:600 13px Manrope,sans-serif;
  white-space:nowrap;border-radius:3px;
  opacity:0;transform:translateY(6px);transition:opacity .5s .6s,transform .5s .6s}
.titan-mascot.is-in .titan-bubble{opacity:1;transform:translateY(0)}
.titan-bubble::after{content:"";position:absolute;right:-6px;bottom:9px;
  border:6px solid transparent;border-left-color:var(--accent);border-right:0}
@keyframes titan-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (max-width:760px){.titan-mascot img{width:78px}.titan-bubble{font-size:12px}}
@media (prefers-reduced-motion:reduce){
  .titan-mascot{transition:none;transform:none}
  .titan-mascot img{animation:none}
  .titan-bubble{transition:none;opacity:1;transform:none}}

/* 2026-08-30: explainerfilmen ca 50 % storre. */
/* 2026-09-01: bredden styrs av .hero-right-stack. Tidigare tvingade en egen
   width:min(46vw,720px) figuren 272 px utanfor sin behallare och 186 px
   utanfor viewporten vid 1440 px - hogerkanten av videon kapades bort. */
.hero-explainer{max-width:100%;width:100%}
.hero-explainer video{width:100%;height:auto;display:block;background:#000}
@media (max-width:1100px){.hero-explainer{width:100%}}
@media (max-width:760px){.hero-explainer{width:100%}}

/* =================================================================
   2026-08-30: de tre ingangskorten i hero.
   Referens: mork "kortlek pa bordet" med tunna ramar, monospace-etiketter
   och limegron accent. Kortet lyfts vid hover och den langre texten
   fars fram - sa slipper hero bli tre skarmhojder hog i viloläge.
   ================================================================= */
.hero-card-grid{position:relative;display:grid;gap:14px;margin-top:30px;max-width:1180px;
  grid-template-columns:repeat(auto-fit,minmax(272px,1fr));perspective:1400px}
.hero-card-grid::before{content:"";position:absolute;inset:-34px -26px -26px;z-index:-1;
  background:url("assets/hero-geoflow-v2.png") center/cover no-repeat;
  opacity:.2;filter:saturate(1.1) blur(1px);
  mask-image:radial-gradient(120% 90% at 50% 45%,#000 40%,transparent 100%);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 45%,#000 40%,transparent 100%)}

.hero-card{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;
  padding:20px 20px 22px;
  background:linear-gradient(158deg,rgba(16,20,26,.93),rgba(7,9,13,.97));
  border:1px solid rgba(232,229,223,.16);
  box-shadow:0 16px 40px rgba(0,0,0,.5);
  transition:transform .42s cubic-bezier(.22,1,.36,1),
             box-shadow .42s ease, border-color .28s ease}
.hero-card::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:var(--accent);transform:scaleX(0);transform-origin:left;
  transition:transform .42s cubic-bezier(.22,1,.36,1)}
.hero-card:hover,.hero-card:focus-within{
  transform:translateY(-14px) scale(1.028);
  border-color:rgba(199,255,84,.55);
  box-shadow:0 30px 70px rgba(0,0,0,.62),0 0 0 1px rgba(199,255,84,.22),
             0 0 46px rgba(199,255,84,.13);z-index:2}
.hero-card:hover::after,.hero-card:focus-within::after{transform:scaleX(1)}
.hero-card:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

.hero-card header{display:flex;align-items:baseline;gap:10px}
.hc-no{font:11px 'DM Mono',monospace;color:var(--accent);letter-spacing:.14em}
.hc-kicker{font:9px 'DM Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:#7d848c}
.hero-card h3{margin:0;font-size:20px;letter-spacing:-.025em;color:var(--paper);line-height:1.18}
.hc-lead{margin:0;font-size:13.5px;line-height:1.6;color:#c3c9d0}
.hc-more{margin:0;font-size:13px;line-height:1.62;color:#9aa1a9;
  max-height:0;opacity:0;overflow:hidden;
  transition:max-height .5s cubic-bezier(.22,1,.36,1),opacity .38s ease,margin .5s ease}
.hero-card:hover .hc-more,.hero-card:focus-within .hc-more{max-height:420px;opacity:1;margin-top:2px}
.hero-card .button{margin-top:auto;width:100%;justify-content:space-between;min-height:44px}

@media (max-width:900px){
  .hero-card-grid{margin-top:22px}
  .hc-more{max-height:none;opacity:1}      /* pa touch finns ingen hover */
  .hero-card:hover{transform:none}
}
@media (prefers-reduced-motion:reduce){
  .hero-card,.hero-card::after,.hc-more{transition:none}
  .hero-card:hover,.hero-card:focus-within{transform:none}
  .hc-more{max-height:none;opacity:1}
}

/* =================================================================
   02 / Losningar - raderna poppar upp rejalt vid hover.
   ================================================================= */
.solution-glass a{transition:transform .4s cubic-bezier(.22,1,.36,1),
  box-shadow .4s ease,border-color .28s ease,background .28s ease}
.solution-glass a:hover,.solution-glass a:focus-visible{
  transform:translateY(-10px) scale(1.022);
  border-color:rgba(199,255,84,.6);
  background:linear-gradient(140deg,rgba(199,255,84,.13),rgba(255,255,255,.03));
  box-shadow:0 26px 58px rgba(0,0,0,.6),0 0 0 1px rgba(199,255,84,.26),
             0 0 40px rgba(199,255,84,.14);z-index:2}
.solution-glass a:hover h3{color:var(--accent)}
.solution-glass a:hover b{transform:translate(4px,-4px)}
.solution-glass a b{display:inline-block;transition:transform .35s cubic-bezier(.22,1,.36,1)}
@media (prefers-reduced-motion:reduce){
  .solution-glass a,.solution-glass a b{transition:none}
  .solution-glass a:hover{transform:none}
}

/* =================================================================
   2026-08-30: Titan-assistenten och ML/RAG-processen.
   ================================================================= */
/* 2026-09-01: .intelligence-band ar ett tvakolumnsgrid och assistenten ar dess
   tredje barn - utan grid-column hamnade hela blocket i vansterkolumnen
   (578 av 1194 px) med halva sektionen tom, och .ta-cols kollapsade da till
   en kolumn sa de tva kunskapsspalterna staplades pa hojden. */
.titan-assistant{grid-column:1/-1;margin-top:52px;padding-top:38px;
  border-top:1px solid rgba(232,229,223,.12)}
.ta-intro{display:grid;gap:26px;align-items:center;
  grid-template-columns:minmax(0,190px) minmax(0,1fr)}
.ta-portrait{margin:0;min-width:0}
.ta-portrait img{width:100%;height:auto;display:block;
  filter:drop-shadow(0 16px 40px rgba(0,0,0,.6));
  animation:ta-bob 5.5s ease-in-out infinite}
@keyframes ta-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.ta-copy h3{margin:10px 0 12px;font-size:clamp(24px,2.8vw,36px);letter-spacing:-.03em;
  color:var(--paper);line-height:1.1}
.ta-copy p{margin:0;max-width:56ch;font-size:15px;line-height:1.7;color:#b6bcc3}
.ta-cols{margin-top:34px;display:grid;gap:34px;
  grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}
.ta-col h4{margin:0 0 16px;font:10px 'DM Mono',monospace;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent)}
.ml-steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px}
.ml-steps li{display:flex;gap:13px;min-width:0}
.ml-no{flex:none;font:11px 'DM Mono',monospace;color:var(--accent);letter-spacing:.1em;
  padding-top:2px}
.ml-steps strong{display:block;font-size:14.5px;color:var(--paper);margin-bottom:3px}
.ml-steps p{margin:0;font-size:13.5px;line-height:1.62;color:#9aa1a9;max-width:48ch}
.rag-list{margin:0 0 16px;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px}
.rag-list li{position:relative;padding-left:18px;min-width:0}
.rag-list li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:1px;
  background:var(--accent)}
.rag-list strong{display:block;font-size:14.5px;color:var(--paper);margin-bottom:3px}
.rag-list p{margin:0;font-size:13.5px;line-height:1.62;color:#9aa1a9;max-width:48ch}
.ta-note{margin:0;padding-top:14px;border-top:1px solid rgba(232,229,223,.1);
  font-size:12.5px;line-height:1.6;color:#7d848c;max-width:48ch}
@media (max-width:760px){.ta-intro{grid-template-columns:1fr;gap:18px}
  .ta-portrait{max-width:150px}}
@media (prefers-reduced-motion:reduce){.ta-portrait img{animation:none}}

/* =================================================================
   2026-08-30: laptopram runt den riktiga Titan-skarmdumpen.
   ================================================================= */
.platform-device{margin:0;min-width:0}
.device-frame{position:relative;border:1px solid rgba(232,229,223,.2);border-radius:8px;
  overflow:hidden;background:#0d1014;
  box-shadow:0 30px 70px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.04) inset}
.device-bar{display:flex;align-items:center;gap:7px;padding:9px 13px;
  background:linear-gradient(180deg,#191f26,#12171d);
  border-bottom:1px solid rgba(232,229,223,.12)}
.device-bar i{width:9px;height:9px;border-radius:50%;background:#39404a;flex:none}
.device-bar i:first-child{background:#c7ff54}
.device-bar span{margin-left:10px;font:9px 'DM Mono',monospace;letter-spacing:.12em;
  text-transform:uppercase;color:#7d848c}
.device-frame img{width:100%;height:auto;display:block}
.platform-device figcaption{margin-top:12px;font:10px 'DM Mono',monospace;
  letter-spacing:.1em;text-transform:uppercase;color:#7d848c}