/* ============================================================
   TINIUS BILSENTER — Design v4: "Digital Showroom"
   Mørk aurora-bakgrunn, glass, kinetisk typografi, spotlight-hover.
   ============================================================ */

:root{
  --bg:        #0b0b0d;
  --bg-2:      #161618;
  --ink:       #ffffff;
  --ink-dim:   #bcbec3;
  --ink-faint: #87898f;

  --glass-bg:     rgba(255,255,255,.04);
  --glass-bg-2:   rgba(255,255,255,.07);
  --glass-border: rgba(255,255,255,.10);
  --glass-border-hi: rgba(255,255,255,.22);

  --accent-a: #2454d1;   /* dempet, eksklusivt blått — brukes sparsomt */
  --accent-b: #4d7fe0;   /* litt lysere, kun til små detaljer/lenker */
  --accent-c: #d4af6a;   /* dempet gull — pris-aksent */
  --accent-grad: var(--accent-a);

  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --container: 1280px;
  --header-h: 88px;

  --shadow-sm: 0 10px 24px -16px rgba(0,0,0,.55);
  --shadow-md: 0 24px 48px -22px rgba(0,0,0,.65);
  --shadow-lg: 0 36px 80px -30px rgba(0,0,0,.72);

  --font-display: 'Space Grotesk', 'Arial', sans-serif;
  --font-body: 'Manrope', -apple-system, Segoe UI, sans-serif;

  --ease: cubic-bezier(.16,.84,.32,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:
    radial-gradient(ellipse 1400px 900px at 50% 0%, #1b1d24 0%, var(--bg) 62%),
    var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  position:relative;
}
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  opacity:.03; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-.02em;
  line-height:1.08;
  margin:0 0 .5em;
  color:var(--ink);
}
p{ margin:0 0 1em; color:var(--ink-dim); }
.container{ max-width:var(--container); margin:0 auto; padding:0 32px; position:relative; z-index:1; }
section{ position:relative; scroll-margin-top:110px; }

/* ---------- Glass utility ---------- */
.glass{
  background:linear-gradient(160deg, var(--bg-2) 0%, #131315 100%);
  border:1px solid var(--glass-border);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
}

/* ---------- Seksjons-rytme: veksler mellom transparent og tonet bakgrunn ---------- */
.section-alt{
  background:linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,0) 100%), var(--bg-2);
  border-top:1px solid var(--glass-border);
  border-bottom:1px solid var(--glass-border);
}

.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-body); font-weight:700; font-size:12px;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink); padding:8px 16px 8px 8px;
  background:rgba(255,255,255,.04); border:1px solid var(--glass-border);
  border-radius:999px; margin-bottom:22px;
}
.eyebrow .dot{ width:22px; height:22px; border-radius:50%; background:var(--accent-grad); flex-shrink:0; }

