/* ==========================================================================
   STARLIT PRINTS – Style: night-sky navy and gold
   CHANGE COLORS AND FONTS HERE ↓
   ========================================================================== */
:root{
  color-scheme:dark;
  /* Brand colors */
  --farge-primar:#c9a85c;          /* gold – buttons and details */
  --farge-primar-hover:#dcbd72;
  --farge-primar-tekst:#121a2e;
  --farge-aksent:#c9a85c;
  --farge-aksent-tekst:#121a2e;
  /* Surfaces and text */
  --farge-bakgrunn:#121a2e;
  --farge-flate:#1a2440;
  --farge-kort:#172038;
  --farge-hero:#121a2e;
  --farge-header:rgba(18,26,46,.9);
  --farge-tekst:#eeeae2;
  --farge-dempet:#a7a196;
  --farge-lenke:#dcbd72;
  --farge-pris:#dcbd72;
  --farge-linje:#2a3558;
  --farge-felt:#172038;
  --farge-fokus:#dcbd72;
  --farge-stripe:#172038; --farge-stripe-tekst:#c9a85c;
  --farge-kategori:#1a2440; --farge-kategori-tekst:#eeeae2;
  --farge-info:#1b2440; --farge-info-tekst:#eadbb3;
  --farge-bunn:#0d1324; --farge-bunn-tekst:#d8d3c8; --farge-bunn-linje:#243050;
  /* Fonts (system fonts = fast, no external files) */
  --font-tekst:"Helvetica Neue","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --font-overskrift:"Cormorant Garamond","Didot","Bodoni 72","Playfair Display",Georgia,"Times New Roman",serif;
  --font-logo:var(--font-overskrift);
  --font-kort:var(--font-overskrift);
  --vekt-overskrift:400; --vekt-logo:500; --vekt-knapp:500;
  --sperring-overskrift:.01em; --sperring-logo:.3em; --sperring-knapp:.18em; --knapp-transform:uppercase;
  /* Shapes */
  --radius:0; --radius-knapp:0; --radius-felt:0; --radius-bilde:0; --radius-merke:0; --logo-radius:0;
  --kant-kort:1px solid #263152; --kant-header:1px solid #243050; --kant-knapp:1px solid #c9a85c; --kant-knapp-sekundar:1px solid #5a5446;
  --kant-filter:1px solid #3a4670; --kant-felt:1px solid #3a4670;
  --skygge-hover:0 20px 40px rgba(0,0,0,.5); --kort-hover-flytt:translateY(-4px);
  --grid-gap:1.5rem; --maks-bredde:1240px;
}

