@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&display=swap");

/* ===== base: lifted from glasscubes-v2/style.css (tokens, type, buttons, layout) ===== */
:root {
  --Color-Accent-Buege: #fce6c6;
  --Color-Accent-Light-Blue: #e3e3fc;
  --Color-Accent-Lime: #d1f55f;
  --Color-Primary-Blue: #2a2a49;
  --Color-Primary-Gray: #d9d9e0;
  --Color-Primary-Light-Gray: #f3f4f6;
  --Color-Primary-Dark-Blue: #161625;
  --Color-Primary-Purple-Gray: #89899e;
  --Color-Stroke-Dark: rgba(137, 137, 158, 0.3);
  --Color-Text-70: rgba(0, 0, 0, 0.7);
  --Color-Text-Black-100: #000;
  --Color-Text-Black-60: rgba(0, 0, 0, 0.6);
  --Color-Text-Black-80: rgba(0, 0, 0, 0.8);
  --Color-Text-Grey-60: rgba(64, 64, 99, 0.6);
  --Color-Text-Grey-80: rgba(64, 64, 99, 0.8);
  --Color-Text-White-100: #fff;
  --Color-Text-White-60: rgba(255, 255, 255, 0.6);
  --Color-Text-White-80: rgba(255, 255, 255, 0.8);
  --Color-Additional-Link: #3E58EC;
  --section-padding: 96px;
}

@media (max-width: 991.98px) {
  :root {
    --section-padding: 72px;
  }
}

@media (max-width: 767.98px) {
  :root {
    --section-padding: 64px;
  }
}

@media (max-width: 487.98px) {
  :root {
    --section-padding: 48px;
  }
}

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

a {
  transition: color 0.3s ease;
  text-decoration: none;
  color: inherit;
}

ul,
ol,
li {
  list-style: none;
}

img {
  vertical-align: top;
}

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

html,
body {
  background: var(--Color-Primary-Light-Gray);
  font-family: "Be Vietnam Pro";
  font-size: 18px;
  color: var(--Color-Text-Black-80);
  cursor: url("/assets/icons/Cursor.svg"), auto;
}

html.pricing-page,
body.pricing-page {
  background: #FFF;
}

button,
input {
  background: transparent;
  cursor: pointer;
  font-weight: inherit;
  color: inherit;
  font-family: inherit;
  transition: all 0.3s ease-in;
  -webkit-appearance: none;
  -moz-appearance: none;
}

dialog::backdrop {
  background: rgba(0, 0, 0, 0.55);
}

/*****************/
[class*=max-container],
[class*=_container] {
  margin: 0px auto;
  height: 100%;
  padding: 0px 16px;
}

[class*=max-container] {
  max-width: 1360px;
}

[class*=_container] {
  max-width: 1248px;
}


/***********TEXT*******************/
.large-text {
  font-size: 20px;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.6px;
}

@media (max-width: 767.98px) {
  .large-text {
    font-size: 18px;
  }
  .main-hero-mtd p br { display: none;}
}

.large-text span {
  font-weight: 700;
}

.regular-text {
  color: var(--Color-Primary-Light-Gray);
  font-size: 18px;
  font-weight: 400;
  line-height: 155.556%;
  /* 155.556% */
  letter-spacing: -0.36px;
}
.regular-text p:not(:last-child) {
  margin-bottom: 20px;
}
@media (max-width: 767.98px) {
  .regular-text {
    font-size: 16px;
  }
}