.section-head{ max-width:620px; margin-bottom:52px; }
.section-head h2{ font-size:clamp(30px,4vw,44px); }
.section-head p{ font-size:17px; max-width:520px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:16px 30px; border-radius:999px;
  font-family:var(--font-body); font-weight:700; font-size:14px;
  border:1px solid transparent; cursor:pointer;
  transition:transform .3s var(--ease), box-shadow .3s ease, background .3s ease, border-color .3s ease, color .3s ease;
  will-change:transform;
}
.btn-primary{ background:var(--accent-a); color:#fff; box-shadow:0 10px 24px -12px rgba(0,0,0,.6); }
.btn-primary:hover{ background:#1c44b0; }
.btn-outline{ background:rgba(255,255,255,.03); border-color:var(--glass-border-hi); color:var(--ink); }
.btn-outline:hover{ background:rgba(255,255,255,.08); border-color:#fff; }
.btn-amber{ background:var(--accent-c); color:#231404; box-shadow:0 10px 24px -12px rgba(0,0,0,.6); }
.btn-sm{ padding:11px 20px; font-size:12.5px; }
.btn-block{ width:100%; }
.magnetic{ display:inline-block; }

/* ---------- Header ---------- */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:var(--header-h); display:flex; align-items:center;
  background:rgba(7,7,10,.5);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid transparent;
  transition:height .3s var(--ease), background .3s ease, border-color .3s ease;
}
.site-header.scrolled{ height:70px; background:rgba(7,7,10,.78); border-bottom-color:var(--glass-border); }
.header-inner{ max-width:var(--container); margin:0 auto; padding:0 32px; width:100%; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.logo{ display:flex; align-items:center; gap:11px; flex-shrink:0; }
.logo img{ height:34px; width:auto; }
.logo .wordmark{ font-family:var(--font-display); font-weight:600; font-size:17px; letter-spacing:-.01em; color:var(--ink); }
.logo .wordmark i{ font-style:normal; display:block; font-family:var(--font-body); font-weight:600; font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-faint); margin-top:2px; }
.main-nav{ display:flex; align-items:center; gap:2px; }
.main-nav a{ position:relative; padding:10px 16px; font-family:var(--font-body); font-weight:600; font-size:13.5px; color:var(--ink-dim); border-radius:999px; transition:color .25s ease; }
.main-nav a:hover{ color:var(--ink); }
.main-nav a.active{ color:var(--ink); background:rgba(255,255,255,.07); }
.main-nav a.active::after{ content:""; position:absolute; left:16px; right:16px; bottom:5px; height:2px; background:var(--accent-a); border-radius:2px; }
.header-cta{ display:flex; align-items:center; gap:14px; }
.header-phone{ display:flex; flex-direction:column; align-items:flex-end; font-family:var(--font-display); font-weight:600; font-size:15px; color:var(--ink); }
.header-phone span{ font-family:var(--font-body); font-weight:600; font-size:9.5px; letter-spacing:.12em; color:var(--ink-faint); text-transform:uppercase; margin-top:2px; }
.burger{ display:none; width:42px; height:42px; border-radius:50%; border:1px solid var(--glass-border-hi); background:rgba(255,255,255,.04); cursor:pointer; align-items:center; justify-content:center; flex-direction:column; gap:5px; flex-shrink:0; }
.burger span{ width:16px; height:1.5px; background:var(--ink); display:block; transition:.3s ease; border-radius:2px; }
.burger.is-open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger.is-open span:nth-child(2){ opacity:0; }
.burger.is-open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* ---------- Hero: fullbredde bakgrunnsbilde ---------- */
.hero{
  position:relative; min-height:82vh; display:flex; align-items:flex-end;
  padding:calc(var(--header-h) + 40px) 0 72px;
  background-size:cover; background-position:center;
  overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(0deg, rgba(15,16,20,.96) 0%, rgba(15,16,20,.72) 38%, rgba(15,16,20,.32) 68%, rgba(15,16,20,.55) 100%);
}
.hero-inner{ position:relative; z-index:1; max-width:820px; }
.hero h1{ font-size:clamp(38px,6vw,68px); margin-bottom:22px; }
.kinetic .word{ display:inline-block; overflow:hidden; padding-bottom:.06em; margin-bottom:-.06em; vertical-align:bottom; }
.kinetic .word .letters{ display:inline-block; transform:translateY(60%); opacity:0; transition:transform .6s var(--ease), opacity .5s ease; }
.kinetic.in .word .letters{ transform:translateY(0); opacity:1; }
.kinetic .hl .letters{ color:var(--accent-b); }
.hero p.lead{ font-size:18px; color:#d7d9de; max-width:540px; margin-bottom:32px; opacity:0; transform:translateY(12px); transition:opacity .6s ease .35s, transform .6s var(--ease) .35s; }
.hero.in p.lead{ opacity:1; transform:none; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
.hero .hero-actions{ opacity:0; transform:translateY(12px); transition:opacity .6s ease .45s, transform .6s var(--ease) .45s; }
.hero.in .hero-actions{ opacity:1; transform:none; }

/* ---------- Stat counters (rolig autoritets-linje rett under hero) ---------- */
.stat-row{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--glass-border); background:var(--bg-2); }
.stat-row .stat{ padding:26px 24px; border-right:1px solid var(--glass-border); }
.stat-row .stat:last-child{ border-right:none; }
.stat-row .num{ font-family:var(--font-display); font-size:28px; font-weight:600; color:var(--ink); }
.stat-row .label{ font-size:12px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.05em; margin-top:4px; }

/* ---------- Sections ---------- */
.section{ padding:120px 0; }
.section.tight{ padding:84px 0; }

/* ---------- About ---------- */
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.about-media{ position:relative; border-radius:var(--radius-lg); overflow:hidden; aspect-ratio:4/3.1; box-shadow:var(--shadow-lg); border:1px solid var(--glass-border); }
.about-media img{ width:100%; height:100%; object-fit:cover; }
.about-list{ margin-top:26px; display:grid; gap:14px; }
.about-list li{ display:flex; gap:14px; align-items:flex-start; color:var(--ink-dim); font-size:15px; }
.about-list li .ic{ flex-shrink:0; width:26px; height:26px; border-radius:50%; background:rgba(77,127,224,.14); border:1px solid rgba(77,127,224,.3); display:flex; align-items:center; justify-content:center; margin-top:1px; }
.about-list li .ic svg{ width:12px; height:12px; color:var(--accent-b); }

/* ---------- Bento cars with spotlight ---------- */
.bento{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:240px; gap:14px; }
.bento-item{
  position:relative; overflow:hidden; border-radius:var(--radius);
  border:1px solid var(--glass-border); background:var(--bg-2);
  --mx:50%; --my:50%;
}
.bento-item.big{ grid-column:span 4; grid-row:span 2; }
.bento-item.small{ grid-column:span 2; grid-row:span 1; }
.bento-item img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.bento-item:hover img{ transform:scale(1.06); }
.bento-item::before{
  content:""; position:absolute; inset:0; z-index:2; pointer-events:none; opacity:0; transition:opacity .3s ease;
  background:radial-gradient(circle 220px at var(--mx) var(--my), rgba(255,255,255,.16), transparent 70%);
  mix-blend-mode:overlay;
}
.bento-item:hover::before{ opacity:1; }
.bento-item::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, transparent 40%, rgba(3,3,5,.92) 100%); }
.bento-info{ position:absolute; left:0; right:0; bottom:0; padding:24px; z-index:3; }
.bento-item.small .bento-info{ padding:18px; }
.bento-info .make{ color:var(--accent-b); font-weight:700; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; }
.bento-info h3{ color:var(--ink); font-size:22px; margin:4px 0 8px; }
.bento-item.small .bento-info h3{ font-size:16.5px; margin:3px 0 6px; }
.bento-info .specs{ color:var(--ink-dim); font-size:12px; font-weight:600; display:flex; gap:14px; flex-wrap:wrap; }
.price-pill{
  position:absolute; top:18px; right:18px; z-index:3;
  background:rgba(11,11,13,.75); backdrop-filter:blur(6px); color:#fff;
  border:1px solid rgba(255,255,255,.18);
  font-family:var(--font-display); font-weight:700; font-size:13px;
  padding:9px 16px; border-radius:999px;
}
.cars-cta{ text-align:center; margin-top:52px; }

/* ---------- Sell banner ---------- */
.sell-banner{
  position:relative; overflow:hidden; padding:64px 56px; border-radius:var(--radius-lg);
  display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;
  box-shadow:var(--shadow-md);
}
.sell-banner{ border-top:2px solid var(--accent-a); }
.sell-banner > *{ position:relative; z-index:1; }
.sell-banner h2{ font-size:clamp(28px,3.6vw,40px); max-width:480px; margin-bottom:14px; }
.sell-banner p{ max-width:440px; margin-bottom:0; }

/* ---------- Contact ---------- */
.contact-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:24px; }
.contact-info{ padding:48px; }
.contact-map{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--glass-border); box-shadow:var(--shadow-md); }
.contact-map iframe{ width:100%; height:100%; min-height:420px; border:0; filter:grayscale(.6) invert(.9) contrast(.85); }
.info-row{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid var(--glass-border); }
.info-row:last-child{ border-bottom:none; }
.info-row .ic{ width:40px; height:40px; border-radius:50%; background:rgba(77,127,224,.14); border:1px solid rgba(77,127,224,.3); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--accent-b); }
.info-row .ic svg{ width:17px; height:17px; }
.info-row h4{ font-size:13px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink); margin-bottom:4px; font-family:var(--font-body); font-weight:700; }
.info-row p{ margin:0; font-size:14.5px; }
.hours-table{ width:100%; margin-top:4px; border-collapse:collapse; }
.hours-table tr td{ padding:3px 0; font-size:14.5px; color:var(--ink-dim); }
.hours-table tr td:last-child{ text-align:right; color:var(--ink); font-weight:600; }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--glass-border); position:relative; }
.footer-cta{ padding:90px 32px; text-align:center; }
.footer-cta h2{ font-size:clamp(34px,5.6vw,68px); margin-bottom:30px; }
.footer-main{ max-width:var(--container); margin:0 auto; padding:0 32px 56px; display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr; gap:40px; }
.footer-brand p{ font-size:13.5px; max-width:260px; margin-top:16px; }
.footer-social{ display:flex; gap:10px; margin-top:20px; }
.footer-social a{ width:38px; height:38px; border-radius:50%; border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; color:var(--ink-dim); transition:.25s; }
.footer-social a:hover{ color:var(--bg); background:var(--ink); border-color:var(--ink); }
.footer-col h4{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); margin-bottom:18px; }
.footer-col ul{ display:grid; gap:11px; }
.footer-col a{ font-size:14.5px; color:var(--ink-dim); transition:.2s; }
.footer-col a:hover{ color:var(--ink); }
.footer-bottom{ border-top:1px solid var(--glass-border); padding:22px 32px; max-width:var(--container); margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; }
.footer-bottom p{ margin:0; font-size:12.5px; color:var(--ink-faint); }