/* ==========================================================================
   BASE LAYOUT (preferably only change the variables at the top)
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font-tekst);font-size:1rem;line-height:1.6;color:var(--farge-tekst);background:var(--farge-bakgrunn);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--farge-lenke)}
h1,h2,h3{font-family:var(--font-overskrift);line-height:1.15;margin:0 0 .5em;font-weight:var(--vekt-overskrift);letter-spacing:var(--sperring-overskrift)}
h1{font-size:clamp(2rem,5vw,3.4rem)}
h2{font-size:clamp(1.5rem,3vw,2.1rem)}
h3{font-size:1.1rem}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--farge-fokus);outline-offset:3px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hopp-til{position:absolute;left:1rem;top:-4rem;z-index:100;background:var(--farge-primar);color:var(--farge-primar-tekst);padding:.6rem 1rem;border-radius:var(--radius)}
.hopp-til:focus{top:1rem}
.beholder{width:min(100% - 2.5rem,var(--maks-bredde));margin-inline:auto}
.ingress{font-size:1.15rem;color:var(--farge-dempet);max-width:60ch}
.liten-tekst{font-size:.85rem;color:var(--farge-dempet)}

/* Top bar and header */
.toppstripe{background:var(--farge-stripe);color:var(--farge-stripe-tekst);text-align:center;font-size:.85rem;padding:.45rem 1rem}
.toppstripe p{margin:0}
.topp{position:sticky;top:0;z-index:50;background:var(--farge-header);border-bottom:var(--kant-header)}
.topp-indre{display:flex;align-items:center;gap:1.5rem;min-height:4.5rem}
.logo{display:inline-flex;align-items:center;gap:.55rem;font-family:var(--font-logo);font-size:1.45rem;font-weight:var(--vekt-logo);text-decoration:none;color:var(--farge-tekst);letter-spacing:var(--sperring-logo);margin:0}
.plassholder-merke{font-family:var(--font-tekst);font-size:.62rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;border:1px dashed currentColor;border-radius:4px;padding:.05rem .35rem;opacity:.6}
.hovedmeny{margin-left:auto}
.hovedmeny ul{display:flex;gap:1.6rem;list-style:none;margin:0;padding:0}
.hovedmeny a{text-decoration:none;color:var(--farge-tekst);font-weight:500;padding:.3rem 0;border-bottom:2px solid transparent}
.hovedmeny a:hover,.hovedmeny a[aria-current]{border-color:var(--farge-primar)}
.kurv-antall{position:absolute;top:0;right:-2px;min-width:1.3rem;height:1.3rem;padding:0 .3rem;border-radius:1rem;background:var(--farge-aksent);color:var(--farge-aksent-tekst);font-size:.72rem;font-weight:700;display:grid;place-items:center}
.kurv-antall[hidden]{display:none}
.meny-knapp{display:none;margin-left:auto;background:none;border:0;width:2.75rem;height:2.75rem;cursor:pointer;color:var(--farge-tekst)}
.meny-ikon,.meny-ikon::before,.meny-ikon::after{display:block;width:22px;height:2px;background:currentColor;position:relative;margin:auto;transition:.2s}
.meny-ikon::before,.meny-ikon::after{content:"";position:absolute}
.meny-ikon::before{top:-7px}.meny-ikon::after{top:7px}

/* Buttons */
.knapp{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font:inherit;font-weight:var(--vekt-knapp);text-decoration:none;cursor:pointer;background:var(--farge-primar);color:var(--farge-primar-tekst);border:var(--kant-knapp);border-radius:var(--radius-knapp);padding:.8rem 1.6rem;letter-spacing:var(--sperring-knapp);text-transform:var(--knapp-transform);transition:transform .15s,background .15s,box-shadow .15s}
.knapp:hover{background:var(--farge-primar-hover)}
.knapp:active{transform:translateY(1px)}
.knapp-sekundar{background:transparent;color:var(--farge-tekst);border:var(--kant-knapp-sekundar)}
.knapp-sekundar:hover{background:var(--farge-flate)}
.knapp-liten{padding:.55rem 1rem;font-size:.9rem}
.knapp-bred{width:100%}

/* Hero */
.hero{background:var(--farge-hero);padding:clamp(3rem,8vw,6rem) 0}
.hero-indre{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.overtittel{text-transform:uppercase;letter-spacing:.15em;font-size:.8rem;font-weight:600;color:var(--farge-dempet)}
.hero-knapper{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.75rem}
.hero-kunst svg{width:100%;height:auto;border-radius:var(--radius-bilde)}

/* Sections */
.seksjon{padding:clamp(2.5rem,6vw,4.5rem) 0}
.seksjon-tett{padding-top:1.5rem}
.seksjon-topp{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.5rem}
.se-alle{font-weight:600;text-decoration:none}
.sidetopp{background:var(--farge-hero);padding:clamp(2rem,5vw,3.5rem) 0}
.sidetopp h1{margin-bottom:.3em}

/* Product grid and cards */
.produktgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:var(--grid-gap)}
.produktkort{display:flex;flex-direction:column;background:var(--farge-kort);border:var(--kant-kort);border-radius:var(--radius);overflow:hidden;transition:transform .2s,box-shadow .2s}
.produktkort:hover{transform:var(--kort-hover-flytt);box-shadow:var(--skygge-hover)}
.produktkort-lenke{color:inherit;text-decoration:none;flex:1}
.produktkort-bilde{position:relative;aspect-ratio:4/3;overflow:hidden}
.produktkort-bilde svg,.produktkort-bilde img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.produktkort:hover .produktkort-bilde svg{transform:scale(1.04)}
.merkelapp{position:absolute;top:.75rem;left:.75rem;background:var(--farge-aksent);color:var(--farge-aksent-tekst);font-size:.75rem;font-weight:700;padding:.2rem .6rem;border-radius:var(--radius-merke)}
.produktkort-tekst{padding:1rem 1rem .5rem}
.produktkort-kategori{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--farge-dempet);margin:0 0 .25rem}
.produktkort h3{font-family:var(--font-kort);font-size:1rem;margin:0 0 .35rem}
.pris{font-weight:700;color:var(--farge-pris);margin:0}
.produktkort .knapp{margin:.5rem 1rem 1rem}

