/* ==========================================================================
   Horticulture Work - component styles.
   Tokens (colour, type, spacing, radius, elevation) live in theme.json and
   are referenced here as WP presets. Never redeclare --c-* style tokens.
   Triaged from site/styles.css in the handoff bundle.
   ========================================================================== */

/* ---- Focus (visible on every interactive element; non-negotiable) ---- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--wp--preset--color--focus);
  outline-offset: 2px;
  border-radius: var(--wp--custom--radius--sm);
}

/* ---- Motion off switch (non-negotiable) ---- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .card,
  .card:hover {
    transform: none;
  }
}

body {
  -webkit-font-smoothing: antialiased;
}

/* ---- Buttons: shared polish + style variations ---- */
.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--wp--preset--spacing--20);
  min-height: 48px;
  font-weight: 800;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.is-style-ghost .wp-block-button__link {
  background: var(--wp--preset--color--primary-soft);
  color: var(--wp--preset--color--primary);
}
.is-style-ghost .wp-block-button__link:hover {
  background: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
}
.is-style-green-light .wp-block-button__link {
  background: var(--wp--preset--color--success);
  color: var(--wp--preset--color--white);
}
.is-style-green-light .wp-block-button__link:hover {
  background: #256642;
  color: var(--wp--preset--color--white);
}
.is-style-secondary .wp-block-button__link {
  background: transparent;
  color: var(--wp--preset--color--primary);
  border: 2px solid var(--wp--preset--color--primary);
  padding-top: 12px;
  padding-bottom: 12px;
}
.is-style-secondary .wp-block-button__link:hover {
  background: var(--wp--preset--color--primary-soft);
  color: var(--wp--preset--color--primary);
}
/* Secondary on a dark green band */
.band--green .is-style-secondary .wp-block-button__link {
  color: var(--wp--preset--color--white);
  border-color: var(--wp--preset--color--white);
}
.band--green .is-style-secondary .wp-block-button__link:hover {
  background: rgba(255, 255, 255, 0.12);
}

/* ---- Sticky header ---- */
.site-header {
  border-bottom: 1px solid var(--wp--preset--color--neutral-200);
  z-index: 30;
}
.site-header .wp-block-site-title a {
  text-decoration: none;
  white-space: nowrap;
}
.site-header .wp-block-navigation a:where(:not(.wp-element-button)):hover {
  color: var(--wp--preset--color--primary);
}
.brand-mark {
  width: 34px;
  height: 34px;
  flex: none;
}
/* The reference collapses its header at 980px (site/styles.css .nav/.nav-toggle):
   below that the inline nav and Register button hide, the hamburger shows, and
   Register lives in the drawer. Core's own overlay breakpoint is 600px, so
   between 600px and 979px we force the hamburger + overlay to stay active. */
@media (max-width: 979.98px) {
  .site-header .wp-block-buttons {
    display: none;
  }
}
@media (min-width: 600px) and (max-width: 979.98px) {
  .site-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex;
  }
  .site-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
    display: none;
  }
}
/* Language picker placeholder (Polylang later) */
.lang-chip {
  display: inline-flex;
  align-items: center;
  border: 1.5px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--pill);
  padding: 5px 12px;
  font-weight: 600;
  font-size: 13px;
  min-height: 36px;
}

/* ---- Eyebrow ---- */
.eyebrow {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  font-size: 13px;
  color: var(--wp--preset--color--primary);
  background: var(--wp--preset--color--primary-soft);
  padding: 8px 14px;
  border-radius: var(--wp--custom--radius--pill);
}
.eyebrow--clay {
  color: var(--wp--preset--color--accent-dark);
  background: var(--wp--preset--color--accent-soft);
}

/* ---- Photos ---- */
.photo img,
img.photo {
  object-fit: cover;
  width: 100%;
}
.hero-photo img {
  height: clamp(240px, 40vw, 420px);
  border-radius: var(--wp--custom--radius--lg);
  object-fit: cover;
  width: 100%;
}
.feature-photo img {
  height: clamp(200px, 36vw, 320px);
  border-radius: var(--wp--custom--radius--lg);
  object-fit: cover;
  width: 100%;
}
.feature-photo--wide img {
  height: clamp(200px, 40vw, 360px);
  border-radius: var(--wp--custom--radius--lg);
  object-fit: cover;
  width: 100%;
}
.post-hero img {
  height: clamp(220px, 42vw, 400px);
  border-radius: var(--wp--custom--radius--lg);
  object-fit: cover;
  width: 100%;
}