/* ---------- Forms ---------- */
.form-card{ padding:44px; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-grid.full, .field.full{ grid-column:1/-1; }
.field label{ display:block; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:9px; }
.field input, .field select, .field textarea{
  width:100%; background:rgba(255,255,255,.04); border:1px solid var(--glass-border);
  border-radius:var(--radius-sm); padding:14px 16px; color:var(--ink);
  font-family:var(--font-body); font-size:14.5px; transition:border-color .2s;
}
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--accent-b); }
.field textarea{ resize:vertical; min-height:120px; }
.form-success{ text-align:center; padding:26px 10px; }
.form-success .ic-ok{ width:56px; height:56px; border-radius:50%; background:var(--accent-grad); display:flex; align-items:center; justify-content:center; margin:0 auto 22px; color:#fff; }
.form-success .ic-ok svg{ width:24px; height:24px; }
.form-success h3{ font-size:22px; margin-bottom:10px; }
.form-success p{ font-size:14.5px; margin:0 auto; max-width:360px; }

/* ---------- Pricing ---------- */
.price-grid{ display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.price-card{ padding:46px 40px; position:relative; overflow:hidden; }
.price-card.featured{ border-color:var(--glass-border-hi); }
.price-card.featured{ border-top:2px solid var(--accent-a); }
.price-card .tier-label{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:12px; }
.price-card h3{ font-size:23px; margin-bottom:6px; max-width:380px; }
.price-card .price{ font-family:var(--font-display); font-size:48px; font-weight:600; margin:18px 0 4px; }
.price-card .price sup{ font-size:16px; color:var(--ink-faint); font-family:var(--font-body); font-weight:700; }
.price-card .price.price-cta{ font-size:30px; color:var(--accent-b); }
.price-card .price-note{ font-size:13px; color:var(--ink-faint); margin-bottom:26px; }
.price-card ul{ display:grid; gap:13px; margin-bottom:30px; }
.price-card ul li{ display:flex; gap:11px; align-items:flex-start; font-size:14.5px; color:var(--ink-dim); }
.price-card ul li svg{ width:16px; height:16px; flex-shrink:0; margin-top:3px; color:var(--accent-b); }
.price-card .examples{ font-size:13px; color:var(--ink-faint); background:rgba(255,255,255,.03); border:1px solid var(--glass-border); border-radius:var(--radius-sm); padding:13px 15px; margin-bottom:26px; }
.price-card .examples b{ color:var(--ink-dim); }

/* ---------- Steps ---------- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.step{ padding:30px 26px; transition:transform .3s var(--ease), box-shadow .3s ease, border-color .3s ease; }
.step:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--glass-border-hi); }
.step .step-num{ font-family:var(--font-display); font-size:26px; font-weight:600; color:transparent; -webkit-text-stroke:1.3px var(--accent-b); display:block; margin-bottom:16px; }
.step h4{ font-size:16px; margin-bottom:8px; }
.step p{ font-size:14px; margin:0; }

/* ---------- Team ---------- */
.team-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.team-card{ overflow:hidden; }
.team-photo{ aspect-ratio:1/1; overflow:hidden; }
.team-photo img{ width:100%; height:100%; object-fit:cover; filter:saturate(.9); transition:transform .5s var(--ease); }
.team-card:hover .team-photo img{ transform:scale(1.05); }
.team-info{ padding:22px 24px 26px; }
.team-info h4{ font-size:18px; margin-bottom:3px; }
.team-role{ font-size:12px; font-weight:700; color:var(--accent-b); text-transform:uppercase; letter-spacing:.05em; margin-bottom:12px; }
.team-info p.bio{ font-size:13.5px; margin-bottom:0; }
.team-contact{ display:flex; gap:10px; margin-top:16px; }
.team-contact a{ width:34px; height:34px; border-radius:50%; background:rgba(255,255,255,.05); border:1px solid var(--glass-border); display:flex; align-items:center; justify-content:center; color:var(--ink-dim); transition:.2s; }
.team-contact a:hover{ color:var(--bg); background:var(--ink); }
.team-contact svg{ width:14px; height:14px; }

/* ---------- Page hero ---------- */
.page-hero{
  position:relative; padding:calc(var(--header-h) + 70px) 0 64px;
  border-bottom:1px solid var(--glass-border);
  background:radial-gradient(ellipse 1100px 520px at 12% 0%, rgba(36,84,209,.16) 0%, transparent 60%), var(--bg-2);
  background-size:cover; background-position:center;
}
.page-hero::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:linear-gradient(90deg, var(--accent-a), transparent 60%); }
.page-hero.has-image::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:linear-gradient(100deg, rgba(11,11,13,.94) 0%, rgba(11,11,13,.86) 42%, rgba(11,11,13,.55) 100%);
}
.page-hero.has-image .container{ position:relative; z-index:1; }
.breadcrumb{ font-size:12px; font-weight:600; letter-spacing:.05em; color:var(--ink-faint); margin-bottom:18px; text-transform:uppercase; }
.breadcrumb a{ color:var(--ink-faint); }
.breadcrumb a:hover{ color:var(--ink); }
.page-hero h1{ font-size:clamp(34px,5.4vw,56px); max-width:760px; }
.page-hero p{ max-width:560px; font-size:17px; }

