/* ==========================================================================
   Benkeplaten — kjøkkenrutiner og batch cooking
   Utgiver: Giancarlo Rivera, Sylmar, CA, USA — g-rivera.digital
   Alle klasser bruker prefiks kj-
   ========================================================================== */

:root{
  --kj-benk:#e7e3d8;        /* leire / bakgrunn */
  --kj-flate:#fbfaf6;       /* lys flate */
  --kj-jern:#23241f;        /* støpejern / brødtekst */
  --kj-gulrot:#b45a1b;      /* brent gulrot / aksent */
  --kj-einer:#4b5a46;       /* einer / sekundær */
  --kj-rug:#7d7566;         /* rug / dempet tekst */
  --kj-strek:#cfc9ba;       /* linjer */

  --kj-sans:"Helvetica Neue",Helvetica,Arial,"Segoe UI",system-ui,sans-serif;
  --kj-serif:Georgia,"Iowan Old Style","Times New Roman",Times,serif;

  --kj-bredde:1180px;
  --kj-lest:66ch;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--kj-benk);
  color:var(--kj-jern);
  font-family:var(--kj-serif);
  font-size:18px;
  line-height:1.72;
  text-rendering:optimizeLegibility;
}

img{max-width:100%;display:block;}

a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:var(--kj-strek);}
a:hover{text-decoration-color:var(--kj-gulrot);}

:focus-visible{outline:2px solid var(--kj-gulrot);outline-offset:3px;}

h1,h2,h3,h4{font-family:var(--kj-sans);font-weight:700;letter-spacing:-.022em;line-height:1.08;margin:0;}

p{margin:0 0 1.15em;}

.kj-hopp{
  position:absolute;left:-9999px;top:0;
  background:var(--kj-jern);color:var(--kj-flate);
  padding:.6rem 1rem;font-family:var(--kj-sans);font-size:.9rem;z-index:60;
}
.kj-hopp:focus{left:1rem;top:1rem;}

.kj-ramme{width:100%;max-width:var(--kj-bredde);margin:0 auto;padding:0 24px;}

/* --------------------------------------------------------- topp / masthead */
.kj-topp{
  border-bottom:1px solid var(--kj-jern);
  background:var(--kj-benk);
  position:sticky;top:0;z-index:40;
}
.kj-topp__rad{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:20px;padding:18px 0 16px;
}
.kj-merke{
  font-family:var(--kj-sans);font-weight:700;font-size:1.55rem;
  letter-spacing:-.035em;text-decoration:none;line-height:1;
}
.kj-merke span{color:var(--kj-gulrot);}
.kj-merke__under{
  display:block;font-size:.72rem;font-weight:400;letter-spacing:.01em;
  color:var(--kj-rug);margin-top:6px;
}
.kj-nav{display:flex;align-items:baseline;gap:26px;font-family:var(--kj-sans);font-size:.95rem;}
.kj-nav a{text-decoration:none;padding-bottom:2px;border-bottom:1px solid transparent;}
.kj-nav a:hover{border-bottom-color:var(--kj-gulrot);}
.kj-nav a[aria-current="page"]{border-bottom-color:var(--kj-jern);}
.kj-nav__bryter{
  display:none;font-family:var(--kj-sans);font-size:.95rem;
  background:none;border:1px solid var(--kj-jern);border-radius:2px;
  padding:6px 12px;cursor:pointer;color:inherit;
}

/* ------------------------------------------------------------------- hero */
.kj-hero{padding:44px 0 8px;}
.kj-hero__bilde{
  margin:0 0 26px;overflow:hidden;background:var(--kj-strek);
  border:1px solid var(--kj-strek);
}
.kj-hero__bilde img{width:100%;height:clamp(240px,44vw,460px);object-fit:cover;}
.kj-hero__tekst{display:flex;flex-wrap:wrap;gap:34px;align-items:flex-start;}
.kj-hero__tittel{flex:1 1 520px;font-size:clamp(2.1rem,5.4vw,3.5rem);}
.kj-hero__ingress{
  flex:1 1 300px;max-width:44ch;font-size:1.06rem;color:var(--kj-jern);
  border-top:3px solid var(--kj-gulrot);padding-top:14px;
}
.kj-hero__ingress p:last-child{margin-bottom:0;}

