/*
 * FinWOW — main stylesheet (direction 1a "Doppio Wow").
 * Tokens mirror design/tokens.css; layout is fluid (auto-fit grids) with a
 * single breakpoint for the mobile menu. Fonts are self-hosted via theme.json.
 */

/* ---------------------------------------------------------------- Tokens */

:root {
  /* Brand */
  --fw-violet: #6B2BF0;
  --fw-violet-dark: #4F1BC0;
  --fw-lime: #8BE03C;
  --fw-lime-bright: #A6EE5C;
  --fw-lime-ink: #1B2A0A;
  --fw-lime-soft: #C9F59A;
  --fw-lime-label: #2E4A10;

  /* Neutrals */
  --fw-ink: #1E1B24;
  --fw-ink-2: #2A2632;
  --fw-ink-line: #3F3A4A;
  --fw-ink-track: #3A3545;
  --fw-ink-divider: #34303E;
  --fw-nav-text: #2E2A38;
  --fw-graphite: #4A4556;
  --fw-muted: #7A7488;
  --fw-muted-on-ink: #B9B3C7;
  --fw-caption-on-ink: #8D869C;
  --fw-chip-on-ink: #E4DFEE;
  --fw-lead-on-violet: #EDE6FD;
  --fw-line: #E4DEF0;
  --fw-line-hover: #CFC6E2;
  --fw-line-soft: #ECE7F5;
  --fw-lavender: #F1ECFB;
  --fw-paper: #FBFAFE;
  --fw-white: #FFFFFF;
  --fw-error: #D93A3A;

  /* Type */
  --fw-font-display: 'Space Grotesk', Arial, sans-serif;
  --fw-font-body: 'Outfit', Arial, sans-serif;
  --fw-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --fw-text-display: clamp(48px, 7vw, 88px);
  --fw-text-h1: clamp(40px, 5.5vw, 64px);
  --fw-text-h2: clamp(34px, 4vw, 48px);
  --fw-text-h3: 26px;
  --fw-text-lead: 21px;
  --fw-text-body: 17px;
  --fw-text-small: 15px;
  --fw-text-caption: 13px;
  --fw-text-mono: 12px;

  /* Radius */
  --fw-radius-sm: 14px;
  --fw-radius-md: 16px;
  --fw-radius-lg: 22px;
  --fw-radius-xl: 28px;
  --fw-radius-pill: 999px;

  /* Spacing */
  --fw-space-1: 8px;
  --fw-space-2: 12px;
  --fw-space-3: 18px;
  --fw-space-4: 26px;
  --fw-space-5: 36px;
  --fw-space-6: 56px;
  --fw-space-7: 88px;
  --fw-container: 1240px;
  --fw-gutter: 28px;
  --fw-reading: 760px;

  /* Effects */
  --fw-shadow-hero: 0 30px 80px rgba(20, 8, 60, 0.45);
  --fw-shadow-thumb: 0 3px 10px rgba(0, 0, 0, 0.35);
  --fw-ease: 150ms ease;
}

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

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: 96px;
}