/* ---------- Filter bar ---------- */
.filter-bar{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; padding:18px; margin-bottom:40px; border-radius:var(--radius); }
.filter-bar select, .filter-bar input{ background:rgba(255,255,255,.05); border:1px solid var(--glass-border); color:var(--ink); border-radius:999px; padding:11px 16px; font-size:13.5px; font-family:var(--font-body); }
.filter-bar select:focus, .filter-bar input:focus{ outline:none; border-color:var(--accent-b); }
.filter-bar .grow{ flex:1; min-width:200px; }
.filter-reset{ background:transparent; border:1px solid var(--glass-border-hi); color:var(--ink-dim); border-radius:999px; padding:11px 18px; font-size:12px; font-weight:700; cursor:pointer; transition:.2s; font-family:var(--font-body); }
.filter-reset:hover{ color:var(--ink); background:rgba(255,255,255,.06); }
.result-count{ color:var(--ink-faint); font-size:13.5px; margin-bottom:24px; }
.empty-state{ display:none; text-align:center; padding:70px 20px; border:1px dashed var(--glass-border-hi); border-radius:var(--radius); color:var(--ink-dim); font-size:15px; }
.empty-state.show{ display:block; }
.empty-state a{ color:var(--accent-b); font-weight:700; }

/* Billink iframe wrapper */
.billink-frame{ border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--glass-border); min-height:1400px; }
.billink-frame iframe{ width:100%; height:1600px; border:0; display:block; }

