/* Kulörkartan. Joakim sa tre gånger att den inte hör hemma på
   förstasidan. Här är den hela poängen med sidan i stället. */
.kul-sek{padding:clamp(56px,7vw,104px) 0;background:var(--bla)}
.kul-sek .etikett{color:var(--gul)}
.kul-rutnat{display:grid;gap:clamp(12px,1.8vw,22px);margin:clamp(30px,4vw,52px) 0 0;
  padding:0;list-style:none;grid-template-columns:repeat(2,1fr)}
@media(min-width:760px){.kul-rutnat{grid-template-columns:repeat(4,1fr)}}
.kul{background:rgba(255,255,255,.05);border:1px solid rgba(250,216,76,.28);
  padding:14px 14px 18px;text-align:center;
  transition:border-color .4s var(--lugn),box-shadow .4s var(--lugn),transform .4s var(--lugn)}
.kul:hover{border-color:var(--gul);transform:translateY(-3px);
  box-shadow:0 24px 54px -30px rgba(250,216,76,.45)}
.kul-ruta{display:block;aspect-ratio:1/1;overflow:hidden;background:#fff}
.kul-ruta img{width:100%;height:100%;object-fit:contain;transition:transform 1s var(--lugn)}
.kul:hover .kul-ruta img{transform:scale(1.06)}
.kul b{display:block;margin:14px 0 2px;font-family:var(--serif);font-weight:400;
  font-size:clamp(18px,2.2vw,24px);color:#fff}
.kul-eng{font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--gul)}
.kul-fot{margin:clamp(28px,3.6vw,44px) 0 0;max-width:60ch;color:var(--is);opacity:.8}