:root {
  color-scheme: dark;
  --bg:#070b19; --panel:#131c32; --panel2:#101729;
  --ink:#f2f6ff; --muted:#b9c7dd; --fine:#8fa4c3;
  --edge:rgba(172,196,241,.18);
  --accent:#77b2ff; --aqua:#6fe7d1; --violet:#a4a2ff;
  --shadow: 0 24px 65px rgba(0,0,0,.22);
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  min-height:100vh; margin:0; color:var(--ink); background:var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.6; text-rendering:optimizeLegibility;
}
body::before {
  content:""; position:absolute; inset:0 0 auto; height:760px; z-index:-1;
  background:
    radial-gradient(ellipse 44% 44% at 16% 11%,rgba(51,98,203,.31),transparent 84%),
    radial-gradient(ellipse 48% 45% at 85% 21%,rgba(87,56,164,.27),transparent 83%),
    radial-gradient(ellipse 31% 33% at 57% 54%,rgba(15,117,129,.15),transparent 85%);
  pointer-events:none;
}
a { color:inherit; }
a:focus-visible,button:focus-visible { outline:3px solid var(--aqua); outline-offset:4px; }
.skip { position:absolute; top:-100px; left:12px; z-index:10; color:#071226; background:#dff8ff; padding:9px 16px; border-radius:8px; }
.skip:focus { top:10px; }
.container { width:min(1160px,calc(100% - 42px)); margin-inline:auto; }
.review-banner { background:#252036; border-bottom:1px solid #836f41; color:#f0d9a1; padding:11px 20px; font-size:.84rem; text-align:center; }
.review-banner strong { color:#fff3cd; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:22px; padding:26px 0; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.logo { display:grid; place-items:center; width:48px; height:48px; color:#eaf9ff; font-size:25px; font-weight:800;
  border-radius:15px; letter-spacing:-.09em;
  background:linear-gradient(135deg,rgba(94,159,255,.9),rgba(134,99,230,.8));
  box-shadow:0 8px 28px rgba(63,121,229,.25);
}
.brandtext { display:grid; gap:0px; line-height:1.25; }
.brandtext strong { font-size:1rem; letter-spacing:-.01em; }
.brandtext small { font-size:.75rem; color:var(--muted); }
nav { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.nav-link { text-decoration:none; color:var(--muted); font-size:.91rem; font-weight:560; padding:10px 13px; border-radius:10px; }
.nav-link:hover,.nav-link[aria-current=page] { color:var(--ink); background:rgba(255,255,255,.075); }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:9px;
  min-height:48px; padding:10px 20px; border:1px solid transparent; border-radius:13px;
  font-size:.94rem; font-weight:700; line-height:1.35; text-decoration:none; transition:transform .18s ease,background .18s ease; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { background:linear-gradient(110deg,#75b6ff,#a19bff); color:#081127; box-shadow:0 10px 24px rgba(104,155,249,.18); }
.btn-primary:hover { background:linear-gradient(110deg,#91c5ff,#b8b1ff); }
.btn-secondary { color:var(--ink); border-color:rgba(207,222,251,.25); background:rgba(255,255,255,.055); }
.btn-secondary:hover { background:rgba(255,255,255,.10); }
.eyebrow { color:var(--aqua); font-size:.75rem; font-weight:800; letter-spacing:.20em; text-transform:uppercase; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(2.75rem,6.8vw,5.5rem); letter-spacing:-.065em; line-height:1.07; font-weight:790; }
h2 { font-size:clamp(1.55rem,3vw,2.25rem); letter-spacing:-.04em; line-height:1.22; }
h3 { font-size:1.1rem; letter-spacing:-.02em; }
p { color:var(--muted); }
.hero { padding:74px 0 88px; position:relative; display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr); gap:56px; align-items:center; }
.hero h1 { margin:20px 0; }
.hero h1 span { color:#90d8ff; }
.hero .lead { font-size:clamp(1.02rem,1.6vw,1.17rem); line-height:1.75; max-width:590px; }
.action-row { display:flex; gap:12px; flex-wrap:wrap; margin-top:30px; }
.micro { margin-top:24px; display:flex; gap:18px; flex-wrap:wrap; color:var(--fine); font-size:.83rem; }
.micro span::before { content:"✓"; color:var(--aqua); font-weight:800; margin-right:7px; }
.app-window { border:1px solid rgba(190,213,247,.23); border-radius:24px; overflow:hidden; background:linear-gradient(143deg,#1a2642,#10192c);
  box-shadow:var(--shadow),0 0 80px rgba(92,121,252,.12); transform:rotate(2deg); }
.window-top { height:49px; display:flex; align-items:center; justify-content:space-between; padding:0 21px; border-bottom:1px solid var(--edge); background:rgba(255,255,255,.03); }
.window-title { font-size:.76rem; font-weight:700; color:#d8e5fa; }
.dots { display:flex; gap:6px; }
.dots i { display:block; width:8px; height:8px; border-radius:50%; background:#607394; }
.dots i:first-child { background:#89bdf9; }
.window-content { display:grid; grid-template-columns:88px 1fr; min-height:340px; }
.window-rail { border-right:1px solid var(--edge); display:grid; align-content:start; justify-items:center; gap:18px; padding-top:25px; }
.rail-dot { width:29px; height:29px; border-radius:10px; background:rgba(156,174,242,.14); }
.rail-dot.active { background:linear-gradient(135deg,#729cff,#897adf); }
.chatlines { padding:22px 19px; }
.chatroomtitle { font-size:.85rem; font-weight:800; padding-bottom:16px; border-bottom:1px solid var(--edge); }
.fakechat { display:flex; gap:10px; margin-top:19px; align-items:flex-start; }
.avatar { flex:0 0 31px; display:grid; place-items:center; width:31px; height:31px; border-radius:11px; color:#11192b; font-size:.73rem; font-weight:800; background:#b8dcff; }
.avatar.v { background:#d1b8ff; } .avatar.m { background:#b0e9d7; }
.bubble { background:rgba(255,255,255,.058); border:1px solid rgba(196,216,254,.10); border-radius:3px 13px 13px 13px; padding:9px 13px; max-width:100%; color:#e1edff; font-size:.81rem; }
.bubble small { display:block; color:#9aadd0; font-size:.71rem; margin-bottom:3px; font-weight:700; }
.compose { margin:19px 0 3px; padding:11px 15px; border:1px solid var(--edge); border-radius:12px; font-size:.77rem; color:#8fa7c4; background:rgba(255,255,255,.025); }
.section { padding:22px 0 76px; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:20px; flex-wrap:wrap; margin-bottom:27px; }
.section-head p { max-width:570px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.feature { padding:28px; border-radius:22px; background:rgba(255,255,255,.04); border:1px solid var(--edge); }
.feature-icon { display:grid; place-items:center; height:43px; width:43px; border-radius:14px; background:rgba(113,166,255,.15); color:#a4d5ff; font-size:24px; margin-bottom:19px; }
.feature h3 { margin-bottom:9px; }
.feature p { font-size:.92rem; margin-bottom:0; }
.privacy-panel { border:1px solid rgba(126,186,219,.27); border-radius:26px; padding:clamp(26px,5vw,52px);
  background:linear-gradient(135deg,rgba(39,74,93,.38),rgba(36,43,88,.35));
  display:grid; grid-template-columns:1fr .82fr; gap:42px; align-items:center; }
.privacy-panel h2 { margin:14px 0 13px; }
.privacy-panel p { max-width:580px; }
.privacy-points { display:grid; gap:14px; }
.privacy-point { background:rgba(7,17,34,.37); padding:15px 17px; border:1px solid rgba(171,216,234,.14); border-radius:13px; color:#dfedf8; font-size:.91rem; }
.privacy-point b { color:var(--aqua); margin-right:8px; }
.notice { margin:20px 0 0; padding:17px 19px; border-radius:14px; background:rgba(247,192,105,.065); border:1px solid rgba(239,197,127,.23); color:#f2d4a5; font-size:.87rem; }
.notice strong { color:#ffe8b5; }
.contact { display:flex; justify-content:space-between; align-items:center; gap:30px; margin:56px 0 80px; padding:25px 0; border-top:1px solid var(--edge); }
.contact p { margin-bottom:0; }
.footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px;
  padding:28px 0 42px; border-top:1px solid var(--edge); font-size:.81rem; color:var(--fine); }
.footer a { color:#b8cee9; text-decoration:none; }
.footer a:hover { text-decoration:underline; }
.footer-links { display:flex; flex-wrap:wrap; gap:19px; }
.legal-hero { padding:64px 0 25px; }
.legal-hero h1 { font-size:clamp(2.55rem,5vw,4.2rem); max-width:780px; margin:15px 0; }
.legal-lead { max-width:720px; font-size:1.09rem; }
.legal-layout { display:grid; grid-template-columns:245px minmax(0,1fr); gap:48px; padding:10px 0 75px; }
.toc { position:sticky; top:20px; align-self:start; border:1px solid var(--edge); border-radius:18px; padding:22px; background:rgba(255,255,255,.035); }
.toc strong { display:block; font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; color:var(--fine); margin-bottom:14px; }
.toc a { display:block; text-decoration:none; color:var(--muted); font-size:.86rem; padding:8px 0; }
.toc a:hover { color:#fff; }
.legal-content { display:grid; gap:0; min-width:0; }
.legal-content section { padding:28px 0; border-bottom:1px solid var(--edge); }
.legal-content section:first-child { padding-top:0; }
.legal-content h2 { font-size:1.55rem; margin-bottom:13px; }
.legal-content h3 { font-size:1rem; margin:18px 0 8px; }
.legal-content p,.legal-content li { font-size:.96rem; }
.legal-content li { color:var(--muted); margin-bottom:9px; }
.legal-content ul { padding-left:22px; }
.legal-content a { color:#9dd1ff; text-underline-offset:3px; }
.review { border:1px dashed rgba(236,187,94,.5); border-radius:11px; background:rgba(244,187,95,.08); padding:12px 15px; color:#f4dda8; margin:12px 0; font-size:.88rem; }
.legal-table { width:100%; border-collapse:collapse; margin:20px 0; }
.legal-table td,.legal-table th { padding:12px 13px; text-align:left; border-bottom:1px solid var(--edge); vertical-align:top; font-size:.89rem; }
.legal-table th { color:#f1f5ff; font-weight:700; }
.legal-table td { color:var(--muted); }
.legal-table th:first-child { width:29%; }
strong { font-weight:700; }
@media (max-width: 930px) {
 .hero { grid-template-columns:1fr; gap:38px; padding-top:35px; }
 .app-window { max-width:630px; width:100%; justify-self:center; transform:none; }
 .feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .privacy-panel { grid-template-columns:1fr; gap:22px; }
 .legal-layout { grid-template-columns:1fr; gap:20px; }
 .toc { position:static; display:none; }
}
@media (max-width: 620px) {
 .container { width:min(100% - 32px,1160px); }
 .topbar { align-items:flex-start; flex-direction:column; padding:20px 0; gap:12px; }
 nav { margin-left:-8px; gap:3px; }
 .nav-link { padding:9px 9px; }
 .hero { padding:37px 0 58px; }
 .hero h1 { margin:14px 0; }
 .action-row .btn { flex:1 1 100%; }
 .window-content { grid-template-columns:55px 1fr; }
 .chatlines { padding:14px 10px; }
 .feature-grid { grid-template-columns:1fr; }
 .section { padding-bottom:52px; }
 .privacy-panel { padding:25px 18px; }
 .contact { flex-direction:column; align-items:flex-start; margin:34px 0 49px; }
 .contact .btn { width:100%; }
 .legal-hero { padding:30px 0 20px; }
 .legal-table, .legal-table thead, .legal-table tbody, .legal-table tr, .legal-table th, .legal-table td { display:block; width:100%; }
 .legal-table th { border-bottom:0; padding-bottom:0; }
 .legal-table td { padding-top:2px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .btn { transition:none; } .btn:hover { transform:none; } }

/* MinAppHobby + selected HobbyChat concept banner (preview only) */
.site-intro {
  padding: clamp(38px, 7vw, 88px) 0 54px;
  text-align: center;
  max-width: 950px;
  margin-inline: auto;
}
.site-heading {
  font-size: clamp(3.65rem, 9vw, 7.7rem);
  font-weight: 830;
  letter-spacing: -.075em;
  line-height: .98;
  margin: 22px 0 20px;
  text-wrap: balance;
  color: #f8fbff;
  text-shadow: 0 10px 36px rgba(65,120,222,.18);
}
.site-heading span {
  background: linear-gradient(100deg, #e2f6ff 5%, #7fc8ff 51%, #4a88ff);
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.site-intro-title {
  font-size: clamp(1.35rem, 3vw, 1.95rem);
  color: #dce9ff;
  font-weight: 550;
  line-height: 1.3;
  margin-bottom: 14px;
}
.site-intro-title strong { color: #8bc3ff; }
.site-lead {
  font-size: clamp(.99rem, 1.5vw, 1.18rem);
  color: var(--muted);
  max-width: 730px;
  margin-inline: auto;
  line-height:1.7;
}
.site-actions {
  justify-content: center;
  margin: 30px 0 20px;
}
.site-actions .btn { min-width:210px; }
.site-byline {
  max-width: 750px;
  margin: 8px auto 0;
  color:#91a8c5;
  font-size:.87rem;
}
.showcase {
  padding-bottom: 85px;
}
.showcase-heading-row {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin: 0 0 22px;
}
.showcase-heading-row h2 { margin:9px 0 0; }
.showcase-heading-row p { margin:0; max-width:300px; }
.showcase-figure { margin:0; }
.showcase-image {
  display:block;
  width:100%;
  height:auto;
  border-radius: 26px;
  border:1px solid rgba(122,179,255,.30);
  box-shadow: 0 26px 90px rgba(3,8,28,.48), 0 0 60px rgba(32,85,231,.16);
  background:#061126;
}
.showcase figcaption {
  padding:15px 4px 0;
  color:#9cb0cb;
  font-size:.82rem;
  line-height:1.7;
}
.showcase figcaption a { color:#a4d3ff; text-underline-offset:3px; }
@media (max-width: 620px) {
  .site-intro { padding: 32px 0 30px; text-align:left; }
  .site-heading { font-size:clamp(3.1rem,12.8vw,5rem); overflow-wrap:anywhere; }
  .site-actions { justify-content:stretch; }
  .site-lead,.site-byline { margin-left:0; }
  .showcase { padding-bottom:45px; }
  .showcase-heading-row { flex-direction:column; align-items:flex-start; gap:8px; }
  .showcase-heading-row h2 { margin-top:6px; }
  .showcase-image { border-radius:16px; }
}

/* Oppdatert forside – nøyaktig brukergodkjent tekst, separat om-seksjon. */
.brandtext small { max-width: 320px; }
.site-intro .eyebrow { letter-spacing: .12em; }
.site-intro { padding-bottom: 62px; }
.showcase-heading-row { align-items: flex-start; }
.showcase-heading-row p { max-width: 550px; line-height: 1.65; }
.showcase figcaption { font-style: italic; }

.about-section {
  margin: 14px 0 84px;
  padding: clamp(28px,5vw,60px);
  background: linear-gradient(125deg, rgba(25,45,80,.85),rgba(16,24,44,.85));
  border: 1px solid rgba(145,188,255,.22);
  border-radius: 26px;
  box-shadow: 0 20px 65px rgba(0,0,0,.18);
  position: relative;
  overflow: hidden;
}
.about-section::after {
  content:"";
  position:absolute;
  right:-160px;
  top:-190px;
  width:390px;
  height:390px;
  border-radius:50%;
  background: radial-gradient(circle,rgba(62,130,247,.16),transparent 70%);
  pointer-events:none;
}
.about-section .eyebrow { margin-bottom:16px; }
.about-section h2 { max-width:720px; margin-bottom:25px; }
.about-copy { max-width:840px; position:relative; z-index:1; }
.about-copy p { font-size:clamp(.97rem,1.35vw,1.06rem); line-height:1.8; margin:0 0 16px; }
.about-copy p:last-child { margin-bottom:0; }
.about-copy .about-highlight {
  color:#e4f1ff;
  padding-left:16px;
  border-left:3px solid var(--accent);
  margin:26px 0 21px;
  font-weight:700;
}
.privacy-panel .privacy-text { max-width:650px; }
.privacy-panel .privacy-text p { line-height:1.78; }
.privacy-detail { margin:17px 0 22px; }
.privacy-note { border:1px solid rgba(244,186,102,.22); border-radius:13px;
  background:rgba(255,193,96,.055); padding:17px 19px; margin-top:24px;
  color:#deca9c; font-size:.91rem; line-height:1.7; }
.privacy-note strong { color:#ffe5b4; }
.contact-copy { max-width:720px; }
.contact-copy p { margin-bottom:12px; }
.contact-copy p:last-child { margin-bottom:0; }
@media(max-width:620px) {
  .about-section { margin-bottom:54px; border-radius:18px; }
  .showcase-heading-row p { max-width:none; }
  .privacy-note { padding:15px; }
  .brandtext small { font-size:.69rem; }
}
