/* Topp A, søk og bunn for bilteori.app (felles/ v1, run 20261015T0006-claude-meny-a-e536; prototype i release/2026-10-14-sok-og-meny).
   Bygger på bloggens CSS (DESIGN-WEB.md): 0 radius, 2 px svart kant, blå knapp, DM Mono-etiketter, svart meny med Antonio og lime pil.
   Ingen nye farger. Første bolk er grunnlaget for toppen og bunnen, avgrenset til .topA og .fbunn, så de ser like ut også på sider
   uten forsidens stil (om, hjelp, personvern, vilkår). På sidene med forsidens stil er verdiene de samme. */
@font-face{font-family:Hanken;src:url(/bilteori/hanken.ttf) format("truetype");font-weight:100 900;font-display:swap}
@font-face{font-family:Antonio;src:url(/bilteori/antonio.ttf) format("truetype");font-weight:100 700;font-display:swap}
.topA,.fbunn{--ink:#0E0E10;--ink2:#3A3A40;--mute:#6E6E76;--paper:#FFFFFF;--lav:#DCD9F7;--fog:#EEEEF0;--blue:#3448FB;--blue-ink:#FFFFFF;--lime:#DFFF82;--black:#0E0E10;--line:#E3E3E8;
  font:400 18px/1.5 Hanken,-apple-system,system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-align:left;box-sizing:border-box}