body {
  margin: 0;
  background: var(--fw-paper);
  color: var(--fw-ink);
  font-family: var(--fw-font-body);
  font-size: var(--fw-text-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, p, figure, blockquote, ul, ol, dl, dd {
  margin: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
}

img,
video {
  max-width: 100%;
  height: auto;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}

a {
  color: var(--fw-violet);
  text-decoration: none;
  transition: color var(--fw-ease), background-color var(--fw-ease), border-color var(--fw-ease);
}

a:hover {
  color: var(--fw-violet-dark);
}

:focus-visible {
  outline: 2px solid var(--fw-violet);
  outline-offset: 2px;
}

/* Violet rings are too faint on ink and violet surfaces: use bright lime there. */
.fw-on-dark :focus-visible,
.fw-hero :focus-visible,
.fw-footer :focus-visible {
  outline-color: var(--fw-lime-bright);
}

/* Footer stays at the bottom of short pages. */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.fw-main {
  display: block;
  flex: 1 0 auto;
  overflow-x: clip;
}

.fw-main:focus {
  outline: none;
}

.fw-num {
  font-family: var(--fw-font-display);
  font-variant-numeric: tabular-nums;
}

/* Accessibility helpers (WordPress class names). */
.screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  word-wrap: normal !important;
}

.fw-skip-link {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 100;
  padding: 12px 18px;
  border-radius: var(--fw-radius-sm);
  background: var(--fw-ink);
  color: var(--fw-white);
  font-weight: 600;
  transform: translateY(-200%);
}

.fw-skip-link:focus {
  transform: none;
  color: var(--fw-white);
}

/* ---------------------------------------------------------------- Layout */

.fw-container {
  width: 100%;
  max-width: var(--fw-container);
  margin-inline: auto;
  padding-inline: var(--fw-gutter);
}

.fw-container--narrow {
  max-width: calc(var(--fw-reading) + 2 * var(--fw-gutter));
}

.fw-stack {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.fw-stack--lg {
  gap: var(--fw-space-5);
}

.fw-grid {
  display: grid;
  gap: var(--fw-space-3);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--fw-grid-min, 300px)), 1fr));
}

.fw-grid--products {
  --fw-grid-min: 300px;
}

/*
 * Listings: at most three columns (each at least a third of the row), never
 * narrower than the minimum. auto-fill keeps card widths when there are fewer
 * than three items.
 */
.fw-grid--guides,
.fw-grid--results {
  --fw-grid-min: 260px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, max(var(--fw-grid-min), (100% - 2 * var(--fw-space-3)) / 3)), 1fr));
}

.fw-grid--results {
  --fw-grid-min: 320px;
}

/* Section rhythm: 88px at the top and bottom of the page, ~96px between. */
.fw-section {
  padding-block: 48px;
}

.fw-main > .fw-section:first-child,
.fw-hero + .fw-section {
  padding-top: var(--fw-space-7);
}

.fw-main > .fw-section:last-child,
.fw-main > .fw-entry:last-child .fw-entry__body {
  padding-bottom: var(--fw-space-7);
}

.fw-page-header + .fw-section--flush {
  padding-top: 8px;
}

.fw-section__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 20px;
  flex-wrap: wrap;
}

.fw-section__title {
  max-width: 680px;
}

.fw-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fw-space-2);
}

/* ------------------------------------------------------------ Typography */

.fw-eyebrow {
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-caption);
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fw-violet);
}

