/* Litir ársins page styles */

/* 1. Hero – 2-column split: grey-green left, image right
   Matches the info-hero pattern from info-pages.css */
.ser-litir-hero {
  background: transparent;
  display: flex;
  align-items: stretch;
  height: 640px;
  min-height: 400px;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  overflow: visible;
  position: relative;
  margin-bottom: 150px;
}

.ser-litir-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 53%;
  height: 100%;
  background: #545B5C;
  z-index: 0;
}

.ser-litir-hero__image {
  position: relative;
  z-index: 1;
}

/* Gutenberg wraps group blocks in an inner container — make it flex too.
   Doubled class selector beats WP core's .is-layout-flow rule. */
.ser-litir-hero > .wp-block-group__inner-container.wp-block-group__inner-container {
  display: flex;
  align-items: stretch;
  width: 100%;
}

/* Left side: title area */
.ser-litir-hero__title {
  flex: 0 0 53%;
  display: flex;
  align-items: flex-end;
  max-width: 53%;
  padding: 40px 40px 50px 101px;
  font-size: 62px;
  font-weight: 500;
  color: #fff;
  margin: 0;
  letter-spacing: 1.7px;
  line-height: 80px;
  font-family: "ivypresto-display", serif;
  position: relative;
  z-index: 1;
}

/* Right side: hero image — narrower, taller, overflows container */
.ser-litir-hero__image {
  flex: 0 0 auto;
  width: 544px;
  height: 816px;
  object-fit: fill;
  display: block;
  margin-right: 130px;
  border-radius: 0;
}

/* Year sections */
.ser-litir-year {
  max-width: 1204px;
  margin: 0 auto 20px;
  padding: 116px 40px 65px;
}

.ser-litir-year:last-child {
  border-bottom: none;
}

.ser-litir-year__heading {
  font-family: "ivypresto-display", serif !important;
  font-size: 41px !important;
  font-weight: 500 !important;
  line-height: 41px !important;
  color: #545b5c;
  margin: 0 0 70px;
  letter-spacing: 2px;
}

# 022 .ser-litir-year__heading,
# 021 .ser-litir-year__heading,
# 020 .ser-litir-year__heading,
# 019 .ser-litir-year__heading,
# 018 .ser-litir-year__heading {
  font-family: "ivypresto-display", serif !important;
  font-weight: 500 !important;
}

# 021 .ser-litir-year__heading,
# 022 .ser-litir-year__heading {
  margin-bottom: 0px !important;
}

.ser-litir-year__text {
  font-family: granville, serif !important;
  font-size: 15px !important;
  line-height: 28px;
  color: rgb(72, 72, 72);
  margin: 0 0 10px;
  
}

.ser-litir-year__text em {
  font-size: 15px;
  font-style: normal;
  color: rgb(72, 72, 72);
}

.ser-litir-year__palette {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 30px auto 20px;
  border-radius: 0;
}

/* Color story sections */
.ser-litir-story {
  max-width: 1204px;
  margin: 0 auto;
  padding: 131px 40px 84px;
  text-align: center;
}

.ser-litir-story__text {
  text-align: left;
}

.ser-litir-story__heading {
  font-family: "ivypresto-display", serif !important;
  font-size: 41px !important;
  font-weight: 400 !important;
  color: #545b5c;
  margin: 0 0 15px;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-align: center;
}

.ser-litir-story__subheading {
  font-family: granville, serif;
  font-size: 20px;
  font-weight: 700;
  font-style: normal;
  line-height: 30px;
  text-transform: uppercase;
  color: #545b5c;
  margin: 0 0 16px;
  text-align: left;
}

.ser-litir-story__text {
  font-family: granville, serif !important;
  font-size: 15px !important;
  line-height: 28px;
  color: rgb(72, 72, 72);
  margin: 0 0 10px;
  
}

.ser-litir-story__caption {
  font-family: granville, serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  font-style: italic;
  line-height: 28px;
  color: rgb(72, 72, 72);
  margin: 20px 0 30px;
  text-align: left;
}

/* Image grid for color stories */
.ser-litir-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 30px;
  }

.ser-litir-grid img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0;

}

