/* Stil basert på RoboNuggets Design Systems og Brand Color Palettes Toolkit (skool.com/robonuggets), CC BY 4.0 */
/* Manendo skog og krem, låst (config/skills/design-manendo). Bare tokens i komponenter. */
:root {
  --krem:#F3F1EC; --krem-dyp:#EBE8E1; --papir:#FDFCFA; --mint:#D6EBE3; --krem-lys:#F6F4EF;
  --skog:#1F3B33; --skog-2:#2B4F45; --tekst:#3B3A33; --dempet:#6E6B62;
  --gran:#0E7A50; --gran-dyp:#0A6442; --gull:#C9A35A; --bronse:#A97C50; --bronse-dyp:#8A6238;
  --linje:rgba(31,59,51,.12); --linje-sterk:rgba(31,59,51,.26);
  --ok:#0A6442; --advarsel:#B86700; --fare:#B3261E;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px; --sp-8:32px; --sp-12:48px; --sp-16:64px;
  --seksjon:clamp(64px,8vw,112px); --marg:clamp(16px,5vw,64px); --innhold-maks:1180px; --tekst-maks:760px;
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:20px; --r-pill:999px;
  --skygge-kort:0 1px 2px rgba(31,59,51,.06),0 8px 24px rgba(31,59,51,.06);
  --skygge-loftet:0 2px 6px rgba(31,59,51,.08),0 18px 40px rgba(31,59,51,.10);
  --serif:"DM Serif Display",Georgia,serif;
  --sans:"Manrope",Helvetica,Arial,sans-serif;
}
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--krem); color:var(--tekst); font:400 16px/1.6 var(--sans); letter-spacing:-.005em; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img,svg { display:block; max-width:100%; }
.innhold { max-width:var(--innhold-maks); margin:0 auto; padding:0 var(--marg); }
.smal { max-width:var(--tekst-maks); }
.senter { text-align:center; }
.senter p { margin-left:auto; margin-right:auto; }
section { padding:var(--seksjon) 0; }
h1,h2,h3,.display,.tall { font-family:var(--serif); font-weight:400; color:var(--skog); margin:0; }
.display { font-size:clamp(44px,6.5vw,80px); line-height:1.02; letter-spacing:-.01em; }
h1 { font-size:clamp(36px,4.6vw,58px); line-height:1.08; letter-spacing:-.01em; }
h2 { font-size:clamp(30px,4vw,46px); line-height:1.1; letter-spacing:-.01em; }
h3 { font-size:22px; line-height:1.2; }
.tall { font-size:clamp(22px,3vw,48px); line-height:1; }
.display em,h1 em { font-style:italic; color:var(--gran-dyp); }
p { margin:0; max-width:70ch; }
.lede { font-size:19px; line-height:1.55; max-width:60ch; }
.liten { font-size:13px; line-height:1.5; color:var(--dempet); }
.eyebrow { display:inline-flex; align-items:center; gap:10px; font:600 12px/1.3 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--bronse-dyp); margin:0 0 14px; }
.eyebrow::before { content:""; width:28px; height:2px; background:var(--gull); }
.nr { font:600 13px/1 var(--sans); letter-spacing:.08em; color:var(--gran); }
a { color:var(--gran); text-decoration-color:var(--gull); text-underline-offset:4px; }
a:hover { color:var(--gran-dyp); }
.knapp { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:15px 26px; border-radius:var(--r-pill); font:600 16px/1 var(--sans); text-decoration:none; cursor:pointer; transition:background .15s ease,transform .15s ease; }
.knapp:active { transform:scale(.97); }
.knapp-primar { background:var(--gran); color:var(--krem-lys); border:0; }
.knapp-primar:hover { background:var(--gran-dyp); }
.knapp-primar[disabled] { opacity:.7; cursor:wait; }
.knapp-sekundar { background:transparent; color:var(--skog); border:1px solid var(--skog); }
.knapp-sekundar:hover { background:var(--krem-dyp); }
.knapp-liten { padding:10px 18px; font-size:14px; }
.kort { background:var(--papir); border:1px solid var(--linje); border-radius:var(--r-lg); padding:28px; box-shadow:var(--skygge-kort); }
.widget { background:var(--papir); border-radius:var(--r-xl); padding:30px; box-shadow:var(--skygge-loftet); }
.merke { display:inline-block; font:600 12px/1.3 var(--sans); letter-spacing:.14em; text-transform:uppercase; padding:4px 10px; border-radius:var(--r-pill); background:var(--mint); color:var(--gran-dyp); }
.band { background:var(--skog); color:var(--krem-lys); }
.band h2,.band .tall { color:var(--gull); }
label { display:grid; gap:6px; font:600 14px/1.3 var(--sans); color:var(--tekst); }
input,select,textarea { width:100%; background:var(--papir); color:var(--skog); border:1px solid var(--linje-sterk); border-radius:var(--r-md); padding:14px 16px; font:400 16px/1.4 var(--sans); }
input:focus,select:focus,textarea:focus { outline:2px solid var(--gran); outline-offset:1px; }
.feil input,.feil select { border-color:var(--fare); }
.melding { font-size:13px; color:var(--fare); }
:focus-visible { outline:2px solid var(--gran); outline-offset:3px; }