/* Benefits and categories */
.seksjon-fordeler{background:var(--farge-flate)}
.fordeler{list-style:none;padding:0;margin:1.5rem 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem}
.fordel{padding:1.5rem;background:var(--farge-kort);border-radius:var(--radius);border:var(--kant-kort)}
.fordel svg{color:var(--farge-primar);margin-bottom:.75rem}
.fordel p{margin:0;color:var(--farge-dempet)}
.kategorier{list-style:none;padding:0;margin:1.5rem 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}
.kategori-flis{display:flex;align-items:flex-end;min-height:130px;padding:1.25rem;border-radius:var(--radius);background:var(--farge-kategori);color:var(--farge-kategori-tekst);font-family:var(--font-overskrift);font-size:1.35rem;font-weight:var(--vekt-overskrift);text-decoration:none;transition:transform .2s}
.kategori-flis:hover{transform:translateY(-3px)}
.nyhetsbrev{background:var(--farge-stripe);color:var(--farge-stripe-tekst)}
.nyhetsbrev-indre{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.nyhetsbrev p{opacity:.85}
.nyhetsbrev-skjema{display:flex;flex-wrap:wrap;gap:.5rem}
.nyhetsbrev-skjema input{flex:1 1 220px}
.nyhetsbrev-skjema p{flex-basis:100%;margin:0;color:inherit}
.nyhetsbrev .knapp{background:var(--farge-aksent);color:var(--farge-aksent-tekst)}

/* Filter */
.filterlinje{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.75rem}
.filter{display:flex;flex-wrap:wrap;gap:.5rem}
.filterknapp{font:inherit;font-size:.9rem;cursor:pointer;padding:.5rem 1.1rem;border-radius:var(--radius-knapp);border:var(--kant-filter);background:transparent;color:var(--farge-tekst)}
.filterknapp:hover{background:var(--farge-flate)}
.filterknapp[aria-pressed="true"]{background:var(--farge-primar);color:var(--farge-primar-tekst);border-color:var(--farge-primar)}
.antall-treff{margin:0;color:var(--farge-dempet);font-size:.9rem}

/* Form fields */
input,select,textarea{font:inherit;color:var(--farge-tekst);background:var(--farge-felt);border:var(--kant-felt);border-radius:var(--radius-felt);padding:.7rem .9rem;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--farge-primar);outline:2px solid var(--farge-fokus);outline-offset:1px}
label{display:block;font-weight:600;margin-bottom:.35rem;font-size:.92rem}

/* Product page */
.brodsmuler{font-size:.88rem;color:var(--farge-dempet);margin-bottom:1.5rem}
.brodsmuler a{color:inherit}
.produkt-oppsett{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:start}
.produkt-bilde svg,.produkt-bilde img{width:100%;height:auto;border-radius:var(--radius-bilde)}
.pris-stor{font-size:1.6rem;margin-bottom:1rem}
.pris-stor small{font-size:.8rem;font-weight:400;color:var(--farge-dempet)}
.detaljer{padding-left:1.2rem;color:var(--farge-dempet)}
.kjop-skjema{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.75rem;margin:1.5rem 0}
.kjop-skjema label{flex-basis:100%;margin:0}
.kjop-skjema input{width:5.5rem}