.fw-display {
  font-family: var(--fw-font-display);
  font-size: var(--fw-text-display);
  font-weight: 700;
  line-height: 0.98;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

.fw-h2 {
  font-family: var(--fw-font-display);
  font-size: var(--fw-text-h2);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.fw-lead {
  max-width: 680px;
  font-size: var(--fw-text-lead);
  line-height: 1.5;
  color: var(--fw-graphite);
  text-wrap: pretty;
}

.fw-link-more {
  font-weight: 600;
}

/* ------------------------------------------------------------ Components */

/* Buttons: primary (lime CTA), secondary (violet), tertiary (outline), dark pill. */
.fw-btn {
  --fw-btn-bg: var(--fw-violet);
  --fw-btn-fg: var(--fw-white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 15px 26px;
  border: 0;
  border-radius: var(--fw-radius-sm);
  background: var(--fw-btn-bg);
  color: var(--fw-btn-fg);
  font-family: var(--fw-font-display);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  transition: background-color var(--fw-ease), border-color var(--fw-ease), color var(--fw-ease);
}

.fw-btn:hover {
  background: color-mix(in srgb, var(--fw-btn-bg) 92%, #000);
  color: var(--fw-btn-fg);
}

.fw-btn--primary {
  --fw-btn-bg: var(--fw-lime);
  --fw-btn-fg: var(--fw-lime-ink);
}

.fw-btn--secondary:hover {
  background: var(--fw-violet-dark);
}

.fw-btn--tertiary {
  --fw-btn-bg: transparent;
  --fw-btn-fg: var(--fw-ink);
  padding: 13px 24px;
  border: 2px solid var(--fw-ink);
  font-family: var(--fw-font-body);
  font-size: 16px;
  font-weight: 600;
}

.fw-btn--tertiary:hover {
  background: var(--fw-lavender);
}

.fw-btn--dark {
  --fw-btn-bg: var(--fw-ink);
  --fw-btn-fg: var(--fw-white);
  padding: 10px 22px;
  border-radius: var(--fw-radius-pill);
  font-family: var(--fw-font-body);
  font-size: 16px;
  font-weight: 600;
}

/* Chips: pill filters and tags. */
.fw-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  list-style: none;
}

.fw-chip {
  display: inline-block;
  padding: 9px 16px;
  border-radius: var(--fw-radius-pill);
  background: var(--fw-lavender);
  color: var(--fw-nav-text);
  font-size: var(--fw-text-small);
  line-height: 1.3;
}

.fw-chip:hover {
  background: color-mix(in srgb, var(--fw-lavender) 92%, #000);
  color: var(--fw-nav-text);
}

.fw-chip.is-active {
  background: var(--fw-violet);
  color: var(--fw-white);
  font-weight: 600;
}

/* Text input with label above and a helper line explaining why it's asked. */
.fw-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fw-field__label {
  font-size: var(--fw-text-small);
  font-weight: 600;
}

.fw-field__help {
  font-size: var(--fw-text-caption);
  color: var(--fw-graphite);
}

.fw-input {
  width: 100%;
  padding: 14px 16px;
  border: 2px solid var(--fw-line);
  border-radius: var(--fw-radius-sm);
  background: var(--fw-white);
  color: var(--fw-ink);
  font-size: var(--fw-text-body);
  transition: border-color var(--fw-ease);
}

.fw-input:hover {
  border-color: var(--fw-line-hover);
}

.fw-input:focus {
  border-color: var(--fw-violet);
  outline: none;
}

.fw-input[aria-invalid="true"] {
  border-color: var(--fw-error);
}

/* 4-step progress bar of the application form. */
.fw-progress {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fw-progress__status {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: var(--fw-text-caption);
  color: var(--fw-graphite);
}

.fw-progress__bar {
  display: flex;
  gap: 6px;
}

.fw-progress__segment {
  flex: 1;
  height: 6px;
  border-radius: 3px;
  background: var(--fw-line);
}

.fw-progress__segment.is-done {
  background: var(--fw-violet);
}

/* Search form */
.fw-search {
  display: flex;
  flex-wrap: wrap;
  gap: var(--fw-space-2);
  max-width: 640px;
}

.fw-search__input {
  flex: 1 1 240px;
}

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

.fw-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(251, 250, 254, 0.92);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--fw-line-soft);
}

.admin-bar .fw-header {
  top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
  .admin-bar .fw-header {
    top: 0;
  }
}

.fw-header__inner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 28px;
  padding-block: 16px;
}

.fw-header__logo {
  display: flex;
  align-items: center;
  margin-right: auto;
}

.fw-logo {
  display: block;
  width: 123px;
  height: 34px;
}

.fw-nav__list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fw-nav__link {
  color: var(--fw-nav-text);
  font-size: 16px;
}

.fw-nav__link:hover,
.fw-nav__link[aria-current="page"] {
  color: var(--fw-violet);
}

.fw-nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 2px solid var(--fw-ink);
  border-radius: var(--fw-radius-sm);
  background: transparent;
  color: var(--fw-ink);
  cursor: pointer;
}

.fw-nav-toggle__close,
.fw-nav-toggle[aria-expanded="true"] .fw-nav-toggle__open {
  display: none;
}

.fw-nav-toggle[aria-expanded="true"] .fw-nav-toggle__close {
  display: block;
}

/* Mobile menu: only when JS can open it; without JS the links simply wrap. */
@media (max-width: 767px) {
  .fw-js .fw-header__inner {
    flex-wrap: nowrap;
    gap: 12px;
  }

  .fw-js .fw-nav-toggle {
    display: inline-flex;
    flex: none;
  }

  .fw-js .fw-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    background: var(--fw-paper);
    border-bottom: 1px solid var(--fw-line-soft);
    box-shadow: 0 24px 40px rgba(30, 27, 36, 0.08);
  }

  .fw-js .fw-nav.is-open {
    display: block;
  }

  .fw-js .fw-nav__list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 4px var(--fw-gutter) 20px;
  }

  .fw-js .fw-nav__link {
    display: block;
    padding: 16px 0;
    border-bottom: 1px solid var(--fw-line-soft);
    font-size: 19px;
  }
}

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

