/* kio/kassi: square box, colour by background, optional bolt and photo. Colours fall back to KÍO's palette when the
   theme doesn't define it. */
.kio-kassi {
  --kio-ink: #3b0624;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 100%;
  padding: clamp(24px, 3vw, 40px);
  background: var(--kio-bg);
  color: var(--kio-fg);
  box-sizing: border-box;
  container-type: inline-size;
}
.kio-kassi--plomma { --kio-bg: var(--wp--preset--color--plomma, #850e4f); --kio-fg: #fff; --kio-accent: var(--wp--preset--color--raf, #f0a03c); --kio-soft: #f7cfe1; }
.kio-kassi--magenta { --kio-bg: var(--wp--preset--color--magenta, #ab1a68); --kio-fg: #fff; --kio-accent: #ffd3bf; --kio-soft: #f7cfe1; }
.kio-kassi--djup { --kio-bg: var(--wp--preset--color--djup, #5e0838); --kio-fg: #fff; --kio-accent: var(--wp--preset--color--raf, #f0a03c); --kio-soft: #f7cfe1; }
.kio-kassi--blek { --kio-bg: var(--wp--preset--color--blek, #3b0624); --kio-fg: #fff; --kio-accent: var(--wp--preset--color--raf, #f0a03c); --kio-soft: #f7cfe1; }
.kio-kassi--koral { --kio-bg: var(--wp--preset--color--koral, #e07355); --kio-fg: #fff; --kio-accent: #3b0624; --kio-soft: #fff; }
.kio-kassi--raf { --kio-bg: var(--wp--preset--color--raf, #f0a03c); --kio-fg: var(--kio-ink); --kio-accent: var(--kio-ink); --kio-soft: var(--kio-ink); }
.kio-kassi--bleikur { --kio-bg: var(--wp--preset--color--bleikur, #f7cfe1); --kio-fg: var(--kio-ink); --kio-accent: var(--wp--preset--color--magenta, #ab1a68); --kio-soft: var(--kio-ink); }
.kio-kassi--lilla { --kio-bg: var(--wp--preset--color--lilla, #cf9dbb); --kio-fg: var(--kio-ink); --kio-accent: var(--kio-ink); --kio-soft: var(--kio-ink); }
.kio-kassi--ljosbleikur { --kio-bg: var(--wp--preset--color--ljosbleikur, #fbeaf2); --kio-fg: var(--kio-ink); --kio-accent: var(--wp--preset--color--magenta, #ab1a68); --kio-soft: var(--kio-ink); }
.kio-kassi--opid { --kio-bg: transparent; --kio-fg: var(--kio-ink); --kio-accent: var(--wp--preset--color--magenta, #ab1a68); --kio-soft: #5c3a4d;
  padding: 18px 0 8px; border-top: 3px solid var(--kio-ink); overflow: visible; }
.kio-kassi--opid .kio-kassi__efni > p { color: var(--kio-soft); }
.kio-kassi--opid .kio-kassi__skraut { display: none; }
.kio-kassi--opid.kio-haed--ha { min-height: 0; }
.kio-kassi--hvitur { --kio-bg: #fff; --kio-fg: var(--kio-ink); --kio-accent: var(--wp--preset--color--magenta, #ab1a68); --kio-soft: var(--kio-ink); box-shadow: inset 0 0 0 2px #eedbe5; }

.kio-kassi a:not(.wp-block-button__link) { color: inherit; }
.kio-kassi .is-style-merki { color: var(--kio-accent); }
.kio-kassi__efni { position: relative; z-index: 2; display: flex; flex-direction: column; flex: 1; }
.kio-kassi__efni > * { margin-block: 0; }
.kio-kassi__efni > * + * { margin-block-start: 12px; }
.kio-kassi__efni > p:not(.is-style-merki) { color: var(--kio-soft); }
.kio-kassi--raf .kio-kassi__efni > p, .kio-kassi--bleikur .kio-kassi__efni > p, .kio-kassi--lilla .kio-kassi__efni > p,
.kio-kassi--ljosbleikur .kio-kassi__efni > p, .kio-kassi--hvitur .kio-kassi__efni > p { color: var(--kio-fg); }

.kio-haed--lag { min-height: 0; }
.kio-haed--ha { min-height: clamp(320px, 38vw, 460px); }

/* Lightning */
.kio-kassi__skraut { position: absolute; z-index: 1; pointer-events: none; display: block; }
.kio-kassi__skraut svg { display: block; height: 100%; width: auto; }
.kio-skraut--haegri { right: clamp(16px, 3vw, 44px); top: 50%; transform: translateY(-50%); height: min(78%, 420px); }
.kio-skraut--einn.kio-skraut--haegri { height: 112%; top: -6%; transform: none; }
.kio-skraut--midja { left: 50%; top: -8%; height: 116%; transform: translateX(-50%); }
.kio-skraut--midja + .kio-kassi__efni { text-shadow: 0 0 1px rgba(0, 0, 0, .05); }

/* Photo filling the box under a tint */
.kio-kassi__fylla { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); opacity: .55; z-index: 0; }
.kio-kassi__tint { position: absolute; inset: 0; z-index: 0; background: linear-gradient(0deg, var(--kio-bg) 15%, color-mix(in srgb, var(--kio-bg) 25%, transparent)); }
.kio-mynd--fylla { min-height: 320px; }
.kio-mynd--fylla .kio-kassi__efni { justify-content: flex-end; }

/* Photo in the four-lobed frame, beside the text */
.kio-mynd--rammi { display: grid; grid-template-columns: minmax(0, 1fr) clamp(160px, 34%, 260px); gap: 24px; align-items: center; }
.kio-kassi__rammi svg { display: block; width: 100%; height: auto; }

@media (max-width: 781px) {
  /* Low boxes read as quick links on phones */
  .kio-haed--lag:not(.kio-kassi--opid) { padding: 20px 22px; }
  .kio-haed--lag h3 { font-size: 23px !important; }
  .kio-haed--lag .kio-kassi__efni > * + * { margin-block-start: 8px; }
  .kio-mynd--rammi { grid-template-columns: 1fr; }
  .kio-kassi__rammi { order: -1; width: min(240px, 70%); }
  .kio-kassi__skraut { opacity: .45; }
  .kio-skraut--haegri { height: min(60%, 220px); }
}

/* Fundargerðir: years, then one row per PDF */
.kio-ar-flakk { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.kio-ar-flakk a { padding: 9px 16px; background: var(--wp--preset--color--bleikur, #f7cfe1); color: #3b0624; font-weight: 700; text-decoration: none; }
.kio-ar-flakk a:hover { background: var(--wp--preset--color--magenta, #ab1a68); color: #fff; }
.kio-ar { scroll-margin-top: 24px; }
.kio-ar + .kio-ar { margin-top: 44px; }
.kio-ar__titill { margin: 0 0 6px; color: var(--wp--preset--color--plomma, #850e4f); }
.kio-fundargerdir { list-style: none; margin: 0; padding: 0; border-top: 2px solid #3b0624; }
.kio-fundargerd { display: grid; grid-template-columns: 7.5em minmax(0, 1fr) auto; gap: 18px; align-items: baseline; padding: 16px 0; border-bottom: 2px solid #eedbe5; position: relative; }
.kio-fundargerd__man { font-weight: 600; color: var(--wp--preset--color--magenta, #ab1a68); text-transform: capitalize; }
.kio-fundargerd__texti { display: flex; flex-direction: column; gap: 4px; }
.kio-fundargerd__titill { font-weight: 700; font-size: 1.15em; color: #3b0624; text-decoration: none; }
.kio-fundargerd__titill::after { content: ""; position: absolute; inset: 0; } /* the whole row opens the PDF */
.kio-fundargerd:hover { background: #fbeaf2; }
.kio-fundargerd__lysing { color: #5c3a4d; line-height: 1.5; }
.kio-fundargerd__skjal { font-weight: 700; font-size: .85em; letter-spacing: .04em; color: #fff; background: var(--wp--preset--color--plomma, #850e4f); padding: 6px 10px; white-space: nowrap; }
.kio-fundargerd a:focus-visible { outline: 3px solid var(--wp--preset--color--raf, #f0a03c); outline-offset: 2px; }
@media (max-width: 600px) {
  .kio-fundargerd { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; }
  .kio-fundargerd__man { grid-column: 1 / -1; font-size: .9em; }
}

/* Stjórn: two per row so the photos are large; bio and LinkedIn under the name */
.kio-stjorn { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.kio-manneskja { background: var(--wp--preset--color--ljosbleikur, #fbeaf2); padding: clamp(24px, 3vw, 40px); display: flex; flex-direction: column; gap: 8px; }
.kio-manneskja__mynd { width: min(66%, 360px); margin: 0 auto 14px; aspect-ratio: 1; }
.kio-manneskja__mynd svg { display: block; width: 100%; height: auto; }
.kio-manneskja__hlutverk { margin: 0; font-weight: 700; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--magenta, #ab1a68); }
.kio-manneskja__nafn { margin: 0; font-size: clamp(24px, 2.4vw, 30px); line-height: 1.15; color: #3b0624; }
.kio-manneskja__kynning { margin: 6px 0 0; line-height: 1.6; color: #5c3a4d; max-width: 52ch; }
.kio-manneskja__linkedin { align-self: flex-start; margin-top: auto; padding-top: 12px; font-weight: 700; color: var(--wp--preset--color--plomma, #850e4f); }
@media (max-width: 700px) {
  .kio-stjorn { grid-template-columns: 1fr; }
  .kio-manneskja__mynd { width: min(72%, 300px); }
}

/* Styrktaraðilar: main sponsors side by side on a soft band, the rest as a frameless logo row under them */
.kio-styrktaradilar { border-top: 3px solid #3b0624; padding-top: 12px; display: grid; gap: 12px; }
.kio-styrktaradilar__adal { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; padding: 18px 0 22px; }
.kio-styrktaradilar__adrir { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 28px clamp(28px, 4vw, 56px); padding: 26px 0 8px; }
.kio-styrkur { display: grid; place-items: center; min-height: 96px; padding: 18px; text-decoration: none; color: #3b0624; }
.kio-styrkur img { max-width: 100%; max-height: 56px; width: auto; height: auto; object-fit: contain; }
.kio-styrktaradilar__adrir .kio-styrkur { min-height: 0; padding: 8px; }
.kio-styrktaradilar__adrir .kio-styrkur img { height: var(--kio-h, 32px); max-height: none; }
.kio-styrkur--adal { min-height: 0; padding: 0; }
.kio-styrkur--adal img { height: var(--kio-h, 72px); max-height: none; max-width: 86%; }
.kio-styrkur__nafn { font-weight: 800; text-align: center; }
.kio-styrkur--adal .kio-styrkur__nafn { font-size: 1.4em; }
a.kio-styrkur:hover { opacity: .75; }
a.kio-styrkur--adal:hover { background: none; opacity: .8; }
@media (max-width: 781px) {
  .kio-styrktaradilar__adal { grid-template-columns: 1fr 1fr; gap: 8px; }
  .kio-styrktaradilar__adrir { gap: 22px 30px; padding-top: 22px; }
  .kio-styrktaradilar__adrir .kio-styrkur { padding: 4px; }
  .kio-styrktaradilar__adrir .kio-styrkur img { height: calc(var(--kio-h, 32px) * .6); }
  .kio-styrkur { min-height: 64px; padding: 10px 6px; font-size: 14px; }
  .kio-styrkur--adal { min-height: 0; padding: 0; }
  .kio-styrkur--adal .kio-styrkur__nafn { font-size: 1.1em; }
  .kio-styrkur--adal img { height: calc(var(--kio-h, 72px) * .55); max-width: 92%; }
  .kio-styrktaradilar__adal { padding: 14px 0 18px; }
}
.kio-tomt { opacity: .7; }