/* Cart */
.handlekurv{display:grid;grid-template-columns:1fr 340px;gap:2.5rem;align-items:start}
.handlekurv>.tom{grid-column:1/-1}
.kurv-liste{list-style:none;margin:0;padding:0}
.kurv-rad{display:grid;grid-template-columns:84px 1fr auto auto auto;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--farge-linje)}
.kurv-bilde svg,.kurv-bilde img{width:84px;height:84px;border-radius:var(--radius)}
.kurv-navn a{font-weight:600;color:inherit;text-decoration:none;display:block}
.kurv-navn span{font-size:.85rem;color:var(--farge-dempet)}
.antallvelger{display:flex;align-items:center;border:var(--kant-felt);border-radius:var(--radius-knapp);overflow:hidden}
.antallvelger button{width:2.4rem;height:2.4rem;border:0;background:transparent;color:var(--farge-tekst);font-size:1.15rem;cursor:pointer}
.antallvelger button:hover{background:var(--farge-flate)}
.antallvelger input{width:3rem;text-align:center;border:0;border-radius:0;padding:.4rem 0;-moz-appearance:textfield;background:transparent}
.antallvelger input::-webkit-inner-spin-button{-webkit-appearance:none}
.kurv-linjesum{margin:0;font-weight:700;min-width:5.5rem;text-align:right}
.fjern{background:none;border:0;color:var(--farge-dempet);text-decoration:underline;cursor:pointer;font:inherit;font-size:.85rem}
.kurv-sammendrag{background:var(--farge-flate);border-radius:var(--radius);padding:1.5rem;border:var(--kant-kort);position:sticky;top:6rem}
.kurv-sammendrag dl{margin:0 0 1rem}
.kurv-sammendrag dl div{display:flex;justify-content:space-between;padding:.4rem 0}
.kurv-sammendrag dd{margin:0}
.kurv-sammendrag .totalt{border-top:1px solid var(--farge-linje);margin-top:.5rem;padding-top:.8rem;font-weight:700;font-size:1.2rem}
.kasse-melding:not(:empty){margin-top:1rem;padding:1rem;border-radius:var(--radius);background:var(--farge-info);color:var(--farge-info-tekst);font-size:.92rem}

/* Text pages, about, contact */
.tekstside{max-width:75ch}
.tekstside h2{font-size:1.35rem;margin-top:1.75rem}
.om-grid{max-width:none;display:grid;grid-template-columns:1.2fr .8fr;gap:3rem;align-items:center}
.om-bilde svg{border-radius:var(--radius-bilde)}
.om-bg{fill:var(--farge-flate)}.om-a{fill:var(--farge-primar)}.om-b{fill:var(--farge-aksent);opacity:.85}
.obs{background:var(--farge-info);color:var(--farge-info-tekst);padding:1rem 1.25rem;border-radius:var(--radius)}
.kontakt-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:3rem}
.kontaktskjema{display:grid;gap:1.1rem}
.kontaktskjema .knapp{justify-self:start}
.skjema-status{margin:0;font-weight:600}
.kontaktinfo{background:var(--farge-flate);padding:1.75rem;border-radius:var(--radius);border:var(--kant-kort);align-self:start}
.tom{text-align:center;padding:3rem 1rem;color:var(--farge-dempet)}
.tom h1{color:var(--farge-tekst)}

/* Footer */
.bunn{background:var(--farge-bunn);color:var(--farge-bunn-tekst);padding:3.5rem 0 1.5rem;margin-top:2rem}
.bunn-indre{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2rem}
.bunn .logo{color:inherit;margin-bottom:.75rem}
.bunn h2{font-family:var(--font-tekst);font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;margin-bottom:.9rem;opacity:.75}
.bunn ul{list-style:none;margin:0;padding:0}
.bunn li{margin-bottom:.4rem}
.bunn a{color:inherit;text-decoration:none;opacity:.85}
.bunn a:hover{opacity:1;text-decoration:underline}
.bunn p{opacity:.8;font-size:.92rem}
.copyright{border-top:1px solid var(--farge-bunn-linje);margin-top:2.5rem;padding-top:1.25rem;font-size:.82rem;opacity:.65}