.ser-litir-grid img:hover {
  transform: none;
}

.ser-litir-grid figure {
  margin: 0;
}

.ser-litir-grid figure img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 0;
}

.ser-litir-grid figcaption {
  font-family: "Roboto", sans-serif;
  font-size: 11.375px;
  font-weight: 500;
  font-style: italic;
  line-height: 28px;
  color: rgb(104, 104, 104);
  margin-top: 0;
}

/* Palette image within story */
.ser-litir-story__palette-img {
  max-width: 1000px;
  height: auto;
  display: block;
  margin: 30px auto 20px;
  border-radius: 0;
}

/* Featured/overview image displayed full-width before gallery grid */
.ser-litir-story__featured-img {
  max-width: 768px;
  height: auto;
  display: block;
  margin: 30px auto 20px;
  border-radius: 4px;
}

/* 2-column layout for older year sections */
.ser-litir-year--compact {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  align-items: start;
}

.ser-litir-year--compact .ser-litir-year__content {
  grid-column: 1;
}

.ser-litir-year--compact .ser-litir-year__image {
  grid-column: 2;
}

.ser-litir-year--compact .ser-litir-year__image img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

/* Booklet layout for 2018-2020 sections */
.ser-litir-booklet {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  margin-top: 20px;
}

.ser-litir-booklet a {
  flex: 0 0 auto;
}

.ser-litir-booklet a img {
  width: 150px;
  height: auto;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

.ser-litir-booklet > img {
  width: 250px;
  height: auto;
  border-radius: 4px;
}

/* Combined palette sections (like 2023 with 4 palettes) */
.ser-litir-palettes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 24px;
}

.ser-litir-palette-item {
  background: #f6f4f4;
  border-radius: 4px;
  padding: 20px;
}

.ser-litir-palette-item h3 {
  font-family: granville, serif;
  font-size: 18px;
  font-weight: 400;
  color: #2b2b2b;
  margin: 0 0 6px;
  text-transform: uppercase;
}

.ser-litir-palette-item h4 {
  font-family: granville, serif;
  font-size: 14px;
  font-weight: 400;
  color: #545b5c;
  margin: 0 0 12px;
}

.ser-litir-palette-item p {
  font-family: granville, serif;
  font-size: 14px;
  line-height: 1.6;
  color: #545b5c;
  margin: 0 0 16px;
}

.ser-litir-palette-item img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}


/* Scoped year heading overrides for 2018-2022 */
/* scoped rules removed - all year headings now ivypresto */

[id="2022"] > .ser-litir-year__heading {
  margin-bottom: 20px !important;
}

[id="2021"] > .ser-litir-year__heading,
[id="2020"] > .ser-litir-year__heading,
[id="2019"] > .ser-litir-year__heading,
[id="2018"] > .ser-litir-year__heading {
  margin-bottom: 0 !important;
}


/* Extra spacing for 2020/2019 year sections */
[id="2020"],
[id="2019"] {
  padding-bottom: 70px !important;
}

[id="2021"] {
  padding-bottom: 30px !important;
}


/* Override parent container width for litir-arsins page */
body.page-id-8588 .woostify-container.container-fluid {
  max-width: 1204px !important;
}


/* 2022 section: text left, room image right */
.ser-litir-year--2col {
  display: flex;
  gap: 30px;
  align-items: flex-start;
  margin-top: 20px;
}

.ser-litir-year--2col__text {
  flex: 1;
}

.ser-litir-year--2col__img {
  flex: 0 0 600px;
}

.ser-litir-year--2col__img img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}


/* Booklet cover image */
.ser-litir-booklet__cover {
  width: 200px;
  height: auto;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12);
  margin-top: 16px;
}


/* Compact story spacing for sub-palette sections */
.ser-litir-story--compact {
  padding-top: 37px !important;
  padding-bottom: 79px !important;
}


/* Compact story after a year section gets normal heading spacing */
.ser-litir-year + .ser-litir-story--compact {
  padding-top: 131px !important;
}

