/* Elementa ad landing page, on landing-base.css (inc/landing.php). D1–D14: the
   approved landing-v2.css as it is, except that D15 hides the inactive flow
   steps only once landing.js runs. D15 flow states · D16 flow on Fluent Forms. */

/* D1 Scale */

.e-ap { --r: 24px; --r-lg: 28px; --sec: clamp(2.5rem, 1.5rem + 4vw, 6rem); --gap-c: clamp(1.25rem, 1rem + 1.5vw, 2rem); --shadow: 0 14px 40px rgba(14, 14, 14, .06); background: var(--e-greige); color: var(--e-ink); }
.e-ap .e-wrap { max-width: 72rem; }
.e-ap .e-media { background: var(--e-stone); }

/* D2 Top bar */

.e-ap-top { position: sticky; top: 0; z-index: 50; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: calc(.75rem + env(safe-area-inset-top, 0px)) var(--edge) .75rem; background: rgba(244, 240, 239, .86); -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px); }
.e-ap-top .e-logo img { height: 20px; width: auto; }
.e-ap-top__actions { display: flex; align-items: center; gap: .5rem; }
.e-ap-top .e-icon-btn { width: 2.5rem; height: 2.5rem; background: var(--e-white); border-color: transparent; }
.e-ap-top .e-icon-btn:hover { background: var(--e-ink); color: var(--e-white); }
.e-ap-top .e-lp-tel, .e-ap-top .e-header__cta { display: none; }

/* D3 Hero: photo card, headline, one action */

.e-ap-hero { padding: 1rem var(--edge) var(--sec); }
.e-ap-hero__grid { display: grid; gap: 1.5rem; }
.e-ap-hero__pic { position: relative; aspect-ratio: 4 / 5; border-radius: var(--r-lg); overflow: hidden; background: var(--e-stone); }
.e-ap-hero__pic img { width: 100%; height: 100%; object-fit: cover; }
.e-ap-hero__tag { position: absolute; left: 1rem; bottom: 1rem; padding: .55em .95em; border-radius: 999px; background: rgba(255, 255, 255, .88); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: .75rem; font-weight: 400; letter-spacing: .02em; }
.e-ap-hero__text { display: grid; gap: 1rem; justify-items: start; }
.e-ap-hero__title { font-size: clamp(2.25rem, 1.5rem + 3.4vw, 4.25rem); font-weight: 300; line-height: 1.02; letter-spacing: -.035em; max-width: 11em; }
.e-ap-hero__title em { font-style: normal; color: var(--e-ink-muted); }
.e-ap-hero__sub { color: var(--e-ink-muted); max-width: 30em; }
.e-ap-hero__cta { display: flex; gap: .625rem; width: 100%; margin-top: .25rem; }
.e-ap-hero__cta .e-btn--solid { flex: 1 1 auto; justify-content: center; padding-block: 1.1em; font-size: 1rem; }
.e-ap-hero__cta .e-icon-btn { width: 3.25rem; height: 3.25rem; background: var(--e-white); border-color: transparent; flex: 0 0 auto; }
.e-ap-hero__cta .e-icon-btn:hover { background: var(--e-ink); color: var(--e-white); }
.e-ap-trust { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .9rem; font-size: .8125rem; color: var(--e-ink-muted); }
.e-ap-trust li { display: inline-flex; align-items: center; gap: .4rem; }
.e-ap-trust li + li::before { content: ""; width: 3px; height: 3px; border-radius: 50%; background: var(--e-muted); margin-right: .5rem; }
.e-ap-trust svg { width: .85rem; height: .85rem; }
.e-ap-trust .e-google__stars { font-size: .65rem; }
.e-ap-trust strong { font-weight: 400; color: var(--e-ink); }
@media (max-width: 47.999rem) { .e-ap-hero__title em { display: block; } }

/* D4 Sections */

.e-ap-sec { padding-block: var(--sec); }
.e-ap-sec--white { background: var(--e-white); }
.e-ap-head { display: grid; gap: .6rem; margin-bottom: var(--gap-c); max-width: 34rem; justify-items: start; }
.e-ap-head .e-h2 { font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.75rem); }
.e-ap-head p { color: var(--e-ink-muted); }

/* D5 Lead flow: photo tiles, three steps */

