/*
 * FS startsida. Every section is a Group block with the class fs-section and
 * styles itself, so it looks right wherever it sits: on the page, in the
 * pattern preview, or on its own. The theme overrides directly below only
 * apply on a page containing at least one section.
 */

/* ---- AccessPress Root: hide its header, slider, title and footer ---------- */

body:has(.fs-section) {
  margin: 0 !important;
  background: #fff !important;
}

body:has(.fs-section) #masthead,
body:has(.fs-section) #nav,
body:has(.fs-section) #main-slider,
body:has(.fs-section) .page_header_wrap,
body:has(.fs-section) .entry-header,
body:has(.fs-section) #colophon,
body:has(.fs-section) .entry-footer {
  display: none !important;
}

body:has(.fs-section) #page,
body:has(.fs-section) #content,
body:has(.fs-section) #main,
body:has(.fs-section) #primary,
body:has(.fs-section) article,
body:has(.fs-section) .entry-content {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

/* The board cards are <article> elements too; undo the rule above for them. */
body:has(.fs-section) .fs-section article.fs-board-member {
  padding: 24px 0 28px !important;
}

/* ---- Base ---------------------------------------------------------------- */

/* Global, so they also reach pattern previews and blocks between sections. */
:root {
  --fs-ink: #1f2933;
  --fs-muted: #66717d;
  --fs-blue: #526b82;
  --fs-green: #6dcc30;
  --fs-line: #dde3e6;
  --fs-white: #fff;
  --fs-serif: "Iowan Old Style", Baskerville, "Times New Roman", serif;
  --fs-sans: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --fs-width: min(100% - 80px, 1360px);
}

/* Every section, and any plain block placed between sections, shares the
   page width and base typography. The theme overrides above make the content
   area full width, so centring each one is enough. */
.fs-section,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > :not(.fs-section) {
  position: relative;
  width: var(--fs-width);
  max-width: none;
  margin-inline: auto;
  color: var(--fs-ink);
  font-family: var(--fs-sans);
  -webkit-font-smoothing: antialiased;
}

.fs-section,
.fs-section * {
  box-sizing: border-box;
}

/* Classic themes get an extra inner <div> in every Group block. Taking it out
   of layout lets each Group's own grid or flex rules reach its children. */
.fs-section .wp-block-group__inner-container {
  display: contents;
}

.fs-section img {
  display: block;
  max-width: 100%;
  height: auto;
}

.fs-section figure.wp-block-image {
  margin: 0;
}

/* ---- Heading scale ------------------------------------------------------- */

/* Size follows the heading level, so choosing H3 instead of H2 in the editor
   makes a heading smaller. The designed headings further down keep their own
   size only at their original level (e.g. h2.fs-news-title); at any other
   level they fall back to this scale. H1 and H2 match the event and Aktuellt
   titles; each level below is roughly a quarter smaller. */
.fs-section h1.wp-block-heading,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > h1.wp-block-heading:not(.fs-section) {
  font-size: clamp(54px, 5vw, 82px);
}

.fs-section h2.wp-block-heading,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > h2.wp-block-heading:not(.fs-section) {
  font-size: clamp(40px, 4.2vw, 68px);
}

.fs-section h3.wp-block-heading,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > h3.wp-block-heading:not(.fs-section) {
  font-size: clamp(32px, 3.2vw, 50px);
}

.fs-section h4.wp-block-heading,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > h4.wp-block-heading:not(.fs-section) {
  font-size: clamp(26px, 2.4vw, 36px);
}

.fs-section h5.wp-block-heading,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > h5.wp-block-heading:not(.fs-section) {
  font-size: clamp(19px, 1.5vw, 22px);
}

.fs-section h6.wp-block-heading,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > h6.wp-block-heading:not(.fs-section) {
  font-size: 17px;
}

/* ---- Header -------------------------------------------------------------- */

.fs-section.fs-site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 92px;
  margin-block: 0;
  border-bottom: 1px solid var(--fs-line);
}

.fs-section .fs-logo {
  width: clamp(220px, 20vw, 305px);
}

.fs-section .fs-logo img {
  width: 100%;
}