/* ---------- Legacy car-grid (fallback) ---------- */
.cars-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.car-card{ position:relative; overflow:hidden; border-radius:var(--radius); border:1px solid var(--glass-border); background:var(--bg-2); aspect-ratio:4/3.1; }
.car-card .car-media{ position:absolute; inset:0; }
.car-card .car-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.car-card:hover .car-media img{ transform:scale(1.05); }
.car-card::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 30%, rgba(3,3,5,.94) 100%); z-index:1; }
.car-tag{ position:absolute; top:16px; left:16px; z-index:3; background:rgba(7,7,10,.6); backdrop-filter:blur(8px); border:1px solid var(--glass-border-hi); color:var(--ink); font-weight:700; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; padding:7px 13px; border-radius:999px; }
.car-body{ position:absolute; left:0; right:0; bottom:0; padding:22px; z-index:2; }
.car-body .make{ color:var(--accent-b); font-weight:700; font-size:11px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:4px; }
.car-body h3{ color:var(--ink); font-size:19px; margin-bottom:10px; }
.car-specs{ display:flex; flex-wrap:wrap; gap:8px 14px; font-size:11.5px; font-weight:600; color:var(--ink-dim); padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid rgba(255,255,255,.14); }
.car-foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.car-price{ font-family:var(--font-display); font-weight:600; font-size:19px; color:var(--ink); }
.car-price small{ display:block; font-weight:600; font-size:10px; color:var(--ink-faint); }

/* ---------- Kort med hover-løft (dekningskort, priskort, teamkort) ---------- */
.coverage-card, .price-card, .team-card, .faq-item, .news-card{ transition:transform .3s var(--ease), box-shadow .3s ease, border-color .3s ease; }
.coverage-card:hover, .price-card:hover, .team-card:hover, .news-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--glass-border-hi); }
.price-card.featured{ box-shadow:var(--shadow-lg); }

/* ---------- Nyheter/tilbud ---------- */
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.news-card{ overflow:hidden; display:flex; flex-direction:column; }
.news-media{ aspect-ratio:16/10; overflow:hidden; }
.news-media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.news-card:hover .news-media img{ transform:scale(1.05); }
.news-body{ padding:22px 24px 26px; }
.news-date{ font-size:11.5px; font-weight:700; color:var(--accent-b); text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
.news-body h3{ font-size:19px; margin-bottom:8px; }
.news-body p{ font-size:14.5px; margin:0 0 12px; }
.news-readmore{ display:inline-block; font-size:13px; font-weight:700; color:var(--accent-b); }
.news-full-text p{ font-size:16px; line-height:1.75; color:var(--ink-dim); margin:0 0 20px; }

/* ---------- Varsel-banner (f.eks. "stengt i dag") ---------- */
.site-alert{
  position:relative; z-index:1001; background:var(--accent-a); color:#fff;
  padding:12px 32px; font-size:13.5px; font-weight:600; text-align:center;
}
.site-alert .container{ display:flex; align-items:center; justify-content:center; gap:16px; position:relative; }
.site-alert-close{
  position:absolute; right:0; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,.15); border:none; color:#fff; width:22px; height:22px;
  border-radius:50%; cursor:pointer; font-size:14px; line-height:1; display:flex; align-items:center; justify-content:center;
}
.site-alert-close:hover{ background:rgba(255,255,255,.28); }

/* ---------- FAQ ---------- */
.faq{ display:grid; gap:12px; max-width:820px; }
.faq-item{ overflow:hidden; }
.faq-q{ padding:22px 26px; display:flex; align-items:center; justify-content:space-between; cursor:pointer; font-family:var(--font-display); font-weight:600; font-size:16px; color:var(--ink); }
.faq-q svg{ width:16px; height:16px; color:var(--accent-b); transition:transform .3s ease; flex-shrink:0; margin-left:18px; }
.faq-item.open .faq-q svg{ transform:rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .35s ease; }
.faq-a-inner{ padding:0 26px 24px; }
.faq-a-inner p{ margin:0; font-size:14.5px; }

/* ---------- Coverage ---------- */
.coverage-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.coverage-card{ padding:30px; text-align:center; }
.coverage-card .zone{ font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--accent-b); margin-bottom:12px; }
.coverage-card .time{ font-size:28px; font-family:var(--font-display); font-weight:600; color:var(--ink); }
.coverage-card .time small{ font-size:12.5px; color:var(--ink-faint); font-family:var(--font-body); font-weight:600; }

/* ---------- Reveal utility ---------- */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.mt-lg{ margin-top:60px; }
.text-center{ text-align:center; }