@media (max-width: 1024px) {
  .ser-litir-grid {
    grid-template-columns: repeat(2, 1fr);
    max-width: 100%;
  }

  .ser-litir-year--compact {
    grid-template-columns: 1fr;
  }

  .ser-litir-year--compact .ser-litir-year__image {
    grid-column: 1;
  }
}

@media (max-width: 768px) {
  .ser-litir-hero {
    height: auto;
    min-height: 260px;
    max-height: none;
  }

  .ser-litir-hero > .wp-block-group__inner-container.wp-block-group__inner-container {
    flex-direction: column;
  }

  .ser-litir-hero__title {
    font-size: 36px;
    max-width: 100%;
    padding: 30px 20px;
    align-items: flex-start;
  }

  .ser-litir-hero__image {
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    max-height: 300px;
    margin-right: 0;
    object-fit: cover;
  }

  .ser-litir-year,
  .ser-litir-story {
    padding: 30px 20px;
  }

  .ser-litir-year__heading {
    font-size: 26px;
  }

  .ser-litir-story__heading {
    font-size: 20px;
  }

  .ser-litir-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ser-litir-palettes {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

@media (max-width: 480px) {
  .ser-litir-hero__title {
    font-size: 26px;
  }

  .ser-litir-grid {
    grid-template-columns: 1fr;
  }
}
/* 2026 + 2025 headings use granville 400 */
.ser-litir-heading--granville {
  font-family: granville, serif !important;
  font-weight: 400 !important;
}

/* -- Gutenberg block compatibility (v3) --
   Neutralize ALL wp-block-* defaults so ser-litir-* CSS controls layout. */

/* Groups: zero out WP defaults, inherit ser-litir-* layout */
body.page-id-8588 .wp-block-group.ser-litir-year,
body.page-id-8588 .wp-block-group.ser-litir-story,
body.page-id-8588 .wp-block-group.ser-litir-story.ser-litir-story--compact {
  border: none !important;
  box-shadow: none !important;
  background: none !important;
}
body.page-id-8588 .wp-block-group > .wp-block-group__inner-container {
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Headings: override global h2.wp-block-heading ivypresto rule */
body.page-id-8588 h2.wp-block-heading.ser-litir-year__heading {
  font-family: "ivypresto-display", serif !important;
  font-size: 41px !important;
  font-weight: 500 !important;
  line-height: 41px !important;
  color: #545b5c !important;
  margin: 0 0 70px !important;
  padding: 0 !important;
  letter-spacing: 2px !important;
  text-align: left !important;
}
body.page-id-8588 h2.wp-block-heading.ser-litir-heading--granville {
  font-family: granville, serif !important;
  font-weight: 400 !important;
}
body.page-id-8588 h2.wp-block-heading.ser-litir-story__heading {
  font-family: ivypresto-display, serif !important;
  font-size: 41px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: #545b5c !important;
  margin: 0 0 15px !important;
  padding: 0 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  text-align: center !important;
}
body.page-id-8588 h4.wp-block-heading.ser-litir-story__subheading {
  font-family: granville, serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  font-style: normal !important;
  line-height: 30px !important;
  text-transform: uppercase !important;
  color: #545b5c !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  text-align: left !important;
}

/* Paragraphs: ensure no WP overrides */
body.page-id-8588 p.ser-litir-year__text,
body.page-id-8588 p.ser-litir-story__text {
  font-family: granville, serif !important;
  font-size: 15px !important;
  line-height: 28px !important;
  color: rgb(72, 72, 72) !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
}
body.page-id-8588 p.ser-litir-story__caption {
  font-family: granville, serif !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  font-style: italic !important;
  line-height: 28px !important;
  color: rgb(72, 72, 72) !important;
  margin: 20px 0 30px !important;
  text-align: left !important;
}

/* Images in figure wrappers: match original bare <img> sizing */
body.page-id-8588 figure.wp-block-image.ser-litir-hero__image {
  margin: 0 130px 0 0 !important;
  padding: 0 !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  width: 544px !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-hero__image img {
  width: 544px !important;
  height: 816px !important;
  object-fit: fill !important;
  display: block !important;
  border-radius: 0 !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-year__palette {
  max-width: 100% !important;
  margin: 30px auto 20px !important;
  padding: 0 !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-year__palette img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 0 !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-story__palette-img {
  max-width: 1000px !important;
  margin: 30px auto 20px !important;
  padding: 0 !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-story__palette-img img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 0 !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-story__featured-img {
  max-width: 768px !important;
  margin: 30px auto 20px !important;
  padding: 0 !important;
}
body.page-id-8588 figure.wp-block-image.ser-litir-story__featured-img img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 4px !important;
}

/* Year-specific heading overrides (from original CSS) */
body.page-id-8588 [id=2022] > h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 .wp-block-group[id=2022] > .wp-block-group__inner-container > h2.wp-block-heading.ser-litir-year__heading {
  margin-bottom: 20px !important;
}
body.page-id-8588 [id=2021] > h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 [id=2020] > h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 [id=2019] > h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 [id=2018] > h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 .wp-block-group[id=2021] h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 .wp-block-group[id=2020] h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 .wp-block-group[id=2019] h2.wp-block-heading.ser-litir-year__heading,
body.page-id-8588 .wp-block-group[id=2018] h2.wp-block-heading.ser-litir-year__heading {
  margin-bottom: 0 !important;
}

/* Fix figure width to match original bare img auto-sizing */
body.page-id-8588 figure.wp-block-image.ser-litir-year__palette,
body.page-id-8588 figure.wp-block-image.ser-litir-story__palette-img,
body.page-id-8588 figure.wp-block-image.ser-litir-story__featured-img {
  width: fit-content !important;
}

/* Gallery blocks replacing ser-litir-grid � match original 2-column grid layout */
body.page-id-8588 .wp-block-gallery.ser-litir-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 24px !important;
  margin-top: 30px !important;
  margin-bottom: 0 !important;
  max-width: none !important;
}
body.page-id-8588 .wp-block-gallery.ser-litir-grid .wp-block-image {
  margin: 0 !important;
  width: 100% !important;
}
body.page-id-8588 .wp-block-gallery.ser-litir-grid .wp-block-image img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 0 !important;
}
body.page-id-8588 .wp-block-gallery.ser-litir-grid .wp-block-image figcaption,
body.page-id-8588 .wp-block-gallery.ser-litir-grid .wp-element-caption {
  font-family: 'Roboto', sans-serif !important;
  font-size: 11.375px !important;
  font-weight: 500 !important;
  font-style: italic !important;
  line-height: 28px !important;
  color: rgb(104, 104, 104) !important;
  margin-top: 0 !important;
  position: static !important;
  background: none !important;
  padding: 0 !important;
  text-align: left !important;
}

/* wp:columns replacing ser-litir-year--2col */
body.page-id-8588 .wp-block-columns.ser-litir-year--2col {
  display: flex !important;
  gap: 30px !important;
  align-items: flex-start !important;
  margin-top: 20px !important;
  flex-wrap: nowrap !important;
}
body.page-id-8588 .wp-block-columns.ser-litir-year--2col > .wp-block-column:first-child {
  flex: 1 !important;
}
body.page-id-8588 .wp-block-columns.ser-litir-year--2col > .wp-block-column:last-child {
  flex: 0 0 564px !important;
}
body.page-id-8588 .wp-block-columns.ser-litir-year--2col img {
  width: 100% !important;
  height: auto !important;
  border-radius: 4px !important;
}
/* Spacing between stacked images in 2col right column (replaces inline margin-top:16px) */
body.page-id-8588 .wp-block-columns.ser-litir-year--2col .wp-block-column .wp-block-image + .wp-block-image {
  margin-top: 16px !important;
}
/* Booklet cover images inside columns */
body.page-id-8588 .wp-block-columns.ser-litir-year--2col .ser-litir-booklet__cover,
body.page-id-8588 .wp-block-column .ser-litir-booklet__cover {
  width: 200px !important;
  height: auto !important;
  border-radius: 4px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
  margin-top: 16px !important;
}
/* Minimize margin below heading inside 2col left column (2018-2020) */
body.page-id-8588 .wp-block-columns.ser-litir-year--2col h2.wp-block-heading.ser-litir-year__heading {
  margin-bottom: 20px !important;
}