/* ---- Trust strip ---- */
.trust {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--md);
  overflow: hidden;
}
.trust > div {
  padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);
  text-align: center;
  border-right: 1px solid var(--wp--preset--color--neutral-200);
}
.trust > div:last-child {
  border-right: none;
}
.trust b {
  display: block;
  font-family: var(--wp--preset--font-family--display);
  font-size: 20px;
  color: var(--wp--preset--color--primary);
}
.trust span {
  font-weight: 600;
  font-size: 12px;
  color: var(--wp--preset--color--neutral-600);
}

/* ---- Cards ---- */
.card {
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--md);
  overflow: hidden;
  transition: transform 0.15s, box-shadow 0.15s;
}
.card:hover {
  transform: translateY(-2px);
  box-shadow: var(--wp--custom--elevation--high);
}
.card-link,
.card-link:hover {
  text-decoration: none;
  color: inherit;
}
.tile__photo img {
  height: 140px;
  object-fit: cover;
  width: 100%;
}
.tile__label {
  padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
  font-weight: 700;
}
.card__h {
  font-family: var(--wp--preset--font-family--display);
  font-size: 1.15rem;
  line-height: 1.2;
  letter-spacing: -0.01em;
}
.card__h--lg {
  font-size: 1.6rem;
}
.card__meta {
  color: var(--wp--preset--color--neutral-500);
  font-size: 14px;
}

/* ---- Benefit cards ---- */
.benefit {
  padding: var(--wp--preset--spacing--50);
}
.benefit__icon {
  width: 44px;
  height: 44px;
  border-radius: var(--wp--custom--radius--md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
  background: var(--wp--preset--color--primary-soft);
  color: var(--wp--preset--color--primary);
}
.benefit__icon--clay {
  background: var(--wp--preset--color--accent-soft);
  color: var(--wp--preset--color--accent-dark);
}
.benefit h3 {
  font-family: var(--wp--preset--font-family--sans);
  font-size: 18px;
}
.benefit p {
  color: var(--wp--preset--color--neutral-600);
  font-size: 14px;
}

/* ---- Vacancy cards + pills + tags ---- */
.vacancy-card {
  padding: var(--wp--preset--spacing--50);
}
.vacancy-row {
  display: flex;
  gap: var(--wp--preset--spacing--20);
  align-items: center;
}
.pill,
.pill a {
  display: inline-flex;
  font-weight: 700;
  font-size: 11px;
  color: var(--wp--preset--color--white);
  background: var(--wp--preset--color--primary);
  padding: 5px 10px;
  border-radius: var(--wp--custom--radius--sm);
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-decoration: none;
}
.pill a {
  padding: 0;
}
.meta {
  font-weight: 600;
  font-size: 12px;
  color: var(--wp--preset--color--neutral-600);
}
.vacancy-card h3 {
  font-size: 22px;
}
.vacancy-card h3 a {
  color: inherit;
  text-decoration: none;
}
.vacancy__desc {
  font-size: 13px;
  color: var(--wp--preset--color--neutral-600);
  line-height: 1.5;
}
.tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--20);
}
.tag {
  font-weight: 600;
  font-size: 12px;
  color: var(--wp--preset--color--neutral-600);
  background: var(--wp--preset--color--bg-alt);
  padding: 5px 10px;
  border-radius: var(--wp--custom--radius--sm);
}

/* ---- Chips (as plain links on the opportunities filter) ---- */
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--20);
}
.chips a,
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  font-size: 13px;
  color: var(--wp--preset--color--neutral-700);
  background: var(--wp--preset--color--white);
  border: 1.5px solid var(--wp--preset--color--neutral-300);
  padding: 9px 14px;
  border-radius: var(--wp--custom--radius--pill);
  min-height: 40px;
  text-decoration: none;
}
.chips a:hover {
  border-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--primary);
}
.chips a.is-current {
  background: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
}

