/* Hvitt belte, foredrag og verktøykassa. Brukes oppå stil.css, lys.css og kurs.css. */
.ekstra{--ink0:#002A3A;--teal:#1D6470;--myk:#F4F6F5}
.ekstra .fh h1{font-size:clamp(44px,7.2vw,116px)}
.pille-e{display:inline-block;justify-self:start;padding:5px 12px;border-radius:999px;background:#E3EEF0;color:var(--teal);font-family:var(--display);font-weight:700;font-size:13.5px;letter-spacing:.1em;text-transform:uppercase}
.e-merk{margin-top:clamp(24px,3vw,40px);font-size:clamp(18px,1.5vw,22px);max-width:60ch}
.e-videre{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}

/* Hvitt belte */
.e-start{margin-top:clamp(36px,5vw,70px);background:#002A3A;color:#fff;border-radius:14px;padding:clamp(24px,3.4vw,52px);display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:clamp(20px,4vw,60px);align-items:center;--gt:#78BE20}
.e-start .eyebrow{color:#78BE20}
.e-start h3{font-size:clamp(30px,3.6vw,54px);font-weight:800;line-height:.95;margin:10px 0 12px}
.e-start p:not(.eyebrow){font-size:clamp(17px,1.3vw,20px);line-height:1.45;color:#D5E0E5;max-width:56ch}
.e-steg{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,38px)}
.e-steg li{border-top:3px solid #78BE20;padding-top:clamp(14px,1.6vw,22px);display:grid;gap:8px;align-content:start}
.e-steg b{font-family:var(--display);font-weight:800;font-size:clamp(44px,4.6vw,72px);line-height:.85;color:var(--teal);font-variant-numeric:tabular-nums}
.e-steg h3{font-size:clamp(22px,2vw,30px);line-height:1}
.e-steg p{font-size:clamp(17px,1.25vw,19.5px);line-height:1.42}

/* Foredrag */
.e-talere{background:var(--myk)}
.taler{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:clamp(24px,5vw,80px);align-items:center;padding-block:clamp(30px,4vw,60px);border-top:1px dashed rgba(0,42,58,.25)}
.taler.snu{grid-template-columns:minmax(0,1.38fr) minmax(0,.62fr)}
.taler.snu figure{order:2}
.taler figure{margin:0;aspect-ratio:4/5;overflow:hidden;background:#DDE5E8;box-shadow:14px 14px 0 #78BE20}
.taler.snu figure{box-shadow:-14px 14px 0 #CDD751}
.taler img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease)}
.taler:hover img{transform:scale(1.04)}
.taler>div{display:grid;gap:12px;justify-items:start}
.taler h3{font-size:clamp(34px,4.2vw,64px);font-weight:800;line-height:.92;letter-spacing:-.01em;color:var(--ink0)}
.taler p{font-size:clamp(17px,1.3vw,20px);line-height:1.5;max-width:58ch}
.taler p:first-of-type{font-family:var(--display);font-weight:600;font-size:clamp(20px,1.8vw,26px);line-height:1.15;color:var(--teal)}
.taler-knapper{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:8px}

/* Verktøykassa */
.e-maler{background:var(--myk)}
.e-maler .k-hode .lead{max-width:58ch}
.mal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.4vw,36px)}
.mal{background:#fff;padding:clamp(16px,1.8vw,26px);display:grid;gap:10px;align-content:start;border-top:3px solid #78BE20;transition:transform .35s var(--ease),box-shadow .35s}
.mal:hover{transform:translateY(-5px);box-shadow:0 26px 34px -24px rgba(0,42,58,.45)}
.mal figure{margin:0 0 6px;aspect-ratio:4/3;background:var(--lc);display:grid;place-items:center;padding:14px;overflow:hidden}
.mal img{max-width:100%;max-height:100%;width:auto;height:auto;display:block;box-shadow:0 10px 16px -8px rgba(0,42,58,.5);transform:rotate(-2deg);transition:transform .5s var(--ease)}
.mal:nth-child(even) img{transform:rotate(1.6deg)}
.mal:hover img{transform:rotate(0) scale(1.04)}
.mal h3{font-size:clamp(24px,2.2vw,32px);line-height:1}
.mal p{font-size:clamp(16.5px,1.15vw,18px);line-height:1.45}
.mal-knapper{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:8px}
.mal-last{display:inline-flex;align-items:baseline;gap:7px;padding:10px 14px;background:#002A3A;color:#fff;text-decoration:none;font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:.06em;text-transform:uppercase;transition:background .2s}
.mal-last small{font-family:var(--body);font-weight:400;font-size:13px;letter-spacing:0;text-transform:none;color:#C4D3D9}
.mal-last:hover{background:#1D6470}
.mal-last:focus-visible{outline:3px solid #78BE20;outline-offset:3px}
.e-kasse{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(26px,5vw,80px);align-items:center}
.e-kasse figure{margin:0}
.e-kasse img{width:100%;height:auto;display:block}
.e-kasse>div{display:grid;gap:14px;justify-items:start}
.e-kasse h2{font-size:clamp(34px,4.4vw,68px);line-height:.92}
.e-kasse p:not(.eyebrow){font-size:clamp(18px,1.4vw,21px);line-height:1.45;max-width:46ch}

@media (max-width:900px){
  .e-start,.e-kasse,.taler,.taler.snu{grid-template-columns:1fr}
  .taler.snu figure{order:0}
  .taler figure{max-width:320px;box-shadow:10px 10px 0 #78BE20}
  .taler.snu figure{box-shadow:10px 10px 0 #CDD751}
  .e-steg,.e-videre{grid-template-columns:1fr}
  .mal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ekstra .fag-lapp{display:none}
}
@media (max-width:560px){.mal-grid{grid-template-columns:1fr}}