/* ---------- Responsive ---------- */
@media (max-width:1080px){
  .about-grid{ grid-template-columns:1fr; }
  .bento{ grid-template-columns:repeat(2,1fr); }
  .bento-item.big{ grid-column:span 2; grid-row:span 1; }
  .stat-row{ grid-template-columns:repeat(2,1fr); }
  .footer-main{ grid-template-columns:1fr 1fr; }
  .steps{ grid-template-columns:repeat(2,1fr); }
  .price-grid{ grid-template-columns:1fr; }
  .contact-grid{ grid-template-columns:1fr; }
  .coverage-grid{ grid-template-columns:1fr 1fr; }
  .team-grid{ grid-template-columns:repeat(2,1fr); }
  .cars-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:860px){
  .main-nav, .header-phone{ display:none; }
  .burger{ display:flex; }
  .main-nav.open{
    display:flex; position:fixed; inset:70px 12px auto 12px; flex-direction:column;
    background:rgba(9,9,13,.96); backdrop-filter:blur(20px);
    padding:14px; gap:2px; border-radius:var(--radius); border:1px solid var(--glass-border);
  }
  .main-nav.open a{ padding:14px 16px; font-size:15px; border-radius:var(--radius-sm); }
  .form-grid{ grid-template-columns:1fr; }
  .cars-grid, .bento, .team-grid, .coverage-grid, .news-grid{ grid-template-columns:1fr; }
  .bento-item.big, .bento-item.small{ grid-column:span 1; }
  .sell-banner{ padding:44px 26px; }
  .footer-main{ grid-template-columns:1fr; gap:34px; }
  .contact-info{ padding:34px 24px; }
  .price-card{ padding:34px 24px; }
  .stat-row{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .hero{ min-height:auto; padding:calc(var(--header-h) + 24px) 0 44px; }
  .hero-visual{ aspect-ratio:4/3.4; margin-top:44px; }
  .page-hero{ padding:calc(var(--header-h) + 36px) 0 36px; }
  .section{ padding:56px 0; }
  .section.tight{ padding:44px 0; }
  .container{ padding:0 20px; }
  .billink-frame{ min-height:900px; border-radius:var(--radius); }
  .billink-frame iframe{ height:1200px; }
  .form-card{ padding:26px 20px; }
  .contact-info{ padding:26px 20px; }
  .price-card{ padding:26px 20px; }
  .footer-cta{ padding:64px 20px; }
  .filter-bar{ padding:14px; }
}


/* ---------- Forside: finpuss + kundeomtaler ---------- */
.about-grid{ gap:84px; }
.about-media{ aspect-ratio:4/3.4; }
.about-media::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 60%, rgba(11,11,13,.45)); pointer-events:none; }
.about-copy h2{ margin-bottom:18px; }
.sell-banner{ background:radial-gradient(120% 140% at 100% 0%, rgba(36,84,209,.22), transparent 55%), var(--glass-bg); }
.sell-banner .hero-actions{ flex-shrink:0; }
.stat-row .num{ background:linear-gradient(180deg,#fff,#a9b8e6); -webkit-background-clip:text; background-clip:text; color:transparent; }
.reviews-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.review-card{ margin:0; padding:34px 30px; display:flex; flex-direction:column; gap:14px; transition:transform .3s var(--ease), box-shadow .3s ease, border-color .3s ease; }
.review-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); border-color:var(--glass-border-hi); }
.review-stars{ color:#f5b942; letter-spacing:3px; font-size:17px; }
.review-card blockquote{ margin:0; font-size:16px; line-height:1.65; color:var(--ink); }
.review-card figcaption{ margin-top:auto; font-size:13.5px; font-weight:700; color:var(--accent-b); }
@media (max-width:1000px){ .reviews-grid{ grid-template-columns:1fr; } .about-grid{ gap:36px; } }

/* ---------- Forside: team-stripe ---------- */
.home-team-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:34px; }
.home-team-head h2{ font-size:clamp(28px,3.6vw,40px); margin-bottom:8px; }
.home-team-head p{ margin:0; font-size:17px; }
.team-grid-home{ grid-template-columns:repeat(4,1fr); }
.team-grid-home .team-info{ padding:18px 20px 22px; }
.team-grid-home .team-role{ margin-bottom:8px; }
.team-phone{ font-size:14px; font-weight:600; color:var(--ink); }
.team-phone:hover{ color:var(--accent-b); }
@media (max-width:1000px){ .team-grid-home{ grid-template-columns:repeat(2,1fr); } }

/* ---------- Forside: mindre "mal-aktig", mer redaksjonell stil ---------- */
.eyebrow{ padding:0; background:none; border:0; border-radius:0; color:var(--accent-b); letter-spacing:.2em; font-size:12px; margin-bottom:18px; gap:14px; }
.eyebrow .dot{ width:30px; height:2px; border-radius:0; background:var(--accent-a); }

.stat-row{ width:min(calc(var(--container) - 64px), calc(100% - 48px)); margin:-56px auto 0; position:relative; z-index:5;
  border:1px solid var(--glass-border); border-top:2px solid var(--accent-a); border-radius:var(--radius-lg);
  background:var(--bg-2); box-shadow:var(--shadow-lg); overflow:hidden; }