/* ---- Card category chip (blog) ---- */
.card-category {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  font-size: 12px;
  color: var(--wp--preset--color--accent-dark);
  background: var(--wp--preset--color--accent-soft);
  padding: 4px 10px;
  border-radius: var(--wp--custom--radius--pill);
}
.card-category a {
  color: inherit;
  text-decoration: none;
}

/* ---- Page + section headers ---- */
.page-header__title {
  font-size: clamp(1.875rem, 5vw, 2.5rem);
  text-wrap: balance;
}
.page-header__lede {
  color: var(--wp--preset--color--neutral-600);
  max-width: 34em;
  text-wrap: pretty;
}
/* Constrained layout auto-centres narrower children; the lede stays left-aligned */
.is-layout-constrained > .page-header__lede {
  margin-left: 0 !important;
}
.section-header__title {
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  text-wrap: balance;
}

/* ---- Checked list (vacancy responsibilities) ---- */
.list-check {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--wp--preset--spacing--30);
}
.list-check li {
  display: flex;
  gap: 11px;
  align-items: flex-start;
}
.list-check li::before {
  content: "\2713";
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: var(--wp--preset--color--primary-soft);
  color: var(--wp--preset--color--primary);
  font-weight: 800;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}

/* ---- Vacancy single ---- */
/* Spans the content column; the capped tracks keep the pair left-aligned at ~420px
   (the constrained layout would centre a capped-width child). */
.vacancy-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 210px));
  gap: var(--wp--preset--spacing--30);
}
.vacancy-stats > * {
  /* The flow layout's default block gap would stagger the second cell. */
  margin-block-start: 0;
}
.vacancy-stat {
  padding: var(--wp--preset--spacing--40);
}
.vacancy-stat__label {
  font-size: 12px;
  font-weight: 600;
  color: var(--wp--preset--color--neutral-500);
}
.vacancy-stat__value {
  font-weight: 700;
  font-size: 16px;
  margin-top: 4px;
}
.vacancy-callout {
  background: var(--wp--preset--color--primary-soft);
  border-radius: var(--wp--custom--radius--md);
  padding: var(--wp--preset--spacing--40);
}
.vacancy-callout strong {
  color: var(--wp--preset--color--primary-dark);
}

/* ---- Back link ---- */
.back-link a {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  color: var(--wp--preset--color--primary);
}
.back-link a:hover {
  text-decoration: underline;
}

/* ---- CTA band (rounded green card) ---- */
.cta-band {
  border-radius: var(--wp--custom--radius--lg);
}

/* Full-width bands (e.g. the closing "Ready when you are" cta-band pattern)
   inside post-content (page.html's <main> wraps page content in post-content,
   with its own bottom padding meant for ordinary text). That padding shows
   through as a cream gap when a full-bleed band is the last thing on the
   page - pull the band down to close it instead. front-page.html embeds
   patterns straight into <main> with no such padding, so needs no offset here. */
.wp-block-post-content > .alignfull:last-child {
  margin-bottom: calc(-1 * var(--wp--preset--spacing--80));
}
/* Root-level template-part rhythm (--wp--style--block-gap, 24px) still leaves
   a sliver between <main> and the footer in that same case - invisible on
   ordinary cream-on-cream pages, but a visible seam between two colour
   blocks here, so close it only when the page ends in a full-bleed band. */
main.wp-block-group:has(> .alignfull:last-child) + footer.wp-block-template-part,
main.wp-block-group:has(> .wp-block-post-content > .alignfull:last-child) + footer.wp-block-template-part {
  margin-top: 0;
}

/* ---- Empty state ---- */
.empty-state {
  border: 1.5px dashed var(--wp--preset--color--neutral-300);
  background: var(--wp--preset--color--bg-alt);
  border-radius: var(--wp--custom--radius--lg);
  text-align: center;
}
.empty-state h3 {
  font-family: var(--wp--preset--font-family--sans);
  font-size: 1.1rem;
}
.empty-state p {
  color: var(--wp--preset--color--neutral-600);
}