.fw-hero {
  background: var(--fw-violet);
  color: var(--fw-white);
}

.fw-hero__inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  align-items: center;
  gap: var(--fw-space-6);
  padding-block: 72px 80px;
}

.fw-hero--text .fw-hero__inner {
  grid-template-columns: minmax(0, 880px);
}

.fw-hero__content {
  display: flex;
  flex-direction: column;
  gap: var(--fw-space-4);
}

.fw-hero__eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--fw-lime-soft);
}

.fw-hero__eyebrow .fw-symbol {
  flex: none;
  color: var(--fw-white);
}

.fw-hero__title {
  color: var(--fw-white);
}

.fw-hero__lead {
  max-width: 520px;
  font-size: var(--fw-text-lead);
  line-height: 1.5;
  color: var(--fw-lead-on-violet);
  text-wrap: pretty;
}

.fw-hero--text .fw-hero__lead {
  max-width: 640px;
}

.fw-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fw-pill {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: var(--fw-radius-pill);
  background: rgba(255, 255, 255, 0.12);
  color: var(--fw-white);
  font-size: var(--fw-text-small);
}

.fw-pill__dot {
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background: var(--fw-lime);
}

/* ------------------------------------------------------------ Calculator */

.fw-calc {
  display: flex;
  flex-direction: column;
  gap: var(--fw-space-4);
  min-width: 0;
  padding: clamp(26px, 6vw, 34px) clamp(20px, 5vw, 32px);
  border-radius: var(--fw-radius-xl);
  background: var(--fw-ink);
  color: var(--fw-white);
  box-shadow: var(--fw-shadow-hero);
}

.fw-calc__group,
.fw-calc__field {
  display: flex;
  flex-direction: column;
  gap: var(--fw-space-2);
}

.fw-calc__group {
  gap: 14px;
}

.fw-calc__label {
  font-size: 16px;
  color: var(--fw-muted-on-ink);
}

.fw-calc__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.fw-choice {
  position: relative;
  display: inline-flex;
}

.fw-choice input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.fw-choice span {
  padding: 10px 18px;
  border: 2px solid var(--fw-ink-line);
  border-radius: var(--fw-radius-pill);
  background: transparent;
  color: var(--fw-chip-on-ink);
  font-family: var(--fw-font-body);
  font-size: var(--fw-text-small);
  line-height: 1.3;
  transition: background-color var(--fw-ease), border-color var(--fw-ease), color var(--fw-ease);
}

.fw-choice:hover span {
  border-color: var(--fw-muted);
}

.fw-choice input:checked + span {
  border-color: var(--fw-lime);
  background: var(--fw-lime);
  color: var(--fw-lime-ink);
  font-weight: 600;
}

.fw-choice input:focus-visible + span {
  outline: 2px solid var(--fw-lime-bright);
  outline-offset: 2px;
}

.fw-calc__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 12px;
}

.fw-calc__value {
  font-family: var(--fw-font-display);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  color: var(--fw-white);
  white-space: nowrap;
}

.fw-calc__value--amount {
  font-size: clamp(36px, 9vw, 44px);
  letter-spacing: -0.035em;
}