.stat-row .stat{ padding:30px 30px; }
.stat-row .num{ font-size:40px; line-height:1.1; background:none; -webkit-background-clip:border-box; background-clip:border-box; color:#fff; }
.stat-row .label{ margin-top:8px; }

.about-grid{ grid-template-columns:1.05fr .95fr; gap:100px; }
.about-visual{ position:relative; }
.about-visual::before{ content:""; position:absolute; top:26px; bottom:-26px; left:26px; right:-26px; border:2px solid var(--accent-a); border-radius:var(--radius-lg); opacity:.6; }
.about-visual .about-media{ position:relative; z-index:1; aspect-ratio:4/4.2; }
.about-badge{ position:absolute; z-index:2; left:-26px; bottom:36px; background:var(--accent-a); color:#fff; padding:20px 28px; border-radius:14px; box-shadow:var(--shadow-lg); }
.about-badge strong{ display:block; font-family:var(--font-display); font-size:42px; line-height:1; margin-bottom:6px; }
.about-badge span{ font-size:13px; font-weight:600; opacity:.92; }
.about-copy h2{ font-size:clamp(32px,4.2vw,50px); line-height:1.1; margin-bottom:22px; }
.about-tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:30px; }
.about-tile{ padding:18px; border:1px solid var(--glass-border); border-radius:12px; background:rgba(255,255,255,.03); font-size:14px; line-height:1.4; color:var(--ink); display:flex; flex-direction:column; gap:12px; }
.about-tile .ic{ width:28px; height:28px; border-radius:50%; background:rgba(77,127,224,.14); border:1px solid rgba(77,127,224,.3); display:flex; align-items:center; justify-content:center; color:var(--accent-b); }
.about-tile .ic svg{ width:13px; height:13px; }
@media (max-width:1000px){
  .about-grid{ grid-template-columns:1fr; gap:56px; }
  .about-badge{ left:14px; bottom:18px; padding:14px 20px; }
  .about-badge strong{ font-size:32px; }
}
@media (max-width:700px){
  .stat-row{ margin-top:-30px; }
  .stat-row .stat{ padding:20px 18px; }
  .stat-row .num{ font-size:28px; }
  .about-tiles{ grid-template-columns:1fr; }
  .about-visual::before{ left:16px; right:-16px; top:16px; bottom:-16px; }
}
.hero{ padding-bottom:128px; }
@media (max-width:860px){ .hero{ padding-bottom:84px; } }

/* ============================================================
   LYST INNHOLD: innholdsseksjonene er lyse, mens toppbilde, meny,
   tallstripe og bunn er mørke. Variablene overstyres bare inni
   .section, så alle kort/tekster tilpasser seg automatisk.
   ============================================================ */
.section{
  --ink:#11151c; --ink-dim:#4b5363; --ink-faint:#727a8a;
  --bg-2:#ffffff;
  --glass-bg:rgba(17,21,28,.03); --glass-bg-2:rgba(17,21,28,.05);
  --glass-border:rgba(17,21,28,.12); --glass-border-hi:rgba(17,21,28,.28);
  --accent-b:#2454d1;
  --shadow-sm:0 6px 18px -10px rgba(20,30,60,.25);
  --shadow-md:0 18px 40px -20px rgba(20,30,60,.32);
  --shadow-lg:0 30px 60px -28px rgba(20,30,60,.38);
  background:#f3f5f9; color:var(--ink);
}
.section.section-alt{ background:#e8ecf4; border-top:1px solid rgba(17,21,28,.07); border-bottom:1px solid rgba(17,21,28,.07); }
.section .glass{ background:#fff; }
.section .eyebrow{ color:var(--accent-a); }
.section .btn-outline{ background:transparent; }
.section .btn-outline:hover{ background:rgba(17,21,28,.05); border-color:var(--ink); }
.section .field input, .section .field select, .section .field textarea{ background:#fff; }
.section .fin-calc input, .section .fin-calc select{ background:#fff; }
.section .price-card .examples, .section .about-tile{ background:rgba(17,21,28,.035); }
.section .team-contact a{ background:rgba(17,21,28,.05); }
.section .contact-map iframe{ filter:none; }
.section .about-media::after{ background:none; }
.section .step .step-num{ -webkit-text-stroke-color:var(--accent-a); }

/* Mørkt banner midt i den lyse siden gir kontrast */
.section .sell-banner{
  --ink:#ffffff; --ink-dim:#bcbec3; --ink-faint:#87898f;
  --glass-border:rgba(255,255,255,.12); --glass-border-hi:rgba(255,255,255,.28);
  --accent-b:#4d7fe0;
  background:radial-gradient(120% 140% at 100% 0%, rgba(36,84,209,.35), transparent 55%), linear-gradient(160deg,#171b26,#0f1218);
  border-top:2px solid var(--accent-a); color:var(--ink);
}
.section .sell-banner .eyebrow{ color:var(--accent-b); }
.section .sell-banner .btn-outline:hover{ background:rgba(255,255,255,.08); border-color:#fff; }

/* Om oss: tre fordeler som egne kort med ikon */
.about-tiles{ gap:14px; }
.section .about-tile{
  position:relative; background:#fff; border:1px solid var(--glass-border); border-radius:14px;
  padding:22px 20px 22px; gap:16px; box-shadow:var(--shadow-sm); overflow:hidden;
  transition:transform .3s var(--ease), box-shadow .3s ease;
}
.section .about-tile::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--accent-a); }
.section .about-tile:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.about-tile .ic{ width:46px; height:46px; border-radius:12px; background:var(--accent-a); border:0; color:#fff; box-shadow:0 10px 18px -10px rgba(36,84,209,.7); }
.about-tile .ic svg{ width:24px; height:24px; }
.about-tile strong{ font-size:15px; font-weight:700; line-height:1.35; color:var(--ink); }
@media (max-width:700px){
  .about-tiles{ gap:10px; }
  .section .about-tile{ flex-direction:row; align-items:center; gap:14px; padding:14px 16px 14px 20px; }
  .about-tile .ic{ width:40px; height:40px; flex-shrink:0; border-radius:10px; }
  .about-tile .ic svg{ width:21px; height:21px; }
}

/* ---------- Penere meny ---------- */
.site-header{ background:rgba(10,11,15,.72); border-bottom:1px solid rgba(255,255,255,.08); }
.site-header.scrolled{ background:rgba(10,11,15,.92); box-shadow:0 12px 30px -18px rgba(0,0,0,.7); }
.logo img{ height:42px; }
.main-nav{ gap:4px; }
.main-nav a{ font-size:14.5px; padding:10px 14px; color:rgba(255,255,255,.78); }
.main-nav a::after{ content:""; position:absolute; left:14px; right:14px; bottom:4px; height:2px; background:var(--accent-b); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease); }
.main-nav a:hover{ color:#fff; }
.main-nav a:hover::after{ transform:scaleX(1); }
.main-nav a.active{ background:none; color:#fff; }
.main-nav a.active::after{ left:14px; right:14px; bottom:4px; background:var(--accent-b); transform:scaleX(1); }
.header-phone{ font-size:16px; }
.header-cta .btn-sm{ padding:12px 24px; font-size:13.5px; }
.nav-phone{ display:none; }

/* Merkelapp over overskriften i toppbildet: hvit og lesbar */
.hero .eyebrow, .page-hero .eyebrow{ color:#fff; text-shadow:0 1px 14px rgba(0,0,0,.65); }
.hero .eyebrow .dot, .page-hero .eyebrow .dot{ background:var(--accent-b); }

@media (max-width:860px){
  .logo img{ height:34px; }
  .main-nav.open{ inset:calc(var(--header-h) - 10px) 12px auto 12px; padding:10px; background:rgba(10,11,15,.97); box-shadow:0 30px 60px -20px rgba(0,0,0,.8); }
  .main-nav.open a{ font-size:16px; padding:15px 14px; border-radius:0; border-bottom:1px solid rgba(255,255,255,.07); color:#fff; }
  .main-nav.open a::after{ display:none; }
  .main-nav.open a.active{ color:var(--accent-b); }
  .main-nav.open .nav-phone{ display:block; border-bottom:0; margin-top:8px; text-align:center; background:var(--accent-a); border-radius:10px; font-weight:700; }
}
@media (max-width:700px){
  .eyebrow{ font-size:11px; letter-spacing:.12em; gap:10px; margin-bottom:14px; }
  .eyebrow .dot{ width:22px; }
}

/* ---------- Meny: ikke la noe brytes over flere linjer ---------- */
.main-nav a, .header-phone, .header-phone span, .header-cta .btn, .logo{ white-space:nowrap; }
.logo img{ height:38px; }
.main-nav{ gap:2px; }
.main-nav a{ font-size:14px; padding:10px 12px; }
.main-nav a::after, .main-nav a.active::after{ left:12px; right:12px; }
.header-inner{ gap:18px; }
@media (max-width:1360px){ .header-phone{ display:none; } }
@media (max-width:1100px){
  .main-nav, .header-phone{ display:none; }
  .burger{ display:flex; }
  .main-nav.open{
    display:flex; position:fixed; inset:calc(var(--header-h) - 10px) 12px auto 12px; flex-direction:column;
    padding:10px; background:rgba(10,11,15,.97); backdrop-filter:blur(20px);
    border-radius:var(--radius); border:1px solid var(--glass-border); gap:0;
    box-shadow:0 30px 60px -20px rgba(0,0,0,.8);
  }
  .main-nav.open a{ font-size:16px; padding:15px 14px; border-radius:0; border-bottom:1px solid rgba(255,255,255,.07); color:#fff; }
  .main-nav.open a::after{ display:none; }
  .main-nav.open a.active{ color:var(--accent-b); }
  .main-nav.open .nav-phone{ display:block; border-bottom:0; margin-top:8px; text-align:center; background:var(--accent-a); border-radius:10px; font-weight:700; }
}

/* ---------- Åpent nå + svevende ring-knapp ---------- */
.open-badge{ display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; letter-spacing:.01em; }
.open-badge i{ width:8px; height:8px; border-radius:50%; background:#c9792b; flex-shrink:0; }
.open-badge.is-open{ color:#3ddc97; }
.open-badge.is-open i{ background:#3ddc97; animation:openPulse 2s infinite; }
.open-badge.is-closed{ color:#e9a45c; }
.section .open-badge.is-open{ color:#15804f; }
.section .open-badge.is-open i{ background:#1fa968; }
.section .open-badge.is-closed{ color:#a65a12; }
.header-phone .open-badge{ font-size:10.5px; margin-top:3px; text-transform:none; letter-spacing:0; }
@keyframes openPulse{ 0%{ box-shadow:0 0 0 0 rgba(61,220,151,.6); } 70%{ box-shadow:0 0 0 7px rgba(61,220,151,0); } 100%{ box-shadow:0 0 0 0 rgba(61,220,151,0); } }

.call-fab{ display:none; }
@media (max-width:860px){
  .call-fab{
    display:flex; align-items:center; gap:14px; position:fixed; left:12px; right:12px; bottom:12px; z-index:900;
    background:var(--accent-a); color:#fff; padding:12px 20px; border-radius:999px;
    box-shadow:0 14px 30px -10px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.08) inset;
  }
  .call-fab svg{ width:22px; height:22px; flex-shrink:0; }
  .call-fab .cf-text{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex:1; font-size:15px; }
  .call-fab .open-badge, .call-fab .open-badge.is-open, .call-fab .open-badge.is-closed{ color:#fff; font-size:11.5px; font-weight:600; opacity:.95; }
  .call-fab .open-badge.is-open i{ background:#7dffc0; }
  body{ padding-bottom:78px; }
}