/* ---- Newsletter card ---- */
.news-card {
  border-radius: var(--wp--custom--radius--lg);
  overflow: hidden;
}
.news-card__photo img {
  height: 200px;
  object-fit: cover;
  width: 100%;
}

/* ---- FAQ accordion (core/details) ---- */
.wp-block-details {
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--md);
  overflow: hidden;
}
.wp-block-details + .wp-block-details {
  margin-top: var(--wp--preset--spacing--30);
}
.wp-block-details summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--wp--preset--spacing--40);
  padding: 18px;
  font-family: var(--wp--preset--font-family--sans);
  font-weight: 700;
  font-size: 1.05rem;
  cursor: pointer;
}
.wp-block-details summary::-webkit-details-marker {
  display: none;
}
.wp-block-details summary::after {
  content: "+";
  font-size: 22px;
  color: var(--wp--preset--color--primary);
  flex: none;
  transition: transform 0.15s;
}
.wp-block-details[open] summary::after {
  transform: rotate(45deg);
}
.wp-block-details > :not(summary) {
  padding: 0 18px;
  color: var(--wp--preset--color--neutral-700);
  max-width: 60em;
}
.wp-block-details > :last-child:not(summary) {
  padding-bottom: 18px;
}

/* ---- Form placeholders (Fluent Forms owns the real thing) ---- */
.form-shell {
  max-width: 560px;
  margin-inline: auto;
}
.field {
  margin-bottom: var(--wp--preset--spacing--40);
}
.field label {
  display: block;
  font-weight: 600;
  font-size: 13px;
  margin-bottom: 6px;
}
.input,
.textarea {
  width: 100%;
  background: var(--wp--preset--color--white);
  border: 1.5px solid var(--wp--preset--color--neutral-300);
  border-radius: var(--wp--custom--radius--sm);
  padding: 13px;
  font: 400 15px/1.4 var(--wp--preset--font-family--sans);
  color: var(--wp--preset--color--ink);
}
.textarea {
  min-height: 96px;
  resize: vertical;
}
.steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--wp--preset--spacing--20);
}
.step {
  flex: 1;
  max-width: 120px;
  text-align: center;
}
.step__dot {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 14px;
  margin: 0 auto;
  background: var(--wp--preset--color--white);
  border: 2px solid var(--wp--preset--color--neutral-300);
  color: var(--wp--preset--color--neutral-400);
}
.step__label {
  font-size: 10px;
  font-weight: 600;
  color: var(--wp--preset--color--neutral-400);
  margin-top: 5px;
}
.step.is-active .step__dot {
  background: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
}
.step.is-active .step__label {
  color: var(--wp--preset--color--primary);
  font-weight: 700;
}
.step__bar {
  height: 2px;
  width: 24px;
  background: var(--wp--preset--color--neutral-300);
  flex: none;
}

/* ---- 404 ---- */
.error-page__num {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 800;
  font-size: clamp(4rem, 16vw, 7rem);
  color: var(--wp--preset--color--primary);
  line-height: 1;
}

/* ---- Footer polish ---- */
.site-footer a {
  color: #cfe0d2;
  text-decoration: none;
  display: block;
  padding: 6px 0;
}
.site-footer a:hover {
  color: var(--wp--preset--color--white);
}
.site-footer .wp-block-heading {
  color: var(--wp--preset--color--white);
  font-size: 16px;
}

/* ==========================================================================
   Fluent Forms skin - ports the reference form look (site/register.html)
   onto Fluent Forms markup. Container classes (hw-chips, hw-choice,
   hw-statement, hw-consent*, hw-section) are set in docker/forms.php.
   ========================================================================== */
