/* Pakkene (forsiden og kurven) og kurven/takkesiden (brief «tilbud v3»). Tokens fra produkt.css og forsiden. Ingen tekst under 14 px. */

/* ---------- Pakkekortene ---------- */
.pakker{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;margin-top:20px}
.pakke{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--surface);border-radius:6px;padding:22px 20px 20px;box-shadow:0 0 0 1px var(--line)}
.pakke.mest{box-shadow:0 0 0 2.5px var(--ink)}
.pakke .merke-mest{position:absolute;top:-13px;left:18px;background:var(--yellow);color:var(--carbon);font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:6px}
.pakke h3{font-family:var(--display);font-stretch:68%;font-weight:850;text-transform:uppercase;font-size:34px;line-height:1;margin:4px 0 0}
.pakke .innhold{margin:0;font-weight:700;font-size:16px}
.pakke .pris{margin:4px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.pakke .pris b{font-family:var(--display);font-stretch:68%;font-weight:850;font-size:46px;line-height:1;font-variant-numeric:tabular-nums}
.pakke .pris .rab{font-size:15px;font-weight:750;background:var(--sunk);padding:3px 8px;border-radius:6px}
.pakke .per{margin:0;font-size:15px;color:var(--muted)}
.miks{border-top:1px solid var(--line);padding-top:12px;margin-top:4px}
.miks-h{display:flex;justify-content:space-between;align-items:center;margin:0 0 8px;font-weight:700;font-size:15px}
.miks .jevn{border:0;background:none;font:inherit;font-size:15px;font-weight:650;text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:8px 0;color:var(--ink)}
.miks ul,.egen ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.smak{display:flex;align-items:center;gap:10px;background:var(--paper);border-radius:6px;padding:4px 4px 4px 4px;border-left:5px solid var(--c)}
.smak img,.smak .ikon{width:44px;height:44px;border-radius:4px;object-fit:cover;flex:none;background:var(--concrete)}
.smak .sn{flex:1;min-width:0;font-size:15px;font-weight:650;line-height:1.25}
.pakker .stepper,.butikk-side .stepper{display:flex;align-items:center;flex:none}
.pakker .stepper button,.butikk-side .stepper button{width:44px;height:44px;border:0;border-radius:6px;background:var(--sunk);color:var(--ink);font-size:22px;font-weight:700;line-height:1;cursor:pointer}
.pakker .stepper button:disabled,.butikk-side .stepper button:disabled{opacity:.35;cursor:not-allowed}
.pakker .stepper output,.butikk-side .stepper output{min-width:32px;text-align:center;font-weight:800;font-size:18px;font-variant-numeric:tabular-nums}
.pakke .btn{width:100%;margin-top:6px}
.kantine,.regler{font-size:15px;color:var(--muted);margin:12px 0 0;max-width:60ch}
.kantine{color:var(--ink);font-weight:650}

/* ---------- Kurven ---------- */
.butikk-side main{padding-bottom:clamp(56px,8vw,96px)}
.butikk-side main{display:flex;flex-direction:column}
.kurv-topp{padding-top:clamp(24px,4vw,48px)}
.kurv-topp .h2{font-size:clamp(48px,9vw,88px)}
.melding{margin:16px 0 0;background:var(--surface);border-left:4px solid var(--yellow);border-radius:6px;padding:12px 14px;font-size:16px;max-width:60ch}
.blokk{padding-top:clamp(28px,4vw,48px);width:100%}
.kurv-blokk{padding-top:8px}
.bh{font-family:var(--display);font-stretch:68%;font-weight:850;text-transform:uppercase;font-size:clamp(30px,4vw,42px);line-height:1;margin:0 0 8px}
/* Tom kurv: pakkene og «Lag din egen» først */
.kurv-tom #pakker{order:1}.kurv-tom #egen{order:2}.kurv-tom #kurven{order:3}
#kurv-topp,.kurv-topp{order:0}
.tom{color:var(--muted);margin:0}
.linjer{list-style:none;margin:8px 0 0;padding:0;border-top:1px solid var(--line)}
.linjer li{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:8px 12px;padding:10px 0;border-bottom:1px solid var(--line)}
.linjer .ln{display:flex;flex-direction:column;min-width:0}
.linjer .ln b{font-size:16px;line-height:1.3}
.linjer .ln small{font-size:14px;color:var(--muted)}
.linjer .ls{font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap;text-align:right;min-width:72px}
.linjer .fjern{width:44px;height:44px;border:0;background:none;font-size:24px;line-height:1;cursor:pointer;color:var(--muted);border-radius:6px}
.linjer .fjern:hover{background:var(--sunk);color:var(--ink)}
@media (max-width:520px){
  .linjer li{grid-template-columns:minmax(0,1fr) auto auto;grid-template-areas:"n s f" "st st f"}
  .linjer .ln{grid-area:n}.linjer .ls{grid-area:s}.linjer .fjern{grid-area:f}.linjer .stepper{grid-area:st}
}
.mersalg{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin:14px 0 0;background:var(--surface);border-radius:6px;padding:12px 12px 12px 16px;box-shadow:0 0 0 1px var(--line);font-weight:650}
.mersalg .btn{padding:12px 16px}
.sum{display:flex;flex-direction:column;gap:6px;margin-top:16px;max-width:520px;font-variant-numeric:tabular-nums}
.sumrad{display:flex;justify-content:space-between;gap:12px;font-size:16px}
.sumrad span:first-child{color:var(--muted)}
.sumrad.total{border-top:1px solid var(--line);padding-top:8px;font-weight:800;font-size:20px}
.sumrad.total span:first-child{color:var(--ink)}
.neste{margin:10px 0 0;font-weight:700;font-size:16px}
.neste:empty{display:none}
.kassa{display:flex;flex-direction:column;gap:14px;margin-top:24px;max-width:520px;background:var(--carbon);color:var(--paper);border-radius:6px;padding:clamp(20px,2.4vw,26px);
  --ink:#F4F3F0;--muted:#A9ACAE;--line:rgba(244,243,240,.16);--surface:#26292C;--sunk:#33363A}
.kassa h3{font-family:var(--display);font-stretch:68%;font-weight:850;text-transform:uppercase;font-size:28px;line-height:1;margin:0}
.kassa .q{display:flex;flex-direction:column;gap:8px;border:0;padding:0;margin:0;min-width:0}
.kassa .q > legend,.kassa .q > label.l{font-weight:700;font-size:16px;padding:0;margin-bottom:8px}
.kassa .hint{font-weight:400;color:var(--muted)}
.kassa input[type=email],.kassa input[type=text]{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:12px 13px}
.kassa .opts{display:flex;flex-wrap:wrap;gap:8px}
.kassa .opt{position:relative}
.kassa .opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.kassa .opt span{display:inline-block;padding:11px 14px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font-size:15px}
.kassa .opt input:checked + span{background:var(--yellow);border-color:var(--yellow);color:var(--carbon);font-weight:700}
.kassa .opt input:focus-visible + span{outline:2px solid var(--yellow);outline-offset:2px}
.kassa .consent{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.45}
.kassa .consent input{margin-top:3px;width:18px;height:18px;accent-color:var(--yellow);flex:none}
.kassa .consent small{display:block;font-size:14px;color:var(--muted);margin-top:2px}
.kassa .err{background:#3A2226;color:#FFC9CF;border-radius:6px;padding:10px 12px;font-size:15px;margin:0}
.kassa .btn{width:100%}
.kassa .fine{color:var(--muted);font-size:14px}
.kassa .link,.kassa a{color:var(--paper)}
.egen{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;margin-top:16px}
.prod{background:var(--surface);border-radius:6px;padding:16px;box-shadow:0 0 0 1px var(--line)}
.prod h3{font-family:var(--display);font-stretch:68%;font-weight:850;text-transform:uppercase;font-size:30px;line-height:1;margin:0 0 4px}
.prod h3 span{font-family:var(--body);font-stretch:100%;text-transform:none;font-weight:600;font-size:15px;color:var(--muted);margin-left:6px}
.prod .fine{margin:0 0 10px;font-size:15px}