.topA *,.fbunn *{box-sizing:border-box}
.topA .wrap,.fbunn .wrap{width:min(1180px,100%);margin:0 auto;padding-inline:20px}
.topA .mono,.fbunn .mono{font-family:"DM Mono",ui-monospace,Menlo,monospace;font-size:13px;letter-spacing:.04em;text-transform:uppercase;font-weight:500}
.topA p,.fbunn p{margin:0}.topA img,.fbunn img{max-width:100%;display:block}
.topA .btn,.fbunn .btn{display:inline-flex;align-items:center;gap:10px;min-height:58px;padding:0 24px;background:var(--blue);color:var(--blue-ink);font:600 19px/1 Hanken,sans-serif;text-decoration:none;border:0;border-radius:0}
.topA .btn::after{content:"→";font-weight:500}.topA .btn:hover{background:#1f33e6}
.topA .tlink{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.topA{position:sticky;top:0;z-index:10;margin:0;padding:0;background:rgba(255,255,255,.88);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);color:var(--ink)}
.topA .bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.topA .logo{display:flex;align-items:center;text-decoration:none}.topA .logo img{height:30px;width:auto}
.topA .nav{display:none;gap:26px;align-items:center;font-weight:600;font-size:16px}.topA .nav>a,.topA .nav summary{text-decoration:none;color:var(--ink2)}.topA .nav>a:hover{color:var(--ink)}
@media(min-width:960px){.topA .nav{display:flex}}
@media(min-width:960px) and (max-width:1120px){.topA .nav{gap:18px;font-size:15px}}
.topA .btn{min-height:44px;padding:0 16px;font-size:16px}
.topA .right{display:flex;align-items:center;gap:10px}
.topA .menyknapp,.topA .lukkknapp{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1.5px solid var(--ink);color:var(--ink);text-decoration:none;background:#fff}
.topA .menyknapp svg,.topA .lukkknapp svg{width:22px;height:22px}
.topA .lukkknapp{display:none;background:var(--ink);color:#fff}
.topA:has(#meny:target) .menyknapp{display:none}.topA:has(#meny:target) .lukkknapp{display:inline-flex}
.topA .meny{display:none;position:absolute;left:0;right:0;top:100%;height:calc(100dvh - 65px);overflow-y:auto;background:var(--black);color:#fff;scroll-margin-top:65px}
.topA .meny:target{display:block}
.topA .meny ul{list-style:none;margin:0;padding:8px 0 0}
.topA .meny li{border-bottom:1px solid #34343C}
.topA .meny li>a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font:600 clamp(30px,8.6vw,40px)/1.2 Antonio,sans-serif;text-transform:uppercase;color:#fff;text-decoration:none}
.topA .meny li>a::after{content:"→";font:500 22px/1 Hanken,sans-serif;color:var(--lime)}
.topA .meny .faner{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 20px}
.topA .meny .faner a{border:1.5px solid #5A5A64;padding:9px 11px;color:#fff;text-decoration:none}
.topA .meny .faner a:hover,.topA .meny .faner a:focus-visible{border-color:var(--lime);color:var(--lime)}
.topA .meny .bunn{display:flex;flex-wrap:wrap;align-items:center;gap:18px 26px;padding:30px 0 44px}
@media(min-width:960px){.topA .menyknapp,.topA .lukkknapp,.topA .meny{display:none!important}}
.topA .meny a:focus-visible,.topA .menyknapp:focus-visible,.topA .lukkknapp:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}
.fbunn{display:block;background:var(--black);color:#B9B9C2;padding:72px 0 40px;margin:0;border:0}
.fbunn .fcols{display:grid;gap:32px}
.fbunn ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}.fbunn a{color:#fff;text-decoration:none}.fbunn a:hover{text-decoration:underline}
.fbunn .mono{color:#8A8A94}.fbunn .ftekst{margin-top:12px}
.fbunn .flogo{margin-top:56px;width:clamp(170px,26vw,260px);height:auto}
.fbunn .fine{margin-top:28px;font-size:14px;color:#8A8A94;max-width:80ch}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.top{position:sticky}
/* ---------- søkefeltet ---------- */
.sokform{position:relative;display:flex;gap:0;width:100%}
.sokform input{flex:1;min-width:0;height:54px;padding:0 16px;border:2px solid var(--ink);border-radius:0;background:#fff;color:var(--ink);font:500 18px/1 Hanken,sans-serif;-webkit-appearance:none;appearance:none}
.sokform input::placeholder{color:var(--mute)}
.sokform input:focus{outline:3px solid var(--blue);outline-offset:0}
.sokform input::-webkit-search-cancel-button{-webkit-appearance:none}
.sokgo{height:54px;padding:0 20px;border:0;border-radius:0;background:var(--blue);color:#fff;font:600 17px/1 Hanken,sans-serif;cursor:pointer}
.sokgo:hover{background:#1f33e6}
.sokliste{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;max-height:min(70vh,560px);overflow-y:auto;background:#fff;border:2px solid var(--ink);box-shadow:0 18px 40px rgba(14,14,16,.16);text-align:left}
.sokgruppe{padding:14px 16px 6px;color:var(--blue)}.sokgruppe span{color:var(--mute);margin-left:6px}
.sokvalg{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:11px 16px;color:var(--ink);text-decoration:none;border-top:1px solid var(--line)}
.sokvalg:hover,.sokvalg[aria-selected="true"]{background:var(--lav)}
.sokvalg[aria-selected="true"]{box-shadow:inset 4px 0 0 var(--blue)}
.sokt{font-weight:600;font-size:17px;line-height:1.3}
.sokm{color:var(--mute);font-size:11.5px;white-space:nowrap;flex:none}
.sok-verktoy .sokt::before{content:"→ ";color:var(--blue)}
mark{background:var(--lime);color:inherit;padding:0 1px}
.sokalle{display:block;padding:14px 16px;border-top:2px solid var(--ink);font-weight:700;text-decoration:none;color:var(--blue)}
.sokingen{padding:16px;color:var(--ink2)}
/* søkeknappen i toppen */
.sokknapp{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;min-width:44px;padding:0 12px;border:1.5px solid var(--ink);color:var(--ink);background:#fff;text-decoration:none;font:600 16px/1 Hanken,sans-serif}
.sokknapp svg{width:20px;height:20px}.sokknapp span{display:none}
@media(min-width:960px){.sokknapp span{display:inline}}
.sokknapp[aria-expanded="true"]{background:var(--ink);color:#fff}
.sokknapp:focus-visible,.menyknapp:focus-visible,.nedtrekk summary:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.sokpanel{border-top:1px solid var(--line);background:#fff;padding:14px 0 16px}
.sokpanel[hidden]{display:none}
/* «Last ned» viker for søk og meny på smale skjermer */
@media(max-width:520px){.top .btn.last{display:none}}
/* ---------- A: Verktøy-nedtrekk ---------- */
.nedtrekk{position:static}
.nedtrekk summary{list-style:none;cursor:pointer;color:var(--ink2);display:inline-flex;align-items:center;gap:6px}
.nedtrekk summary::-webkit-details-marker{display:none}
.nedtrekk summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.nedtrekk[open] summary{color:var(--blue)}.nedtrekk[open] summary::after{transform:translateY(2px) rotate(225deg)}
.nedpanel{position:absolute;left:0;right:0;top:100%;background:var(--black);color:#fff;padding:34px 0 40px;border-top:1px solid #34343C}
.nedpanel .wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.nedpanel ul{list-style:none;margin:12px 0 0;padding:0}
.nedpanel li a{display:grid;gap:3px;padding:12px 0;border-bottom:1px solid #34343C;color:#fff;text-decoration:none}
.nedpanel li a b{font:600 26px/1.2 Antonio,sans-serif;text-transform:uppercase;display:flex;justify-content:space-between}
.nedpanel li a b::after{content:"→";font:500 18px/1.4 Hanken,sans-serif;color:var(--lime)}
.nedpanel li a span{color:#B9B9C2;font-size:15px;font-weight:400}
.nedpanel li a:hover b{color:var(--lime)}
.nedpanel .mono{color:#8A8A94}
/* ---------- den svarte menyen: søk og verktøy øverst ---------- */
.meny .msok{padding:18px 0 6px}
.meny .msok input{border-color:#fff}
.meny .mkick{color:#8A8A94;margin:18px 0 10px}
.mverk{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:18px}
.mrute{display:grid;align-content:space-between;gap:6px;min-height:78px;padding:12px;background:#1B1B21;color:#fff;text-decoration:none}
.mrute .vnavn{font:600 19px/1.15 Antonio,sans-serif;text-transform:uppercase}
.mrute .vlinje{display:none}
.mrute::after{content:"→";color:var(--lime);font-size:18px;justify-self:end}
.mrute.alle{background:var(--blue)}.mrute.alle::after{color:#fff}
.mrute:hover,.mrute:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}
/* ---------- B: søk først ---------- */
.topB .bar{gap:18px}
.bsok{flex:1;max-width:620px}
@media(max-width:759px){.topB .bar{flex-wrap:wrap;row-gap:0}.topB .bsok{order:3;flex:1 0 100%;max-width:none;padding-bottom:12px}.topB .bsok input{height:48px}.topB .bsok .sokgo{height:48px}}
.topB .menyknapp.tekst,.topB .lukkknapp.tekst,.topC .menyknapp.tekst,.topC .lukkknapp.tekst{width:auto;padding:0 14px;gap:8px;font:600 16px/1 Hanken,sans-serif}
.verktoyrad{background:var(--fog);border-top:1px solid var(--line)}
.verktoyrad .wrap{display:flex;gap:8px;align-items:center;overflow-x:auto;scrollbar-width:none;padding-block:10px;scroll-snap-type:x proximity}
.verktoyrad .wrap::-webkit-scrollbar{display:none}
.verktoyrad a{flex:none;scroll-snap-align:start;padding:9px 12px;background:#fff;border:1.5px solid var(--ink);color:var(--ink);text-decoration:none;font:600 15px/1 Hanken,sans-serif}
.verktoyrad a:hover{background:var(--ink);color:#fff}
.verktoyrad .vr-alle{background:var(--blue);border-color:var(--blue);color:#fff;font:500 13px/1 "DM Mono",monospace}
/* ---------- C: stor meny på alle bredder ---------- */
.cmid{flex:1;display:none}
@media(min-width:960px){.cmid{display:flex;justify-content:flex-end}}
.cverk{font-weight:700;color:var(--ink);text-decoration:none;padding:12px 6px;border-bottom:3px solid var(--lime)}
@media(min-width:960px){.topC .menyknapp,.topC .lukkknapp{display:inline-flex!important}.topC .lukkknapp{display:none!important}
  .topC:has(#meny:target) .menyknapp{display:none!important}.topC:has(#meny:target) .lukkknapp{display:inline-flex!important}
  .topC .meny.mega:target{display:block!important}}
.mega .mgrid{display:grid;gap:4px 34px;padding:14px 0 10px}
@media(min-width:960px){.mega .mgrid{grid-template-columns:repeat(4,1fr)}.mega .msok{max-width:720px}}
.mega .mkol{padding:12px 0;border-bottom:1px solid #34343C}
.mega .mkol .mono a{color:#8A8A94;text-decoration:none}
.mega .mkol ul{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:2px}
.mega .mkol li{border:0}
.mega .mkol li a{display:flex;justify-content:space-between;padding:7px 0;font:600 23px/1.2 Antonio,sans-serif;text-transform:uppercase;color:#fff;text-decoration:none}
.mega .mkol li a::after{content:"→";font:500 17px/1.4 Hanken,sans-serif;color:var(--lime)}
.mega .vkol{background:var(--blue);padding:14px 16px 16px;border:0}
.mega .vkol .mono a{color:#fff}
.mega .vkol li a::after{color:#fff}
@media(min-width:960px){.mega .vkol{grid-row:span 2}}
.mega .mfot{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;padding:26px 0 40px}
.mega .mfot a:not(.btn){color:#fff;font-weight:600}
/* ---------- /verktoy/ ---------- */
.vhero h1{max-width:none}
.vsok{margin-top:30px;max-width:640px}
.vsec{padding:56px 0 110px}
.vgruppe{margin-top:44px}.vgruppe:first-child{margin-top:0}
.vgruppe h2{font-size:13px;color:var(--blue)}
.vgruppe ul{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px}
@media(min-width:900px){.vgruppe ul{grid-template-columns:1fr 1fr}}
.vrad{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;padding:20px;background:var(--fog);color:var(--ink);text-decoration:none;min-height:108px}
.vrad:hover{background:var(--lav)}.vrad:focus-visible{outline:3px solid var(--blue)}
.vnr{color:var(--mute)}
.vtekst{display:grid;gap:4px}.vtekst b{font:600 30px/1.2 Antonio,sans-serif;text-transform:uppercase}
.vtekst span{color:var(--ink2);font-size:16px;line-height:1.4}
.vpil{font-size:26px;color:var(--blue)}
.vstatus{display:inline-block;margin-left:8px;padding:3px 6px;background:var(--lime);color:var(--ink)!important;font:500 11px/1.2 "DM Mono",monospace;text-transform:uppercase;vertical-align:middle}
/* ---------- /sidekart/ ---------- */
.skart{padding:56px 0 110px}
.skgrid{display:grid;gap:36px 40px}
@media(min-width:760px){.skgrid{grid-template-columns:1fr 1fr}}@media(min-width:1100px){.skgrid{grid-template-columns:1fr 1fr 1fr}}
.skblokk h2{font-size:13px;color:var(--blue)}.skblokk h2 a{text-decoration:none}
.skblokk ul{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.skblokk li a{font-weight:600;text-decoration:none}.skblokk li a:hover{text-decoration:underline}
.skbred{margin-top:56px}.skbred h3{margin-top:26px}
.skflyt{display:flex!important;flex-wrap:wrap;gap:6px 18px!important}
.skflyt li a{font-weight:500}
.skinfo{margin-top:10px;color:var(--ink2)}
/* ---------- /sok/ ---------- */
.sokhero .sokform{margin-top:28px;max-width:720px}
.sokhero .sokform input{height:64px;font-size:21px}.sokhero .sokgo{height:64px}
.sokres{padding:36px 0 110px}
.sokseksjon{margin-top:36px}.sokseksjon h2{font-size:13px;color:var(--blue)}.sokseksjon h2 span{color:var(--mute)}
.sokseksjon ol{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px;max-width:820px}
.sokseksjon li{display:grid;gap:4px;padding:16px 18px;background:var(--fog)}
.sokseksjon li a{text-decoration:none}.sokseksjon li a:hover .sokt{text-decoration:underline}
.sokseksjon .sokd{color:var(--ink2);font-size:16px}
.sokseksjon .sok-verktoy{background:var(--lav)}
#sok-reserve h2{font-size:13px;color:var(--blue)}#sok-reserve ul{list-style:none;padding:0;margin:12px 0}
/* ---------- bunnen med seks kolonner ---------- */
.fbunn .fcols6{grid-template-columns:1fr 1fr;gap:32px 20px}.fbunn .fcols6>div:first-child{grid-column:1/-1}
@media(min-width:900px){.fbunn .fcols6{grid-template-columns:1.3fr repeat(5,1fr)}.fbunn .fcols6>div:first-child{grid-column:auto}}
.fbunn .flinjer{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:40px;padding-top:22px;border-top:1px solid #34343C}
/* rettinger etter første skjermbilderunde */
.menyknapp:not(.tekst) span,.lukkknapp:not(.tekst) span{display:none}
@media(max-width:600px){.sokvalg{flex-direction:column;align-items:flex-start;gap:3px}.sokt{font-size:16px}}
@media(max-width:759px){.topB .bar>.logo,.topB .bar>.right{min-height:64px;display:flex;align-items:center}}
.vtekst .vstatus{justify-self:start;margin-left:0;width:max-content}
/* felles v1: «Alle verktøy» under nedtrekket, og appens nettleser (?ct=app-…) */
.nedpanel .nedalle{margin-top:26px}.nedpanel .nedalle a{color:var(--lime)}
/* Åpnet fra appen (app.js setter html[data-app]): ingen lenker til App Store, ingen «Last ned» */
html[data-app] a[href*="apps.apple.com"]{display:none!important}
/* /verktoy/ på 375 px: «BOMPENGEKALKULATOR» i 30 px var bredere enn kolonnen (7 px sideveis rulling) */
.vtekst{min-width:0}.vtekst b{overflow-wrap:anywhere}
@media(max-width:480px){.vrad{gap:12px;padding:16px}.vtekst b{font-size:25px}}
/* Sider med eldre stilark (/support/, /personvern/, /vilkar/: bilteori.css; /om/, /slik-er-oppgavene-laget/: sider.css) har regler for
   nav, details, summary og footer som element. De skal ikke nå toppen og bunnen. */
header.topA details.nedtrekk{border:0;padding:0;margin:0}
header.topA .nedtrekk summary{font:inherit;font-weight:600;min-height:0;padding:0;margin:0}
header.topA nav.nav,header.topA nav.meny{max-width:none;margin:0;padding:0;gap:26px;flex-wrap:nowrap}
header.topA nav.meny{gap:0}
header.topA .nav>a{min-height:0;display:inline}
header.topA .meny a,footer.fbunn a{min-height:0}
footer.fbunn ul,footer.fbunn p{max-width:none}
@media(min-width:960px) and (max-width:1120px){header.topA nav.nav{gap:18px}}
/* /om/ og /slik-er-oppgavene-laget/ laster styles.css, der .wrap (600 px), .bar (fremdriftslinje) og .right (svarknapp) betyr noe annet */
header.topA .wrap,footer.fbunn .wrap{max-width:none;width:min(1180px,100%)}
header.topA .bar{flex:none;height:auto;min-height:64px;background:none;overflow:visible}
header.topA .right{background:none;border:0;color:inherit}
header.topA .logo{flex:none}
header.topA svg{animation:none;margin:0;flex:none;fill:none;stroke:currentColor}
header.topA .sokknapp svg{width:20px;height:20px}header.topA .menyknapp svg,header.topA .lukkknapp svg{width:22px;height:22px}
header.topA .sokknapp{color:var(--ink)}header.topA .sokknapp[aria-expanded="true"]{color:#fff}
header.topA .btn{flex-direction:row;color:var(--blue-ink);width:auto;text-align:left;white-space:nowrap}
header.topA .meny a,header.topA .nedpanel a,header.topA .mrute{color:#fff}
footer.fbunn a{color:#fff}
footer.fbunn{padding:72px 0 40px;font-size:18px;color:#B9B9C2}footer.fbunn::after{content:none;display:none}
footer.fbunn p{color:#B9B9C2;margin-top:0}footer.fbunn .ftekst{margin-top:12px}footer.fbunn .flinjer{margin-top:40px}footer.fbunn .fine{margin-top:28px;color:#8A8A94}
/* felles v2 (2026-10-21): «Legg til Bilteori som foretrukket kilde i Google» i bunnen og boksen etter artiklene */
footer.fbunn .fkilde{margin-top:18px;font-size:16px}footer.fbunn .fkilde a{color:#DFFF82;text-decoration:underline;text-underline-offset:3px}
.gkilde{margin-top:48px;padding:22px 24px;background:#EEEEF0;border-left:4px solid #3448FB;color:#0E0E10}
.gkilde p{margin:0;max-width:62ch}.gkilde p+p{margin-top:10px}
.gkilde .mono{font-family:"DM Mono",ui-monospace,Menlo,monospace;font-size:13px;letter-spacing:.04em;text-transform:uppercase;font-weight:500;color:#3448FB}
.gkilde a{color:#3448FB;font-weight:600;text-decoration:underline;text-underline-offset:3px}