.frm-fluent-form {
  font-family: var(--wp--preset--font-family--sans);
}
.frm-fluent-form .ff-el-group {
  margin-bottom: var(--wp--preset--spacing--40);
}
.frm-fluent-form .ff-el-input--label {
  margin-bottom: 6px;
  padding: 0;
}
.frm-fluent-form .ff-el-input--label label {
  font-weight: 600;
  font-size: 13px;
  color: var(--wp--preset--color--ink);
  margin: 0;
}
.frm-fluent-form .ff-el-is-required.asterisk-right label:after {
  color: var(--wp--preset--color--error);
}
.frm-fluent-form .ff-el-form-control {
  width: 100%;
  background: var(--wp--preset--color--white);
  border: 1.5px solid var(--wp--preset--color--neutral-300);
  border-radius: var(--wp--custom--radius--sm);
  padding: 13px;
  font: 400 15px/1.4 var(--wp--preset--font-family--sans);
  color: var(--wp--preset--color--ink);
  height: auto;
  box-shadow: none;
}
.frm-fluent-form .ff-el-form-control:focus {
  border-color: var(--wp--preset--color--primary);
  outline-offset: 1px;
}
.frm-fluent-form .ff-el-is-error .ff-el-form-control {
  border-color: var(--wp--preset--color--error);
  background: #fdecea;
}
.frm-fluent-form .error.text-danger,
.frm-fluent-form .error {
  color: var(--wp--preset--color--error);
  font-size: 13px;
  font-weight: 600;
  margin-top: 5px;
}
.frm-fluent-form .ff-t-container {
  gap: var(--wp--preset--spacing--30);
}
@media (max-width: 600px) {
  .frm-fluent-form .ff-t-container {
    flex-direction: column;
  }
  .frm-fluent-form .ff-t-container .ff-t-cell {
    flex-basis: auto !important;
  }
}

/* Section headings (the reference's 3 steps as labelled sections) */
.frm-fluent-form .hw-section {
  margin-bottom: var(--wp--preset--spacing--40);
}
.frm-fluent-form .ff-el-group ~ .hw-section {
  margin-top: var(--wp--preset--spacing--60);
  padding-top: var(--wp--preset--spacing--50);
  border-top: 1.5px solid var(--wp--preset--color--neutral-200);
}
.hw-section-head__step {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wp--preset--color--accent);
  margin-bottom: 4px;
}
.hw-section-head__title {
  font-family: var(--wp--preset--font-family--display);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--wp--preset--color--ink);
  margin: 0;
}

/* Checkable base: native input kept visible (state never by colour alone) */
.frm-fluent-form .ff-el-form-check {
  margin: 0;
}
.frm-fluent-form .ff-el-form-check-label {
  display: flex;
  align-items: center;
  gap: 11px;
  cursor: pointer;
  font-size: 15px;
  color: var(--wp--preset--color--ink);
  margin: 0;
}
.frm-fluent-form .ff-el-form-check-input {
  width: 20px;
  height: 20px;
  flex: none;
  margin: 0;
  accent-color: var(--wp--preset--color--primary);
}

/* Chips (multi-select pills) */
.frm-fluent-form .hw-chips .ff-el-input--content {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--20);
}
.frm-fluent-form .hw-chips .ff-el-form-check-label {
  display: inline-flex;
  gap: 6px;
  font-weight: 600;
  font-size: 13px;
  color: var(--wp--preset--color--neutral-700);
  background: var(--wp--preset--color--white);
  border: 1.5px solid var(--wp--preset--color--neutral-300);
  padding: 9px 14px;
  border-radius: var(--wp--custom--radius--pill);
  min-height: 40px;
  transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.frm-fluent-form .hw-chips .ff-el-form-check-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.frm-fluent-form .hw-chips .ff-el-form-check-label:has(input:checked) {
  background: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--white);
}
.frm-fluent-form .hw-chips .ff-el-form-check-label:has(input:checked) span::before {
  content: "\2713\00a0";
  font-weight: 800;
}
.frm-fluent-form .hw-chips--clay .ff-el-form-check-label:has(input:checked) {
  background: var(--wp--preset--color--accent);
  border-color: var(--wp--preset--color--accent);
}
.frm-fluent-form .hw-chips .ff-el-form-check-label:has(input:focus-visible) {
  outline: 3px solid var(--wp--preset--color--focus);
  outline-offset: 2px;
}

