@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{--ink:#111416;--paper:#f4f4f0;--lime:#d8ff3e;--muted:#9ca3a6;--line:rgba(255,255,255,.15)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px}a{color:inherit;text-decoration:none}.topbar{height:82px;background:#0b0d0e;color:#fff;display:flex;align-items:center;padding:0 clamp(22px,5vw,72px);gap:42px;position:relative;z-index:10}.brand{display:flex;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.5px}.brand-main{font-size:20px}.brand-as{font-size:12px;border:1px solid #83898b;border-radius:2px;padding:2px 4px}.topbar nav{margin-left:auto;display:flex;gap:30px;color:#c9cdce;font-size:15px}.topbar nav a:hover{color:#fff}.top-phone{background:var(--lime);color:#111;padding:12px 20px;border-radius:3px;font-weight:700}.menu{display:none}.hero{height:clamp(620px,78vh,820px);min-height:620px;position:relative;color:#fff;overflow:hidden}.hero-image{position:absolute;inset:0;background:url('hero.png') center/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,10,.94) 0%,rgba(5,8,10,.78) 38%,rgba(5,8,10,.14) 72%),linear-gradient(0deg,rgba(5,8,10,.55),transparent 45%)}.hero-content{position:relative;z-index:1;padding:clamp(90px,13vh,145px) clamp(22px,7vw,104px);max-width:790px}.eyebrow{font:700 13px Manrope,sans-serif;letter-spacing:2.4px;color:var(--lime);margin:0 0 22px}.eyebrow.dark{color:#687515}.hero h1,.section-head h2,.inventory h2,.about h2,.contact h2{font-family:Manrope,sans-serif;letter-spacing:-3px;line-height:1.02;margin:0}.hero h1{font-size:clamp(50px,6.3vw,88px)}.hero h1 span{color:var(--lime)}.lead{font-size:20px;color:#d5d8d9;max-width:520px;line-height:1.55;margin:28px 0 36px}.actions{display:flex;gap:12px;flex-wrap:wrap}.btn{padding:16px 22px;border-radius:3px;font-weight:700}.btn.primary{background:var(--lime);color:#0b0d0e}.btn.primary span{margin-left:18px}.btn.ghost{border:1px solid rgba(255,255,255,.4)}.open-card{position:absolute;z-index:2;right:0;bottom:0;background:rgba(12,15,16,.9);backdrop-filter:blur(10px);padding:24px 48px 24px 28px;display:flex;align-items:center;gap:15px}.open-card .dot{width:10px;height:10px;border-radius:50%;background:var(--lime);box-shadow:0 0 16px var(--lime)}.open-card strong,.open-card small{display:block}.open-card small{color:#adb2b4;margin-top:5px}.inventory{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:end;padding:100px clamp(22px,7vw,104px)}.inventory h2,.about h2{font-size:clamp(42px,5vw,68px)}.inventory p:not(.eyebrow),.about p:not(.eyebrow){font-size:18px;line-height:1.7;color:#5e6466;max-width:660px}.finn-card{background:#06e35d;padding:28px;min-height:180px;display:grid;grid-template-columns:1fr auto;align-content:space-between;font-weight:700;font-size:18px}.finn-card .finn-word{grid-column:1/-1;font:800 38px Manrope,sans-serif;letter-spacing:-2px}.finn-card b{font-size:28px}.services{background:#111416;color:white;padding:100px clamp(22px,7vw,104px)}.section-head h2,.contact h2{font-size:clamp(42px,5vw,66px)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:65px;border-top:1px solid var(--line)}.service-grid article{padding:38px 38px 18px 0;border-right:1px solid var(--line);min-height:300px}.service-grid article+article{padding-left:38px}.service-grid article:last-child{border-right:0}.number{color:var(--lime);font:600 14px Manrope,sans-serif}.service-grid h3{font:700 25px Manrope,sans-serif;margin:38px 0 15px}.service-grid p{color:#aeb3b5;line-height:1.65}.service-grid a{display:inline-block;color:var(--lime);font-weight:700;margin-top:18px}.about{display:grid;grid-template-columns:.75fr 1.25fr;gap:90px;padding:110px clamp(22px,7vw,104px);align-items:center}.about-mark{height:390px;background:var(--lime);display:flex;align-items:center;justify-content:center;font:800 clamp(80px,10vw,155px) Manrope,sans-serif;letter-spacing:-12px}.about-mark span{font-size:.2em;letter-spacing:0;border:2px solid #111;padding:3px;align-self:center;margin:35px 0 0 10px}.contact{background:#222729;color:#fff;padding:100px clamp(22px,7vw,104px)}.contact-intro p:not(.eyebrow){color:#b9bec0;font-size:18px}.people{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:55px 0}.people a{border:1px solid #4b5254;padding:28px;transition:.2s}.people a:hover{border-color:var(--lime);transform:translateY(-2px)}.people small,.details small{display:block;color:#92999c;font-size:12px;letter-spacing:1.3px;margin-bottom:14px}.people strong{display:block;font:700 24px Manrope,sans-serif;margin-bottom:24px}.people span{color:var(--lime);font-size:18px;font-weight:700}.details{border-top:1px solid #4b5254;padding-top:38px;display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.details strong,.details a{font-size:18px;line-height:1.5}footer{background:#090b0c;color:#aaa;display:flex;align-items:center;gap:40px;padding:35px clamp(22px,7vw,104px);font-size:14px}footer p{margin-left:auto}.footer-brand{color:white}
@media(max-width:800px){.topbar{height:70px;padding:0 20px}.brand-main{font-size:17px}.top-phone{display:none}.menu{display:block;margin-left:auto;background:none;border:1px solid #54595b;color:#fff;padding:8px 12px;border-radius:3px}.topbar nav{display:none;position:absolute;top:70px;left:0;right:0;background:#0b0d0e;padding:22px;flex-direction:column}.topbar nav.open{display:flex}.hero{height:700px}.hero-image{background-position:62% center}.hero-shade{background:linear-gradient(90deg,rgba(5,8,10,.93),rgba(5,8,10,.42)),linear-gradient(0deg,rgba(5,8,10,.7),transparent)}.hero-content{padding-top:100px}.open-card{left:0;right:auto;padding:20px}.inventory,.about{grid-template-columns:1fr;gap:45px;padding-top:75px;padding-bottom:75px}.services,.contact{padding-top:75px;padding-bottom:75px}.service-grid{grid-template-columns:1fr}.service-grid article,.service-grid article+article{border-right:0;border-bottom:1px solid var(--line);padding:30px 0;min-height:auto}.about-mark{height:260px}.people{grid-template-columns:1fr}.details{grid-template-columns:1fr 1fr}.hero h1,.inventory h2,.about h2,.contact h2,.section-head h2{letter-spacing:-2px}footer{align-items:flex-start;flex-direction:column;gap:14px}footer p{margin:0}}
@media(max-width:480px){.details{grid-template-columns:1fr}.hero h1{font-size:48px}.lead{font-size:18px}.actions{flex-direction:column}.btn{text-align:center}.about-mark{height:210px}}

/* Ren forside uten bilfoto */
.hero{background:#111416}
.hero-image{background:none}
.hero-shade{background:radial-gradient(circle at 82% 38%,rgba(216,255,62,.12),transparent 26%),linear-gradient(135deg,#111416 0%,#1d2325 100%)}
.hero::after{content:"BN";position:absolute;right:5vw;top:50%;transform:translateY(-54%);font:800 clamp(170px,25vw,390px)/1 Manrope,sans-serif;letter-spacing:-.12em;color:rgba(255,255,255,.025);pointer-events:none}
@media(max-width:800px){.hero::after{right:-8vw;top:60%}}

/* Mykere og mer profesjonelt uttrykk */
.topbar{border-bottom:1px solid rgba(255,255,255,.08)}
.top-phone,.btn{border-radius:999px;transition:transform .2s ease,background .2s ease,border-color .2s ease}
.top-phone:hover,.btn:hover{transform:translateY(-2px)}
.btn.ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.7)}
.hero{min-height:600px;height:clamp(600px,72vh,740px)}
.hero-content{max-width:850px}
.open-card{right:clamp(18px,4vw,64px);bottom:28px;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:20px 28px;box-shadow:0 18px 50px rgba(0,0,0,.22)}
.inventory{gap:clamp(45px,7vw,100px)}
.finn-card{border-radius:24px;box-shadow:0 16px 45px rgba(17,20,22,.12);transition:transform .2s ease,box-shadow .2s ease}
.finn-card:hover{transform:translateY(-4px);box-shadow:0 22px 55px rgba(17,20,22,.17)}
.service-grid{gap:18px;border-top:0}
.service-grid article,.service-grid article+article{padding:34px;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(255,255,255,.035);min-height:310px}
.service-grid article:last-child{border-right:1px solid rgba(255,255,255,.12)}
.service-grid article:hover{background:rgba(255,255,255,.06);border-color:rgba(216,255,62,.35)}
.about-mark{border-radius:28px;box-shadow:0 18px 45px rgba(17,20,22,.12)}
.people a{border-radius:18px;background:rgba(255,255,255,.025)}
.people a:hover{background:rgba(255,255,255,.05)}
@media(max-width:800px){.open-card{left:20px;right:20px;bottom:20px}.service-grid{gap:14px}.service-grid article,.service-grid article+article{padding:28px;border:1px solid rgba(255,255,255,.12)}.service-grid article:last-child{border-right:1px solid rgba(255,255,255,.12)}}

/* Midtstilt Bruktbil Nordvest-logo */
.topbar{justify-content:space-between}
.topbar .header-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(270px,28vw,420px);display:block;text-align:center;padding:9px 18px}
.header-logo::before,.header-logo::after{content:"";position:absolute;left:0;right:0;height:2px;background:#fff;transform:skewX(-24deg)}
.header-logo::before{top:0}.header-logo::after{bottom:0}
.logo-word{display:block;font:800 italic clamp(19px,2vw,30px)/1 Manrope,sans-serif;letter-spacing:-1.4px;text-transform:uppercase;transform:skewX(-8deg);white-space:nowrap}
.logo-word small{font-size:.5em;letter-spacing:0;margin-left:4px}
.topbar nav{margin-left:0}
.topbar .top-phone{margin-left:auto}
footer p{margin-left:auto;margin-right:auto}
@media(max-width:1050px){.topbar nav{display:none}}
@media(max-width:800px){.topbar .header-logo{width:230px;padding:7px 12px}.logo-word{font-size:17px}.menu{margin-left:0}.topbar nav.open{display:flex}.topbar .brand-main{font-size:17px}}
@media(max-width:430px){.topbar .header-logo{width:205px;left:57%}.logo-word{font-size:15px}}

/* Sort og gull profil */
:root{--ink:#11100e;--paper:#f5f1e8;--lime:#cba85a;--muted:#aaa49a}
.topbar,footer{background:#080808}
.hero{background:#090909}
.hero-shade{background:radial-gradient(circle at 82% 38%,rgba(203,168,90,.16),transparent 27%),linear-gradient(135deg,#090909 0%,#1c1914 100%)}
.hero h1 span,.eyebrow,.service-grid a,.people span{color:#d5b66f}
.eyebrow.dark{color:#9b762d}
.top-phone,.btn.primary{background:linear-gradient(135deg,#dfc27c,#b78a38);color:#11100e;box-shadow:0 8px 24px rgba(183,138,56,.22)}
.top-phone:hover,.btn.primary:hover{background:linear-gradient(135deg,#ead08e,#c79b48)}
.open-card .dot{background:#d5b66f;box-shadow:0 0 16px rgba(213,182,111,.8)}
.finn-card{background:linear-gradient(135deg,#d7ba73,#b68935);color:#11100e}
.services{background:#11100e}
.service-grid article:hover{border-color:rgba(203,168,90,.45)}
.about-mark{background:linear-gradient(145deg,#d8bb74,#b98b36)}
.contact{background:#201c16}
.header-logo::before,.header-logo::after{background:#d5b66f}
.logo-word{color:#fff}

/* Helhetlig mørk layout og ryddig seksjonsflyt */
html{background:#111}
body{background:#181818;color:#f3efe6;overflow-x:hidden}
main>section{position:relative;isolation:isolate}
.inventory,.about{background:#242424;color:#f3efe6}
.inventory p:not(.eyebrow),.about p:not(.eyebrow){color:#bdbab3}
.inventory{align-items:center;border-top:1px solid rgba(203,168,90,.16);border-bottom:1px solid rgba(203,168,90,.16)}
.about{border-top:1px solid rgba(255,255,255,.06)}
.btn,.top-phone{display:inline-flex;align-items:center;justify-content:center;line-height:1.2;white-space:nowrap}
.actions{position:relative;z-index:3;gap:14px;margin-bottom:24px}
.hero-content{padding-bottom:150px}
.open-card{z-index:4;max-width:440px}
.finn-card{width:100%;overflow:hidden}
.services,.contact{overflow:hidden}
.service-grid article{display:flex;flex-direction:column}
.service-grid article a{margin-top:auto;padding-top:18px}
.people a{display:flex;flex-direction:column;min-width:0}
.people span{overflow-wrap:anywhere}
footer{border-top:1px solid rgba(203,168,90,.2)}
@media(max-width:800px){
  .hero{height:auto;min-height:0;padding-bottom:22px}
  .hero-content{padding:82px 20px 52px;max-width:none}
  .actions{margin-bottom:0}
  .open-card{position:relative;left:auto;right:auto;bottom:auto;width:calc(100% - 40px);max-width:none;margin:0 20px;padding:18px 20px}
  .inventory,.services,.about,.contact{padding-top:72px;padding-bottom:72px}
  .finn-card{min-height:160px}
  .service-grid article,.service-grid article+article{min-height:0}
}
@media(max-width:480px){
  .actions .btn{width:100%}
  .hero-content{padding-top:70px}
  .inventory,.services,.about,.contact{padding-top:60px;padding-bottom:60px}
  .people a{padding:24px}
}

/* Toppfeltet følger innholdet og kan aldri klippe knappene */
@media(min-width:801px){
  .hero{height:auto;min-height:820px}
  .hero-content{padding-top:90px;padding-bottom:140px}
}