.regular-text span {
  font-weight: 600;
  color: var(--Color-Text-White-100, #FFF);
}

.regular-text a {
  font-weight: 600;
  text-decoration-line: underline;
  text-decoration-style: solid;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.small-text {
  color: var(--Color-Text-Grey-80);
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
}

@media (max-width: 767.98px) {
  .small-text {
    font-size: 14px;
  }
}

.small-text span {
  font-weight: 600;
  color: var(--Color-Text-White-100, #FFF);
}

.small-text a {
  text-decoration-line: underline;
  text-decoration-style: solid;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.x-small-text {
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 142%;
}

.x-small-text a {
  text-decoration-line: underline;
  text-decoration-style: solid;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}


/*********TITLE*******************/
.h1 {
  /* Title/H1 */
  color: var(--Color-Text-Black-100, #000);
  font-size: 64px;
  font-weight: 500;
  line-height: 115.625%;
  letter-spacing: -3px;
}

.h1 span {
  position: relative;
  z-index: 10;
  color: var(--Color-Text-Black-100, #000);
  letter-spacing: -6px;
  display: inline-block;
}

.h1 span::after {
  content: "";
  height: 28px;
  width: 100%;
  position: absolute;
  bottom: 0px;
  left: 0;
  z-index: -1;
  background: var(--Color-Accent-Lime-50, rgba(209, 245, 95, 0.5));
}

@media (max-width: 991.98px) {
  .h1 span::after {
    height: 20px;
  }
}

@media (max-width: 991.98px) {
  .h1 {
    font-size: 48px;
    letter-spacing: -1px !important;
  }

  .h1 span {
    letter-spacing: -1px !important;
  }
}

@media (max-width: 767.98px) {
  .h1 {
    font-size: 36px;
    letter-spacing: 0px !important;
  }
}

.faq-content h2,
.post-content h2,
.h2 {
  /* Title/H2 */
  font-size: 48px;
  font-weight: 500;
  line-height: 120.833%;
  /* 120.833% */
  letter-spacing: -3px;
}

@media (max-width: 991.98px) {

  .faq-content h2,
  .post-content h2,
  .h2 {
    font-size: 34px;
    letter-spacing: -1px !important;
  }
}

@media (max-width: 767.98px) {

  .faq-content h2,
  .post-content h2,
  .h2 {
    font-size: 28px;
    letter-spacing: 0px !important;
  }
}

.h3 {
  font-size: 32px;
  font-weight: 600;
  line-height: 131%;
  /* 131.25% */
  letter-spacing: -1px;
}

@media (max-width: 991.98px) {
  .h3 {
    font-size: 28px;
    letter-spacing: normal;
  }
}

@media (max-width: 767.98px) {
  .h3 {
    font-size: 20px;
  }
}

.h4 {
  /* Title/H4 */
  font-size: 24px;
  font-weight: 600;
  line-height: 150%;
  /* 150% */
  letter-spacing: -0.72px;
}

@media (max-width: 991.98px) {
  .h4 {
    font-size: 22px;
    letter-spacing: normal;
  }
}

@media (max-width: 767.98px) {
  .h4 {
    font-size: 20px;
  }
}

.h5 {
  /* Title/H5 */
  font-size: 18px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.36px;
}

@media (max-width: 991.98px) {
  .h5 {
    font-size: 16px;
    letter-spacing: normal;
  }
}

@media (max-width: 767.98px) {
  .h5 {
    font-size: 14px;
  }
}

.h6 {
  color: var(--Color-Text-Black-100);
  /* Title/H6 */
  font-size: 16px;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.32px;
}

@media (max-width: 767.98px) {
  .h6 {
    font-size: 14px;
    letter-spacing: normal;
  }
}


/***********BADGE*************************/
.badge-icon {
  display: inline-flex;
  max-width: -moz-fit-content;
  max-width: fit-content;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 16px;
}

.badge-icon.mini {
  height: 32px;
  width: 32px;
  border-radius: 8px;
  padding: 8px;
}

.badge-icon.mini img {
  width: 16px;
  height: 16px;
}

.badge-icon.w-40 {
  width: 40px;
  max-width: 40px;
  height: 40px;
  padding: 8px;
}

.badge-icon.w-40 img {
  width: 24px;
  height: 24px;
}

.badge-icon.small {
  padding: 8px;
  width: 56px;
  height: 56px;
}

.badge-icon.small img {
  width: 40px;
  height: 40px;
}

@media (max-width: 767.98px) {
  .badge-icon.small {
    width: 48px;
    height: 48px;
    padding: 4px;
  }
}

.badge-icon.small-2 {
  padding: 16px;
  width: 56px;
  height: 56px;
}

.badge-icon.small-2 img {
  width: 24px;
  height: 24px;
}

@media (max-width: 767.98px) {
  .badge-icon.small-2 {
    width: 48px;
    height: 48px;
    padding: 12px;
  }
}

.badge-icon.middle {
  padding: 20px;
  width: 64px;
  height: 64px;
}

.badge-icon.middle img {
  width: 24px;
  height: 24px;
}

@media (max-width: 767.98px) {
  .badge-icon.middle {
    padding: 8px;
    width: 56px;
    height: 56px;
  }
}

.badge-icon.large {
  width: 80px;
  height: 80px;
  padding: 16px;
}

.badge-icon.large img {
  width: 32px;
  height: 32px;
}

@media (max-width: 767.98px) {
  .badge-icon.large {
    padding: 16px;
    width: 64px;
    height: 64px;
  }
}

.badge-icon.accent {
  background: var(--Color-Accent-Lime, #d1f55f);
}

.badge-icon.primary-blue {
  background: var(--Color-Primary-Blue);
}

.badge-icon.primary-light-gray {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.badge-icon.primary-dark-blue {
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.badge-icon.black-100 {
  background: var(--Color-Text-Black-100, #000);
}

.badge-text {
  border-radius: 16px;
  background: var(--Color-Text-70, rgba(0, 0, 0, 0.7));
  display: flex;
  width: 56px;
  height: 56px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  color: var(--Color-Accent-Bright-lime, #d1f55f);
}

.badge-text span {
  color: var(--Color-Accent-Bright-lime, #d1f55f);
  text-align: center;
  font-family: "Be Vietnam Pro";
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

@media (max-width: 767.98px) {
  .badge-text {
    width: 48px;
    height: 48px;
    padding: 4px;
  }
}

.badge-text.primary-dark-blue {
  border-radius: 16px;
  background: var(--Color-Primary-Dark-Blue, #161625);
}


/**************Content Wrapper******************************/
.section-bottom {
  padding-bottom: var(--section-padding);
}

@media (max-width: 991.98px) {
  .section-bottom {
    padding-bottom: var(--section-padding);
  }
}

@media (max-width: 767.98px) {
  .section-bottom {
    padding-bottom: var(--section-padding);
  }
}

@media (max-width: 487.98px) {
  .section-bottom {
    padding-bottom: var(--section-padding);
  }
}

.section {
  padding: var(--section-padding) 0px;
}

@media (max-width: 991.98px) {
  .section {
    padding: var(--section-padding) 0px;
  }
}

@media (max-width: 767.98px) {
  .section {
    padding: var(--section-padding) 0px;
  }
}

@media (max-width: 487.98px) {
  .section {
    padding: var(--section-padding) 0px;
  }
}

.section-content {
  display: flex;
  flex-direction: column;
  gap: 64px;
}

@media (max-width: 991.98px) {
  .section-content {
    gap: 48px;
  }
}

@media (max-width: 767.98px) {
  .section-content {
    gap: 32px;
  }
}

.section-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

@media (max-width: 991.98px) {
  .section-header {
    gap: 20px;
  }
}

@media (max-width: 767.98px) {
  .section-header {
    gap: 16px;
  }
}

.section-padding {
  padding: 80px 56px;
  border-radius: 24px;
}

@media (max-width: 991.98px) {
  .section-padding {
    padding: 40px 20px;
  }
}

@media (max-width: 767.98px) {
  .section-padding {
    padding: 32px 16px;
  }
}

.flex-content-50 {
  display: flex;
  gap: 24px;
}

@media (min-width: 991.98px) {
  .flex-content-50 {
    align-items: center;
    justify-content: space-between;
  }

  .flex-content-50 div:nth-child(1),
  .flex-content-50 div:nth-child(2) {
    flex: 0 1 50%;
  }
}

@media (max-width: 991.98px) {
  .flex-content-50 {
    flex-direction: column;
  }
}

.bottom-cta-bg {
  position: relative;
}

.bottom-cta-bg::after {
  content: "";
  width: 100%;
  height: 121px;
  background: var(--Color-Primary-Dark-Blue, #161625);
  position: absolute;
  bottom: 0;
}

.bottom-cta-bg [class*=__content] {
  position: relative;
  z-index: 2;
}

.check-list {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

.check-list__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0px 8px;
}

.check-list__item::before {
  width: 24px;
  height: 24px;
  content: url("/assets/icons/RoundCheck.svg");
}

.cards {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.card {
  display: flex;
  align-items: center;
  gap: 16px;
  align-self: stretch;
  border-radius: 20px;
  border: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.3));
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

@media (min-width: 991.98px) {
  .card {
    padding: 24px 32px 24px 24px;
  }
}

@media (max-width: 991.98px) {
  .card {
    padding: 16px 24px 16px 16px;
  }
}

.text-dark-100 .regular-text {
  color: var(--Color-Text-Black-100, #000) !important;
}

.button-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 20;
  outline: none;
  transition: all 0.3s;
}

.button-icon::after {
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  position: absolute;
  transition: opacity 0.3s;
  inset: -4px;
  opacity: 0;
  z-index: -1;
  border-radius: 48px;
  content: "";
}

.button-icon.large {
  width: 72px;
  height: 72px;
  border-radius: 100%;
}

.button-icon.large:hover {
  cursor: pointer;
}

.button-icon-max {
  border-radius: 48px;
  width: 64px;
  height: 64px;
  padding: 16px;
}

@media (max-width: 767.98px) {
  .button-icon-max {
    width: 56px;
    height: 56px;
    padding: 12px;
  }
}

.button-icon-max-2 {
  border-radius: 48px;
  width: 72px;
  height: 72px;
  padding: 24px;
}

@media (max-width: 767.98px) {
  .button-icon-max-2 {
    width: 64px;
    height: 64px;
    padding: 16px;
  }
}

.button-icon-max-3 {
  border-radius: 48px;
  width: 56px;
  height: 56px;
  padding: 16px;
}

.button {
  border-radius: 48px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-family: "Be Vietnam Pro";
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  position: relative;
  z-index: 20;
  outline: none;
  /* 125% */
}

.button::after {
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  position: absolute;
  border-radius: 48px;
  transition: opacity 0.3s ease, background-color 0.3s ease, transform 0.3s ease;
  inset: -4px;
  opacity: 0;
  background-color: transparent;
  z-index: -1;
  content: "";
}

.button.base {
  padding: 8px 8px 8px 32px;
  gap: 16px;
  height: 64px;
  border-radius: 48px;
}

.button.base .button-icon {
  border-radius: 48px;
  padding: 8px;
  width: 48px;
  height: 48px;
}

.button.base::after {
  display: none;
  border-radius: 48px;
}

.button.large {
  height: 80px;
  padding: 12px 12px 12px 32px;
  gap: 16px;
}

.button.large .button-icon {
  border-radius: 48px;
  padding: 16px;
  width: 56px;
  height: 56px;
}

@media (max-width: 767.98px) {
  .button.large {
    height: 64px;
    padding: 10px 10px 10px 24px;
  }

  .button.large .button-icon {
    border-radius: 48px;
    padding: 16px;
    width: 48px;
    height: 48px;
  }
}

.button.middle {
  gap: 8px;
  padding: 12px 12px 12px 24px;
  border-radius: 112px;
}

.button.middle .button-icon {
  border-radius: 40px;
  width: 48px;
  height: 48px;
  padding: 8px;
}

.button.middle::after {
  border-radius: 40px;
}

@media (max-width: 767.98px) {
  .button.middle {
    height: 48px;
    padding: 10px 10px 10px 24px;
  }

  .button.middle .button-icon {
    border-radius: 48px;
    padding: 6px;
    width: 36px;
    height: 36px;
  }
}

.button.small-secondary {
  border-radius: 48px;
  height: 56px;
  gap: 8px;
  padding: 16px 16px 16px 32px;
}

.button.small-secondary::after {
  border-radius: 48px;
}

@media (max-width: 767.98px) {
  .button.small-secondary {
    height: 48px;
    padding: 10px 10px 10px 24px;
  }
}

.button.disabled,
.button:disabled {
  background: var(--Color-Primary-Gray, #d9d9e0) !important;
  color: var(--Color-Primary-Purple-Gray, #89899e) !important;
  cursor: not-allowed;
}

.button.disabled .button-icon,
.button:disabled .button-icon {
  border-radius: 48px;
  background: var(--Color-Primary-Purple-Gray, #89899e) !important;
}

.button.disabled:hover::after,
.button:disabled:hover::after {
  opacity: 0;
  background-color: transparent;
}

.button-accent-secondary {
  background-color: transparent;
  border: 1px solid var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Text-White-100, #fff);
}

.button-accent-secondary:focus {
  border: 3px solid rgba(255, 255, 255, 0.6);
}

.button-accent-secondary:hover {
  background-color: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.button-accent-secondary:hover::after {
  border-radius: 48px;
  opacity: 1;
  border: 3px solid var(--Color-Accent-Lime, #d1f55f);
  background-color: var(--Color-Accent-Lime, #d1f55f);
}

.button-accent-secondary:hover img {
  filter: brightness(0) saturate(100%);
}

.button-accent {
  border: 3px solid var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
  background: var(--Color-Accent-Lime, #d1f55f);
}

.button-accent:focus {
  border: 3px solid rgba(255, 255, 255, 0.6);
}

.button-accent:hover::after {
  opacity: 1;
  background-color: var(--Color-Accent-Lime, #d1f55f);
}

.button-accent:hover .button-icon::after {
  opacity: 1;
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.button-primary-dark {
  color: var(--Color-Text-White-100, #fff);
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.button-primary-dark:focus {
  border: 3px solid rgba(255, 255, 255, 0.6);
}

.button-primary-dark:hover::after {
  opacity: 1;
  border-radius: 112px;
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.button-primary-dark:hover .button-icon::after {
  opacity: 1;
  background-color: var(--Color-Accent-Lime, #d1f55f);
}

.button-icon-dark {
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.button-icon-dark:focus {
  border: 3px solid rgba(255, 255, 255, 0.6);
}

.button-icon-dark:hover::after {
  opacity: 1;
  border-radius: 112px;
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.button-icon-accent {
  background: var(--Color-Accent-Lime, #d1f55f);
}

.button-icon-accent:focus {
  border: 3px solid rgba(255, 255, 255, 0.6);
}

.button-icon-accent:hover::after {
  opacity: 1;
  background-color: var(--Color-Accent-Lime, #d1f55f);
}

.button-green {
  display: flex;
  padding: 12px 32px;
  justify-content: center;
  align-items: center;
  gap: 16px;
  border-radius: 48px;
  color: var(--Color-Text-Black-100, #000);
  text-align: center;
  /* Batton/Small */
  font-family: "Be Vietnam Pro";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px;
  /* 150% */
  letter-spacing: -0.32px;
  transition: all 0.3s ease-in-out;
}

.button-green.primary {
  background: var(--Color-Accent-Lime, #D1F55F);
}

.button-green.primary:focus {
  border: 3px solid rgba(255, 255, 255, 0.6);
}

.button-green.primary:active {
  background: var(--Color-Accent-Lime, #D1F55F);
}

.button-green.primary:hover {
  background: var(--Color-Accent-Lime, #D1F55F);
}

.button-green.primary:disabled {
  color: var(--Color-Primary-Purple-Gray, #89899E);
  background: var(--Color-Primary-Gray, #D9D9E0);
}

.button-green.secondary {
  border: 1px solid var(--Color-Primary-Purple-Gray, #89899E);
}

.button-green.secondary:focus {
  border: 3px solid var(--Color-Primary-Purple-Gray, #89899E);
}

.button-green.secondary:active {
  border: 1px solid var(--Color-Primary-Purple-Gray, #89899E);
  background: var(--Color-Accent-Lime, #D1F55F);
}

.button-green.secondary:hover {
  border: 1px solid var(--Color-Primary-Purple-Gray, #89899E);
  background: var(--Color-Accent-Lime, #D1F55F);
}

.button-green.secondary:disabled {
  color: var(--Color-Primary-Purple-Gray, #89899E);
  border: 1px solid var(--Color-Primary-Purple-Gray, #89899E);
}


/* ===== fiscari page styles: lifted from glasscubes-v2/style.css ===== */
.fiscari-badge {
  display: inline-block;
  padding: 6px 16px;
  border-radius: 24px;
  background: var(--Color-Accent-Light-Blue, #e3e3fc);
  color: var(--Color-Primary-Blue, #2a2a49);
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0.2px;
}

.fiscari-badge--hero {
  background: rgba(42, 42, 73, 0.1);
  color: var(--Color-Primary-Blue, #2a2a49);
  border: 1px solid rgba(42, 42, 73, 0.2);
}

.fiscari-badge--lime {
  background: rgba(209, 245, 95, 0.15);
  color: var(--Color-Accent-Lime, #d1f55f);
}

.fiscari-badge--launch {
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Blue, #2a2a49);
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  font-size: 17px;
  display: block;
  transform: rotate(-17deg);
  width: fit-content;
  align-self: flex-start;
}

.fiscari-methodology-link {
  display: inline-block;
  margin-top: 8px;
  font-size: 14px;
  color: var(--Color-Accent-Lime, #d1f55f);
  opacity: 0.8;
  text-decoration: none;
  border-bottom: 1px solid rgba(209, 245, 95, 0.35);
  transition: opacity 0.2s;
}
.fiscari-methodology-link:hover {
  opacity: 1;
}

.fiscari-section-header {
  text-align: center;
  max-width: 720px;
  margin: 0 auto 56px;
}

.fiscari-section-header .h2 {
  margin: 16px 0;
}

.fiscari-section-header .large-text {
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
}

/* ---- Hero ---- */
.fiscari-hero {
  background: var(--Color-Accent-Light-Blue, #e3e3fc);
  padding-top: calc(var(--section-padding) + 48px);
  text-align: center;
}

.fiscari-hero__content {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
}

.fiscari-hero .h1 {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-hero .h1 span {
  color: var(--Color-Primary-Dark-Blue, #161625);
  letter-spacing: inherit;
}


.fiscari-hero .large-text {
  color: rgba(22, 22, 37, 0.72);
}

.fiscari-hero__buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}

/* White button — for use on lime backgrounds */
.fiscari-btn-white {
  background: #fff;
  color: var(--Color-Primary-Dark-Blue, #161625);
  border: 3px solid rgba(22, 22, 37, 0.12);
}

.fiscari-btn-white:hover::after {
  opacity: 1;
  background: #fff;
  border-radius: 112px;
}

/* ---- Problem ---- */
.fiscari-problem {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fiscari-problem__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

@media (max-width: 767.98px) {
  .fiscari-problem__cards {
    grid-template-columns: 1fr;
  }
}

.fiscari-problem__card {
  background: #fff;
  border-radius: 24px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.3));
}

.fiscari-problem__card .h4 {
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-problem__card .regular-text {
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
}

.fiscari-problem__card--highlight {
  background: var(--Color-Primary-Blue, #2a2a49);
  border-color: transparent;
}

.fiscari-problem__card--highlight .h4 {
  color: var(--Color-Text-White-100, #fff);
}

.fiscari-problem__card--highlight .regular-text {
  color: var(--Color-Text-White-80, rgba(255, 255, 255, 0.8));
}

.fiscari-problem__case-link {
  color: var(--Color-Accent-Lime, #d1f55f);
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: rgba(209, 245, 95, 0.4);
}
.fiscari-problem__case-link:hover {
  text-decoration-color: var(--Color-Accent-Lime, #d1f55f);
}

/* ---- Testimonial ---- */
.fiscari-testimonial {
  background: #fff;
}

.fiscari-testimonial__card {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  border-radius: 32px;
  padding: 56px 64px;
  max-width: 960px;
  margin: 0 auto;
}

@media (max-width: 767.98px) {
  .fiscari-testimonial__card {
    padding: 40px 24px;
  }
}

.fiscari-testimonial__quote-mark {
  font-size: 96px;
  line-height: 0.7;
  color: var(--Color-Accent-Lime, #d1f55f);
  font-family: Georgia, serif;
  display: block;
}

.fiscari-testimonial__text {
  font-style: italic;
  margin-bottom: 32px;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
}

.fiscari-testimonial__avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 2px solid rgba(0, 0, 0, 0.08);
}

.fiscari-testimonial__name {
  font-weight: 600;
  font-size: 16px;
  color: var(--Color-Text-Black-100, #000);
  margin-bottom: 4px;
}

.fiscari-testimonial__role {
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
}

.fiscari-testimonial__role a {
  color: var(--Color-Additional-Link, #3e58ec);
  text-decoration: underline;
}

/* ---- Solution ---- */
.fiscari-solution {
  background: #fff;
}

.fiscari-solution__content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

@media (max-width: 991.98px) {
  .fiscari-solution__content {
    grid-template-columns: 1fr;
    gap: 48px;
  }
}

.fiscari-solution__text .h2 {
  margin-bottom: 20px;
}

.fiscari-solution__text > .large-text {
  margin-bottom: 40px;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
}

.fiscari-solution__features {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.fiscari-solution__feature {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.fiscari-solution__feature-icon {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  background: var(--Color-Accent-Lime, #d1f55f);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 2px;
}

.fiscari-solution__feature strong {
  display: block;
  font-weight: 600;
  font-size: 16px;
  line-height: 1.4;
  margin-bottom: 6px;
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-solution__feature .regular-text {
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  font-size: 15px;
}

/* Answer mockup — product UI card */
.fiscari-answer-mockup {
  background: #fff;
  border: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.3));
  border-radius: 16px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  font-size: 14px;
}

.fiscari-am__label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  margin-bottom: 8px;
}

/* Query section */
.fiscari-am__query-section {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  padding: 20px 24px;
  border-bottom: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.2));
}

.fiscari-am__query-text {
  font-size: 14px;
  font-weight: 500;
  color: var(--Color-Primary-Blue, #2a2a49);
  line-height: 1.5;
}

/* Answer section */
.fiscari-am__answer-section {
  padding: 20px 24px;
  border-bottom: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.2));
}

.fiscari-am__answer-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.fiscari-am__answer-body p {
  font-size: 13px;
  line-height: 1.7;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
}

/* Citations section */
.fiscari-am__citations-section {
  padding: 20px 24px;
}

.fiscari-am__citations-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fiscari-am__citation {
  display: flex;
  gap: 12px;
  padding: 10px 12px;
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  border-radius: 8px;
  border: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.2));
  align-items: flex-start;
  transition: border-color 0.15s ease;
}

.fiscari-am__citation:hover {
  border-color: var(--Color-Primary-Purple-Gray, #89899e);
}

.fiscari-am__citation-num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(209, 245, 95, 0.35);
  color: var(--Color-Primary-Blue, #2a2a49);
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
}

.fiscari-am__citation-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.fiscari-am__citation-title {
  font-size: 12px;
  font-weight: 600;
  color: var(--Color-Primary-Blue, #2a2a49);
  line-height: 1.4;
}

.fiscari-am__citation-sub {
  font-size: 11px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  line-height: 1.4;
}

.fiscari-am__citation-url {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--Color-Additional-Link, #3e58ec);
  text-decoration: none;
  margin-top: 2px;
  transition: opacity 0.15s ease;
}

.fiscari-am__citation-url:hover {
  opacity: 0.75;
}

/* ---- Principle (dark) ---- */
.fiscari-principle {
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-principle__content {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}

.fiscari-principle__title {
  color: var(--Color-Text-White-100, #fff) !important;
}

.fiscari-principle__text {
  color: var(--Color-Text-White-80, rgba(255, 255, 255, 0.8));
}

/* ---- Comparison ---- */
.fiscari-comparison {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fiscari-comparison__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 24px;
}

.fiscari-comparison__table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  min-width: 600px;
}

.fiscari-comparison__table thead tr {
  background: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-comparison__table thead th {
  padding: 20px 24px;
  text-align: left;
  font-weight: 600;
  color: var(--Color-Text-White-100, #fff);
}

.fiscari-comparison__th--highlight {
  background: var(--Color-Primary-Dark-Blue, #161625) !important;
  color: var(--Color-Accent-Lime, #d1f55f) !important;
}

.fiscari-comparison__table tbody tr {
  border-bottom: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.3));
}

.fiscari-comparison__table tbody tr:last-child {
  border-bottom: none;
}

.fiscari-comparison__table tbody td {
  padding: 20px 24px;
}

.fiscari-comparison__table tbody td:first-child {
  font-weight: 600;
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-td--bad {
  color: var(--Color-Primary-Purple-Gray, #89899e);
}

.fiscari-td--good {
  color: var(--Color-Primary-Blue, #2a2a49);
  font-weight: 600;
  background: rgba(209, 245, 95, 0.08);
}

/* ---- Audience ---- */
.fiscari-audience {
  background: #fff;
}

.fiscari-audience__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
}

@media (max-width: 767.98px) {
  .fiscari-audience__cards {
    grid-template-columns: 1fr;
  }
}

.fiscari-audience__card {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  border-radius: 32px;
  padding: 48px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}

.fiscari-audience__card .h3 {
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-audience__card--dark {
  background: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-audience__card--dark .h3 {
  color: var(--Color-Text-White-100, #fff);
}

.fiscari-audience__card--dark .regular-text {
  color: var(--Color-Text-White-80, rgba(255, 255, 255, 0.8));
}

.fiscari-audience__list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex: 1;
}

.fiscari-audience__list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
}

.fiscari-audience__card--dark .fiscari-audience__list li {
  color: var(--Color-Text-White-80, rgba(255, 255, 255, 0.8));
}

/* Audience card buttons — shrink to content */
.fiscari-audience__card .button {
  align-self: flex-start;
}

/* "Start Free" — lime default state; hover ring matches each element's own colour so it expands without changing */
.fiscari-audience__card .button-primary-dark {
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-audience__card .button-primary-dark:hover::after {
  background: var(--Color-Accent-Lime, #d1f55f);
  border-radius: 112px;
}

.fiscari-audience__card .button-primary-dark:hover .button-icon::after {
  background: var(--Color-Primary-Dark-Blue, #161625);
}

/* "Get API Access" — no colour change on hover; expand via lime border ring + lime icon ring */
.fiscari-audience__card .button-accent-secondary:hover {
  background-color: transparent;
  color: var(--Color-Text-White-100, #fff);
}

.fiscari-audience__card .button-accent-secondary:hover::after {
  border-radius: 112px;
  background-color: transparent;
  border: 1px solid var(--Color-Accent-Lime, #d1f55f);
}

.fiscari-audience__card .button-accent-secondary:hover .button-icon::after {
  opacity: 1;
  background: var(--Color-Accent-Lime, #d1f55f);
}

.fiscari-audience__card .button-accent-secondary:hover img {
  filter: none;
}

/* ---- API Response Code Block ---- */
.fiscari-api-response {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  overflow: hidden;
}

.fiscari-api-response__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.05);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.fiscari-api-response__label {
  font-family: 'Be Vietnam Pro', sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.45);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.fiscari-api-response__status {
  font-family: 'Courier New', monospace;
  font-size: 11px;
  font-weight: 700;
  color: #4ade80;
  background: rgba(74, 222, 128, 0.12);
  padding: 2px 8px;
  border-radius: 4px;
}

.fiscari-api-response__code {
  margin: 0;
  padding: 16px;
  font-family: 'Fira Code', 'Fira Mono', 'Courier New', monospace;
  font-size: 11.5px;
  line-height: 1.65;
  overflow-x: auto;
  white-space: pre;
}

.fjson-k { color: var(--Color-Accent-Light-Blue, #e3e3fc); }
.fjson-s { color: var(--Color-Accent-Lime, #d1f55f); }
.fjson-b { color: #fb923c; }
.fjson-n { color: #fb923c; }
.fjson-p { color: rgba(255, 255, 255, 0.35); }

/* ---- Use Cases ---- */
.fiscari-usecases {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fiscari-usecases__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

@media (max-width: 991.98px) {
  .fiscari-usecases__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 567.98px) {
  .fiscari-usecases__grid {
    grid-template-columns: 1fr;
  }
}

.fiscari-usecase {
  background: #fff;
  border-radius: 20px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.3));
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.fiscari-usecase:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

.fiscari-usecase__category {
  display: inline-block;
  background: var(--Color-Accent-Light-Blue, #e3e3fc);
  color: var(--Color-Primary-Blue, #2a2a49);
  font-size: 12px;
  font-weight: 600;
  padding: 4px 12px;
  border-radius: 12px;
  letter-spacing: 0.3px;
  width: fit-content;
}

.fiscari-usecase .regular-text {
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
  font-style: italic;
  font-size: 15px;
}

/* ---- Friction ---- */
.fiscari-friction {
  background: #fff;
}

.fiscari-friction__cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

@media (max-width: 991.98px) {
  .fiscari-friction__cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 567.98px) {
  .fiscari-friction__cards {
    grid-template-columns: 1fr;
  }
}

.fiscari-friction__card {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  border-radius: 20px;
  padding: 32px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.fiscari-friction__icon {
  width: 56px;
  height: 56px;
  background: var(--Color-Accent-Lime, #d1f55f);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.fiscari-friction__card .h4 {
  color: var(--Color-Primary-Blue, #2a2a49);
}

/* ---- Pricing ---- */
html:has(.fiscari-home) {
  scroll-behavior: smooth;
}

.fiscari-home #pricing {
  scroll-margin-top: 96px;
}

.fiscari-pricing {
  background: #fff;
}

.fiscari-pricing__eyebrow {
  display: inline-block;
  background: var(--Color-Accent-Light-Blue, #e3e3fc);
  color: var(--Color-Primary-Blue, #2a2a49);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
  padding: 4px 12px;
  border-radius: 12px;
}

.fiscari-pricing__cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  align-items: stretch;
}

@media (max-width: 767.98px) {
  .fiscari-pricing__cards {
    grid-template-columns: 1fr;
  }
}

.fiscari-pricing__card {
  position: relative;
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  border: 1px solid var(--Color-Stroke-Dark, rgba(137, 137, 158, 0.3));
  border-radius: 20px;
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.fiscari-pricing__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

.fiscari-pricing__card--featured {
  background: var(--Color-Primary-Dark-Blue, #161625);
  border-color: var(--Color-Primary-Dark-Blue, #161625);
  color: #fff;
}

.fiscari-pricing__card--featured .fiscari-pricing__name,
.fiscari-pricing__card--featured .fiscari-pricing__amount,
.fiscari-pricing__card--featured .fiscari-pricing__period {
  color: #fff;
}

.fiscari-pricing__card--featured .fiscari-pricing__sub,
.fiscari-pricing__card--featured .fiscari-pricing__price-note,
.fiscari-pricing__card--featured .fiscari-pricing__features {
  color: rgba(255, 255, 255, 0.75);
}

.fiscari-pricing__badge {
  position: absolute;
  top: -12px;
  left: 32px;
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.3px;
  padding: 6px 14px;
  border-radius: 12px;
}

.fiscari-pricing__head {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.fiscari-pricing__name {
  color: var(--Color-Primary-Blue, #2a2a49);
  margin: 0;
}

.fiscari-pricing__sub {
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  margin: 0;
}

.fiscari-pricing__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}

.fiscari-pricing__amount {
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 48px;
  line-height: 1;
  font-weight: 600;
  color: var(--Color-Primary-Dark-Blue, #161625);
  letter-spacing: -0.5px;
}

.fiscari-pricing__amount--sm {
  font-size: 22px;
  letter-spacing: 0;
}

.fiscari-pricing__period {
  font-size: 15px;
  font-weight: 500;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
}

.fiscari-pricing__price-note {
  font-size: 13px;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  margin: -16px 0 0;
}

.fiscari-pricing__features {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding-top: 20px;
}

.fiscari-pricing__card--featured .fiscari-pricing__features {
  border-top-color: rgba(255, 255, 255, 0.15);
}

.fiscari-pricing__features li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 15px;
  line-height: 1.5;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
}

.fiscari-pricing__card--featured .fiscari-pricing__features li {
  color: rgba(255, 255, 255, 0.9);
}

.fiscari-pricing__check {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background: var(--Color-Accent-Lime, #d1f55f);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}

.fiscari-pricing__check img {
  width: 14px;
  height: 14px;
}

.fiscari-pricing__cta {
  margin-top: auto;
  align-self: stretch;
  justify-content: center;
}

.fiscari-pricing__footnote {
  max-width: 760px;
  margin: 40px auto 0;
  text-align: center;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  font-size: 14px;
}

/* ---- Firm-wide cost calculator (featured card) ---- */
.fiscari-calc {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 24px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

/* Users control — a primary element: large label + compact stepper */
.fiscari-calc__control {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.fiscari-calc__label {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  letter-spacing: -0.2px;
}

.fiscari-calc__stepper {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.fiscari-calc__step {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
  font-size: 22px;
  line-height: 1;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: opacity 0.2s ease, transform 0.1s ease;
}

.fiscari-calc__step:hover {
  opacity: 0.85;
}

.fiscari-calc__step:active {
  transform: scale(0.95);
}

.fiscari-calc__step:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.fiscari-calc__input {
  width: 68px;
  height: 40px;
  text-align: center;
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 10px;
  -moz-appearance: textfield;
  appearance: textfield;
}

.fiscari-calc__input::-webkit-outer-spin-button,
.fiscari-calc__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.fiscari-calc__input:focus {
  outline: 2px solid var(--Color-Accent-Lime, #d1f55f);
  outline-offset: 1px;
}

/* Volume discount — the headline saving, given the most visual weight */
.fiscari-calc__discount {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 20px;
}

.fiscari-calc__discount-label {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}

.fiscari-calc__discount-value {
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 40px;
  line-height: 1;
  font-weight: 700;
  color: var(--Color-Accent-Lime, #d1f55f);
  letter-spacing: -1px;
}

/* Totals — annual prominent, monthly de-emphasised underneath */
.fiscari-calc__totals {
  display: flex;
  flex-direction: column;
  gap: 6px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding-top: 16px;
}

.fiscari-calc__primary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.85);
}

.fiscari-calc__primary > span:last-child {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
}

.fiscari-calc__secondary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
}

.fiscari-calc__secondary > span:last-child {
  font-weight: 600;
  white-space: nowrap;
}

.fiscari-calc__secondary small {
  font-size: 10px;
  font-weight: 400;
  opacity: 0.7;
}

/* ---- Final CTA ---- */
.fiscari-final-cta {
  background: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-final-cta__content {
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}

.fiscari-final-cta__title {
  color: var(--Color-Text-White-100, #fff) !important;
}

.fiscari-final-cta__text {
  color: var(--Color-Text-White-80, rgba(255, 255, 255, 0.8));
}

.fiscari-final-cta__buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}

/* ---- Demo widget ---- */

@keyframes fiscari-wobble {
  0%, 85%, 100% { transform: scale(1) rotate(0deg); }
  88%            { transform: scale(1.06) rotate(-2deg); }
  92%            { transform: scale(1.06) rotate(2deg); }
  96%            { transform: scale(1.03) rotate(-1deg); }
}

@keyframes fiscari-spin {
  to { transform: rotate(360deg); }
}

@keyframes fiscari-blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

@keyframes fiscari-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.4; }
}

@keyframes fiscari-fadein {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.fiscari-demo {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: left;
}

/* Ensure hidden attribute works on flex/grid children inside the demo */
.fiscari-demo [hidden] {
  display: none !important;
}

.fiscari-demo__input-wrap {
  background: #fff;
  border-radius: 16px;
  border: 2px solid rgba(42, 42, 73, 0.1);
  padding: 16px 16px 16px 20px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  box-shadow: 0 8px 40px rgba(42, 42, 73, 0.15);
  transition: border-color 0.2s ease;
}

.fiscari-demo__input-wrap:focus-within {
  border-color: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-demo__search-icon {
  flex-shrink: 0;
  margin-top: 4px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
}

.fiscari-demo__textarea {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  resize: none;
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--Color-Primary-Blue, #2a2a49);
  cursor: default;
  overflow: hidden;
}

.fiscari-demo__ask-btn {
  flex-shrink: 0;
  align-self: flex-end;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 10px;
  background: var(--Color-Primary-Dark-Blue, #161625);
  color: var(--Color-Accent-Lime, #d1f55f);
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s ease, opacity 0.2s ease;
  animation: fiscari-wobble 5s ease-in-out infinite;
  box-shadow: 0 4px 16px rgba(22, 22, 37, 0.25);
}

.fiscari-demo__ask-btn:hover {
  background: var(--Color-Primary-Blue, #2a2a49);
  color: var(--Color-Accent-Lime, #d1f55f);
}

.fiscari-demo__ask-btn--loading {
  animation: none;
  opacity: 0.85;
}

.fiscari-demo__ask-btn:disabled {
  cursor: not-allowed;
}

.fiscari-demo__spinner {
  animation: fiscari-spin 0.7s linear infinite;
}

/* "Try it" annotation */
.fiscari-demo__annotation {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-right: 24px;
  margin-top: -4px;
  color: rgba(22, 22, 37, 0.4);
  pointer-events: none;
  user-select: none;
}

.fiscari-demo__annotation-text {
  font-size: 28px;
  font-weight: 600;
  font-style: italic;
  transform: rotate(-2deg);
  display: block;
  margin-top: -4px;
  font-family: cursive;
}

/* Answer panel */
.fiscari-demo__answer {
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
  animation: fiscari-fadein 0.3s ease;
}

.fiscari-demo__answer-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px 10px;
  text-align: left;
}

.fiscari-demo__confidence-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 20px;
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  color: var(--Color-Primary-Purple-Gray, #89899e);
  font-size: 12px;
  font-weight: 500;
}

.fiscari-demo__confidence-badge--high {
  background: rgba(209, 245, 95, 0.18);
  color: #3a6600;
}

.fiscari-demo__badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--Color-Primary-Purple-Gray, #89899e);
  flex-shrink: 0;
}

.fiscari-demo__badge-dot--pulse {
  animation: fiscari-pulse 1.2s ease-in-out infinite;
}

.fiscari-demo__badge-dot--high {
  background: #5a9e00;
}

.fiscari-demo__source-count {
  font-size: 12px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
}

.fiscari-demo__status-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 18px 10px;
  font-size: 14px;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
}

.fiscari-demo__status-row .fiscari-demo__spinner {
  color: var(--Color-Primary-Blue, #2a2a49);
}

/* Prose rendering */
.fiscari-demo__prose {
  padding: 4px 18px 14px;
  text-align: left;
}

.fiscari-prose__h1 {
  font-size: 16px;
  font-weight: 700;
  color: var(--Color-Primary-Blue, #2a2a49);
  margin: 14px 0 6px;
  line-height: 1.3;
}

.fiscari-prose__h2 {
  font-size: 14px;
  font-weight: 700;
  color: var(--Color-Primary-Blue, #2a2a49);
  margin: 12px 0 4px;
  line-height: 1.3;
}

.fiscari-prose__p {
  font-size: 14px;
  line-height: 1.65;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
  margin: 0 0 8px;
}

.fiscari-prose__ol,
.fiscari-prose__ul {
  margin: 4px 0 10px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.fiscari-prose__ol { list-style: decimal; }
.fiscari-prose__ul { list-style: disc; }

.fiscari-prose__ol li,
.fiscari-prose__ul li {
  font-size: 14px;
  line-height: 1.6;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
  list-style: inherit;
}

.fiscari-prose__cursor {
  display: inline-block;
  width: 2px;
  height: 14px;
  background: var(--Color-Primary-Blue, #2a2a49);
  vertical-align: text-bottom;
  margin-left: 2px;
  animation: fiscari-blink 0.8s ease-in-out infinite;
}

.fiscari-prose__h3 {
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--Color-Primary-Blue, #2a2a49);
  margin: 14px 0 6px;
  letter-spacing: 0.1px;
}

.fiscari-prose__hr {
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  margin: 14px 0;
}

.fiscari-prose__table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 14px;
  font-size: 13px;
}

.fiscari-prose__table th,
.fiscari-prose__table td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  vertical-align: top;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
}

.fiscari-prose__table th {
  font-weight: 600;
  color: var(--Color-Primary-Blue, #2a2a49);
  background: rgba(0, 0, 0, 0.025);
}

/* ---- Inline citation pills (mirror app's InlineCitationBadge contract) ---- */
.fiscari-cite__btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0 2px;
  padding: 1px 8px 1px 6px;
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--Color-Primary-Dark-Blue, #161625);
  background: var(--Color-Accent-Lime, #d1f55f);
  border: 1px solid transparent;
  border-radius: 999px;
  cursor: pointer;
  vertical-align: baseline;
  transition: background 0.15s ease, border-color 0.15s ease;
  letter-spacing: 0.1px;
}

.fiscari-cite__btn:hover,
.fiscari-cite__btn:focus-visible {
  background: #c0e84a;
  border-color: var(--Color-Primary-Dark-Blue, #161625);
  outline: none;
}

.fiscari-cite__chev {
  flex-shrink: 0;
  transition: transform 0.15s ease;
}

.fiscari-cite__btn[aria-expanded="true"] .fiscari-cite__chev {
  transform: rotate(90deg);
}

.fiscari-cite__panel {
  display: block;
  margin: 10px 0;
}

.fiscari-cite__panel[hidden] {
  display: none;
}

.fiscari-cite__panel-inner {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-left: 3px solid var(--Color-Accent-Lime, #d1f55f);
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 13px;
}

.fiscari-cite__panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.fiscari-cite__badge {
  display: inline-block;
  padding: 2px 8px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-radius: 4px;
}

.fiscari-cite__badge.fiscari-citation__badge--legislation { background: var(--Color-Primary-Dark-Blue, #161625); color: #fff; }
.fiscari-cite__badge.fiscari-citation__badge--guidance    { background: #475569; color: #fff; }
.fiscari-cite__badge.fiscari-citation__badge--manual      { background: #475569; color: #fff; }
.fiscari-cite__badge.fiscari-citation__badge--tribunal    { background: #6d28d9; color: #fff; }

.fiscari-cite__ext {
  display: inline-flex;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  transition: color 0.15s ease;
}

.fiscari-cite__ext:hover {
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-cite__title {
  font-weight: 600;
  color: var(--Color-Primary-Dark-Blue, #161625);
  margin: 0 0 6px;
  line-height: 1.4;
}

.fiscari-cite__title-link {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
  text-decoration-color: rgba(0, 0, 0, 0.25);
  transition: text-decoration-color 0.15s ease, color 0.15s ease;
}

.fiscari-cite__title-link:hover,
.fiscari-cite__title-link:focus-visible {
  color: var(--Color-Primary-Blue, #2a2a49);
  text-decoration-color: currentColor;
  outline: none;
}

.fiscari-cite__quote {
  margin: 0 0 6px;
  padding: 0 0 0 10px;
  border-left: 2px solid rgba(0, 0, 0, 0.12);
  font-size: 12px;
  font-style: italic;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  line-height: 1.5;
}

.fiscari-cite__meta {
  margin: 0;
  font-size: 11px;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
}

/* Citations */
.fiscari-demo__citations-section {
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  padding: 14px 18px;
}

.fiscari-demo__citations-label {
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  margin-bottom: 10px;
}

.fiscari-citation-card {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  padding: 12px 14px;
  margin-bottom: 8px;
  background: #fff;
  transition: border-color 0.15s ease;
  animation: fiscari-fadein 0.3s ease;
}

.fiscari-citation-card:last-child { margin-bottom: 0; }

.fiscari-citation-card:hover { border-color: rgba(42, 42, 73, 0.25); }

.fiscari-citation__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.fiscari-citation__left {
  display: flex;
  align-items: center;
  gap: 6px;
}

.fiscari-citation__num {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  color: var(--Color-Primary-Purple-Gray, #89899e);
  font-size: 10px;
  font-weight: 600;
  font-family: monospace;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.fiscari-citation__badge {
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.fiscari-citation__badge--legislation { background: var(--Color-Primary-Dark-Blue, #161625); color: #fff; }
.fiscari-citation__badge--guidance    { background: #475569; color: #fff; }
.fiscari-citation__badge--manual      { background: #475569; color: #fff; }
.fiscari-citation__badge--tribunal    { background: #6d28d9; color: #fff; }

.fiscari-citation__link {
  color: var(--Color-Primary-Purple-Gray, #89899e);
  transition: color 0.15s ease;
  flex-shrink: 0;
}

.fiscari-citation__link:hover { color: var(--Color-Primary-Blue, #2a2a49); }

.fiscari-citation__label {
  font-size: 13px;
  font-weight: 600;
  color: var(--Color-Text-Black-80, rgba(0, 0, 0, 0.8));
  line-height: 1.4;
  margin-bottom: 6px;
}

.fiscari-citation__quote {
  font-size: 12px;
  font-family: monospace;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  line-height: 1.6;
  border-left: 2px solid rgba(0, 0, 0, 0.1);
  padding-left: 10px;
  margin-bottom: 6px;
}

.fiscari-citation__authority {
  font-size: 11px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
}

/* Meta footer */
.fiscari-demo__meta-footer {
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  padding: 10px 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  background: rgba(243, 244, 246, 0.4);
  animation: fiscari-fadein 0.3s ease;
}

.fiscari-demo__meta-item {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
}

/* Post-done CTA */
.fiscari-demo__post-cta {
  text-align: center;
  animation: fiscari-fadein 0.3s ease;
}

.fiscari-demo__post-cta a {
  font-size: 14px;
  font-weight: 600;
  color: var(--Color-Primary-Dark-Blue, #161625);
  text-decoration: none;
  transition: opacity 0.15s ease;
}

.fiscari-demo__post-cta a:hover { opacity: 0.8; }

/* ============================================================
   FISCARI SIGNUP MODAL
   ============================================================ */

.fiscari-modal {
  position: fixed;
  inset: 0;
  z-index: 9000;
  overflow-y: auto;
}

.fiscari-modal__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(22, 22, 37, 0.6);
  backdrop-filter: blur(4px);
}

.fiscari-modal__wrap {
  position: relative;
  display: flex;
  min-height: 100%;
  align-items: center;
  justify-content: center;
  padding: 32px 16px;
}

.fiscari-modal__box {
  position: relative;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(22, 22, 37, 0.18);
  border: 1px solid var(--Color-Primary-Light-Gray, #e8e8f0);
  width: 100%;
  max-width: 440px;
  padding: 40px;
}

.fiscari-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  border-radius: 6px;
  transition: color 0.15s, background 0.15s;
}

.fiscari-modal__close:hover {
  color: var(--Color-Primary-Blue, #2a2a49);
  background: var(--Color-Primary-Light-Gray, #e8e8f0);
}

.fiscari-modal__icon-wrap {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(209, 245, 95, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-modal__title {
  margin-bottom: 8px;
}

.fiscari-modal__subtitle {
  color: var(--Color-Primary-Purple-Gray, #89899e);
  margin-bottom: 0;
}

.fiscari-modal__header {
  margin-bottom: 28px;
}

.fiscari-modal__form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.fiscari-modal__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.fiscari-modal__field label {
  font-size: 14px;
  font-weight: 500;
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-modal__field label span {
  font-weight: 400;
  color: var(--Color-Primary-Purple-Gray, #89899e);
}

.fiscari-modal__field input {
  padding: 10px 14px;
  border: 1px solid var(--Color-Primary-Light-Gray, #e8e8f0);
  border-radius: 8px;
  font-size: 15px;
  color: var(--Color-Primary-Blue, #2a2a49);
  background: #fff;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
  font-family: inherit;
  width: 100%;
  box-sizing: border-box;
}

.fiscari-modal__field input::placeholder {
  color: #b0b0c0;
}

.fiscari-modal__field input:focus {
  border-color: var(--Color-Accent-Lime, #d1f55f);
  box-shadow: 0 0 0 3px rgba(209, 245, 95, 0.25);
}

.fiscari-modal__field input[type="text"] {
  text-transform: uppercase;
}

.fiscari-modal__field input[type="text"]::placeholder {
  text-transform: none;
}

.fiscari-modal__checkbox {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.fiscari-modal__checkbox input[type="checkbox"] {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  appearance: checkbox;
  width: 16px;
  height: 16px;
  min-width: 16px;
  margin-top: 2px;
  accent-color: var(--Color-Primary-Blue, #2a2a49);
  cursor: pointer;
  flex-shrink: 0;
}

.fiscari-modal__checkbox label {
  font-size: 13px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  line-height: 1.5;
  cursor: pointer;
}

.fiscari-modal__checkbox label a {
  color: var(--Color-Primary-Blue, #2a2a49);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.fiscari-modal__error {
  font-size: 13px;
  color: #c0392b;
  background: #fdf0ee;
  border: 1px solid #f5c6c0;
  border-radius: 6px;
  padding: 10px 12px;
}

.fiscari-modal__field-opt {
  font-weight: 400;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  margin-left: 4px;
}

.fiscari-modal__field-hint {
  font-size: 13px;
  color: var(--Color-Text-Black-60, rgba(0, 0, 0, 0.6));
  margin: -8px 0 4px;
}

.fiscari-modal__submit {
  width: 100%;
  justify-content: center;
  margin-top: 4px;
}

.fiscari-modal__submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.fiscari-modal__pw-wrap {
  position: relative;
}
.fiscari-modal__pw-wrap input {
  width: 100%;
  padding-right: 42px;
}
.fiscari-modal__pw-toggle {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  line-height: 0;
}
.fiscari-modal__pw-toggle:hover {
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-modal__trust-line {
  margin-top: 12px;
  font-size: 13px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  text-align: center;
  font-style: italic;
}

.fiscari-modal__footer-note {
  margin-top: 20px;
  font-size: 12px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  text-align: center;
  line-height: 1.5;
}

.fiscari-modal__success {
  text-align: center;
  padding: 20px 0;
}

.fiscari-modal__success-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(209, 245, 95, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
  color: var(--Color-Primary-Blue, #2a2a49);
}

.fiscari-modal__success p {
  font-size: 15px;
  color: var(--Color-Primary-Blue, #2a2a49);
  font-weight: 500;
}

.fiscari-modal__success-sub {
  font-size: 13px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  margin-top: 6px;
  font-weight: 400 !important;
}

/* ---- Signup success state -------------------------------------------------
   Once the account is created the modal is only about one thing, so the header,
   form, trust line and footer note all go and the confirmation carries the
   weight instead. Selectors are doubled up where they need to beat the base
   `.fiscari-modal__success p` rule above. */
.fiscari-modal__box.is-success .fiscari-modal__header,
.fiscari-modal__box.is-success .fiscari-modal__trust-line,
.fiscari-modal__box.is-success .fiscari-modal__footer-note {
  display: none;
}

.fiscari-modal__box.is-success .fiscari-modal__success {
  padding: 8px 0 4px;
}

.fiscari-modal__success .fiscari-modal__success-title {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-modal__success .fiscari-modal__success-sub {
  font-size: 14px;
  font-weight: 500 !important;
  line-height: 1.55;
  margin-top: 10px;
  color: rgba(42, 42, 73, 0.72);
}

/* The address is the one thing people need to read back, so it gets the most
   weight. `anywhere` stops a long address pushing the modal wider. */
.fiscari-modal__success-sub strong {
  font-weight: 700;
  color: var(--Color-Primary-Dark-Blue, #161625);
  overflow-wrap: anywhere;
}

.fiscari-modal__success-icon {
  width: 64px;
  height: 64px;
  background: rgba(209, 245, 95, 0.28);
}

/* Sign-in link below hero buttons */
.fiscari-hero__signin {
  margin-top: 16px;
  font-size: 14px;
  color: rgba(255,255,255,0.7);
  text-align: center;
}
.fiscari-hero__signin a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.fiscari-hero__signin a:hover {
  color: var(--Color-Accent-Lime, #d1f55f);
}

/* Forgot password inline label row */
.fiscari-modal__label-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 4px;
}
.fiscari-modal__label-row label {
  margin-bottom: 0;
}
.fiscari-modal__forgot {
  font-size: 12px;
  color: var(--Color-Primary-Purple-Gray, #89899e);
  text-decoration: none;
}
.fiscari-modal__forgot:hover {
  color: var(--Color-Primary-Blue, #2a2a49);
  text-decoration: underline;
}

/* ── Invite modal — locked email display ── */
.fiscari-modal__email-locked {
  padding: 10px 14px;
  border: 1px solid var(--Color-Primary-Light-Gray, #e8e8f0);
  border-radius: 8px;
  font-size: 15px;
  color: #6b6b8a;
  background: #f5f5fa;
  font-family: inherit;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.fiscari-modal__email-locked span {
  word-break: break-all;
  flex: 1;
}
.fiscari-modal__email-tick {
  flex-shrink: 0;
}

/* ============================================================
   END FISCARI
   ============================================================ */


/* ============================================================================
   fiscari.ai — standalone landing page styles
   Everything above this file is lifted from the Glasscubes theme so the page
   matches /fiscari/ exactly. Everything below is new: the standalone header
   and footer (the theme's were WordPress-rendered), the free-plan block, the
   testimonial grid and the FAQ. All new classes are prefixed .fa- so they can
   never collide with the theme's .fiscari- rules.
   ============================================================================ */

:root {
  --fa-header-h: 72px;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--fa-header-h) + 16px);
}

body {
  background: #fff;
}

.fa-link {
  color: var(--Color-Additional-Link, #3E58EC);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---------------------------------------------------------------- header -- */
/* Transparent at rest so it sits flush on the hero. The blur is kept for the
   scrolled state, where content passes underneath and the bar has to stay
   readable — that state still paints white with a hairline and a soft shadow. */
.fa-header {
  position: sticky;
  top: 0;
  z-index: 60;
  height: var(--fa-header-h);
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.fa-header.is-scrolled {
  background: rgba(255, 255, 255, 0.94);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom-color: rgba(22, 22, 37, 0.08);
  box-shadow: 0 6px 24px rgba(22, 22, 37, 0.06);
}

.fa-header__inner {
  display: flex;
  align-items: center;
  gap: 32px;
}

.fa-logo {
  display: flex;
  align-items: baseline;
  gap: 8px;
  color: var(--Color-Primary-Dark-Blue, #161625);
  text-decoration: none;
  flex-shrink: 0;
}

/* The mark and wordmark together are the link home. */
.fa-logo__link {
  display: flex;
  align-items: baseline;
  gap: 8px;
  color: inherit;
  text-decoration: none;
}

/* Mirrors the app's logo chip: w-8 h-8 (32px), rounded-lg (8px), bg-primary
   with a 20px book-open icon in primary-foreground. The colours are the app's
   own --primary / --primary-foreground rather than the marketing palette, so
   the mark reads identically here and in the product. */
.fa-logo__mark {
  align-self: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #0f172a;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fa-logo__word {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

/* Links to the parent company. Underlines only on hover/focus so it stays
   visually subordinate to the Fiscari wordmark it sits beside. */
.fa-logo__by {
  font-size: 12px;
  font-weight: 500;
  color: rgba(22, 22, 37, 0.55);
  white-space: nowrap;
  text-decoration: none;
  transition: color 0.15s ease;
}

.fa-logo__by:hover,
.fa-logo__by:focus-visible {
  color: var(--Color-Primary-Dark-Blue, #161625);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.fa-nav {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-left: auto;
}

.fa-nav a {
  font-size: 15px;
  font-weight: 500;
  color: rgba(22, 22, 37, 0.72);
  text-decoration: none;
  white-space: nowrap;
  transition: color 0.15s ease;
}

.fa-nav a:hover {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-header__actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

.fa-header__signin {
  font-size: 15px;
  font-weight: 600;
  color: var(--Color-Primary-Dark-Blue, #161625);
  text-decoration: none;
  white-space: nowrap;
}

.fa-header__signin:hover {
  text-decoration: underline;
}

@media (max-width: 1100px) {
  .fa-nav { gap: 18px; }
  .fa-nav a { font-size: 14px; }
}

@media (max-width: 900px) {
  .fa-nav { display: none; }
  .fa-header__actions { margin-left: auto; }
  .fa-logo__by { display: none; }
}

@media (max-width: 480px) {
  .fa-header__signin { display: none; }
}

/* The theme hero assumes a tall WP header sits above it. */
/* The theme tints the hero light blue; this page runs it on the page white so
   the hero reads as one surface with the section below it. */
.fiscari-hero {
  background: transparent;
  padding-top: var(--section-padding);
}

/* ------------------------------------------------------------ trust line -- */
.fa-trustline {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 24px;
  margin: -8px 0 0;
  padding: 0;
  list-style: none;
}

.fa-trustline li {
  position: relative;
  font-size: 15px;
  font-weight: 500;
  color: rgba(22, 22, 37, 0.66);
  padding-left: 22px;
}

.fa-trustline li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  background: url("../icons/Check.svg") center/contain no-repeat;
}

/* ------------------------------------------------------------- free plan -- */
.fa-free {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fa-free__grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 24px;
  align-items: stretch;
  max-width: 1080px;
  margin: 0 auto;
}

.fa-free__card {
  border-radius: 24px;
  padding: 40px;
  display: flex;
  flex-direction: column;
}

.fa-free__card--main {
  background: var(--Color-Primary-Dark-Blue, #161625);
  color: #fff;
}

.fa-free__card--aside {
  background: #fff;
  border: 1px solid rgba(22, 22, 37, 0.1);
}

.fa-free__eyebrow {
  display: inline-block;
  align-self: flex-start;
  padding: 6px 14px;
  border-radius: 24px;
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.fa-free__price {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 20px 0 4px;
}

.fa-free__amount {
  font-size: 64px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #fff;
}

.fa-free__period {
  font-size: 18px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.6);
}

.fa-free__list {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.fa-free__card--main .fa-free__list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.85);
}

.fa-free__card--main .fa-free__list strong {
  color: #fff;
}

.fa-free__list img {
  flex-shrink: 0;
  margin-top: 2px;
}

.fa-free__cta {
  margin-top: 32px;
  align-self: flex-start;
}

.fa-free__note {
  margin: 14px 0 0;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.55);
}

.fa-free__honest {
  color: rgba(22, 22, 37, 0.65);
  margin: 12px 0 0;
}

.fa-free__list--minus li {
  position: relative;
  padding-left: 26px;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(22, 22, 37, 0.75);
}

.fa-free__list--minus li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 11px;
  width: 14px;
  height: 2px;
  border-radius: 2px;
  background: rgba(22, 22, 37, 0.3);
}

.fa-free__card--aside .fa-free__list {
  margin-bottom: 20px;
}

@media (max-width: 900px) {
  .fa-free__grid { grid-template-columns: 1fr; }
  .fa-free__card { padding: 32px 24px; }
  .fa-free__amount { font-size: 52px; }
}

/* ----------------------------------------------------------- testimonials -- */
/* The cards reuse the theme's .fiscari-testimonial__* classes verbatim, so they
   render exactly like the quote on glasscubes.com/fiscari/ — lime quote mark
   above the text, italic body, avatar stacked above the name. Only the
   container differs: the theme centres a single 960px card, we sit two of them
   side by side. */
.fa-proof {
  background: #fff;
}

.fa-proof__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  align-items: stretch;
  max-width: 1120px;
  margin: 0 auto;
}

.fa-proof__grid .fiscari-testimonial__card {
  max-width: none;   /* the theme caps this at 960px for one centred card */
  margin: 0;
  padding: 44px 44px 40px;
  display: flex;
  flex-direction: column;
}

/* Avatars: the theme ships 52px. The two lower cards go slightly larger at
   60px, and the lead card larger again at 100px to weight it as the headline
   quote. Overrides the theme rule, which is why they're scoped to the grid. */
.fa-proof__grid .fiscari-testimonial__avatar {
  width: 60px;
  height: 60px;
}

.fa-proof__grid .fiscari-testimonial__card--wide .fiscari-testimonial__avatar {
  width: 100px;
  height: 100px;
}

/* Lead quote: spans both columns above the pair. Roomier padding echoes the
   theme's single centred card, and the quote itself is capped so the line
   length stays readable rather than running the full 1120px. */
.fa-proof__grid .fiscari-testimonial__card--wide {
  grid-column: 1 / -1;
  padding: 52px 56px 44px;
}

.fa-proof__grid .fiscari-testimonial__card--wide .fiscari-testimonial__text {
  max-width: 72ch;
}

/* Let the quote take the slack and pin the author to the bottom, so the two
   attributions line up even when one quote runs longer than the other. */
.fa-proof__grid .fiscari-testimonial__text {
  flex: 1 1 auto;
}

.fa-proof__grid .fiscari-testimonial__author {
  margin-top: auto;
}

/* Placeholder card — dashed outline and muted text so it cannot ship unnoticed.
   Delete the attribute along with the placeholder copy. */
.fiscari-testimonial__card[data-placeholder] {
  border: 1px dashed rgba(62, 88, 236, 0.45);
  background: rgba(227, 227, 252, 0.35);
}

.fiscari-testimonial__card[data-placeholder] .fiscari-testimonial__text,
.fiscari-testimonial__card[data-placeholder] .fiscari-testimonial__name,
.fiscari-testimonial__card[data-placeholder] .fiscari-testimonial__role {
  color: rgba(22, 22, 37, 0.45);
}

/* Stand-in for a missing headshot: initials in a circle, same footprint as
   .fiscari-testimonial__avatar so the layout doesn't shift when a photo lands. */
.fiscari-testimonial__initials {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.08);
  color: rgba(0, 0, 0, 0.45);
  font-size: 16px;
  font-weight: 700;
  border: 2px solid rgba(0, 0, 0, 0.08);
}

@media (max-width: 900px) {
  .fa-proof__grid {
    grid-template-columns: 1fr;
  }
  .fa-proof__grid .fiscari-testimonial__card,
  .fa-proof__grid .fiscari-testimonial__card--wide {
    padding: 40px 28px 32px;
  }
}

/* -------------------------------------------------------- use-case CTA --- */
.fa-usecases__cta {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

/* -------------------------------------------------------------- the FAQ -- */
.fa-faq {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fa-faq__list {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fa-faq__item {
  background: #fff;
  border: 1px solid rgba(22, 22, 37, 0.08);
  border-radius: 16px;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.fa-faq__item[open] {
  border-color: rgba(62, 88, 236, 0.3);
  box-shadow: 0 8px 28px rgba(22, 22, 37, 0.06);
}

.fa-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 26px;
  cursor: pointer;
  list-style: none;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-faq__q::-webkit-details-marker { display: none; }

.fa-faq__q:hover { background: rgba(22, 22, 37, 0.02); }

.fa-faq__q:focus-visible {
  outline: 2px solid var(--Color-Additional-Link, #3E58EC);
  outline-offset: -2px;
}

.fa-faq__q em {
  font-style: italic;
}

.fa-faq__icon {
  position: relative;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(22, 22, 37, 0.06);
}

.fa-faq__icon::before,
.fa-faq__icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: var(--Color-Primary-Dark-Blue, #161625);
  transform: translate(-50%, -50%);
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.fa-faq__icon::before { width: 10px; height: 1.8px; }
.fa-faq__icon::after  { width: 1.8px; height: 10px; }

.fa-faq__item[open] .fa-faq__icon::after {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg);
}

.fa-faq__a {
  padding: 0 26px 24px;
}

.fa-faq__a .regular-text {
  color: rgba(22, 22, 37, 0.72);
}

.fa-faq__a .regular-text + .regular-text {
  margin-top: 12px;
}

@media (max-width: 640px) {
  .fa-faq__q { padding: 18px 20px; font-size: 16px; }
  .fa-faq__a { padding: 0 20px 20px; }
}

/* --------------------------------------------------------- final CTA + -- */
.fa-final__signin {
  margin: 20px 0 0;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.7);
}

.fa-final__signin a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---------------------------------------------------------------- footer -- */
.fa-footer {
  background: var(--Color-Primary-Dark-Blue, #161625);
  padding: 56px 0 40px;
  color: rgba(255, 255, 255, 0.6);
}

.fa-footer__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px 40px;
  align-items: start;
}

.fa-footer__brand .fa-logo__word {
  color: #fff;
}

.fa-footer__tag {
  margin: 8px 0 0;
  font-size: 15px;
  max-width: 42ch;
  color: rgba(255, 255, 255, 0.6);
}

.fa-footer__tag a,
.fa-footer__links a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

.fa-footer__tag a:hover,
.fa-footer__links a:hover {
  color: #fff;
  border-bottom-color: #fff;
}

.fa-footer__links {
  display: flex;
  gap: 28px;
  font-size: 15px;
  flex-wrap: wrap;
}

.fa-footer__legal {
  grid-column: 1 / -1;
  margin: 24px 0 0;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 14px;
  color: rgba(255, 255, 255, 0.45);
}

@media (max-width: 640px) {
  .fa-footer__inner { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------ a11y bits -- */
:where(a, button, summary, input, textarea):focus-visible {
  outline: 2px solid var(--Color-Additional-Link, #3E58EC);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ============================================================================
   Overrides — theme rules that don't hold up on a standalone, free-first page
   ============================================================================ */

/* .button.middle is 72px tall (48px icon + 12px padding), exactly the header
   height, so it overflows. Shrink it for the header only. */
.fa-header__cta.button.middle {
  padding: 8px 8px 8px 20px;
  font-size: 15px;
}

.fa-header__cta.button.middle .button-icon {
  width: 36px;
  height: 36px;
  padding: 6px;
}

.fa-header__cta.button.middle .button-icon img {
  width: 16px;
  height: 16px;
}

/* The theme sets this white — it was written for a dark hero. This hero is
   light blue, so white on light blue is unreadable. */
.fiscari-hero__signin {
  color: rgba(22, 22, 37, 0.65);
}

.fiscari-hero__signin a {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fiscari-hero__signin a:hover {
  color: var(--Color-Additional-Link, #3E58EC);
}

/* The free offer is the whole campaign — give the hero badge the accent. */
.fiscari-badge--hero {
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
  border-color: transparent;
}

/* Check.svg is a #161625 tick — invisible on the dark free-plan card. */
.fa-free__card--main .fa-free__list img {
  filter: brightness(0) invert(1);
}

/* The theme's `.regular-text span` / `.small-text span` force white — they were
   written for dark sections. The free-limit token appears on light backgrounds
   too, so it must inherit whatever colour its context sets. */
/* Matches every js- token span, not just js-free-limit: the same white-text
   trap has now caught js-deep-limit too, and would catch the next token added.
   The attribute selector beats `.regular-text span` on specificity (0,2,1 vs
   0,1,1) without needing !important. */
.regular-text span[class*="js-"],
.large-text span[class*="js-"],
.small-text span[class*="js-"],
.fiscari-td--good span[class*="js-"] {
  color: inherit;
  font-weight: inherit;
}

/* ============================================================================
   The `hidden` attribute only gets `display: none` from the UA stylesheet, so
   ANY author `display` rule silently beats it. `.fiscari-modal__form` is
   `display: flex`, which left the signup form sitting under the success
   message, and the forgot-password form permanently stacked beneath the
   sign-in form. The theme already patches this for the demo
   (`.fiscari-demo [hidden]`); this makes it hold document-wide.
   ============================================================================ */
[hidden] {
  display: none !important;
}

/* ============================================================================
   LEAD-MAGNET REBUILD
   The page's job is one real query run in the app, so the hero question box is
   the centre of gravity and everything below it is supporting evidence. Styles
   for the removed sections (problem, solution, use cases, principle, free-plan
   cards, three-up testimonials) are left in place above — unused, but harmless,
   and cheaper to keep than to risk unpicking a shared theme sheet.
   ============================================================================ */

/* Visually hidden but available to screen readers. */
.fa-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ------------------------------------------------------------- allowance -- */
.fa-allowance {
  margin: -8px 0 0;
  font-size: 15px;
  font-weight: 500;
  color: rgba(22, 22, 37, 0.62);
  line-height: 1.7;
}

.fa-allowance__sep {
  margin: 0 8px;
  color: rgba(22, 22, 37, 0.28);
}

/* ------------------------------------------------------ hero question box -- */
.fa-ask {
  width: 100%;
  max-width: 720px;
  margin: 4px auto 0;
  text-align: left;
}

/* The theme's demo input was read-only; this one is the real control, so it
   takes a text cursor and grows with the question. */
.fa-ask__wrap {
  align-items: center;
}

.fa-ask__textarea {
  cursor: text;
  font-size: 16px;   /* 16px stops iOS zooming the page on focus */
  min-height: 48px;
}

.fa-ask__textarea::placeholder {
  color: rgba(42, 42, 73, 0.45);
}

.fa-ask__btn {
  flex-shrink: 0;
  align-self: stretch;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  padding: 12px 22px;
  border: none;
  border-radius: 12px;
  background: var(--Color-Primary-Dark-Blue, #161625);
  color: var(--Color-Accent-Lime, #d1f55f);
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s ease;
}

.fa-ask__btn:hover {
  background: var(--Color-Primary-Blue, #2a2a49);
}

.fa-ask__hint {
  margin: 10px 2px 0;
  font-size: 14px;
  font-weight: 500;
  color: #b4451f;
}

.fa-ask__helper {
  margin-top: 22px;
}

.fa-ask__prompt {
  margin: 0 0 12px;
  font-size: 15px;
  color: rgba(22, 22, 37, 0.6);
}

/* ----------------------------------------------------------- credibility -- */
/* Sits directly under the hero and must be visible without scrolling on a
   laptop, so it is deliberately short and horizontal. */
.fa-cred {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  padding: 28px 0;
}

.fa-cred__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}

.fa-cred__quote {
  margin: 0;
  position: relative;
  max-width: 620px;
  padding-left: 40px;
}

.fa-cred__mark {
  position: absolute;
  left: 0;
  top: 4px;
  font-size: 54px;
  line-height: 1;
}

.fa-cred__text {
  margin: 0;
  font-size: 17px;
  font-style: italic;
  line-height: 1.5;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-cred__author {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
}

.fa-cred__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.fa-cred__author span {
  font-size: 14px;
  color: rgba(22, 22, 37, 0.62);
  line-height: 1.4;
}

.fa-cred__author strong {
  display: block;
  font-weight: 700;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-cred__author a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.fa-cred__built {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  max-width: 300px;
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(22, 22, 37, 0.62);
}

.fa-cred__built svg {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-cred__built a {
  color: var(--Color-Primary-Dark-Blue, #161625);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 900px) {
  .fa-cred__inner { gap: 24px; }
  .fa-cred__built { max-width: none; }
}

/* --------------------------------------------------------- worked example -- */
.fa-example {
  background: #fff;
}

.fa-example__frame {
  max-width: 860px;
  margin: 0 auto;
}

.fa-example__cta {
  margin: 20px 0 0;
  text-align: center;
}

.fa-textlink {
  border: none;
  background: none;
  padding: 0;
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--Color-Additional-Link, #3E58EC);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.fa-textlink:hover {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

/* -------------------------------------------------------------- benefits -- */
.fa-benefits {
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fa-benefits__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1000px;
  margin: 0 auto;
}

.fa-benefit {
  background: #fff;
  border-radius: 20px;
  padding: 30px 28px;
  border: 1px solid rgba(22, 22, 37, 0.06);
}

.fa-benefit__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--Color-Accent-Lime, #d1f55f);
  color: var(--Color-Primary-Dark-Blue, #161625);
  margin-bottom: 18px;
}

.fa-benefit .h4 {
  margin-bottom: 8px;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-benefit .regular-text {
  color: rgba(22, 22, 37, 0.68);
}

@media (max-width: 860px) {
  .fa-benefits__grid { grid-template-columns: 1fr; }
  .fa-benefit { padding: 24px 22px; }
}

/* ------------------------------------------------------ comparison ticks -- */
.fa-tick {
  display: inline-block;
  font-size: 18px;
  font-weight: 700;
  color: #1f7a3d;
}

/* ------------------------------------------------------------- challenge -- */
.fa-challenge {
  background: var(--Color-Accent-Light-Blue, #e3e3fc);
}

.fa-challenge__content {
  max-width: 680px;
  margin: 0 auto;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.fa-challenge__title {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-challenge__text {
  margin: 0;
  color: rgba(22, 22, 37, 0.72);
}

/* ----------------------------------------------------------- mini quotes -- */
.fa-mini-quotes {
  background: #fff;
  padding-top: 0;
}

.fa-mini-quotes__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  max-width: 1000px;
  margin: 0 auto;
}

.fa-mini-quote {
  margin: 0;
  padding: 26px 28px;
  border-radius: 18px;
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
}

.fa-mini-quote blockquote {
  margin: 0 0 18px;
  font-size: 15.5px;
  font-style: italic;
  line-height: 1.55;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-mini-quote figcaption {
  display: flex;
  align-items: center;
  gap: 12px;
}

.fa-mini-quote figcaption img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.fa-mini-quote figcaption span {
  font-size: 13.5px;
  line-height: 1.4;
  color: rgba(22, 22, 37, 0.6);
}

.fa-mini-quote figcaption strong {
  display: block;
  font-weight: 700;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-mini-quote figcaption a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 860px) {
  .fa-mini-quotes__grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------- FAQ additions -- */
.fa-faq__ticks {
  list-style: none;
  padding: 0;
  margin: 14px 0 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.fa-faq__ticks li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(22, 22, 37, 0.72);
}

.fa-faq__ticks img {
  flex-shrink: 0;
  margin-top: 3px;
}

.fa-faq__a .fa-free__list--minus {
  margin: 14px 0 16px;
}

/* ------------------------------------------------------------ final CTA -- */
.fa-final__sep {
  margin: 0 10px;
  color: rgba(255, 255, 255, 0.35);
}

/* ---------------------------------------------------------------- mobile -- */
@media (max-width: 560px) {
  .fa-ask__wrap {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .fa-ask__wrap .fiscari-demo__search-icon { display: none; }
  .fa-ask__btn { width: 100%; padding: 14px 20px; }
  .fa-allowance { font-size: 14px; }
  .fa-allowance__sep { margin: 0 5px; }
  .fa-cred__quote { padding-left: 30px; }
  .fa-cred__mark { font-size: 42px; }
  .fa-cred__text { font-size: 16px; }
}

/* ---------------------------------------------------------- hero density --
   The credibility strip has to clear the fold on a 1280x800 laptop with all
   three chips showing, so the hero runs tighter than the theme's default
   section rhythm. */
.fiscari-hero {
  padding-top: 32px;
  padding-bottom: 40px;
}

.fiscari-hero__content {
  gap: 18px;
  max-width: 860px;
}

.fiscari-hero .h1 {
  font-size: clamp(34px, 4.4vw, 58px);
  line-height: 1.08;
}

.fiscari-hero__text {
  max-width: 640px;
  margin: 0 auto;
}

.fa-ask__helper {
  margin-top: 16px;
}

.fa-ask__prompt {
  margin-bottom: 10px;
}

@media (max-width: 640px) {
  .fiscari-hero {
    padding-top: 24px;
    padding-bottom: 32px;
  }
}

/* The header CTA label got longer in the rebuild ("Ask a question free" vs
   "Get free access") and overflowed a 375px viewport by ~9px. Drop the arrow
   chip and tighten the padding on small screens — the label carries it. */
@media (max-width: 560px) {
  .fa-header__cta.button.middle {
    padding: 8px 16px;
    font-size: 14px;
  }
  .fa-header__cta .button-icon {
    display: none;
  }
}

/* Same trap as .js-free-limit: the theme's `.regular-text span` forces white,
   which made the ticks invisible on the pale-green Fiscari column. */
.fiscari-td--good span.fa-tick,
.regular-text span.fa-tick {
  color: #1f7a3d;
  font-weight: 700;
}

/* Adjacent full-padding sections stacked ~190px of dead space between the
   benefits cards and the comparison table. Pull the seams in. */
.fa-example { padding-bottom: 56px; }
.fa-benefits { padding-bottom: 56px; }
.fiscari-comparison { padding-top: 56px; }
.fa-challenge { padding-top: 56px; padding-bottom: 56px; }
.fa-mini-quotes { padding-bottom: 56px; }

/* The supporting quotes now sit inside the challenge band rather than on their
   own white section, so they need white cards to lift off the lavender, and
   the section needs its bottom padding back to hold them. */
.fa-challenge {
  padding-bottom: 72px;
}

.fa-challenge .fa-mini-quotes__grid {
  margin-top: 44px;
}

.fa-challenge .fa-mini-quote {
  background: #fff;
  border: 1px solid rgba(22, 22, 37, 0.06);
}

@media (max-width: 860px) {
  .fa-challenge .fa-mini-quotes__grid { margin-top: 32px; }
}

/* Equal-height cards with the attributions aligned, so the two quotes read as
   a pair rather than two unrelated blocks. */
.fa-mini-quote {
  display: flex;
  flex-direction: column;
}

.fa-mini-quote blockquote {
  flex: 1 1 auto;
}

.fa-mini-quote figcaption {
  margin-top: auto;
}

/* "Try a random question" — a button because it performs an action rather than
   navigating, styled as the link it reads as. */
.fa-ask__helper {
  margin: 14px 2px 0;
  font-size: 15px;
  color: rgba(22, 22, 37, 0.6);
}

.fa-ask__random {
  border: none;
  background: none;
  padding: 0;
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 15px;
  font-weight: 600;
  color: var(--Color-Additional-Link, #3E58EC);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.fa-ask__random:hover {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

/* With the three chips gone the hero no longer needs to be squeezed to keep the
   credibility strip above the fold, so the breathing room goes back in: a clear
   gap between the question box and the first quote, rather than the two running
   into each other. */
.fiscari-hero {
  padding-bottom: 112px;
}

.fa-cred {
  padding: 40px 0;
}

@media (max-width: 640px) {
  .fiscari-hero { padding-bottom: 64px; }
  .fa-cred { padding: 32px 0; }
}

/* The hero is centred; the helper line and the empty-input hint were inheriting
   the input's left alignment and sitting off to one side. */
.fa-ask__helper,
.fa-ask__hint {
  text-align: center;
}

/* The textarea was two rows tall, so its text sat at the top of the box while
   the box itself was centred — the placeholder looked stuck to the ceiling. It
   now starts one line high and grows with the question, which lets flex centre
   the text itself. The button keeps its own height so it does not collapse to
   the height of a single line. */
.fa-ask__textarea {
  min-height: 0;
  align-self: center;
}

.fa-ask__btn {
  align-self: center;
  min-height: 46px;
}

/* ---------------------------------------------------------- customer logos --
   Greyscaled and dimmed so four different brand palettes read as one quiet row
   of proof rather than competing with the quote beneath them. Heights are set
   per logo because they have very different aspect ratios and internal padding
   — matching them on height alone makes the wide wordmarks look enormous next
   to the stacked marks. */
.fa-logos {
  list-style: none;
  margin: 0 0 34px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 22px 52px;
}

.fa-logos img {
  display: block;
  width: auto;
  height: 32px;
  max-width: 170px;
  object-fit: contain;
  filter: grayscale(1);
  opacity: 0.55;
}

/* Optical balance, not mathematical. */
.fa-logos li:nth-child(1) img { height: 34px; }  /* Offshore Group   */
.fa-logos li:nth-child(2) img { height: 26px; }  /* Midgley Snelling */
.fa-logos li:nth-child(3) img { height: 42px; }  /* Cameron          */
.fa-logos li:nth-child(4) img { height: 40px; }  /* Calm Accounts    */

@media (max-width: 640px) {
  .fa-logos {
    gap: 18px 32px;
    margin-bottom: 26px;
  }
  .fa-logos li:nth-child(1) img { height: 26px; }
  .fa-logos li:nth-child(2) img { height: 20px; }
  .fa-logos li:nth-child(3) img { height: 32px; }
  .fa-logos li:nth-child(4) img { height: 30px; }
}

/* Slightly stronger: at 0.55 the row read as decoration rather than proof, and
   Midgley Snelling's thin lowercase wordmark was disappearing next to the
   heavier marks. */
.fa-logos img {
  opacity: 0.62;
}

.fa-logos li:nth-child(2) img { height: 30px; }

@media (max-width: 640px) {
  .fa-logos li:nth-child(2) img { height: 23px; }
}

/* ============================================================================
   WORKED EXAMPLE — styled to match the app
   A replica of a real Fiscari answer: the question as a dark bubble, the answer
   card with its confidence pill and inline citation toggles, and the expandable
   source cards. Palette is taken from the app rather than the marketing theme,
   so what someone sees here is what they get when they click through.
   ============================================================================ */
.fa-app {
  max-width: 780px;
  margin: 0 auto;
}

/* ---- the question, as the app renders it ---- */
.fa-app__q {
  max-width: 78%;
  margin: 0 0 18px auto;
  padding: 14px 20px;
  border-radius: 14px;
  background: #0f172a;
  color: #fff;
  font-size: 15.5px;
  font-weight: 500;
  line-height: 1.45;
}

/* ---- the answer card ---- */
.fa-app__card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px 14px 0 0;
  border-bottom: none;
  padding: 22px 26px 24px;
}

.fa-app__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.fa-app__conf {
  padding: 4px 12px;
  border-radius: 999px;
  background: #cffafe;
  border: 1px solid #a5f3fc;
  color: #0e7490;
  font-size: 12.5px;
  font-weight: 600;
}

.fa-app__sources {
  font-size: 13px;
  color: #64748b;
}

.fa-app__card p {
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.62;
  color: #334155;
}

.fa-app__lead {
  font-weight: 700;
  color: #0f172a !important;
}

.fa-app__card strong {
  font-weight: 700;
  color: #0f172a;
}

/* The three conditions are indented in the app, as a nested definition. */
.fa-app__conditions {
  padding-left: 26px;
  margin-bottom: 4px;
}

/* A citation that follows on its own rather than ending a sentence. */
.fa-app__citeline {
  margin-bottom: 10px !important;
}

/* ---- inline citation toggle ---- */
.fa-cite {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border: none;
  background: none;
  padding: 0 2px;
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #0891b2;
  cursor: pointer;
  white-space: nowrap;
  vertical-align: baseline;
}

.fa-cite:hover {
  color: #0e7490;
  text-decoration: underline;
}

.fa-cite__chev {
  transition: transform 0.15s ease;
}

.fa-cite[aria-expanded="true"] .fa-cite__chev {
  transform: rotate(90deg);
}

/* ---- expanded source card ---- */
.fa-cite__panel {
  margin: 4px 0 16px;
}

.fa-cite__card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 16px 18px;
}

.fa-cite__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.fa-cite__badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
}

.fa-cite__badge--manual { background: #1e293b; }
.fa-cite__badge--court  { background: #7c3aed; }

.fa-cite__ext {
  flex-shrink: 0;
  color: #64748b;
  line-height: 0;
}

.fa-cite__ext:hover { color: #0f172a; }

.fa-cite__title {
  margin: 0 0 10px !important;
  font-size: 15px !important;
  font-weight: 700;
  color: #0f172a !important;
  line-height: 1.4 !important;
}

.fa-cite__quote {
  margin: 0 0 10px;
  padding-left: 14px;
  border-left: 3px solid #94a3b8;
  font-size: 13.5px;
  font-style: italic;
  line-height: 1.6;
  color: #475569;
}

.fa-cite__src {
  margin: 0 !important;
  font-size: 12px !important;
  color: #94a3b8 !important;
}

/* ---- the expand-analysis band, which doubles as the CTA ---- */
.fa-app__foot {
  background: #eff6ff;
  border: 1px solid #e2e8f0;
  border-radius: 0 0 14px 14px;
  padding: 18px 26px 20px;
}

.fa-app__expand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border: 1px solid #cbd5e1;
  border-radius: 9px;
  background: #fff;
  font-family: "Be Vietnam Pro", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.fa-app__expand:hover {
  border-color: #0f172a;
  background: #f8fafc;
}

.fa-app__foot-note {
  margin: 10px 0 0;
  font-size: 12.5px;
  color: #64748b;
}

@media (max-width: 640px) {
  .fa-app__q { max-width: 92%; font-size: 15px; padding: 12px 16px; }
  .fa-app__card { padding: 18px 18px 20px; }
  .fa-app__foot { padding: 16px 18px; }
  .fa-app__conditions { padding-left: 14px; }
  .fa-cite__card { padding: 14px; }
}

/* ---- question length: hint on the left, counter on the right -------------
   The app rejects anything outside 10-1000 characters with the same silent
   signup prompt it uses for a spent code, so the visitor has to be able to see
   the count before they hand off. */
.fa-ask__status {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 10px 2px 0;
  min-height: 20px;
}

.fa-ask__hint {
  margin: 0;
  text-align: left;
  flex: 1 1 auto;
}

.fa-ask__count {
  margin: 0;
  flex-shrink: 0;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  color: rgba(22, 22, 37, 0.4);
}

.fa-ask__count.is-near {
  color: #b4451f;
  font-weight: 600;
}

/* ---- invite-only notice -------------------------------------------------- */
.fa-invite__body {
  margin-bottom: 22px;
}

.fa-invite__body .regular-text {
  color: rgba(22, 22, 37, 0.72);
  text-align: left;
}

.fa-invite__body .regular-text + .regular-text {
  margin-top: 12px;
}

.fa-invite__subhead {
  color: var(--Color-Primary-Dark-Blue, #161625);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.36px;
  margin: 0 0 4px;
}

.fa-invite__body .regular-text + .fa-invite__subhead {
  margin-top: 20px;
}

.fa-invite__body .regular-text a {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

#fa-invite-modal .fiscari-modal__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

#fa-invite-modal .fiscari-modal__box:focus {
  outline: none;
}

/* ============================================================================
   LEGAL PAGES — terms, privacy
   Plain, readable, and narrow enough to actually be read. Nothing decorative:
   these exist to be understood, not to convert.
   ============================================================================ */
.fa-legal {
  padding: 56px 0 88px;
  background: #fff;
}

.fa-legal__inner {
  max-width: 720px;
  margin: 0 auto;
}

.fa-legal__eyebrow {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(22, 22, 37, 0.45);
}

.fa-legal h1 {
  margin: 0 0 8px;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-legal__meta {
  margin: 0 0 28px;
  font-size: 14px;
  color: rgba(22, 22, 37, 0.5);
}

.fa-legal__lead {
  margin: 0 0 8px;
  padding: 18px 20px;
  border-radius: 12px;
  background: var(--Color-Primary-Light-Gray, #f3f4f6);
  font-size: 16px;
  line-height: 1.6;
  color: rgba(22, 22, 37, 0.8);
}

.fa-legal h2 {
  margin: 34px 0 10px;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-legal p,
.fa-legal li {
  font-size: 16px;
  line-height: 1.65;
  color: rgba(22, 22, 37, 0.78);
}

.fa-legal p {
  margin: 0 0 12px;
}

.fa-legal ul {
  margin: 0 0 12px;
  padding-left: 22px;
}

.fa-legal li {
  margin-bottom: 8px;
}

.fa-legal strong {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

.fa-legal a {
  color: var(--Color-Additional-Link, #3E58EC);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.fa-legal a:hover {
  color: var(--Color-Primary-Dark-Blue, #161625);
}

@media (max-width: 640px) {
  .fa-legal { padding: 36px 0 60px; }
  .fa-legal h2 { font-size: 18px; margin-top: 28px; }
  .fa-legal__lead { padding: 16px; }
}

/* `align-self: center` vertically centres the placeholder in the desktop row
   layout, but the mobile layout is a column — where the cross axis is
   horizontal, so the same rule shrink-wrapped the textarea to its content and
   clipped the placeholder to "Ask a UK tax". Stretch it back. */
@media (max-width: 560px) {
  .fa-ask__textarea,
  .fa-ask__btn {
    align-self: stretch;
  }
}

/* ---- hero breathing room ----------------------------------------------------
   The hero was tightened back when three example chips sat under the input and
   the credibility strip had to clear the fold. With the chips gone it reads
   cramped, so the elements get more space between them and the whole block sits
   lower. Some of that is paid for out of the bottom padding, which was doing
   less work than the gaps: the constraint is that Roman's quote and "Built by
   Glasscubes" stay visible at 1280x800, not that the strip ends above the fold. */
.fiscari-hero {
  padding-top: 100px;
  padding-bottom: 100px;
}

.fiscari-hero__content {
  gap: 40px;
}

.fa-ask__helper {
  margin-top: 22px;
}

@media (max-width: 640px) {
  .fiscari-hero {
    padding-top: 40px;
    padding-bottom: 56px;
  }
  .fiscari-hero__content {
    gap: 22px;
  }
}