/* Choice cards (radio / checkbox rows) */
.frm-fluent-form .hw-choice .ff-el-form-check-label,
.frm-fluent-form .hw-statement .ff-el-form-check-label {
  background: var(--wp--preset--color--white);
  border: 1.5px solid var(--wp--preset--color--neutral-300);
  border-radius: var(--wp--custom--radius--md);
  padding: 13px;
  min-height: 48px;
  transition: background 0.12s, border-color 0.12s;
}
.frm-fluent-form .hw-choice .ff-el-form-check {
  margin-bottom: var(--wp--preset--spacing--20);
}
.frm-fluent-form .hw-choice .ff-el-form-check-label:hover,
.frm-fluent-form .hw-statement .ff-el-form-check-label:hover {
  border-color: var(--wp--preset--color--primary);
}
.frm-fluent-form .hw-choice .ff-el-form-check-label:has(input:checked),
.frm-fluent-form .hw-statement .ff-el-form-check-label:has(input:checked) {
  background: var(--wp--preset--color--primary-soft);
  border-color: var(--wp--preset--color--primary);
}
.frm-fluent-form .hw-statement .ff-el-form-check-label {
  align-items: flex-start;
}
.frm-fluent-form .hw-statement .ff-el-form-check-input {
  margin-top: 2px;
}

/* GDPR consents */
.frm-fluent-form .hw-consent .ff-el-form-check-label,
.frm-fluent-form .hw-consent-optional .ff-el-form-check-label {
  align-items: flex-start;
  padding: 6px 4px;
  min-height: 44px;
  font-size: 14px;
}
.frm-fluent-form .hw-consent .ff-el-form-check-input,
.frm-fluent-form .hw-consent-optional .ff-el-form-check-input {
  margin-top: 1px;
}
.frm-fluent-form .hw-consent {
  margin-bottom: var(--wp--preset--spacing--20);
}
.frm-fluent-form .hw-consent-optional {
  margin-bottom: var(--wp--preset--spacing--30);
}
.frm-fluent-form .ff_tc_checkbox {
  position: static;
  display: inline-flex;
  flex: none;
}
.frm-fluent-form .ff_t_c {
  margin: 0;
  padding: 0 0 0 11px;
  font-size: 14px;
}
.frm-fluent-form .ff_t_c p {
  margin: 0;
  font-size: 14px;
}

/* Submit */
.frm-fluent-form .ff-btn-submit {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 14px 22px;
  border: none;
  border-radius: var(--wp--custom--radius--md);
  background: var(--wp--preset--color--accent);
  color: var(--wp--preset--color--white);
  font-family: var(--wp--preset--font-family--sans);
  font-weight: 800;
  font-size: 16px;
  cursor: pointer;
  transition: background 0.15s;
}
.frm-fluent-form .ff-btn-submit:hover {
  background: var(--wp--preset--color--accent-dark);
}

/* Confirmation panel (FF wraps it in .ff-message-success, which has its own chrome) */
.ff-message-success {
  border: none;
  padding: 0;
  box-shadow: none;
  background: transparent;
}
.hw-thanks {
  background: var(--wp--preset--color--white);
  border: 1.5px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--lg);
  padding: var(--wp--preset--spacing--50);
}
.hw-thanks h2 {
  font-family: var(--wp--preset--font-family--display);
  margin: 0 0 var(--wp--preset--spacing--20);
}
.hw-thanks h3 {
  font-family: var(--wp--preset--font-family--sans);
  font-size: 1.1rem;
  font-weight: 700;
  margin: var(--wp--preset--spacing--40) 0 var(--wp--preset--spacing--20);
}
.hw-thanks ol {
  margin: 0;
  padding-left: 1.2em;
}
.hw-thanks li {
  margin-bottom: 6px;
}
.hw-thanks a {
  color: var(--wp--preset--color--primary);
  font-weight: 700;
}

/* Newsletter card: form sits on the dark green panel */
.news-card .frm-fluent-form .ff-el-input--label label {
  color: var(--wp--preset--color--white);
}
.news-card .frm-fluent-form .ff-el-group {
  margin-bottom: var(--wp--preset--spacing--30);
}
.news-card .hw-thanks {
  border: none;
}

/* ---- Mobile nav drawer (core navigation overlay restyled to the reference
   drawer: dark green panel from the right, dim backdrop, large left-aligned
   display-font links, accent CTA at the end) ---- */