.fw-calc__value--months {
  font-size: 26px;
}

/* Slider: lime fill up to the thumb's centre, dark track after it. */
.fw-range {
  --fw-fill-at: calc(15px + var(--fw-fill, 0.5) * (100% - 30px));
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 10px;
  margin: 6px 0;
  border-radius: 5px;
  background: linear-gradient(to right, var(--fw-lime) var(--fw-fill-at), var(--fw-ink-track) var(--fw-fill-at));
  cursor: pointer;
}

.fw-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  border: 4px solid var(--fw-lime);
  border-radius: 50%;
  background: var(--fw-white);
  box-shadow: var(--fw-shadow-thumb);
  cursor: pointer;
}

.fw-range::-moz-range-track {
  height: 10px;
  border: 0;
  background: transparent;
}

.fw-range::-moz-range-thumb {
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  border: 4px solid var(--fw-lime);
  border-radius: 50%;
  background: var(--fw-white);
  box-shadow: var(--fw-shadow-thumb);
  cursor: pointer;
}

.fw-calc__scale {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-caption);
  color: var(--fw-caption-on-ink);
}

.fw-calc__result {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 18px 20px;
  border-radius: var(--fw-radius-md);
  background: var(--fw-ink-2);
}

.fw-calc__result-label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: var(--fw-text-small);
  color: var(--fw-muted-on-ink);
}

.fw-calc__note-mono {
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-mono);
  color: var(--fw-caption-on-ink);
}

.fw-calc__payment {
  font-family: var(--fw-font-display);
  font-size: 30px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  color: var(--fw-lime-bright);
  white-space: nowrap;
}

.fw-calc__submit {
  display: block;
  width: 100%;
  padding: 18px;
  border: 0;
  border-radius: var(--fw-radius-md);
  background: var(--fw-lime);
  color: var(--fw-lime-ink);
  font-family: var(--fw-font-display);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  transition: background-color var(--fw-ease);
}

.fw-calc__submit:hover {
  background: color-mix(in srgb, var(--fw-lime) 92%, #000);
}

.fw-calc__micro {
  font-size: var(--fw-text-caption);
  line-height: 1.5;
  text-align: center;
  color: var(--fw-caption-on-ink);
}

/* ---------------------------------------------------------- Product cards */

.fw-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 30px;
  border: 1px solid var(--fw-line);
  border-radius: var(--fw-radius-lg);
  background: var(--fw-white);
  color: var(--fw-ink);
}

.fw-card:hover {
  border-color: var(--fw-line-hover);
  color: var(--fw-ink);
}

.fw-card__icon {
  width: 48px;
  height: 48px;
  border-radius: var(--fw-radius-sm);
  background: var(--fw-violet);
}

.fw-card__icon--lime {
  border-radius: 24px;
  background: var(--fw-lime);
}

.fw-card__icon--ink {
  background: var(--fw-ink);
}

.fw-card__title {
  font-family: var(--fw-font-display);
  font-size: var(--fw-text-h3);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.fw-card__label {
  order: -1;
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fw-violet);
}

.fw-card__text {
  font-size: var(--fw-text-body);
  line-height: 1.5;
  color: var(--fw-graphite);
  text-wrap: pretty;
}

.fw-card__more {
  margin-top: auto;
  font-weight: 600;
  color: var(--fw-violet);
  transition: color var(--fw-ease);
}

.fw-card:hover .fw-card__more {
  color: var(--fw-violet-dark);
}

/* ----------------------------------------------------------------- Steps */

.fw-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
  gap: var(--fw-space-5);
  padding: clamp(28px, 5vw, 56px);
  border-radius: var(--fw-radius-xl);
  background: var(--fw-lavender);
}

