/* KÍO theme: everything theme.json can't express. White page, square boxes with 16 px gaps, wide Archivo headings. */

:root { --kio-gap: 16px; --kio-col-gap: 32px; --kio-ink: #3b0624; } /* columns a little wider apart than rows (the user, 4 Nov) */

/* Wide, heavy headings (Archivo's width axis) */
h1, h2, h3, .wp-block-post-title, .is-style-risastort, .is-style-breitt {
  font-stretch: 125%;
  font-variation-settings: "wdth" 125;
}
h4, h5, h6 { font-stretch: 110%; }
.is-style-risastort { font-size: var(--wp--preset--font-size--risastort) !important; }
.kio-kassi .is-style-risastort { font-size: min(var(--wp--preset--font-size--risastort), 31cqi) !important; }
.is-style-risastort { line-height: .95 !important; letter-spacing: -.03em !important; }
p.is-style-merki, .is-style-merki, .wp-block-post-terms.is-style-merki {
  font-size: 13px !important; font-weight: 700; line-height: 1.2; letter-spacing: .12em; text-transform: uppercase;
}
.wp-block-post-terms.is-style-merki a { text-decoration: none; color: inherit; }
::selection { background: var(--wp--preset--color--raf); color: var(--kio-ink); }
:focus-visible { outline: 3px solid var(--wp--preset--color--raf); outline-offset: 2px; }

/* Header */
.kio-haus { padding-block: 22px; gap: 24px; }
.kio-haus__haegri { gap: 28px; }
.kio-merki a { display: flex; align-items: center; gap: 12px; color: var(--wp--preset--color--plomma); text-decoration: none; }
.kio-merki__texti { font-size: 15px; line-height: 1.15; letter-spacing: .08em; text-align: right; font-weight: 500; }
.kio-haus .wp-block-navigation a { color: var(--kio-ink); text-decoration: none; }
.kio-haus .wp-block-navigation a:hover { color: var(--wp--preset--color--magenta); }
.kio-haus .wp-block-navigation .current-menu-item > a { color: var(--wp--preset--color--magenta); }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--plomma) !important; color: #fff !important; padding: 28px; }
.wp-block-navigation__responsive-container.is-menu-open a { color: #fff !important; font-size: 26px; font-weight: 800; font-stretch: 125%; }
@media (max-width: 600px) {
  .kio-merki__texti { font-size: 12px; }
  .kio-merki svg { width: 42px; height: 42px; }
  .kio-haus__takki .wp-element-button { padding: 10px 14px; }
}

/* Main: the same 16 px gap between every box and section */
.kio-main { padding-bottom: var(--kio-gap); }
/* Pattern parts are wrapped in a content-only locked group (.kio-laest); spacing treats the wrapper as the part */
.kio-laest > * { margin-block: 0 !important; }
.kio-laest > * + * { margin-block-start: 18px !important; }
.kio-forsida > .kio-laest:has(> .kio-kafli) + .kio-laest { margin-block-start: 18px !important; }
.kio-forsida > .kio-laest:has(> .kio-heil) + .kio-laest:has(> [class*="is-style-kio-"]) { margin-block-start: clamp(24px, 3vw, 36px) !important; }
.kio-forsida > * + *, .kio-sida > * + * { margin-block-start: clamp(40px, 5vw, 72px) !important; }
.kio-forsida > .kio-heil + [class*="is-style-kio-"] { margin-block-start: clamp(24px, 3vw, 36px) !important; } /* the row under a focus box belongs to it */
.kio-forsida > .kio-kafli + *, .kio-sida > .kio-kaflaheiti + * { margin-block-start: 18px !important; }

/* Box layouts (Group styles) */
[class*="is-style-kio-"] > * { margin: 0 !important; min-width: 0; }
.is-style-kio-3, .is-style-kio-2, .is-style-kio-21, .is-style-kio-12 { display: grid; gap: var(--kio-gap) var(--kio-col-gap); align-items: stretch; }
.is-style-kio-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.is-style-kio-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.is-style-kio-21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.is-style-kio-12 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
.is-style-kio-radir { display: grid; grid-auto-rows: 1fr; gap: var(--kio-gap); }
@media (max-width: 781px) {
  .is-style-kio-3, .is-style-kio-2, .is-style-kio-21, .is-style-kio-12 { grid-template-columns: 1fr; row-gap: 22px; }
  .is-style-kio-radir { grid-auto-rows: auto; }
}

/* Phones: a group marked kio-strjuka (editor switch "Strjúka á síma") becomes one swipe row instead of a stack.
   Each box is 80% wide, so the next one peeks in. */
@media (max-width: 781px) {
  .kio-strjuka {
    display: grid !important;
    grid-template-columns: none !important;
    grid-auto-flow: column;
    grid-auto-columns: 80%;
    gap: 12px !important;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    margin-inline: calc(-1 * var(--wp--style--root--padding-left, 14px)) !important;
    padding-inline: var(--wp--style--root--padding-left, 14px);
    scroll-padding-inline: var(--wp--style--root--padding-left, 14px);
  }
  .kio-strjuka::-webkit-scrollbar { display: none; }
  .kio-strjuka > * { scroll-snap-align: start; }
  .kio-strjuka > .is-style-kio-radir { display: contents; } /* a column of two rows becomes two swipe cards */
  .kio-strjuka > .is-style-kio-radir > * { scroll-snap-align: start; }
  .editor-styles-wrapper .kio-strjuka { margin-inline: 0 !important; }
}

/* Inside boxes: headings take the box colour; links read as links */
.kio-kassi h1, .kio-kassi h2, .kio-kassi h3 { color: inherit; overflow-wrap: break-word; }
h1, h2, h3 { overflow-wrap: break-word; }
.kio-kassi .kio-kassi__efni > .wp-block-buttons { margin-top: auto; padding-top: 18px; }
.kio-kassi .is-style-risastort { margin-block: 6px 10px !important; }
.kio-kassi a:not(.wp-element-button) { font-weight: 700; text-underline-offset: 3px; }
.kio-kassi--magenta .wp-element-button, .kio-kassi--plomma .wp-element-button, .kio-kassi--djup .wp-element-button { background: var(--wp--preset--color--raf); color: var(--kio-ink); }
.kio-kassi--raf .wp-element-button { background: var(--kio-ink); color: #fff; }

/* Page and post title box */
.kio-sidutitill { padding: clamp(28px, 4.5vw, 60px) !important; }
.kio-sidutitill .kio-kassi__efni { max-width: 860px; }
.kio-sidutitill h1 { --kio-titill: var(--wp--preset--font-size--huge); }
/* Titles shrink to fit their longest word: --kio-ord = its width in em (kio_longest_word(), KÍO kjarni), 4% to spare */
.kio-sidutitill h1, .kio-fokus__titill, .kio-vidburdur__titill { font-size: min(var(--kio-titill), calc(100cqi / (var(--kio-ord, .1) * 1.04))) !important; }
.kio-sidutitill .kio-inngangur, .kio-sidutitill .wp-block-term-description { font-size: var(--wp--preset--font-size--large); color: var(--kio-soft); margin-top: 18px !important; }
.kio-sidutitill .kio-inngangur p { margin: 0; }
.kio-sidutitill .kio-dagsetning { color: var(--kio-soft); margin-top: 14px !important; }
.kio-sidutitill .wp-block-search { max-width: 520px; margin-top: 22px !important; }

/* Reading text on white */
.kio-efni { padding-top: clamp(28px, 4vw, 44px); }
.kio-efni > p, .kio-efni > ul, .kio-efni > ol { font-size: 19px; line-height: 1.65; }
.kio-efni > h2 { color: var(--wp--preset--color--magenta); font-size: clamp(30px, 3.4vw, 42px); margin-top: 1.6em; }
.kio-efni > h3 { color: var(--wp--preset--color--plomma); margin-top: 1.4em; }
.kio-efni > h2:first-child, .kio-efni > h3:first-child { margin-top: 0; }
.kio-efni a { text-underline-offset: 3px; }
.kio-efni blockquote { border-left: 0; background: var(--wp--preset--color--bleikur); padding: 28px 32px; margin-inline: 0; }
.kio-adalmynd img { width: 100%; object-fit: cover; }

/* Section headings with a "see all" link */
.kio-kafli { align-items: baseline; }
.kio-kaflaheiti { color: var(--wp--preset--color--plomma); font-size: clamp(30px, 3.4vw, 40px) !important; margin: 0; }
.kio-kafli p a { font-weight: 700; text-decoration: none; }

/* Dagskrá rows inside a box */
.kio-vidburdur { display: grid; grid-template-columns: 86px minmax(0, 1fr); gap: 18px; align-items: center; padding: 14px 0; border-bottom: 2px solid rgba(255, 255, 255, .2); }
/* A news post in the hero: titles are longer than an event's name */
.kio-fokus__titill { --kio-titill: clamp(30px, 3.1vw, 46px); line-height: 1.05; }
.kio-vidburdur__titill { --kio-titill: clamp(34px, 5vw, 72px); line-height: 1.02; }
.kio-dagskra { margin-top: 24px !important; }
/* Past events stay in Dagskrá, faded; dates that have passed fade in the hero's big date */
.kio-vidburdur--lidinn { opacity: .5; }
.kio-vidburdur--lidinn:hover { opacity: .8; }
.kio-lidid { opacity: .4; }
.kio-dagskra__tomt { color: #f7cfe1; }
.kio-vidburdur__stadur { font-weight: 600; }
.kio-skraning-stada { display: inline-block; align-self: flex-start; margin-top: 18px !important; padding: 10px 18px; border: 2px solid currentColor; font-weight: 700; }
.kio-vidburdur > * { margin: 0 !important; }
.kio-dags { background: var(--wp--preset--color--koral); color: #fff; text-align: center; padding: 12px 0; line-height: 1.1; }
.kio-dags p { margin: 0 !important; color: #fff !important; }
.kio-dags p:first-child { font-weight: 800; font-size: 22px; }
.kio-dags p + p { font-size: 15px; font-weight: 600; }
.kio-dags--fleiri p:first-child { font-size: 16px; letter-spacing: -.01em; } /* "3. & 11." fits the box */
.kio-vidburdur__texti p { margin: 0 !important; }
.kio-vidburdur__texti p:first-child { font-size: 20px; color: #fff; }
.kio-vidburdur__texti p + p { font-size: 16px; }
/* The whole row opens the event's link (on its name) */
.kio-vidburdur { position: relative; transition: background-color .15s; }
.kio-vidburdur__texti a { color: #fff; text-decoration: none; }
.kio-vidburdur__texti a::after { content: ""; position: absolute; inset: 0; }
.kio-vidburdur:has(a):hover { background: rgba(255, 255, 255, .08); }
.kio-vidburdur:has(a):hover .kio-vidburdur__texti a { text-decoration: underline; text-underline-offset: 4px; }
.kio-vidburdur__texti a:focus-visible { outline: none; }
.kio-vidburdur:has(a:focus-visible) { outline: 3px solid var(--wp--preset--color--raf); outline-offset: 2px; }
/* The same rows on a white page: in a news post (Viðburðir block) and under an event's own page (10 Nov 2026) */
.kio-sida .kio-vidburdur__texti p:first-child, .kio-sida .kio-vidburdur__texti a { color: var(--kio-ink); }
.kio-sida .kio-vidburdur__texti p + p { color: #5c4a54; }
.kio-sida .kio-vidburdur:has(a):hover { background: #f7eef3; }
.kio-sida .kio-dagskra__tomt { color: #5c4a54; }
.kio-efni .kio-vidburdir-val { margin-block: 28px !important; }
/* The event's name in the hero box links to its page: no underline until hovered */
.kio-kassi h3 a { color: inherit; text-decoration: none; }
.kio-kassi h3 a:hover { text-decoration: underline; text-underline-offset: 6px; }

/* The low banner */
.kio-bordi { padding-block: clamp(30px, 4vw, 46px) !important; }
.kio-bordi h2 { font-size: clamp(40px, 5vw, 64px); }
.kio-bordi p { max-width: 640px; }
.kio-bordi .wp-block-buttons { margin-top: 18px !important; padding-top: 0 !important; }

/* News cards: open entries on white, a dark line on top (colour is kept for the key boxes) */
.kio-spjold { gap: 28px var(--kio-gap) !important; }
.kio-spjald { position: relative; height: 100%; padding: 18px 0 6px; border-top: 3px solid var(--kio-ink); display: flex; flex-direction: column; gap: 8px; }
.kio-spjald > * { margin: 0 !important; }
.kio-spjald .is-style-merki { color: var(--wp--preset--color--magenta); }
.kio-spjald .wp-block-post-title { font-size: 26px; line-height: 1.12; }
.kio-spjald .wp-block-post-title a { color: var(--kio-ink); text-decoration: none; }
.kio-spjald .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.kio-spjald:hover .wp-block-post-title a { color: var(--wp--preset--color--magenta); }
.kio-spjald .wp-block-post-date, .kio-spjald .wp-block-post-excerpt { color: #5c3a4d; }
.kio-spjald .wp-block-post-excerpt__more-link { display: none; }
@media (max-width: 781px) { .kio-spjold { grid-template-columns: 1fr !important; gap: 22px !important; } }
.kio-sidur { margin-top: 28px; font-weight: 700; gap: 14px; }
.kio-sidur a { text-decoration: none; }

/* Footer */
.kio-fotur-wrap { margin-top: var(--kio-gap); }
.kio-fotur { padding: clamp(30px, 4vw, 48px) !important; margin-bottom: 30px; font-size: 16px; line-height: 1.8; }
.kio-fotur a { color: inherit; text-decoration: none; }
.kio-fotur a:hover { color: #fff; text-decoration: underline; }
.kio-fotur__titill { color: #fff; font-weight: 700; margin-bottom: 6px !important; }
.kio-fotur p { margin: 0; }

/* Search field */
.kio-leit .wp-block-search__input { border: 0; padding: 12px 14px; font-size: 17px; }
.kio-leit .wp-block-search__button { margin-left: 0; }
.kio-leit .wp-block-search__input::placeholder { color: #8a6b7c; }
/* 404: the search box stays clear of the bolt; quick links under the box */
.kio-villa .kio-kassi__efni { max-width: 640px; }
.kio-villa-tenglar { display: flex; flex-wrap: wrap; gap: 10px 32px; margin-top: 28px !important; font-weight: 700; font-size: 18px; }
.kio-villa-tenglar p { margin: 0; }
.kio-villa-tenglar a { color: var(--wp--preset--color--plomma); text-decoration: none; }
.kio-villa-tenglar a:hover { text-decoration: underline; }

/* Editor: give the layout groups a hint of their grid */
.editor-styles-wrapper [class*="is-style-kio-"] { outline: 1px dashed rgba(133, 14, 79, .25); outline-offset: 4px; }

/* Phones: Archivo a little less wide, so long Icelandic words ("Gervigreindarnámskeið") fit without breaking */
@media (max-width: 600px) {
  h1, h2, h3, .wp-block-post-title { font-stretch: 106%; font-variation-settings: "wdth" 106; }
  .is-style-risastort { font-stretch: 112%; font-variation-settings: "wdth" 112; }
  .kio-kassi h2 { font-size: clamp(28px, 8vw, 34px) !important; }
  .kio-spjald .wp-block-post-title { font-size: 23px; }
  .kio-spjald { padding: 22px 22px 26px; }
}

/* Phone menu (kio/simavalmynd): KÍO's own, full screen, in place of the Navigation block's overlay */
.kio-simavalmynd { display: none; }
@media (max-width: 600px) {
  .kio-haus .wp-block-navigation { display: none; }
  .kio-simavalmynd { display: block; }
}
.kio-simavalmynd__opna { width: 46px; height: 46px; display: grid; place-content: center; gap: 7px; background: none; border: 0; padding: 0; cursor: pointer; color: var(--wp--preset--color--plomma); }
.kio-simavalmynd__opna span[aria-hidden] { display: block; width: 28px; height: 3px; background: currentColor; }
.kio-simavalmynd__opna span[aria-hidden]:last-child { width: 18px; justify-self: end; }
html.kio-valmynd-opin { overflow: hidden; }

.kio-valmynd {
  position: fixed; inset: 0; box-sizing: border-box; width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; border: 0;
  padding: max(18px, env(safe-area-inset-top)) clamp(18px, 6vw, 32px) max(22px, env(safe-area-inset-bottom));
  background: var(--wp--preset--color--plomma); color: #fff; overflow-x: hidden; overflow-y: auto;
  display: none; flex-direction: column;
}
.kio-valmynd[open] { display: flex; animation: kio-valmynd-inn .28s cubic-bezier(.2, .8, .2, 1); }
.kio-valmynd::backdrop { background: transparent; }
.kio-valmynd > * { position: relative; z-index: 1; }
.kio-valmynd__elding { position: absolute; z-index: 0; right: -12%; bottom: 13%; height: 37%; pointer-events: none; opacity: .9; }
.kio-valmynd__elding svg { height: 100%; width: auto; display: block; }
.kio-valmynd__toppur { display: flex; align-items: center; justify-content: space-between; }
.kio-valmynd .kio-merki a { color: #fff; }
.kio-valmynd__loka { width: 48px; height: 48px; display: grid; place-items: center; background: none; border: 0; color: #fff; cursor: pointer; margin-right: -8px; }
.kio-valmynd__listi { list-style: none; margin: clamp(28px, 7vh, 64px) 0 0; padding: 0; border-top: 2px solid rgba(255, 255, 255, .22); }
.kio-valmynd__listi li { border-bottom: 2px solid rgba(255, 255, 255, .22); animation: kio-lina-inn .45s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(60ms + var(--i) * 55ms); }
.kio-valmynd__listi a { display: block; padding: 16px 0 14px; color: #fff; text-decoration: none; }
.kio-valmynd__heiti { font-size: clamp(34px, 10.5vw, 52px); font-weight: 800; line-height: 1; font-stretch: 112%; font-variation-settings: "wdth" 112; letter-spacing: -.01em; }
.kio-valmynd__listi a[aria-current] .kio-valmynd__heiti, .kio-valmynd__listi a:active .kio-valmynd__heiti { color: var(--wp--preset--color--raf); }
.kio-valmynd__botn { margin-top: auto; padding-top: 32px; animation: kio-lina-inn .45s .32s cubic-bezier(.2, .8, .2, 1) both; }
.kio-valmynd__takki { display: flex; justify-content: space-between; align-items: center; background: var(--wp--preset--color--raf); color: var(--kio-ink); font-weight: 800; font-size: 20px; padding: 18px 20px; text-decoration: none; }
.kio-valmynd__tenglar { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 18px 0 0; font-weight: 600; }
.kio-valmynd__tenglar a { color: #f7cfe1; text-decoration: none; }
@keyframes kio-valmynd-inn { from { opacity: 0; transform: translateY(-12px); } }
@keyframes kio-lina-inn { from { opacity: 0; transform: translateX(-24px); } }
@media (prefers-reduced-motion: reduce) {
  .kio-valmynd[open], .kio-valmynd__listi li, .kio-valmynd__botn { animation: none; }
}
.kio-kassi .has-large-font-size { line-height: 1.3 !important; }

/* Phones: page titles shrink with the screen so long one-word titles ("Fundargerðir") stay whole */
@media (max-width: 600px) {
  .kio-sidutitill h1 { --kio-titill: clamp(30px, 10vw, 44px); overflow-wrap: normal; }
}

/* Two focus boxes side by side: the poster date scales to the half width (container units in kio/kassi) */
.kio-tveir-fokusar > .kio-kassi { min-height: clamp(360px, 36vw, 520px); }
.kio-tveir-fokusar .is-style-risastort { font-size: min(var(--wp--preset--font-size--risastort), 24cqi) !important; }
/* Half-width boxes: the bolt behind the text is toned down so the text on it stays readable (as on phones) */
.kio-tveir-fokusar .kio-skraut--midja, .kio-kassi:has(.kio-dagskra) .kio-kassi__skraut { opacity: .45; }
.kio-tveir-fokusar .kio-skraut--haegri { top: auto; bottom: clamp(20px, 3vw, 40px); transform: none; height: 46%; }
@media (max-width: 600px) {
  .kio-tveir-fokusar .kio-kassi h3 { font-size: min(var(--wp--preset--font-size--x-large), 7.4cqi) !important; font-stretch: 100%; font-variation-settings: "wdth" 100; }
  .kio-tveir-fokusar .kio-kassi h2:not(.is-style-risastort) { font-size: min(34px, 11cqi) !important; }
}
.kio-tveir-fokusar .kio-kassi__efni > p:not(.is-style-merki) { max-width: 74%; }
@media (max-width: 600px) { .kio-tveir-fokusar .kio-kassi__efni > p:not(.is-style-merki) { max-width: none; } }

/* A news post's poster-shaped main image: whole, not cropped (functions.php) */
.kio-adalmynd--heil { max-width: 560px; }
.kio-adalmynd--heil img { height: auto !important; aspect-ratio: auto !important; }

/* Gallery captions under the photos, not over them (long Icelandic captions covered whole photos on phones) */
.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before { display: none; }
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  position: static; background: none; color: var(--kio-ink); text-shadow: none; max-height: none; overflow: visible;
  padding: 6px 0 0; font-size: 14px; line-height: 1.4; text-align: left;
}

/* Pagination: page numbers big enough to tap */
.wp-block-query-pagination { gap: 6px; flex-wrap: wrap; font-weight: 700; }
.wp-block-query-pagination .page-numbers, .wp-block-query-pagination-previous, .wp-block-query-pagination-next {
  display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; margin: 0 !important;
}
.wp-block-query-pagination .page-numbers.current { background: var(--wp--preset--color--plomma); color: #fff; }

/* Category descriptions (old content) may hold long bare links */
.kio-sidutitill .wp-block-term-description { overflow-wrap: anywhere; }
.kio-sidutitill .wp-block-term-description p + p { font-size: var(--wp--preset--font-size--medium); margin-top: 12px; } /* long descriptions: intro big, rest body size */