.site-header .wp-block-navigation__responsive-container-open {
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  color: var(--wp--preset--color--ink);
}
.site-header .wp-block-navigation__responsive-container.is-menu-open {
  /* !important: core's overlay background (white) wins the cascade otherwise */
  background: rgba(20, 40, 25, 0.45) !important;
  padding: 0;
  color: var(--wp--preset--color--white);
}
.site-header .is-menu-open .wp-block-navigation__responsive-close {
  margin: 0 0 0 auto;
  width: min(86vw, 360px);
  max-width: none;
  height: 100%;
  background: var(--wp--preset--color--primary);
  padding: 18px;
  animation: hw-drawer-in 0.15s ease;
}
.site-header .is-menu-open .wp-block-navigation__responsive-dialog {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-close {
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 6px;
  color: var(--wp--preset--color--white);
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content {
  padding: 0;
  margin-top: var(--wp--preset--spacing--20);
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
  align-items: stretch;
  gap: 0;
  width: 100%;
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item a:where(:not(.wp-element-button)) {
  display: block;
  width: 100%;
  box-sizing: border-box;
  color: var(--wp--preset--color--white);
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700;
  font-size: 20px;
  padding: 16px 4px;
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item a:where(:not(.wp-element-button)):hover {
  color: var(--wp--preset--color--white);
  background: rgba(255, 255, 255, 0.08);
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .nav-cta {
  border-bottom: none;
  margin-top: var(--wp--preset--spacing--40);
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .nav-cta a:where(:not(.wp-element-button)) {
  background: var(--wp--preset--color--accent);
  border-radius: var(--wp--custom--radius--md);
  text-align: center;
  font-family: var(--wp--preset--font-family--sans);
  font-size: 16px;
  font-weight: 800;
  min-height: 48px;
  padding: 14px 22px;
}
.site-header .is-menu-open .wp-block-navigation__responsive-container-content .nav-cta a:where(:not(.wp-element-button)):hover {
  background: var(--wp--preset--color--accent-dark);
  color: var(--wp--preset--color--white);
}
/* Above the header collapse breakpoint the CTA lives in the header button instead */
@media (min-width: 980px) {
  .site-header .wp-block-navigation-item.nav-cta {
    display: none;
  }
}
@keyframes hw-drawer-in {
  from {
    transform: translateX(24px);
    opacity: 0.4;
  }
}

/* ---- Language picker (Polylang switcher; reference lang-picker, no emoji flags) ---- */
.lang-picker {
  position: relative;
}
.lang-picker__btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: none;
  border: 1.5px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--pill);
  padding: 5px 12px;
  font: 600 13px/1 var(--wp--preset--font-family--sans);
  color: var(--wp--preset--color--ink);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  min-height: 36px;
  list-style: none;
}
.lang-picker__btn::-webkit-details-marker {
  display: none;
}
.lang-picker__btn:hover,
.lang-picker[open] .lang-picker__btn {
  border-color: var(--wp--preset--color--primary);
  background: var(--wp--preset--color--primary-soft);
}
.lang-picker__arrow {
  font-size: 9px;
  color: var(--wp--preset--color--neutral-500);
  transition: transform 0.2s;
  margin-left: 1px;
}
.lang-picker[open] .lang-picker__arrow {
  transform: rotate(180deg);
}
.lang-picker__dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  background: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--neutral-200);
  border-radius: var(--wp--custom--radius--md);
  box-shadow: var(--wp--custom--elevation--high);
  list-style: none;
  margin: 0;
  padding: 4px 0;
  min-width: 148px;
  z-index: 31;
}
.lang-picker__dropdown li {
  margin: 0;
}
.lang-picker__dropdown a {
  display: flex;
  align-items: center;
  padding: 9px 14px;
  font: 500 14px/1 var(--wp--preset--font-family--sans);
  color: var(--wp--preset--color--ink);
  text-decoration: none;
}
.lang-picker__dropdown a:hover {
  background: var(--wp--preset--color--primary-soft);
  color: var(--wp--preset--color--primary);
}
.lang-picker__dropdown .is-current a {
  color: var(--wp--preset--color--primary);
  font-weight: 700;
}
.lang-picker__dropdown .is-current a::after {
  content: "\2713";
  margin-left: auto;
  padding-left: 12px;
  font-size: 11px;
}