.fw-steps__intro,
.fw-step {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.fw-steps__title {
  font-family: var(--fw-font-display);
  font-size: 36px;
  line-height: 1.05;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.fw-step__number {
  font-family: var(--fw-font-display);
  font-size: 44px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.04em;
  color: var(--fw-violet);
}

.fw-step__title {
  font-family: var(--fw-font-body);
  font-size: 19px;
  font-weight: 600;
}

.fw-step__text {
  font-size: 16px;
  line-height: 1.5;
  color: var(--fw-graphite);
}

/* ----------------------------------------------------------- Guide cards */

.fw-guide-card {
  display: flex;
  flex-direction: column;
  gap: 40px;
  min-height: 220px;
  padding: 28px;
  border-radius: var(--fw-radius-lg);
  background: var(--fw-violet);
  color: var(--fw-white);
}

.fw-guide-card__label {
  order: -1;
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fw-lime-soft);
}

.fw-guide-card__title {
  margin-top: auto;
  font-family: var(--fw-font-display);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

.fw-guide-card--violet:hover {
  background: var(--fw-violet-dark);
  color: var(--fw-white);
}

.fw-guide-card--white {
  border: 1px solid var(--fw-line);
  background: var(--fw-white);
  color: var(--fw-ink);
}

.fw-guide-card--white:hover {
  border-color: var(--fw-line-hover);
  color: var(--fw-ink);
}

.fw-guide-card--white .fw-guide-card__label {
  color: var(--fw-violet);
}

.fw-guide-card--lime {
  background: var(--fw-lime);
  color: var(--fw-lime-ink);
}

.fw-guide-card--lime:hover {
  background: color-mix(in srgb, var(--fw-lime) 92%, #000);
  color: var(--fw-lime-ink);
}

.fw-guide-card--lime .fw-guide-card__label {
  color: var(--fw-lime-label);
}

/* ------------------------------------------------------------ Inner pages */

.fw-page-header__inner {
  display: flex;
  flex-direction: column;
  gap: var(--fw-space-3);
  padding-block: 72px 40px;
}

.fw-page-title {
  font-family: var(--fw-font-display);
  font-size: var(--fw-text-h1);
  line-height: 1.02;
  letter-spacing: -0.045em;
  text-wrap: balance;
  overflow-wrap: break-word;
}

.fw-page-header__meta {
  font-size: var(--fw-text-small);
  color: var(--fw-graphite);
}

.fw-breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-caption);
  line-height: 1.4;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fw-muted);
}

.fw-breadcrumbs li + li::before {
  content: "/";
  margin-inline: 10px;
  color: var(--fw-line-hover);
}

.fw-entry__media {
  margin-bottom: var(--fw-space-5);
}

.fw-entry__media img {
  display: block;
  width: 100%;
  border-radius: var(--fw-radius-lg);
}

.fw-entry__tags {
  margin-top: var(--fw-space-5);
}

.fw-empty {
  padding: var(--fw-space-5);
  border-radius: var(--fw-radius-lg);
  background: var(--fw-lavender);
  color: var(--fw-graphite);
}

.fw-pagination .nav-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.fw-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 16px;
  border-radius: var(--fw-radius-pill);
  background: var(--fw-lavender);
  color: var(--fw-nav-text);
  font-size: var(--fw-text-small);
}