.e-flow { background: var(--e-white); border-radius: var(--r); box-shadow: var(--shadow); padding: clamp(1.25rem, 1rem + 1.5vw, 2.25rem); display: grid; gap: 1.25rem; max-width: 56rem; margin-inline: auto; }
.e-flow__bar { height: 3px; background: var(--e-stone); border-radius: 999px; overflow: hidden; }
.e-flow__bar i { display: block; height: 100%; width: 33.333%; background: var(--e-ink); transition: width var(--dur) var(--ease-out); }
.e-flow__meta { display: flex; justify-content: space-between; align-items: center; font-size: var(--t-small); color: var(--e-ink-muted); }
.e-flow__step { display: grid; gap: 1.1rem; }
.e-flow__q { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.125rem); font-weight: 300; line-height: 1.1; letter-spacing: -.015em; padding-bottom: .35rem; }
.e-flow__hint { font-size: var(--t-small); color: var(--e-ink-muted); margin-top: -.5rem; }
.e-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
.e-opt { position: relative; }
.e-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.e-opt span { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden; background: var(--e-stone); cursor: pointer; outline: 2px solid transparent; outline-offset: 3px; transition: outline-color var(--dur-fast); }
.e-opt span img { width: 100%; height: 100%; object-fit: cover; }
.e-opt span i { position: absolute; left: .7rem; bottom: .7rem; padding: .5em .85em; border-radius: 999px; background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-style: normal; font-size: .8125rem; font-weight: 400; line-height: 1; transition: background var(--dur-fast), color var(--dur-fast); }
.e-opt input:checked + span { outline-color: var(--e-ink); }
.e-opt input:checked + span i { background: var(--e-ink); color: var(--e-white); }
.e-opt input:focus-visible + span { outline-color: var(--e-ink); }
.e-chips--flow .e-chip span { padding: .9em 1.2em; }
.e-flow__nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.e-flow__back { font-size: var(--t-small); color: var(--e-ink-muted); display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 0; }
.e-flow__back svg { width: .8rem; height: .8rem; }
.e-flow__back:hover { color: var(--e-ink); }
.e-flow__nav .e-btn { flex: 1 1 auto; justify-content: center; padding-block: 1.05em; }
.e-flow__note { font-size: .75rem; color: var(--e-ink-muted); text-align: center; line-height: 1.5; }
.e-flow .e-fields { gap: 1rem; grid-template-columns: 1fr; }
.e-flow__ok { display: none; gap: 1rem; text-align: center; padding-block: 1rem; }
.e-flow[data-sent="true"] .e-flow__step, .e-flow[data-sent="true"] .e-flow__meta, .e-flow[data-sent="true"] .e-flow__bar { display: none; }
.e-flow[data-sent="true"] .e-flow__ok { display: grid; }
.e-flow__ok svg { width: 3rem; height: 3rem; margin-inline: auto; }
.e-flow__ok h3 { font-size: var(--t-h3); font-weight: 300; line-height: 1.1; }
.e-flow__ok p { color: var(--e-ink-muted); }
.e-flow__ok a { text-decoration: underline; text-underline-offset: .2em; }

/* D6 Stats */

.e-ap-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; text-align: center; padding: clamp(1.25rem, 1rem + 1.5vw, 2rem) 1rem; background: var(--e-white); border-radius: var(--r); }
.e-ap-stats li { display: grid; gap: .35rem; }
.e-ap-stats strong { font-size: clamp(2rem, 1.4rem + 4vw, 3.75rem); font-weight: 300; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.e-ap-stats li > span { font-size: var(--t-label); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--e-ink-muted); }

/* D7 Rails: swipe on phones, grid on desktop */