/* ------------------------------------------------------ seksjonsoverskrift */
.kj-bolk{padding:52px 0;}
.kj-bolk--linje{border-top:1px solid var(--kj-strek);}
.kj-bolk__topp{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:16px;flex-wrap:wrap;margin-bottom:26px;
}
.kj-bolk__topp h2{font-size:clamp(1.35rem,2.6vw,1.75rem);}
.kj-bolk__note{font-family:var(--kj-sans);font-size:.88rem;color:var(--kj-rug);}

/* --------------------------------------------------------------- artikkelliste */
.kj-liste{display:flex;flex-direction:column;}
.kj-post{
  display:flex;gap:26px;align-items:flex-start;
  padding:26px 0;border-top:1px solid var(--kj-strek);
}
.kj-post:last-child{border-bottom:1px solid var(--kj-strek);}
.kj-post__bilde{
  flex:0 0 210px;margin:0;overflow:hidden;background:var(--kj-strek);
  border:1px solid var(--kj-strek);
}
.kj-post__bilde img{width:100%;height:150px;object-fit:cover;}
.kj-post__inn{flex:1 1 340px;}
.kj-post__tittel{font-size:1.42rem;margin-bottom:10px;}
.kj-post__tittel a{text-decoration:none;}
.kj-post__tittel a:hover{text-decoration:underline;text-decoration-color:var(--kj-gulrot);}
.kj-post p{margin-bottom:10px;max-width:60ch;}
.kj-post__fakta{
  font-family:var(--kj-sans);font-size:.85rem;color:var(--kj-rug);
  display:flex;gap:18px;flex-wrap:wrap;
}
.kj-post__fakta span{display:inline-flex;align-items:center;gap:8px;}
.kj-post__fakta span::before{
  content:"";width:6px;height:6px;background:var(--kj-einer);border-radius:50%;
}