.fs-section .fs-header-date {
  margin: 0;
  color: var(--fs-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* ---- Hero ---------------------------------------------------------------- */

.fs-section.fs-hero {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(48px, 5vw, 72px);
  align-items: center;
  min-height: calc(100vh - 92px);
  min-height: calc(100svh - 92px);
  margin-block: 0;
  padding: 24px 0;
}

.fs-section .fs-copy {
  position: relative;
  z-index: 3;
  max-width: 620px;
  margin: 0;
}

.fs-section .fs-kicker {
  margin: 0 0 18px;
  color: var(--fs-blue);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.2em;
  line-height: 1.6;
  text-transform: uppercase;
}

.fs-section .fs-kicker::before {
  display: inline-block;
  width: 34px;
  height: 1px;
  margin: 0 14px 4px 0;
  background: var(--fs-green);
  content: "";
}

.fs-section .fs-title {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.98;
}

.fs-section h1.fs-title {
  font-size: clamp(54px, 5vw, 82px);
}

.fs-section .fs-intro {
  max-width: 550px;
  margin: 22px 0 0;
  color: var(--fs-muted);
  font-size: 17px;
  line-height: 1.65;
}

/* Facts row: Tidpunkt · Plats · Program */

.fs-section .fs-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px clamp(22px, 2.6vw, 38px);
  margin: 26px 0 0;
  padding-top: 18px;
  border-top: 1px solid var(--fs-line);
}

.fs-section .fs-fact {
  margin: 0;
}

.fs-section .fs-fact-label {
  margin: 0 0 7px;
  color: var(--fs-blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.fs-section .fs-fact-value {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-size: clamp(14px, 1.45vw, 20px);
  line-height: 1.15;
  white-space: nowrap;
}

.fs-section .fs-fact-note {
  margin: 5px 0 0;
  color: var(--fs-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.fs-section .fs-fact-link a {
  color: var(--fs-ink);
  text-decoration: underline;
  text-decoration-color: var(--fs-green);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.fs-section .fs-fact-link a:hover,
.fs-section .fs-fact-link a:focus-visible {
  text-decoration-color: var(--fs-ink);
}

/* Price and deadline lines */

.fs-section .fs-terms {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin: 28px 0 0;
}

.fs-section .fs-terms + .fs-terms {
  margin-top: 5px;
}

.fs-section .fs-terms-label {
  flex: 0 0 auto;
  min-width: 104px;
  margin: 0;
  color: var(--fs-blue);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.fs-section .fs-terms-text {
  margin: 0;
  color: var(--fs-muted);
  font-size: 13px;
  line-height: 1.55;
}

.fs-section .fs-terms-text strong {
  color: var(--fs-ink);
  font-weight: 600;
}

/* Grapes panel with themes and registration QR code */

.fs-section .fs-grape-inline {
  position: relative;
  min-height: 224px;
  margin: 24px 0 0;
  overflow: hidden;
  border: 1px solid #e6ecef;
  border-radius: 18px;
  color: var(--fs-ink);
  background: #f4f8fb;
}

.fs-section .fs-grapes {
  position: absolute;
  inset: 0;
}

.fs-section .fs-grapes img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.fs-section .fs-grape-inline::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    90deg,
    transparent 29%,
    rgb(244 248 251 / 94%) 48%,
    rgb(244 248 251) 100%
  );
  content: "";
  pointer-events: none;
}

.fs-section .fs-themes {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 158px;
  width: 180px;
  margin: 0;
  transform: translateY(-50%);
}

.fs-section .fs-themes-label {
  margin: 0 0 11px;
  color: var(--fs-blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.fs-section .fs-theme-word {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-size: clamp(18px, 1.55vw, 23px);
  line-height: 1.15;
}

.fs-section .fs-theme-word::after {
  margin-left: 5px;
  color: var(--fs-green);
  content: "·";
}

.fs-section .fs-theme-word:last-child::after {
  content: "";
}

.fs-section .fs-more-info {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  margin: 0;
  transform: translateY(-50%);
}

.fs-section .fs-more-info-title {
  margin: 0;
  color: var(--fs-ink);
  font-size: 9px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.11em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.fs-section .fs-qr img {
  width: 120px;
  height: 120px;
  background: var(--fs-white);
}

.fs-section .fs-more-info-link {
  margin: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}

.fs-section .fs-more-info-link a {
  color: var(--fs-ink);
  text-decoration: underline;
  text-decoration-color: var(--fs-green);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.fs-section .fs-more-info-link a:hover,
.fs-section .fs-more-info-link a:focus-visible {
  text-decoration-color: var(--fs-ink);
}

/* Event coordinator and SFV partnership */

.fs-section .fs-event-contact {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  width: fit-content;
  max-width: 100%;
  margin: 14px 0 0;
  padding: 10px 0 0;
  border-top: 1px solid var(--fs-line);
}

.fs-section .fs-contact-label {
  margin: 0;
  color: var(--fs-blue);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.fs-section .fs-contact-details {
  margin: 0;
  color: var(--fs-ink);
  font-size: 14px;
  line-height: 1.35;
}

.fs-section .fs-contact-details strong {
  margin-right: 12px;
  font-weight: 500;
}

.fs-section .fs-partner {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 20px 0 0;
}

.fs-section .fs-partner-logo {
  flex: 0 0 auto;
  width: 42px;
}

.fs-section .fs-partner-text {
  margin: 0;
  color: var(--fs-muted);
  font-size: 13px;
  line-height: 1.45;
}

/* Speaker photo */

.fs-section .fs-speaker-panel {
  position: relative;
  min-height: clamp(500px, calc(100svh - 150px), 690px);
  margin: 0;
  overflow: hidden;
  border-radius: 22px;
  background: #f2f6f8;
}

.fs-section .fs-speaker-photo {
  position: absolute;
  inset: 0;
}

.fs-section .fs-speaker-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 34%;
  filter: saturate(0.96) contrast(1.02);
}

.fs-section .fs-speaker-panel::before {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(
      90deg,
      var(--fs-white) 0%,
      rgb(255 255 255 / 90%) 2%,
      transparent 17%,
      transparent 83%,
      rgb(255 255 255 / 90%) 98%,
      var(--fs-white) 100%
    ),
    linear-gradient(
      180deg,
      var(--fs-white) 0%,
      rgb(255 255 255 / 88%) 2%,
      transparent 15%,
      transparent 80%,
      rgb(255 255 255 / 92%) 97%,
      var(--fs-white) 100%
    );
  content: "";
  pointer-events: none;
}

.fs-section .fs-speaker-name {
  position: absolute;
  z-index: 2;
  bottom: 24px;
  left: 28px;
  margin: 0;
}

.fs-section .fs-speaker-label {
  margin: 0 0 6px;
  color: var(--fs-blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.fs-section .fs-speaker-title {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-size: clamp(34px, 3.4vw, 52px);
  font-weight: 400;
  line-height: 1;
}

/* ---- About FS ------------------------------------------------------------ */

.fs-section.fs-about-section {
  margin-block: 0;
  padding: 104px 0 0;
  border-top: 1px solid var(--fs-line);
}

/* With the event section deleted, About follows the header directly; one
   dividing line is enough. */
.fs-section.fs-site-header + .fs-about-section {
  border-top: 0;
}

.fs-section .fs-about-intro {
  display: grid;
  grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(52px, 7vw, 110px);
  align-items: start;
  margin: 0;
}

.fs-section .fs-about-heading {
  margin: 0;
}

.fs-section .fs-section-label {
  margin: 0 0 20px;
  color: var(--fs-blue);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.fs-section .fs-about-title {
  max-width: 480px;
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 0.98;
}

.fs-section h2.fs-about-title {
  font-size: clamp(48px, 5vw, 74px);
}

.fs-section .fs-about-copy {
  max-width: 760px;
  margin: 0;
  color: var(--fs-muted);
  font-size: 17px;
  line-height: 1.75;
}

/* One level more specific than the plain-paragraph rule further down, which
   would otherwise override this one (including its phone font size). */
.fs-section .fs-about-intro .fs-about-copy p {
  margin: 0 0 1.15em;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

.fs-section .fs-about-intro .fs-about-copy p:last-child {
  margin-bottom: 0;
}

/* Stats */

.fs-section .fs-stats-block {
  margin: 0;
}

.fs-section .fs-stats-intro {
  margin: 64px 0 -48px;
  color: var(--fs-muted);
  font-size: 15px;
  line-height: 1.6;
  text-align: center;
}

.fs-section .fs-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 70px 0 0;
  padding: 30px 0;
  border-top: 1px solid var(--fs-line);
  border-bottom: 1px solid var(--fs-line);
}

.fs-section .fs-stat {
  margin: 0;
  padding: 0 30px;
  text-align: center;
}

.fs-section .fs-stat:first-child {
  padding-left: 0;
}

.fs-section .fs-stat:last-child {
  padding-right: 0;
}

.fs-section .fs-stat + .fs-stat {
  border-left: 1px solid var(--fs-line);
}

.fs-section .fs-stat-number {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-size: clamp(38px, 4vw, 58px);
  font-weight: 400;
  line-height: 1;
}

.fs-section .fs-stat-label {
  margin: 8px 0 0;
  color: var(--fs-blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* Scripture */

.fs-section.fs-scripture {
  position: relative;
  margin-block: 82px;
  overflow: hidden;
  padding: clamp(40px, 6vw, 76px);
  border-radius: 22px;
  background:
    linear-gradient(90deg, rgb(244 248 251 / 98%), rgb(244 248 251 / 90%)),
    url("grapes-light.webp") left center / cover no-repeat;
}

.fs-section.fs-scripture::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 5px;
  background: var(--fs-green);
  content: "";
}

.fs-section .fs-scripture-text {
  max-width: 1080px;
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-size: clamp(22px, 2.25vw, 32px);
  line-height: 1.45;
}

.fs-section .fs-scripture-text + .fs-scripture-text {
  margin-top: 1.45em;
}

.fs-section .fs-scripture-cite {
  margin: 26px 0 0;
  color: var(--fs-blue);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* Board */

.fs-section.fs-board {
  margin-block: 0;
  padding: 0 0 110px;
}

.fs-section .fs-board-top {
  margin: 0;
}

.fs-section .fs-board-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin: 0 0 34px;
}

.fs-section .fs-board-title {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  letter-spacing: -0.03em;
}

.fs-section h3.fs-board-title {
  font-size: clamp(38px, 4vw, 56px);
}

.fs-section .fs-board-term {
  margin: 0 0 8px;
  color: var(--fs-blue);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.fs-section .fs-email-note {
  max-width: 760px;
  margin: -14px 0 30px;
  color: var(--fs-muted);
  font-size: 13px;
  line-height: 1.6;
}

.fs-section .fs-email-note strong {
  color: var(--fs-ink);
  font-weight: 600;
}

.fs-section .fs-board-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 34px;
  margin: 0;
}

.fs-section .fs-board-member {
  min-width: 0;
  margin: 0;
  padding: 24px 0 28px;
  border-top: 1px solid var(--fs-line);
}

.fs-section .fs-member-name {
  margin: 0;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  line-height: 1.2;
}

.fs-section h4.fs-member-name {
  font-size: 25px;
}

.fs-section .fs-member-role {
  min-height: 18px;
  margin: 6px 0 17px;
  color: var(--fs-blue);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.fs-section .fs-member-contact {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--fs-muted);
  font-size: 13px;
  line-height: 1.75;
}

.fs-section .fs-member-contact a {
  color: inherit;
  text-decoration: none;
}

.fs-section .fs-member-contact a:hover,
.fs-section .fs-member-contact a:focus-visible {
  color: var(--fs-ink);
  text-decoration: underline;
  text-decoration-color: var(--fs-green);
  text-underline-offset: 3px;
}

/* ---- Aktuellt (news) ---------------------------------------------------- */

.fs-section.fs-news {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(40px, 5vw, 80px);
  /* Top, not centre: the label stays level with the top of the image
     however long the text is. */
  align-items: start;
  margin-block: 0;
  padding-block: clamp(56px, 7vw, 104px);
}

.fs-section .fs-news-copy {
  max-width: 560px;
  margin: 0;
}

.fs-section .fs-news-title {
  margin: 0 0 24px;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.02;
}

.fs-section h2.fs-news-title {
  font-size: clamp(40px, 4.2vw, 68px);
}

/* The right column is a container: text can go under the image or replace
   it. Without the column at all, the text takes the full width. */
.fs-section .fs-news-media {
  margin: 0;
}

.fs-section .fs-news-media > * + *,
.fs-section .fs-news-media > .wp-block-group__inner-container > * + * {
  margin-top: 18px;
}

.fs-section.fs-news:not(:has(.fs-news-media)) {
  grid-template-columns: minmax(0, 1fr);
}

.fs-section.fs-news:not(:has(.fs-news-media)) .fs-news-copy {
  max-width: 760px;
}

.fs-section .fs-news-image img {
  width: 100%;
  border-radius: 22px;
}

.fs-section .fs-news-image figcaption {
  margin: 12px 0 0;
  color: var(--fs-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* ---- Image and text section --------------------------------------------- */

.fs-section.fs-feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(40px, 6vw, 90px);
  /* Top, not centre: the label stays level with the top of the image
     however long the text is. */
  align-items: start;
  margin-block: 82px;
}

/* Same two containers as Aktuellt: text can go under or instead of the image,
   and without the image column the text takes the full width. */
.fs-section .fs-feature-media {
  margin: 0;
}

.fs-section .fs-feature-media > * + *,
.fs-section .fs-feature-media > .wp-block-group__inner-container > * + * {
  margin-top: 18px;
}

.fs-section.fs-feature:not(:has(.fs-feature-media)) {
  grid-template-columns: minmax(0, 1fr);
}

.fs-section.fs-feature:not(:has(.fs-feature-media)) .fs-feature-copy {
  max-width: 760px;
}

.fs-section .fs-feature-image {
  overflow: hidden;
  border-radius: 22px;
}

.fs-section .fs-feature-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.fs-section .fs-feature-copy {
  margin: 0;
}

.fs-section .fs-feature-title {
  margin: 0 0 22px;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  letter-spacing: -0.03em;
  line-height: 1.02;
}

.fs-section h2.fs-feature-title {
  font-size: clamp(36px, 3.6vw, 54px);
}

/* ---- Plain blocks added by editors -------------------------------------- */

/* Anything without one of our fs- classes: a paragraph, heading, list or
   image someone inserts between sections or inside the text columns. */
.fs-section p:not([class*="fs-"]),
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > p:not([class*="fs-"]) {
  max-width: 760px;
  margin: 0 0 1.15em;
  color: var(--fs-muted);
  font-size: 17px;
  line-height: 1.7;
}

.fs-section :is(h1, h2, h3, h4, h5, h6):not([class*="fs-"]),
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > :is(h1, h2, h3, h4, h5, h6):not([class*="fs-"]) {
  margin: 1.4em 0 0.5em;
  color: var(--fs-ink);
  font-family: var(--fs-serif);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.fs-section :is(ul, ol):not([class*="fs-"]),
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > :is(ul, ol):not([class*="fs-"]) {
  max-width: 760px;
  margin: 0 0 1.15em;
  padding-left: 1.3em;
  color: var(--fs-muted);
  font-size: 17px;
  line-height: 1.7;
}

.fs-section figure.wp-block-image:not([class*="fs-"]),
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > figure.wp-block-image:not([class*="fs-"]) {
  margin: 56px 0;
}

.fs-section figure.wp-block-image:not([class*="fs-"]) img,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > figure.wp-block-image:not([class*="fs-"]) img {
  border-radius: 22px;
}

.fs-section figure.wp-block-image:not([class*="fs-"]) figcaption,
:where(.entry-content, .is-root-container):where(:has(> .fs-section)) > figure.wp-block-image:not([class*="fs-"]) figcaption {
  margin-top: 10px;
  color: var(--fs-muted);
  font-size: 13px;
}

.fs-section p:not([class*="fs-"]) a,
.fs-section li a {
  color: var(--fs-ink);
  text-decoration-color: var(--fs-green);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* ---- Tablet -------------------------------------------------------------- */

@media (max-width: 900px) {
  :root {
    --fs-width: min(100% - 40px, 700px);
  }

  .fs-section.fs-hero {
    grid-template-columns: 1fr;
    gap: 26px;
    min-height: 0;
    padding-top: 58px;
  }

  .fs-section .fs-copy {
    max-width: none;
  }

  /* The hero is one column here, so the facts have room again. */
  .fs-section .fs-fact-value {
    font-size: clamp(17px, 2.4vw, 21px);
  }

  .fs-section h1.fs-title {
    max-width: 700px;
    font-size: clamp(58px, 12vw, 86px);
  }

  .fs-section .fs-speaker-panel {
    min-height: min(760px, 112vw);
  }

  .fs-section .fs-grape-inline {
    max-width: 620px;
  }

  .fs-section.fs-about-section {
    padding-top: 80px;
  }

  .fs-section.fs-board {
    padding-bottom: 90px;
  }

  .fs-section.fs-feature,
  .fs-section.fs-news {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .fs-section .fs-news-copy {
    max-width: none;
  }

  .fs-section .fs-about-intro {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .fs-section .fs-about-copy {
    max-width: none;
  }

  .fs-section .fs-board-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ---- Phone --------------------------------------------------------------- */

@media (max-width: 540px) {
  :root {
    --fs-width: calc(100% - 32px);
  }

  .fs-section.fs-site-header {
    min-height: 90px;
  }

  .fs-section .fs-logo {
    width: 205px;
  }

  .fs-section .fs-header-date {
    display: none;
  }

  .fs-section.fs-hero {
    min-height: 0;
    padding: 46px 0 34px;
  }

  .fs-section .fs-kicker {
    font-size: 10px;
  }

  .fs-section .fs-kicker::before {
    width: 24px;
    margin-right: 9px;
  }

  .fs-section h1.fs-title {
    font-size: clamp(51px, 15.5vw, 70px);
  }

  .fs-section .fs-intro {
    margin-top: 25px;
    font-size: 15px;
  }

  .fs-section .fs-facts {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 30px;
  }

  .fs-section .fs-fact + .fs-fact {
    padding-top: 20px;
    border-top: 1px solid var(--fs-line);
  }

  .fs-section .fs-speaker-panel {
    min-height: 122vw;
  }

  .fs-section .fs-speaker-photo img {
    object-position: 50% 30%;
  }

  .fs-section .fs-speaker-name {
    bottom: 22px;
    left: 18px;
  }

  .fs-section .fs-speaker-title {
    font-size: 36px;
  }

  .fs-section .fs-grape-inline {
    min-height: 310px;
  }

  .fs-section .fs-theme-word {
    font-size: 24px;
  }

  .fs-section .fs-themes {
    right: 150px;
    width: 155px;
  }

  .fs-section .fs-more-info {
    right: 16px;
  }

  .fs-section .fs-qr img {
    width: 118px;
    height: 118px;
  }

  .fs-section .fs-event-contact {
    padding-top: 10px;
  }

  .fs-section.fs-about-section {
    padding-top: 68px;
  }

  .fs-section.fs-board {
    padding-bottom: 72px;
  }

  .fs-section.fs-feature {
    margin-block: 58px;
  }

  .fs-section.fs-news {
    padding-block: 46px 34px;
  }

  .fs-section h2.fs-about-title {
    font-size: 48px;
  }

  .fs-section .fs-about-copy {
    font-size: 15px;
    line-height: 1.7;
  }

  .fs-section .fs-stats {
    grid-template-columns: 1fr;
    margin-top: 48px;
    padding: 0;
  }

  .fs-section .fs-stats-intro {
    margin: 42px 0 -28px;
  }

  .fs-section .fs-stat {
    padding: 24px 0;
  }

  .fs-section .fs-stat + .fs-stat {
    border-top: 1px solid var(--fs-line);
    border-left: 0;
  }

  .fs-section.fs-scripture {
    margin-block: 58px;
    padding: 34px 28px;
    border-radius: 16px;
  }

  .fs-section .fs-scripture-text {
    font-size: 22px;
  }

  .fs-section .fs-board-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .fs-section .fs-board-grid {
    grid-template-columns: 1fr;
  }
}

/* ---- Editor canvas ------------------------------------------------------- */

/* Lift the editor's default 840px cap on blocks inside sections. */
.editor-styles-wrapper .fs-section.wp-block,
.editor-styles-wrapper .fs-section .wp-block {
  max-width: none;
}

/* The editor wraps resizable images in an extra box; let cover images fill. */
.editor-styles-wrapper .fs-section :is(.fs-grapes, .fs-speaker-photo) .components-resizable-box__container {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
}

/* ---- Editor choices win -------------------------------------------------- */

/* A few labels are centred by design. Text alignment picked in the editor's
   toolbar must still apply, so these come last at equal strength. */
.fs-section .has-text-align-left { text-align: left; }
.fs-section .has-text-align-center { text-align: center; }
.fs-section .has-text-align-right { text-align: right; }