/* Topp */
.topp { display:flex; justify-content:space-between; align-items:center; gap:var(--sp-4); padding:18px var(--marg); border-bottom:1px solid var(--linje); }
.topp nav { display:flex; gap:28px; align-items:center; font-size:15px; }
.topp nav a:not(.knapp) { color:var(--dempet); text-decoration:none; }
.topp nav a:not(.knapp):hover { color:var(--skog); }
.logo { font-family:var(--serif); font-size:22px; color:var(--skog); text-decoration:none; }

/* Hero */
.hero { padding:clamp(32px,5vw,72px) 0 clamp(40px,6vw,80px); }
.hero-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(32px,5vw,72px); align-items:center; }
.hero-grid>*,.kort-rad>*,.steg>*,.band-grid>* { min-width:0; }
.hero .display { margin-bottom:22px; }
.hero .lede { margin-bottom:30px; }
.hero-side { display:flex; align-items:center; justify-content:center; }

/* Venteliste */
.vl { display:grid; gap:14px; max-width:560px; }
.vl .rad { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.vl .kryss { grid-template-columns:auto 1fr; align-items:start; gap:10px; font-weight:400; color:var(--dempet); }
.vl .kryss input { width:auto; margin-top:3px; accent-color:var(--gran); }
.vl .liten { margin-top:4px; }
.honning { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.turnstile-boks { display:flex; justify-content:flex-start; }
.turnstile-boks:not(:empty) { margin-top:4px; }
.takk { background:var(--mint); color:var(--gran-dyp); border-radius:var(--r-lg); padding:22px 24px; max-width:560px; }
.takk h3 { color:var(--skog); margin-bottom:6px; }
.takk p { color:var(--skog); }
.status { font-size:14px; min-height:1.4em; }
.status.feilet { color:var(--fare); }

/* Regnestykket (widget) */
.kalk { width:100%; max-width:440px; }
.kalk h3 { font-size:26px; margin-bottom:6px; }
.kalk .under { font-size:14px; color:var(--dempet); margin-bottom:22px; }
.kalk label { display:flex; justify-content:space-between; margin-bottom:8px; }
.kalk input[type=range] { width:100%; padding:0; border:0; background:transparent; accent-color:var(--gran); margin-bottom:22px; }
.kalk input[type=range]:focus { outline-offset:4px; }
.kalk .linje { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:14px 0; border-top:1px solid var(--linje); font-size:15px; }
.kalk .linje strong { font-family:var(--serif); font-size:22px; font-weight:400; color:var(--skog); white-space:nowrap; }
.kalk .linje.air strong { color:var(--fare); }
.kalk .linje.oss { background:var(--mint); margin:8px -30px -30px; padding:18px 30px; border-radius:0 0 var(--r-xl) var(--r-xl); border-top:0; flex-direction:column; gap:4px; }
.kalk .linje.oss strong { font-size:19px; color:var(--gran-dyp); white-space:normal; }

/* Kort */
.kort-rad { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.kort .nr { display:block; margin-bottom:22px; }
.kort h3 { margin-bottom:10px; }
.kort ul { margin:14px 0 0; padding:0; list-style:none; display:grid; gap:8px; }
.kort li { padding-left:18px; position:relative; }
.kort li::before { content:""; position:absolute; left:0; top:.65em; width:8px; height:2px; background:var(--gull); }
.kort-stor { grid-column:span 1; background:var(--krem-dyp); border-color:transparent; box-shadow:none; }
.kort-stor .tall { margin:6px 0 10px; }

/* Bånd */
.band { padding:clamp(40px,6vw,72px) 0; }
.band-grid { display:grid; grid-template-columns:auto 1fr; gap:clamp(24px,5vw,64px); align-items:center; }
.band-dato { font-family:var(--serif); font-size:clamp(28px,4vw,48px); line-height:1; color:var(--gull); }
.band p.tekst { font-size:18px; max-width:640px; }

/* Steg */
.steg { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:28px; counter-reset:s; }
.steg li { counter-increment:s; padding-top:22px; border-top:2px solid var(--linje-sterk); }
.steg li::before { content:counter(s,decimal-leading-zero); display:block; font:600 13px/1 var(--sans); letter-spacing:.08em; color:var(--gran); margin-bottom:14px; }
.steg h3 { margin-bottom:10px; }
h2 + .steg, h2 + .kort-rad, h2 + .tbl { margin-top:28px; }

/* Tabell */
.tbl { overflow-x:auto; -webkit-overflow-scrolling:touch; }
table { width:100%; min-width:560px; border-collapse:collapse; font-size:16px; }
th { text-align:left; font:600 13px/1.3 var(--sans); letter-spacing:.08em; text-transform:uppercase; color:var(--dempet); padding:12px 16px; border-bottom:1px solid var(--linje-sterk); }
td { padding:18px 16px; border-bottom:1px solid var(--linje); vertical-align:top; }
td:first-child { font-weight:600; color:var(--skog); }
tr.oss td { background:var(--papir); color:var(--skog); font-weight:500; }
tr.oss td:first-child { color:var(--gran); }
.tbl + .liten { margin-top:12px; }

/* Spørsmål */
details { border-top:1px solid var(--linje); padding:18px 0; }
details:last-of-type { border-bottom:1px solid var(--linje); }
summary { cursor:pointer; font-weight:600; font-size:18px; color:var(--skog); list-style:none; display:flex; justify-content:space-between; gap:16px; }
summary::-webkit-details-marker { display:none; }
summary::after { content:"+"; color:var(--gran); font-weight:400; flex:none; }
details[open] summary::after { content:"\2212"; }
details p { margin-top:12px; }
h2 + details { margin-top:28px; }

/* Avslutning og bunn */
.cta { background:var(--papir); border-top:1px solid var(--linje); }
.cta .lede { margin:14px auto 28px; }
footer { padding:36px 0; background:var(--skog); color:var(--krem-lys); font-size:14px; }
footer .logo { color:var(--krem-lys); }
footer a { color:var(--krem-lys); }
footer a:hover { color:var(--gull); }
.bunn { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:center; }
.bunn nav { display:flex; gap:20px; }

/* Undersider (personvern) */
.side { padding:clamp(40px,6vw,80px) 0; }
.side h1 { margin-bottom:18px; }
.side h2 { font-size:clamp(24px,3vw,32px); margin:40px 0 12px; }
.side p + p, .side ul { margin-top:12px; }
.side ul { padding-left:20px; }

@media (max-width:820px) {
  .hero-grid,.band-grid,.kort-rad,.steg,.vl .rad { grid-template-columns:1fr; }
  .topp nav a:not(.knapp) { display:none; }
  table { font-size:14px; } th,td { padding:12px 8px; }
  .lede { font-size:18px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; } }