/* -------------------------------------------------------------- fire grep */
.kj-grep{display:flex;flex-wrap:wrap;gap:1px;background:var(--kj-strek);border:1px solid var(--kj-strek);}
.kj-grep__kort{flex:1 1 240px;background:var(--kj-flate);padding:24px 22px 26px;}
.kj-grep__kort h3{font-size:1.08rem;margin-bottom:8px;}
.kj-grep__kort p{font-size:.98rem;margin-bottom:0;color:#3a3a33;}
.kj-grep__tall{
  font-family:var(--kj-sans);font-size:.8rem;color:var(--kj-gulrot);
  display:block;margin-bottom:12px;font-weight:700;
}

/* ---------------------------------------------------------------- artikkel */
.kj-artikkel{padding:40px 0 10px;}
.kj-artikkel__topp{max-width:var(--kj-lest);}
.kj-artikkel__stikk{
  font-family:var(--kj-sans);font-size:.9rem;color:var(--kj-gulrot);
  margin-bottom:14px;font-weight:700;
}
.kj-artikkel__tittel{font-size:clamp(1.9rem,4.6vw,3rem);margin-bottom:18px;}
.kj-artikkel__ingress{font-size:1.18rem;color:#3a3a33;margin-bottom:18px;}
.kj-artikkel__meta{
  font-family:var(--kj-sans);font-size:.85rem;color:var(--kj-rug);
  display:flex;gap:20px;flex-wrap:wrap;
  border-top:1px solid var(--kj-strek);border-bottom:1px solid var(--kj-strek);
  padding:10px 0;
}
.kj-figur{margin:30px 0;border:1px solid var(--kj-strek);background:var(--kj-strek);}
.kj-figur img{width:100%;height:clamp(220px,38vw,420px);object-fit:cover;}
.kj-figur figcaption{
  font-family:var(--kj-sans);font-size:.82rem;color:var(--kj-rug);
  background:var(--kj-benk);padding:10px 14px;
}
.kj-brod{max-width:var(--kj-lest);}
.kj-brod h2{font-size:1.5rem;margin:36px 0 14px;}
.kj-brod h3{font-size:1.15rem;margin:28px 0 10px;}
.kj-brod ul{padding-left:1.15em;margin:0 0 1.15em;}
.kj-brod li{margin-bottom:.45em;}
.kj-brod strong{font-weight:700;}

/* nummerert framgangsmåte (ekte rekkefølge) */
.kj-steg{list-style:none;margin:26px 0 30px;padding:0;counter-reset:steg;max-width:var(--kj-lest);}
.kj-steg li{
  counter-increment:steg;position:relative;
  padding:14px 0 14px 52px;border-top:1px solid var(--kj-strek);
}
.kj-steg li:last-child{border-bottom:1px solid var(--kj-strek);}
.kj-steg li::before{
  content:counter(steg);position:absolute;left:0;top:14px;
  font-family:var(--kj-sans);font-weight:700;font-size:.95rem;
  color:var(--kj-flate);background:var(--kj-einer);
  width:30px;height:30px;display:flex;align-items:center;justify-content:center;
}

/* benkenotat — signaturmodul */
.kj-notat{
  max-width:var(--kj-lest);margin:32px 0;padding:20px 22px;
  background:var(--kj-flate);border-left:4px solid var(--kj-gulrot);
}
.kj-notat h3{font-size:1rem;margin-bottom:8px;color:var(--kj-gulrot);}
.kj-notat p:last-child{margin-bottom:0;}
.kj-notat p{font-size:.99rem;}

/* tabell holdbarhet */
.kj-tabellramme{max-width:var(--kj-lest);overflow-x:auto;margin:28px 0 34px;}
.kj-tabell{width:100%;border-collapse:collapse;font-size:.98rem;}
.kj-tabell caption{
  text-align:left;font-family:var(--kj-sans);font-size:.88rem;
  color:var(--kj-rug);padding-bottom:10px;
}
.kj-tabell th,.kj-tabell td{
  text-align:left;padding:11px 12px;border-bottom:1px solid var(--kj-strek);
}
.kj-tabell th{font-family:var(--kj-sans);font-size:.9rem;background:var(--kj-flate);}
.kj-tabell td:last-child{white-space:nowrap;color:var(--kj-einer);font-family:var(--kj-sans);font-size:.92rem;}

/* videre lesning */
.kj-videre{display:flex;flex-wrap:wrap;gap:1px;background:var(--kj-strek);border:1px solid var(--kj-strek);margin-top:20px;}
.kj-videre__lenke{
  flex:1 1 260px;background:var(--kj-flate);padding:20px 22px;text-decoration:none;
}
.kj-videre__lenke:hover{background:#fff;}
.kj-videre__lenke em{
  font-style:normal;font-family:var(--kj-sans);font-size:.82rem;color:var(--kj-rug);
  display:block;margin-bottom:8px;
}
.kj-videre__lenke b{font-family:var(--kj-sans);font-size:1.04rem;line-height:1.25;display:block;}

/* ------------------------------------------------------------- enkel side */
.kj-side{padding:44px 0 20px;max-width:var(--kj-lest);}
.kj-side h1{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:18px;}
.kj-side h2{font-size:1.25rem;margin:34px 0 12px;}
.kj-side ul{padding-left:1.15em;}
.kj-side li{margin-bottom:.4em;}
.kj-side__dato{font-family:var(--kj-sans);font-size:.85rem;color:var(--kj-rug);margin-bottom:26px;}
.kj-kort{background:var(--kj-flate);border:1px solid var(--kj-strek);padding:22px 24px;margin:26px 0;}
.kj-kort p:last-child{margin-bottom:0;}
.kj-epost{font-family:var(--kj-sans);font-size:1.05rem;color:var(--kj-gulrot);}

/* ------------------------------------------------------------------ 404 */
.kj-feil{padding:80px 0 60px;max-width:56ch;}
.kj-feil__kode{font-family:var(--kj-sans);font-size:5rem;font-weight:700;color:var(--kj-gulrot);line-height:1;letter-spacing:-.05em;}
.kj-feil h1{font-size:clamp(1.7rem,4vw,2.4rem);margin:14px 0 16px;}
.kj-feil ul{padding-left:1.15em;}

/* ---------------------------------------------------------------- bunntekst */
.kj-bunn{
  border-top:1px solid var(--kj-jern);margin-top:56px;
  background:var(--kj-benk);padding:40px 0 34px;
  font-size:.95rem;
}
.kj-bunn__rad{display:flex;flex-wrap:wrap;gap:34px;}
.kj-bunn__kol{flex:1 1 250px;}
.kj-bunn__kol h4{font-family:var(--kj-sans);font-size:.95rem;margin-bottom:10px;}
.kj-bunn__kol p{margin-bottom:.6em;color:#3a3a33;}
.kj-bunn__lenker{list-style:none;margin:0;padding:0;}
.kj-bunn__lenker li{margin-bottom:.45em;}
.kj-bunn__linje{
  margin-top:30px;padding-top:18px;border-top:1px solid var(--kj-strek);
  font-family:var(--kj-sans);font-size:.83rem;color:var(--kj-rug);
}

/* ----------------------------------------------------- samtykke / cookies */
.kj-samtykke{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:50;
  max-width:560px;margin:0 auto;
  background:var(--kj-jern);color:#f2efe7;
  padding:20px 22px;border:1px solid var(--kj-jern);
  font-size:.95rem;line-height:1.6;
  transform:translateY(140%);transition:transform .32s ease;
}
.kj-samtykke[data-vis="ja"]{transform:translateY(0);}
.kj-samtykke[hidden]{display:none;}
.kj-samtykke h2{font-size:1.02rem;margin-bottom:8px;color:#fff;}
.kj-samtykke p{margin-bottom:14px;}
.kj-samtykke a{color:#f0c08a;text-decoration-color:#8a6a45;}
.kj-samtykke__knapper{display:flex;gap:12px;flex-wrap:wrap;}
.kj-knapp{
  font-family:var(--kj-sans);font-size:.93rem;cursor:pointer;
  padding:9px 18px;border:1px solid transparent;border-radius:2px;
}
.kj-knapp--ja{background:var(--kj-gulrot);color:#fff;}
.kj-knapp--ja:hover{background:#9c4c14;}
.kj-knapp--nei{background:transparent;color:#f2efe7;border-color:#6b6a61;}
.kj-knapp--nei:hover{border-color:#f2efe7;}

/* --------------------------------------------------- bilde som ikke lastet */
.kj-bildefeil{
  min-height:150px;
  background:
    repeating-linear-gradient(135deg,#ddd7c7 0 14px,#e7e1d1 14px 28px);
}
.kj-bildefeil::after{
  content:attr(data-tekst);
  display:block;font-family:var(--kj-sans);font-size:.8rem;color:var(--kj-rug);
  padding:12px 14px;
}

/* ------------------------------------------------------------- responsivt */
@media (max-width:860px){
  .kj-post{flex-direction:column;gap:16px;}
  .kj-post__bilde{flex:1 1 auto;width:100%;}
  .kj-post__bilde img{height:200px;}
}

@media (max-width:720px){
  body{font-size:17px;}
  .kj-ramme{padding:0 18px;}
  .kj-topp__rad{flex-wrap:wrap;align-items:center;}
  .kj-nav__bryter{display:block;}
  .kj-nav{
    display:none;flex-basis:100%;flex-direction:column;gap:0;
    padding:8px 0 6px;
  }
  .kj-nav[data-apen="ja"]{display:flex;}
  .kj-nav a{padding:11px 0;border-bottom:1px solid var(--kj-strek);}
  .kj-hero{padding-top:28px;}
  .kj-bolk{padding:38px 0;}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important;}
}

@media print{
  .kj-topp,.kj-samtykke,.kj-videre{display:none;}
  body{background:#fff;font-size:12pt;}
}