/* Notification (toast) */
.varsel{position:fixed;left:50%;bottom:1.5rem;transform:translate(-50%,150%);background:var(--farge-tekst);color:var(--farge-bakgrunn);padding:.85rem 1.4rem;border-radius:var(--radius-knapp);box-shadow:0 10px 30px rgba(0,0,0,.25);z-index:200;transition:transform .3s,opacity .3s,visibility .3s;max-width:calc(100% - 2rem);font-weight:600}
.varsel:not(.vis){visibility:hidden;opacity:0}
.varsel.vis{transform:translate(-50%,0)}

/* Mobile */
@media (max-width:860px){
  .meny-knapp{display:block}
  .hovedmeny{position:absolute;left:0;right:0;top:100%;background:var(--farge-header);border-bottom:var(--kant-header);display:none;margin:0}
  .hovedmeny.apen{display:block}
  .hovedmeny ul{flex-direction:column;gap:0;padding:.5rem 1.25rem 1rem}
  .hovedmeny a{display:block;padding:.8rem 0;border-bottom:1px solid var(--farge-linje)}
  .topp-indre{gap:.5rem}
  .plassholder-merke{display:none}
  .hero-indre,.produkt-oppsett,.handlekurv,.om-grid,.kontakt-grid,.nyhetsbrev-indre{grid-template-columns:1fr}
  .hero-kunst{max-width:380px}
  .bunn-indre{grid-template-columns:1fr 1fr}
  .kurv-sammendrag{position:static}
}
@media (max-width:560px){
  .kurv-rad{grid-template-columns:64px 1fr auto;grid-template-areas:"b n s" "b a f"}
  .kurv-bilde{grid-area:b}.kurv-navn{grid-area:n}.antallvelger{grid-area:a;justify-self:start}.kurv-linjesum{grid-area:s}.fjern{grid-area:f}
  .kurv-bilde svg{width:64px;height:64px}
  .bunn-indre{grid-template-columns:1fr}
  .produktgrid{grid-template-columns:repeat(2,1fr);gap:.75rem}
  .produktkort .knapp{margin:.5rem .75rem .75rem;padding:.5rem}
  .produktkort-tekst{padding:.75rem .75rem .25rem}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ---------- Premium style details ---------- */
.topp{backdrop-filter:blur(10px)}
.logo{text-transform:uppercase;font-size:1.3rem}
.plassholder-merke{letter-spacing:.05em;text-transform:uppercase;font-size:.55rem}
.hovedmeny a{text-transform:uppercase;letter-spacing:.16em;font-size:.78rem}
.toppstripe{letter-spacing:.16em;text-transform:uppercase;font-size:.72rem;border-bottom:1px solid #243050}
.knapp{font-size:.8rem;padding:1rem 2rem}
.knapp-sekundar{color:var(--farge-tekst)}
.knapp-sekundar:hover{background:transparent;border-color:var(--farge-primar);color:var(--farge-primar)}
.hero{background:radial-gradient(ellipse at 75% 40%,#1e1a12 0,#121a2e 60%);padding:clamp(4rem,10vw,8rem) 0}
.hero h1{font-size:clamp(2.6rem,6vw,4.8rem);font-style:italic}
.overtittel{color:var(--farge-primar);letter-spacing:.3em}
h2{font-style:italic}
.seksjon-topp h2::after,.seksjon-fordeler h2::after{content:"";display:block;width:3rem;height:1px;background:var(--farge-primar);margin-top:.75rem}
.produktkort-tekst{text-align:center}
.produktkort h3{font-size:1.25rem;font-weight:400}
.produktkort .knapp{background:transparent;color:var(--farge-primar)}
.produktkort .knapp:hover{background:var(--farge-primar);color:var(--farge-primar-tekst)}
.merkelapp{background:transparent;color:var(--farge-primar);border:1px solid var(--farge-primar);font-weight:500;letter-spacing:.15em;text-transform:uppercase;font-size:.65rem;backdrop-filter:blur(4px)}
.fordel{text-align:center;background:transparent}
.fordel svg{margin-inline:auto}
.fordel h3{font-family:var(--font-overskrift);font-size:1.3rem;font-weight:400}
.kategori-flis{border:1px solid #2a3558;justify-content:center;align-items:center;font-style:italic;font-size:1.6rem;min-height:170px;background:linear-gradient(160deg,#1d2848,#121a2e)}
.kategori-flis:hover{border-color:var(--farge-primar);color:var(--farge-primar)}
.nyhetsbrev{border-top:1px solid #243050;border-bottom:1px solid #243050}
.nyhetsbrev h2{color:var(--farge-tekst)}
.nyhetsbrev p{color:var(--farge-dempet)}
.filterknapp{text-transform:uppercase;letter-spacing:.12em;font-size:.75rem}
.varsel{background:var(--farge-primar);color:#121a2e}
.bunn .logo{text-transform:uppercase}

/* ==========================================================================
   DIGITAL PRODUCTS additions
   ========================================================================== */
.hero-kunst{position:relative}
.hero-kunst img{width:100%;height:auto;display:block;border:1px solid #2a3558;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.hero-pris{margin-top:1rem;color:var(--farge-dempet);font-size:.9rem;letter-spacing:.08em}
.hero-pris strong{color:var(--farge-primar)}
/* image helpers */
.produkt-bilde{position:relative}
.produkt-bilde img{display:block}
.produktkort:hover .produktkort-bilde img{transform:scale(1.04)}
.produktkort-format{font-size:.78rem;color:var(--farge-dempet);margin:0 0 .4rem;line-height:1.4}
.nedlasting-merke{display:inline-block;margin:.45rem .35rem 0 0;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--farge-primar);border:1px solid #5a5446;padding:.18rem .5rem}
.nedlasting-merke::before{content:"↓ "}
.merker{margin:0 0 1rem}
.merker .nedlasting-merke:last-child::before{content:""}
.format-linje{color:var(--farge-tekst);margin:.5rem 0}
.kjop-knapper{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0 .5rem}
.produkt-info .kasse-melding{margin:.5rem 0 1rem}
.lisens{margin-top:1.75rem;padding:1.25rem 1.4rem;border:var(--kant-kort);background:var(--farge-kort)}
.lisens h2{font-size:1.2rem;margin:0 0 .5rem}
.lisens ul{margin:0;padding-left:1.1rem;color:var(--farge-dempet);font-size:.92rem}
.lisens li{margin:.3rem 0}
.kasse-lenker{margin:.5rem 0 0;padding-left:1.1rem}
.kasse-lenker a{color:var(--farge-lenke)}
/* Cart without quantity selector */
.kurv-rad.kurv-rad-digital{grid-template-columns:84px 1fr auto auto}
.kurv-bilde img{object-fit:cover}
/* How it works */
.steg{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;counter-reset:none}
.steg li{padding:1.75rem 1.5rem;border:var(--kant-kort);background:var(--farge-kort);text-align:center}
.steg-nr{display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;border:1px solid var(--farge-primar);color:var(--farge-primar);font-family:var(--font-overskrift);font-size:1.3rem;border-radius:50%;margin-bottom:.75rem}
.steg h3{font-family:var(--font-overskrift);font-weight:400;font-size:1.3rem;margin:0 0 .4rem}
.steg p{margin:0;color:var(--farge-dempet)}
/* Category tiles with images */
.kategorier-bilde .kategori-flis{position:relative;overflow:hidden;padding:0;min-height:200px;align-items:flex-end;justify-content:flex-start}
.kategorier-bilde .kategori-flis img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;transition:opacity .3s,transform .4s}
.kategorier-bilde .kategori-flis:hover img{opacity:.75;transform:scale(1.04)}
.kategorier-bilde .kategori-flis span{position:relative;padding:1rem 1.2rem;width:100%;background:linear-gradient(transparent,rgba(18,26,46,.9))}
/* FAQ */
.faq{max-width:60rem}
.faq details{border-bottom:1px solid var(--farge-linje);padding:.9rem 0}
.faq details:first-of-type{margin-top:1.5rem;border-top:1px solid var(--farge-linje)}
.faq summary{cursor:pointer;font-family:var(--font-overskrift);font-size:1.2rem;list-style-position:outside}
.faq summary:hover{color:var(--farge-primar)}
.faq details p{color:var(--farge-dempet);margin:.6rem 0 0;max-width:70ch}
@media (max-width:560px){
  .kurv-rad.kurv-rad-digital{grid-template-columns:64px 1fr auto;grid-template-areas:"b n s" "b n f"}
  .kurv-bilde img{width:64px;height:64px}
  .produktkort-format{display:none}
  .produktkort h3{font-size:1.05rem}
  .kategorier-bilde{grid-template-columns:1fr 1fr}
  .kategorier-bilde .kategori-flis{min-height:140px;font-size:1.2rem}
}
/* Badges readable on light (coloring page) previews too */
.produktkort-bilde .merkelapp{background:rgba(18,26,46,.82);z-index:1}

/* ---------- Starlit Prints additions ---------- */
.logo-bilde{width:2.4rem;height:2.4rem;border-radius:50%;flex:none;display:block}
.bunn .logo-bilde{width:2.1rem;height:2.1rem}
.produktkort:hover .produktkort-bilde img{transform:scale(1.04)}
.knapp-snart,.knapp-snart:hover{background:transparent;color:var(--farge-dempet);border:1px dashed #4a5680;cursor:default;transform:none}
.produktkort .knapp-snart,.produktkort .knapp-snart:hover{background:transparent;color:var(--farge-dempet)}
.produkt-bilde img{aspect-ratio:4/3;object-fit:cover}
.galleri{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin-top:.75rem}
.galleri-tommel{padding:0;border:1px solid var(--farge-linje);background:none;cursor:pointer;line-height:0}
.galleri-tommel img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block}
.galleri-tommel[aria-pressed="true"],.galleri-tommel:hover{border-color:var(--farge-primar)}
.kjop-knapper{display:flex;flex-wrap:wrap;gap:.6rem}
.nyhetsbrev-indre p .knapp{margin:.25rem .25rem 0 0}

/* ---------- "by pinguloveart" byline (links to the hub site) ---------- */
.merke{position:relative;display:flex;align-items:center;min-width:0}
.logo-av{position:absolute;left:calc(2.4rem + .55rem);top:calc(50% + .8rem);white-space:nowrap;font-family:var(--font-overskrift);font-style:italic;font-size:.82rem;line-height:1;letter-spacing:.06em;color:var(--farge-dempet);text-decoration:none;padding:.1rem 0;transition:color .2s}
.logo-av span{color:var(--farge-primar)}
.logo-av:hover,.logo-av:focus-visible{color:var(--farge-tekst)}
.logo-av:hover span{text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1px}
.copyright .bunn-av{font-family:var(--font-overskrift);font-style:italic;font-size:1.05em;color:var(--farge-primar);opacity:1;letter-spacing:.03em}
.copyright .bunn-av:hover{text-decoration:underline}
@media (min-width:861px){.logo-av{font-size:.92rem;top:calc(50% + .85rem)}}

/* Etsy buy buttons (Etsy launch) */
.knapp-etsy{box-shadow:0 2px 0 rgba(0,0,0,.12)}
.produktkort .knapp-etsy,.produktkort .knapp-snart{align-self:stretch}
.produkt-info .knapp-etsy{font-size:1.05rem;padding:.95rem 2rem}
.etsy-butikk-lenke{margin-top:.6rem;font-size:.95rem}
.hero-pris a{color:inherit}
.kjop-knapper-topp{margin:1rem 0 1.2rem}
.produktkort .knapp-etsy{white-space:nowrap}
@media (max-width:480px){.produktkort .knapp-etsy{letter-spacing:.06em;font-size:.82rem;padding:.55rem .4rem}}