.e-rail { display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(-1 * var(--edge)); padding-inline: var(--edge); scroll-padding-inline: var(--edge); min-width: 0; }
.e-rail::-webkit-scrollbar { display: none; }
.e-rail > * { flex: 0 0 80%; scroll-snap-align: start; }
.e-rail-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 1rem; }
.e-why { background: var(--e-white); border-radius: var(--r); overflow: hidden; display: grid; box-shadow: var(--shadow); }
.e-why .e-media { aspect-ratio: 4 / 3; }
.e-why__body { padding: 1.25rem 1.25rem 1.5rem; display: grid; gap: .5rem; }
.e-why__body .e-label { color: var(--e-ink-muted); }
.e-why__body h3 { font-size: 1.375rem; font-weight: 300; line-height: 1.1; letter-spacing: -.015em; }
.e-why__body p { color: var(--e-ink-muted); }
.e-story { position: relative; display: block; aspect-ratio: 3 / 4; border-radius: var(--r); overflow: hidden; background: var(--e-stone); color: var(--e-white); }
.e-story img { width: 100%; height: 100%; object-fit: cover; }
.e-story::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0) 50%); pointer-events: none; }
.e-story__t { position: absolute; left: 1.25rem; right: 1.25rem; bottom: 1.25rem; z-index: 1; display: grid; gap: .3rem; }
.e-story__t strong { font-size: 1.5rem; font-weight: 300; line-height: 1.1; letter-spacing: -.02em; }
.e-story__t span { font-size: var(--t-label); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .72); }
.e-story__i { position: absolute; top: 1rem; right: 1rem; z-index: 1; padding: .45em .7em; border-radius: 999px; background: rgba(255, 255, 255, .85); color: var(--e-ink); font-size: .7rem; letter-spacing: .1em; }

/* D8 Reviews */

.e-rev { background: var(--e-white); border-radius: var(--r); padding: 1.5rem; display: grid; gap: 1.25rem; align-content: space-between; box-shadow: var(--shadow); }
.e-ap-sec--white .e-rev { background: var(--e-greige); box-shadow: none; }
.e-rev blockquote { font-size: clamp(1.125rem, 1rem + .6vw, 1.375rem); font-weight: 300; line-height: 1.4; letter-spacing: -.01em; }
.e-rev figcaption { display: grid; gap: .2rem; font-size: var(--t-small); }
.e-rev figcaption span { color: var(--e-ink-muted); }
.e-rev .e-google__stars { font-size: .7rem; }
.e-google-badge { display: inline-flex; align-items: center; gap: .5rem; font-size: var(--t-small); font-weight: 400; color: var(--e-ink); }
.e-google-badge svg { width: 1.1rem; height: 1.1rem; }
.e-google-badge .e-google__stars { font-size: .75rem; }

/* D9 Steps */

.e-tl2 { display: grid; gap: 1.5rem; position: relative; padding-left: 3.25rem; }
.e-tl2::before { content: ""; position: absolute; left: 1.25rem; top: 1.25rem; bottom: 1.25rem; width: 1px; background: var(--e-stone); }
.e-tl2 li { position: relative; display: grid; gap: .3rem; }
.e-tl2 li::before { content: attr(data-n); position: absolute; left: -3.25rem; top: 0; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; border-radius: 50%; background: var(--e-white); border: 1px solid var(--e-stone); font-size: var(--t-small); }
.e-tl2 h3 { font-size: var(--t-h4); font-weight: 400; line-height: 1.3; margin-top: .45rem; }
.e-tl2 p { color: var(--e-ink-muted); max-width: 34ch; }

/* D10 FAQ */

.e-faq-c { display: grid; }
.e-faq-c details { border-top: 1px solid var(--e-stone); }
.e-faq-c details:last-child { border-bottom: 1px solid var(--e-stone); }
.e-faq-c summary { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1rem; padding: 1.1rem 0; cursor: pointer; list-style: none; font-weight: 400; }
.e-faq-c summary::-webkit-details-marker { display: none; }
.e-faq-c summary svg { width: 1rem; height: 1rem; transition: transform var(--dur) var(--ease-out); }
.e-faq-c details[open] summary svg { transform: rotate(45deg); }
.e-faq-c p { padding: 0 0 1.1rem; color: var(--e-ink-muted); max-width: 60ch; }

/* D11 Promo card */

.e-promo { position: relative; isolation: isolate; min-height: 24rem; border-radius: var(--r-lg); overflow: hidden; padding: clamp(1.5rem, 1rem + 3vw, 3.5rem); display: grid; align-content: end; gap: 1rem; justify-items: start; color: var(--e-white); }
.e-promo img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.e-promo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(0, 0, 0, .72), rgba(0, 0, 0, .1) 60%); }
.e-promo .e-label { color: rgba(255, 255, 255, .7); }
.e-promo .e-h2 { font-size: clamp(1.9rem, 1.3rem + 2.6vw, 3rem); max-width: 12em; }
.e-promo__row { display: flex; flex-wrap: wrap; gap: .625rem; width: 100%; margin-top: .5rem; }
.e-promo__row .e-btn--light { flex: 1 1 auto; justify-content: center; padding-block: 1.05em; }
.e-promo__row .e-btn--ghost-light { padding-block: 1.05em; }