.fw-pagination a.page-numbers:hover {
  background: color-mix(in srgb, var(--fw-lavender) 92%, #000);
}

.fw-pagination .page-numbers.current {
  background: var(--fw-violet);
  color: var(--fw-white);
  font-weight: 600;
}

.fw-pagination .page-numbers.dots {
  background: transparent;
}

/* -------------------------------------------------- Editor content (prose) */

.fw-prose {
  font-size: var(--fw-text-body);
  line-height: 1.6;
  overflow-wrap: break-word;
}

.fw-prose > * + * {
  margin-top: 1.15em;
}

.fw-prose > :first-child {
  margin-top: 0;
}

.fw-prose h2,
.fw-prose h3,
.fw-prose h4 {
  font-family: var(--fw-font-display);
  line-height: 1.15;
  letter-spacing: -0.03em;
  text-wrap: balance;
}

.fw-prose h2 {
  margin-top: 1.9em;
  font-size: clamp(28px, 3vw, 34px);
  letter-spacing: -0.04em;
}

.fw-prose h3 {
  margin-top: 1.6em;
  font-size: 24px;
}

.fw-prose h4 {
  margin-top: 1.4em;
  font-size: 20px;
}

.fw-prose h2 + *,
.fw-prose h3 + *,
.fw-prose h4 + * {
  margin-top: 0.6em;
}

.fw-prose a:not(.wp-block-button__link) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.fw-prose ul,
.fw-prose ol {
  padding-left: 1.4em;
}

.fw-prose li + li {
  margin-top: 0.4em;
}

.fw-prose li::marker {
  color: var(--fw-violet);
}

.fw-prose strong {
  font-weight: 600;
}

.fw-prose blockquote,
.fw-prose .wp-block-quote {
  padding: 4px 0 4px 22px;
  border-left: 4px solid var(--fw-violet);
  font-size: 20px;
  line-height: 1.5;
}

.fw-prose blockquote cite {
  display: block;
  margin-top: 10px;
  font-size: var(--fw-text-small);
  font-style: normal;
  color: var(--fw-graphite);
}

.fw-prose hr {
  border: 0;
  border-top: 1px solid var(--fw-line);
}

.fw-prose img {
  border-radius: var(--fw-radius-md);
}

.fw-prose figcaption {
  margin-top: 8px;
  font-size: var(--fw-text-caption);
  color: var(--fw-graphite);
}

.fw-prose table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
}

.fw-prose th,
.fw-prose td {
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid var(--fw-line);
  text-align: left;
  vertical-align: top;
}

.fw-prose thead,
.fw-prose tfoot {
  border: 0;
}

.fw-prose thead th {
  background: var(--fw-lavender);
  font-weight: 600;
}

.fw-prose .wp-block-table {
  overflow-x: auto;
  border: 1px solid var(--fw-line);
  border-radius: var(--fw-radius-md);
}

.fw-prose .wp-block-table tbody tr:last-child td {
  border-bottom: 0;
}

.fw-prose code {
  padding: 2px 6px;
  border-radius: 6px;
  background: var(--fw-lavender);
  font-family: var(--fw-font-mono);
  font-size: 0.88em;
}

.fw-prose .alignwide {
  width: min(1184px, 100vw - 2 * var(--fw-gutter));
  max-width: none;
  margin-inline: calc(50% - min(592px, 50vw - var(--fw-gutter)));
}

.fw-prose .alignfull {
  width: 100vw;
  max-width: none;
  margin-inline: calc(50% - 50vw);
}

.fw-prose .alignfull img {
  border-radius: 0;
}

.fw-prose .alignleft {
  float: left;
  margin: 0.3em 1.5em 1em 0;
}

.fw-prose .alignright {
  float: right;
  margin: 0.3em 0 1em 1.5em;
}

.fw-prose .aligncenter {
  margin-inline: auto;
}