/* D12 Glass bar (phones) */

.e-bar { position: fixed; inset: auto 0 0 0; z-index: 45; display: flex; gap: .5rem; padding: .625rem var(--edge) calc(.625rem + env(safe-area-inset-bottom, 0px)); background: rgba(244, 240, 239, .86); -webkit-backdrop-filter: saturate(160%) blur(16px); backdrop-filter: saturate(160%) blur(16px); border-top: 1px solid rgba(14, 14, 14, .08); color: var(--e-ink); transition: transform var(--dur) var(--ease-out); }
.e-bar[data-hidden="true"] { transform: translateY(110%); }
.e-bar .e-btn--solid { flex: 1 1 auto; justify-content: center; padding-block: 1.05em; }
.e-bar .e-icon-btn { width: 3rem; height: 3rem; flex: 0 0 auto; background: var(--e-white); border-color: transparent; }

/* D13 Footer */

.e-ap-foot { padding: 2rem var(--edge) calc(2rem + 5rem); font-size: .8125rem; line-height: 1.6; color: var(--e-ink-muted); }
.e-ap-foot__in { max-width: 72rem; margin-inline: auto; display: grid; gap: .75rem; }
.e-ap-foot a:hover { color: var(--e-ink); }
.e-ap-foot ul { display: flex; flex-wrap: wrap; gap: .75rem 1.25rem; }
.e-ap-foot .e-logo img { height: 18px; width: auto; opacity: .8; }

/* D14 Desktop */

@media (min-width: 62rem) {
  .e-ap-top { padding: 1rem var(--edge); }
  .e-ap-top .e-logo img { height: 24px; }
  .e-ap-top .e-lp-tel { display: inline-flex; margin-right: .75rem; font-size: var(--t-small); }
  .e-ap-top .e-header__cta { display: inline-flex; }
  .e-ap-hero { padding: clamp(2rem, 4vw, 4rem) var(--edge) var(--sec); }
  .e-ap-hero__grid { grid-template-columns: 6fr 6fr; align-items: center; gap: clamp(2.5rem, 5vw, 5rem); }
  .e-ap-hero__pic { order: 2; }
  .e-ap-hero__text { gap: 1.25rem; }
  .e-ap-hero__cta { width: auto; }
  .e-ap-hero__cta .e-btn--solid { flex: 0 0 auto; }
  .e-opts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .e-flow .e-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .e-flow__nav .e-btn { flex: 0 0 auto; min-width: 16rem; }
  .e-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); overflow: visible; margin: 0; padding: 0; }
  .e-rail--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .e-rail > * { flex: none; }
  .e-rail-foot { display: none; }
  .e-tl2 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gutter); padding-left: 0; }
  .e-tl2::before { left: 1.25rem; right: 1.25rem; top: 1.25rem; bottom: auto; width: auto; height: 1px; }
  .e-tl2 li { padding-top: 3.5rem; }
  .e-tl2 li::before { left: 0; }
  .e-faq-c { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(2rem, 5vw, 5rem); }
  .e-faq-c details:last-child { border-bottom: 0; }
  .e-faq-c details:nth-last-child(-n+2) { border-bottom: 1px solid var(--e-stone); }
  .e-promo { min-height: 28rem; justify-items: center; text-align: center; align-content: center; }
  .e-promo .e-h2 { max-width: 14em; }
  .e-promo__row { width: auto; justify-content: center; }
  .e-promo__row .e-btn--light { flex: 0 0 auto; }
  .e-bar { display: none; }
  .e-ap-foot { padding-block: 2rem; }
  .e-ap-foot__in { grid-template-columns: auto 1fr auto; align-items: center; gap: var(--gutter); }
}

/* D15 Flow states */

.e-ap [id] { scroll-margin-top: 4.5rem; }
.e-flow__ok { scroll-margin-block: 6rem; }

/* below the admin bar (which scrolls away up to 600px) */
.admin-bar .e-ap-top { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { .admin-bar .e-ap-top { top: 0; } }
.e-flow__ok:focus { outline: none; }

/* one step at a time once landing.js runs; no progress or step buttons without it */
.js .e-flow .e-flow__step[data-active="false"],
.js .e-flow [data-step][data-active="false"],
.js .e-flow--fluent:not([data-flow-ready], [data-flow-failed]) :is(.e-lf-step-2, .e-lf-step-3, .ff_submit_btn_wrapper) { display: none; }

html:not(.js) .e-flow :is(.e-flow__bar, .e-flow__meta, [data-flow-back], [data-flow-next]),
.e-flow[data-flow-failed] :is(.e-flow__bar, .e-flow__meta, .e-flow__hint, [data-flow-back], [data-flow-next]) { display: none; }

.e-flow [role="alert"] { font-size: var(--t-small); line-height: 1.5; color: var(--e-ink); }
.e-flow [role="alert"] a { text-decoration: underline; text-underline-offset: .2em; }
.e-flow[data-sent="true"] > .e-flow__error { display: none; }

/* D16 Flow on Fluent Forms: the plugin's markup, the design's look */

.e-flow--fluent form { font: inherit; color: inherit; }
.e-flow--fluent[data-sent="true"] .fluentform { display: none; }
.e-flow--fluent .frm-fluent-form > fieldset { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.1rem 1rem; min-width: 0; }
.e-flow--fluent .frm-fluent-form > fieldset > * { grid-column: 1 / -1; min-width: 0; }
.e-flow--fluent form .ff-el-group { margin: 0; }
.e-flow--fluent form .ff-el-group::before,
.e-flow--fluent form .ff-el-group::after { content: none; display: none; }

/* questions (steps 1, 2), with the hint where the design's legend has it */
.e-flow--fluent form :is(.e-lf-home, .e-lf-step-2) { display: grid; gap: 1.1rem; }
.e-flow--fluent form :is(.e-lf-home, .e-lf-step-2) > .ff-el-input--label { display: block; margin: 0; padding-bottom: .35rem; }
.e-flow--fluent form :is(.e-lf-home, .e-lf-step-2) > .ff-el-input--label label { display: block; margin: 0; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.125rem); font-weight: 300; line-height: 1.1; letter-spacing: -.015em; text-transform: none; color: var(--e-ink); }
.e-flow--fluent form .ff-el-input--label.ff-el-is-required.asterisk-right label::after { content: " *"; margin: 0; color: inherit; }
.e-flow--fluent form .e-lf-home .ff-el-input--label.ff-el-is-required.asterisk-right label::after { content: none; }
.e-flow--fluent form .ff-el-input--label > .e-flow__hint { margin: -.15rem 0 -.35rem; }

/* choices: pills, and picture cards once landing.js adds the pictures */
.e-flow--fluent form :is(.e-lf-home, .e-ff-chips) .ff-el-input--content { display: flex; flex-wrap: wrap; gap: .5rem; }
.e-flow--fluent form .ff-el-form-check { position: relative; margin: 0; }
.e-flow--fluent form .ff-el-form-check label.ff-el-form-check-label { position: relative; display: block; margin: 0; color: inherit; cursor: pointer; }
.e-flow--fluent form .ff-el-form-check-label .ff-el-form-check-input { position: absolute; top: 0; left: 0; width: 1px; height: 1px; margin: 0; opacity: 0; }
.e-flow--fluent form .ff-el-form-check-label:not(.e-opt) > span { display: inline-flex; align-items: center; padding: .9em 1.2em; border: 1px solid var(--line-strong); border-radius: var(--r-pill); font-size: var(--t-small); font-weight: 400; letter-spacing: .02em; line-height: 1; user-select: none; transition: background var(--dur-fast), color var(--dur-fast), border-color var(--dur-fast); }
.e-flow--fluent form .ff-el-form-check-label:not(.e-opt) > span:hover { border-color: var(--fg); }
.e-flow--fluent form .ff-el-form-check-label:not(.e-opt) > input:checked + span { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.e-flow--fluent form .ff-el-form-check-label:not(.e-opt) > input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 3px; }

.e-flow--fluent form .ff-el-input--content.e-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .625rem; }
.e-flow--fluent form .e-opt > span { display: block; }