/* Block buttons: default = secondary (violet), "Contorno" = tertiary, "CTA lime" = primary. */
.fw-prose .wp-block-button__link {
  padding: 15px 26px;
  border-radius: var(--fw-radius-sm);
  background: var(--fw-violet);
  color: var(--fw-white);
  font-family: var(--fw-font-display);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

.fw-prose .wp-block-button__link:hover {
  background: var(--fw-violet-dark);
  color: var(--fw-white);
}

.fw-prose .is-style-outline .wp-block-button__link {
  padding: 13px 24px;
  border: 2px solid var(--fw-ink);
  background: transparent;
  color: var(--fw-ink);
  font-family: var(--fw-font-body);
  font-size: 16px;
  font-weight: 600;
}

.fw-prose .is-style-outline .wp-block-button__link:hover {
  background: var(--fw-lavender);
  color: var(--fw-ink);
}

.fw-prose .is-style-finwow-cta .wp-block-button__link {
  background: var(--fw-lime);
  color: var(--fw-lime-ink);
}

.fw-prose .is-style-finwow-cta .wp-block-button__link:hover {
  background: color-mix(in srgb, var(--fw-lime) 92%, #000);
  color: var(--fw-lime-ink);
}

.fw-page-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: var(--fw-space-5);
}

/* ---------------------------------------------------------------- Footer */

.fw-footer {
  background: var(--fw-ink);
  color: var(--fw-muted-on-ink);
}

.fw-footer__inner {
  display: flex;
  flex-direction: column;
  gap: var(--fw-space-5);
  padding-block: 56px 40px;
}

.fw-footer__top {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 32px;
}

.fw-footer__logo {
  align-self: flex-start;
}

.fw-footer__cols {
  display: flex;
  flex-wrap: wrap;
  gap: 32px 48px;
  font-size: var(--fw-text-small);
}

.fw-footer__col {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 120px;
}

.fw-footer__title {
  font-family: var(--fw-font-body);
  font-size: var(--fw-text-small);
  font-weight: 600;
  color: var(--fw-white);
}

.fw-footer__col ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fw-footer__col a {
  color: var(--fw-muted-on-ink);
}

.fw-footer__col a:hover,
.fw-footer__col a[aria-current="page"] {
  color: var(--fw-white);
}

.fw-footer__legal {
  padding-top: 22px;
  border-top: 1px solid var(--fw-ink-divider);
  font-family: var(--fw-font-mono);
  font-size: var(--fw-text-mono);
  line-height: 1.7;
  color: var(--fw-caption-on-ink);
}

/* ------------------------------------------------- Application form page */

/* page-templates/application-form.php, with header-minimal.php and footer-minimal.php. */

.fw-header--minimal .fw-header__inner {
  justify-content: center;
}

.fw-header--minimal .fw-header__logo {
  margin-right: 0;
}

/*
 * As wide as the form (the plugin's .fwmaf). Block flow, not flex or grid: the
 * form centres itself with auto margins, which would shrink it to fit there.
 */
.fw-apply__inner {
  max-width: calc(640px + 2 * var(--fw-gutter));
  padding-block: var(--fw-space-5) var(--fw-space-6);
}

.fw-apply .fw-secure {
  margin-top: var(--fw-space-6);
}

.fw-secure {
  display: flex;
  align-items: flex-start;
  gap: var(--fw-space-3);
  padding: var(--fw-space-4);
  border: 1px solid var(--fw-line);
  border-radius: var(--fw-radius-lg);
  background: var(--fw-white);
}

.fw-secure__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--fw-lavender);
  color: var(--fw-violet);
}

.fw-secure__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  font-size: var(--fw-text-small);
  color: var(--fw-graphite);
}

.fw-secure__title {
  font-family: var(--fw-font-display);
  font-size: 19px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--fw-ink);
}

.fw-secure__list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fw-secure__list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.fw-secure__list .fw-symbol {
  flex: none;
  margin-top: 3px;
  color: var(--fw-violet);
}

.fw-legal-footer {
  border-top: 1px solid var(--fw-line-soft);
  font-size: var(--fw-text-caption);
}

.fw-legal-footer__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 0;
  margin: 0;
  padding: 22px 0;
  list-style: none;
}

/* Dots between the links, hidden from screen readers where supported. */
.fw-legal-footer__links li + li::before {
  content: "·";
  content: "·" / "";
  margin-inline: 10px;
  color: var(--fw-muted);
}

/* Where the links wrap, dots would start lines: spacing instead. */
@media (max-width: 599px) {
  .fw-legal-footer__links {
    gap: 8px 20px;
  }

  .fw-legal-footer__links li + li::before {
    content: none;
  }
}

.fw-legal-footer__links a {
  color: var(--fw-graphite);
}

.fw-legal-footer__links a:hover {
  color: var(--fw-violet);
}

/* ---------------------------------------------------------------- Motion */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: 0.01ms !important;
  }
}