/* fields */
.e-flow--fluent form .e-lf-step-3 { display: grid; gap: .35rem; align-content: start; }
.e-flow--fluent form .e-lf-step-3 > .ff-el-input--label { display: block; margin: 0; }
.e-flow--fluent form .e-lf-step-3 > .ff-el-input--label label { display: block; margin: 0; font-size: var(--t-label); font-weight: 700; letter-spacing: .14em; line-height: 1.6; text-transform: uppercase; color: var(--fg-muted); }
.e-flow--fluent form .e-flow__q + .e-lf-step-3 { margin-top: -1.1rem; }
.e-flow--fluent[data-flow-ready] form .e-lf-step-3 + .e-lf-step-3 { margin-top: -.1rem; }
.e-flow--fluent form .ff-el-form-control,
.e-flow--fluent form .ff-el-form-control:hover,
.e-flow--fluent form .ff-el-form-control:focus { display: block; width: 100%; max-width: 100%; height: auto; min-height: 0; margin: 0; padding: .75em 0; border: 0; border-bottom: 1px solid var(--line-strong); border-radius: 0; background: transparent; box-shadow: none; color: inherit; font: inherit; line-height: 1.6; transition: border-color var(--dur-fast), box-shadow var(--dur-fast); }
.e-flow--fluent form .ff-el-form-control::placeholder { color: var(--fg-muted); opacity: .7; }
.e-flow--fluent form .ff-el-form-control:focus-visible,
.e-flow--fluent form .ff-el-form-control:focus { outline: none; border-bottom-color: var(--fg); box-shadow: 0 1px 0 var(--fg); }
.e-flow--fluent form .e-phone { row-gap: 0; }
.e-flow--fluent form .e-phone > .e-phone__prefix + .ff-el-form-control { min-width: 0; }
.e-flow--fluent form .e-phone > :not(.e-phone__prefix, .ff-el-form-control) { grid-column: 1 / -1; }

/* errors: no colour of their own */
.e-flow--fluent form .ff-el-is-error .ff-el-form-control { border-bottom-color: var(--fg); }
.e-flow--fluent form .ff-el-is-error .ff-el-form-check-label,
.e-flow--fluent form .ff-el-is-error .ff-el-form-check-label a { color: inherit; }
.e-flow--fluent form .ff-el-is-error .text-danger,
.e-flow--fluent form .ff-el-input--content > .error { margin: .35rem 0 0; font-size: .75rem; font-weight: 400; line-height: 1.4; letter-spacing: .02em; color: var(--e-ink); }
.e-flow--fluent form .ff-el-is-error .text-danger::before { content: "— "; }
.e-flow--fluent .ff-errors-in-stack { margin: 1rem 0 0; font-size: var(--t-small); color: var(--e-ink); }
.e-flow--fluent .ff-errors-in-stack .error { font-size: inherit; color: inherit; }

/* submit: the solid pill, over the plugin's own colours */
.e-flow--fluent form .ff_submit_btn_wrapper { display: flex; justify-content: space-between; align-items: center; gap: 1rem; text-align: left; }
.e-flow--fluent form .ff-btn-submit.ff-btn,
.e-flow--fluent form .ff-btn-submit.ff-btn:focus { position: relative; display: inline-flex; flex: 1 1 auto; align-items: center; justify-content: center; gap: .6em; overflow: hidden; margin: 0; padding: 1.05em 1.6em; border: 1px solid var(--fg); border-radius: var(--r-pill); background: var(--fg); color: var(--bg); font: inherit; font-size: var(--t-small); font-weight: 400; letter-spacing: .02em; line-height: 1; white-space: nowrap; opacity: 1; box-shadow: none; transition: background var(--dur-fast), color var(--dur-fast), border-color var(--dur-fast); }
.e-flow--fluent form .ff-btn-submit.ff-btn:hover { background: transparent; color: var(--fg); opacity: 1; }
.e-flow--fluent form .ff-btn-submit.ff-btn:focus-visible { outline: 2px solid var(--fg); outline-offset: 4px; }
.e-flow--fluent form .ff-btn-submit.ff-btn.disabled { opacity: .65; }
.e-flow--fluent form .ff-btn-submit.ff-btn svg { flex: 0 0 auto; }


@media (min-width: 62rem) {
  .e-flow--fluent .frm-fluent-form > fieldset { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .e-flow--fluent form .ff-el-group.e-lf-step-3 { grid-column: auto; }
  .e-flow--fluent[data-flow-ready] form .e-lf-step-3 + .e-lf-step-3 { margin-top: -1.1rem; }
  .e-flow--fluent form .ff-el-input--content.e-opts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .e-flow--fluent form .ff-btn-submit.ff-btn { flex: 0 0 auto; min-width: 16rem; }
}

/* without JavaScript (Fluent form hidden, inc/forms-landing.php) */
.e-flow__nojs a { text-decoration: underline; text-underline-offset: .2em; }
