/* Aria blocks: the design any block can carry (space, alignment, width, tone, background, entrance,
   per-device changes) and the builder blocks (icons, features, galleries, tabs, accordions, sliders,
   counters, maps, logos, pricing, people, testimonials). Every value comes from the theme's own
   tokens when it has them (--ar-* for Aria), so a page built here looks like it belongs to the theme.
   Brand marks: Font Awesome Free 5.15 (CC BY 4.0). Icons: Lucide (ISC). */

:root {
  --ab-accent: var(--ar-accent, #5b47e0); --ab-on-accent: var(--ar-on-accent, #fff); --ab-accent-ink: var(--ar-accent-ink, #4a39b8);
  --ab-ink: var(--ar-ink, #16171d); --ab-ink-2: var(--ar-ink-2, #3a3c46); --ab-muted: var(--ar-muted, #6b6e7a);
  --ab-line: var(--ar-line, #e7e6e2); --ab-line-2: var(--ar-line-2, #d6d5d0);
  --ab-bg: var(--ar-bg, #fff); --ab-bg-2: var(--ar-bg-2, #f6f6f4); --ab-surface: var(--ar-surface, #fff);
  --ab-r: var(--ar-r, 12px); --ab-r-sm: var(--ar-r-sm, 8px);
  --ab-shadow: var(--ar-shadow, 0 1px 2px rgb(16 17 22 / 6%), 0 8px 24px rgb(16 17 22 / 6%));
  --ab-display: var(--ar-font-display, inherit);
  --ab-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ------------------------------------------------------------------ space, alignment, width */
.ab.ab-mt-none { margin-top: 0; } .ab.ab-mt-xs { margin-top: 8px; } .ab.ab-mt-sm { margin-top: 16px; } .ab.ab-mt-md { margin-top: 32px; }
.ab.ab-mt-lg { margin-top: clamp(40px, 5vw, 56px); } .ab.ab-mt-xl { margin-top: clamp(56px, 8vw, 88px); } .ab.ab-mt-2xl { margin-top: clamp(72px, 11vw, 128px); }
.ab.ab-mb-none { margin-bottom: 0; } .ab.ab-mb-xs { margin-bottom: 8px; } .ab.ab-mb-sm { margin-bottom: 16px; } .ab.ab-mb-md { margin-bottom: 32px; }
.ab.ab-mb-lg { margin-bottom: clamp(40px, 5vw, 56px); } .ab.ab-mb-xl { margin-bottom: clamp(56px, 8vw, 88px); } .ab.ab-mb-2xl { margin-bottom: clamp(72px, 11vw, 128px); }
.ab.ab-ta-left { text-align: left; } .ab.ab-ta-center { text-align: center; } .ab.ab-ta-right { text-align: right; }
.ab.ab-ta-center :where(.ab-buttons, .ar-actions, .ab-social, .ab-counter__figure) { justify-content: center; }
.ab.ab-ta-right :where(.ab-buttons, .ar-actions, .ab-social, .ab-counter__figure) { justify-content: flex-end; }
.ab.ab-ta-center :where(p, .ar-lead) { margin-inline: auto; }
/* a centred paragraph is centred even where the theme caps its line length */
.ab.ab-ta-center:where(p) { margin-inline: auto; } .ab.ab-ta-right:where(p) { margin-left: auto; }
.ab.ab-ta-center:where(.ab-buttons, .ab-social) { justify-content: center; }
.ab.ab-ta-right:where(.ab-buttons, .ab-social) { justify-content: flex-end; }
.ab.ab-w-narrow { --ar-max: 42rem; max-width: min(42rem, 100%); }
.ab.ab-w-regular { --ar-max: 64rem; max-width: min(64rem, 100%); }
.ab.ab-w-wide { --ar-max: 84rem; max-width: min(84rem, 100%); }
.ab.ab-w-full { max-width: none; margin-inline: 0; }
:where(.ab-w-narrow, .ab-w-regular, .ab-w-wide):not(.block-section) { margin-inline: auto; }

/* text size, whatever the heading level */
.ab.ab-fs-sm { font-size: 1rem; } .ab.ab-fs-md { font-size: 1.25rem; } .ab.ab-fs-lg { font-size: clamp(1.4rem, 1.2rem + .8vw, 1.8rem); }
.ab.ab-fs-xl { font-size: clamp(1.9rem, 1.4rem + 1.8vw, 2.8rem); } .ab.ab-fs-2xl { font-size: clamp(2.4rem, 1.6rem + 3vw, 4rem); line-height: 1.05; }
.ab.ab-fs-3xl { font-size: clamp(2.8rem, 1.6rem + 5vw, 5.6rem); line-height: 1; letter-spacing: -0.035em; }

/* boxes */
.ab.ab-pad-none { padding: 0; } .ab.ab-pad-sm { padding: 16px; } .ab.ab-pad-md { padding: clamp(20px, 3vw, 32px); } .ab.ab-pad-lg { padding: clamp(28px, 5vw, 56px); } .ab.ab-pad-xl { padding: clamp(40px, 7vw, 88px); }
.block-section.ab.ab-pad-sm, .block-section.ab.ab-pad-md, .block-section.ab.ab-pad-lg, .block-section.ab.ab-pad-xl { padding-inline: 0; }
.ab.ab-r-none { border-radius: 0; } .ab.ab-r-sm { border-radius: var(--ab-r-sm); } .ab.ab-r-md { border-radius: var(--ab-r); } .ab.ab-r-lg { border-radius: calc(var(--ab-r) * 2); } .ab.ab-r-full { border-radius: 999px; }
.ab.ab-r-sm img, .ab.ab-r-md img, .ab.ab-r-lg img { border-radius: inherit; }
.ab.ab-r-full:where(figure) img { border-radius: 50%; }
.ab.ab-sh-sm { box-shadow: 0 1px 2px rgb(16 17 22 / 8%), 0 2px 8px rgb(16 17 22 / 6%); } .ab.ab-sh-md { box-shadow: var(--ab-shadow); } .ab.ab-sh-lg { box-shadow: 0 2px 6px rgb(16 17 22 / 8%), 0 24px 60px rgb(16 17 22 / 16%); }
.ab.ab-sh-sm:where(figure), .ab.ab-sh-md:where(figure), .ab.ab-sh-lg:where(figure) { overflow: hidden; }
.ab.ab-bd { border: 1px solid var(--ab-line); }

/* ------------------------------------------------------------------ tones */
.ab-tone-muted { background-color: var(--ab-bg-2); }
.ab-tone-soft { background-color: color-mix(in srgb, var(--ab-accent) 9%, var(--ab-bg)); }
.ab-tone-dark, .ab-on-dark {
  --ar-ink: #f4f4f2; --ar-ink-2: #d2d3da; --ar-muted: #a5a7b3; --ar-line: rgb(255 255 255 / 14%); --ar-line-2: rgb(255 255 255 / 24%);
  --ar-bg-2: rgb(255 255 255 / 6%); --ar-surface: rgb(255 255 255 / 6%); --ar-accent-ink: var(--ar-accent-glow, #a99cf5);
  --ab-ink: #f4f4f2; --ab-ink-2: #d2d3da; --ab-muted: #a5a7b3; --ab-line: rgb(255 255 255 / 14%); --ab-line-2: rgb(255 255 255 / 24%);
  --ab-bg-2: rgb(255 255 255 / 6%); --ab-surface: rgb(255 255 255 / 6%); --ab-accent-ink: var(--ar-accent-glow, #a99cf5);
  color: #f4f4f2; color-scheme: dark;
}
.ab-tone-dark { background-color: var(--ab-dark, #101218); }
.ab-tone-accent {
  background-color: var(--ab-accent); color: var(--ab-on-accent);
  --ar-ink: var(--ab-on-accent); --ar-ink-2: var(--ab-on-accent); --ar-muted: color-mix(in srgb, var(--ab-on-accent) 78%, transparent);
  --ar-line: color-mix(in srgb, var(--ab-on-accent) 22%, transparent); --ar-accent-ink: var(--ab-on-accent);
  --ab-ink: var(--ab-on-accent); --ab-ink-2: var(--ab-on-accent); --ab-muted: color-mix(in srgb, var(--ab-on-accent) 78%, transparent);
  --ab-line: color-mix(in srgb, var(--ab-on-accent) 22%, transparent); --ab-accent-ink: var(--ab-on-accent);
}
.ab-tone-dark :where(h1, h2, h3, h4, h5, h6), .ab-on-dark :where(h1, h2, h3, h4, h5, h6), .ab-tone-accent :where(h1, h2, h3, h4, h5, h6) { color: inherit; }
.ab-tone-accent :where(a:not(.btn, .ar-btn)) { color: inherit; }
/* a primary button on the accent colour turns inside out, so it still stands out */
.ab-tone-accent :where(.btn-primary, .ar-btn--primary) { background: var(--ab-on-accent); border-color: var(--ab-on-accent); color: var(--ab-accent); }
.ab-tone-accent :where(.btn-secondary, .ar-btn:not(.ar-btn--primary)) { border-color: color-mix(in srgb, var(--ab-on-accent) 40%, transparent); color: var(--ab-on-accent); background: transparent; }
.ab-tone-dark :where(.btn-secondary), .ab-on-dark :where(.btn-secondary) { color: #f4f4f2; border-color: rgb(255 255 255 / 30%); background: transparent; }
.ab-tone-dark :where(.btn-secondary:hover), .ab-on-dark :where(.btn-secondary:hover) { border-color: #fff; color: #fff; }

/* ------------------------------------------------------------------ backgrounds */
.ab-bg { position: relative; isolation: isolate; }
.ab-bg[style*="--ab-bgc"] { background-color: var(--ab-bgc); }
.ab-g-aurora { background-image: radial-gradient(60rem 30rem at 85% -10%, color-mix(in srgb, var(--ab-accent) 28%, transparent), transparent 70%), radial-gradient(40rem 26rem at 0% 110%, color-mix(in srgb, #19c3b0 18%, transparent), transparent 70%); }
.ab-g-sunrise { background-image: linear-gradient(135deg, #fff1e6 0%, #ffd9c2 45%, #ffc0cb 100%); color: #2a1a12; --ar-ink: #2a1a12; --ab-ink: #2a1a12; }
.ab-g-ocean { background-image: linear-gradient(160deg, #0b2a4a 0%, #0e5b80 55%, #18a3b5 100%); color: #f2fbff; --ar-ink: #f2fbff; --ab-ink: #f2fbff; --ar-ink-2: #d5ecf4; --ar-muted: #b5d4df; }
.ab-g-dusk { background-image: linear-gradient(160deg, #1a1033 0%, #3a1d5c 50%, #a3466e 100%); color: #fbf3ff; --ar-ink: #fbf3ff; --ab-ink: #fbf3ff; --ar-ink-2: #e8d9f2; --ar-muted: #cdb7dc; }
.ab-g-mist { background-image: linear-gradient(180deg, var(--ab-bg) 0%, var(--ab-bg-2) 100%); }
.ab-g-accent { background-image: linear-gradient(135deg, var(--ab-accent) 0%, color-mix(in srgb, var(--ab-accent) 55%, #000) 100%); color: var(--ab-on-accent); --ar-ink: var(--ab-on-accent); --ab-ink: var(--ab-on-accent); --ar-ink-2: var(--ab-on-accent); --ar-muted: color-mix(in srgb, var(--ab-on-accent) 78%, transparent); }
.ab-g-ocean :where(h1, h2, h3, h4), .ab-g-dusk :where(h1, h2, h3, h4), .ab-g-accent :where(h1, h2, h3, h4), .ab-g-sunrise :where(h1, h2, h3, h4) { color: inherit; }
.ab-bg-img { background-image: var(--ab-img); background-size: cover; background-position: var(--ab-pos, 50% 50%); background-repeat: no-repeat; }
.ab-bg-img.ab-bg-contain { background-size: contain; } .ab-bg-img.ab-bg-auto { background-size: auto; background-repeat: repeat; }
.ab-bg-img.ab-bg-fixed { background-attachment: fixed; }
@media (hover: none), (max-width: 900px) { .ab-bg-img.ab-bg-fixed { background-attachment: scroll; } }
.ab-ov::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: rgb(8 10 16 / var(--ab-ov, .4)); pointer-events: none; }
.ab-bg-video { overflow: hidden; }
.ab-bgv { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .ab-bgv { display: none; } }

/* height and where the content sits */
.ab-mh-sm { min-height: 40vh; } .ab-mh-md { min-height: 60vh; } .ab-mh-lg { min-height: 80vh; } .ab-mh-screen { min-height: 100vh; min-height: 100svh; }
.ab.ab-va-top, .ab.ab-va-center, .ab.ab-va-bottom { display: flex; flex-direction: column; }
.ab.ab-va-center { justify-content: center; } .ab.ab-va-bottom { justify-content: flex-end; }
.ab.ab-va-center > *, .ab.ab-va-bottom > *, .ab.ab-va-top > * { flex: none; }

/* a section's content width */
.block-section.ab-inner-narrow { --ar-max: 42rem; } .block-section.ab-inner-wide { --ar-max: 84rem; }
.block-section.ab-inner-full > :where(*) { max-width: none; margin-inline: 0; }
.block-section.pad-xl { padding-block: clamp(88px, 12vw, 168px); }

/* ------------------------------------------------------------------ columns
   Keyed on .ab-cols, which every theme's columns get, so shares, gaps, line-up and stacking work
   the same on any theme (its own grid only decides what these don't). */
.ab-cols.ab-cols { display: grid; gap: var(--ab-gap, 28px); grid-template-columns: repeat(var(--ab-n, 2), minmax(0, 1fr)); }
.ab-n-1 { --ab-n: 1; } .ab-n-2 { --ab-n: 2; } .ab-n-3 { --ab-n: 3; } .ab-n-4 { --ab-n: 4; } .ab-n-5 { --ab-n: 5; } .ab-n-6 { --ab-n: 6; }
.ab-cols.ab-ratio-1-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } .ab-cols.ab-ratio-2-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.ab-cols.ab-ratio-1-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); } .ab-cols.ab-ratio-3-1 { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
.ab-cols.ab-ratio-2-3 { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); } .ab-cols.ab-ratio-3-2 { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.ab-cols.ab-ratio-1-2-1 { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); } .ab-cols.ab-ratio-2-1-1 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
.ab-cols.ab-ratio-1-1-2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); }
.ab-gap-none { --ab-gap: 0px; } .ab-gap-sm { --ab-gap: 12px; } .ab-gap-md { --ab-gap: 28px; } .ab-gap-lg { --ab-gap: 48px; } .ab-gap-xl { --ab-gap: 72px; }
.block-columns.gap-none { gap: 0; } .block-columns.gap-xl { gap: 72px; }
.ab-cva-center { align-items: center; } .ab-cva-bottom { align-items: end; } .ab-cva-stretch { align-items: stretch; }
.ab-cva-stretch > * { display: flex; flex-direction: column; } .ab-cva-stretch > * > :last-child { margin-top: auto; }
@media (min-width: 901px) { .cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .ab-cols.ab-stack-tablet { grid-template-columns: minmax(0, 1fr); }
  .ab-cols.ab-stack-tablet.ab-n-4, .ab-cols.ab-stack-tablet.ab-n-5, .ab-cols.ab-stack-tablet.ab-n-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-cols.ab-stack-tablet.ab-rev { display: flex; flex-direction: column-reverse; }
  .ab-cols.ab-stack-phone.ab-n-4, .ab-cols.ab-stack-phone.ab-n-5, .ab-cols.ab-stack-phone.ab-n-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .ab-cols.ab-stack-phone, .ab-cols.ab-stack-tablet { grid-template-columns: minmax(0, 1fr); }
  .ab-cols.ab-stack-phone.ab-rev { display: flex; flex-direction: column-reverse; }
}

/* ------------------------------------------------------------------ tablets and phones */
@media (min-width: 901px) { :root:not([data-fb-editing]) .ab-hide-desktop { display: none !important; } }
@media (min-width: 601px) and (max-width: 900px) {
  :root:not([data-fb-editing]) .ab-hide-tablet { display: none !important; }
  .ab.ab-t-ta-left { text-align: left; } .ab.ab-t-ta-center { text-align: center; } .ab.ab-t-ta-right { text-align: right; }
  .ab.ab-t-fs-sm { font-size: 1rem; } .ab.ab-t-fs-md { font-size: 1.2rem; } .ab.ab-t-fs-lg { font-size: 1.5rem; } .ab.ab-t-fs-xl { font-size: 2rem; } .ab.ab-t-fs-2xl { font-size: 2.6rem; } .ab.ab-t-fs-3xl { font-size: 3.2rem; }
  .ab.ab-t-mt-none { margin-top: 0; } .ab.ab-t-mt-xs { margin-top: 8px; } .ab.ab-t-mt-sm { margin-top: 16px; } .ab.ab-t-mt-md { margin-top: 28px; } .ab.ab-t-mt-lg { margin-top: 44px; } .ab.ab-t-mt-xl { margin-top: 64px; } .ab.ab-t-mt-2xl { margin-top: 88px; }
  .ab.ab-t-mb-none { margin-bottom: 0; } .ab.ab-t-mb-xs { margin-bottom: 8px; } .ab.ab-t-mb-sm { margin-bottom: 16px; } .ab.ab-t-mb-md { margin-bottom: 28px; } .ab.ab-t-mb-lg { margin-bottom: 44px; } .ab.ab-t-mb-xl { margin-bottom: 64px; } .ab.ab-t-mb-2xl { margin-bottom: 88px; }
}
@media (max-width: 600px) {
  :root:not([data-fb-editing]) .ab-hide-phone { display: none !important; }
  .ab.ab-p-ta-left { text-align: left; } .ab.ab-p-ta-center { text-align: center; } .ab.ab-p-ta-right { text-align: right; }
  .ab.ab-p-fs-sm { font-size: .95rem; } .ab.ab-p-fs-md { font-size: 1.1rem; } .ab.ab-p-fs-lg { font-size: 1.35rem; } .ab.ab-p-fs-xl { font-size: 1.75rem; } .ab.ab-p-fs-2xl { font-size: 2.2rem; } .ab.ab-p-fs-3xl { font-size: 2.6rem; }
  .ab.ab-p-mt-none { margin-top: 0; } .ab.ab-p-mt-xs { margin-top: 6px; } .ab.ab-p-mt-sm { margin-top: 12px; } .ab.ab-p-mt-md { margin-top: 24px; } .ab.ab-p-mt-lg { margin-top: 36px; } .ab.ab-p-mt-xl { margin-top: 52px; } .ab.ab-p-mt-2xl { margin-top: 72px; }
  .ab.ab-p-mb-none { margin-bottom: 0; } .ab.ab-p-mb-xs { margin-bottom: 6px; } .ab.ab-p-mb-sm { margin-bottom: 12px; } .ab.ab-p-mb-md { margin-bottom: 24px; } .ab.ab-p-mb-lg { margin-bottom: 36px; } .ab.ab-p-mb-xl { margin-bottom: 52px; } .ab.ab-p-mb-2xl { margin-bottom: 72px; }
  .ab-mh-screen { min-height: 86svh; }
}
.ab.ab-p-ta-center :where(.ab-buttons, .ab-social), .ab.ab-t-ta-center :where(.ab-buttons, .ab-social) { justify-content: center; }

/* ------------------------------------------------------------------ entrances */
.ab-d-100 { --ab-delay: 100ms; } .ab-d-200 { --ab-delay: 200ms; } .ab-d-300 { --ab-delay: 300ms; } .ab-d-500 { --ab-delay: 500ms; } .ab-d-800 { --ab-delay: 800ms; }
@media (prefers-reduced-motion: no-preference) {
  html.ab-motion .ab-an { transition: opacity .7s var(--ab-ease), transform .9s var(--ab-ease), filter .9s var(--ab-ease); transition-delay: var(--ab-delay, 0ms); }
  html.ab-motion .ab-an:not(.is-in) { opacity: 0; }
  html.ab-motion .ab-an-fade-up:not(.is-in) { transform: translateY(28px); }
  html.ab-motion .ab-an-fade-down:not(.is-in) { transform: translateY(-28px); }
  html.ab-motion .ab-an-slide-left:not(.is-in) { transform: translateX(44px); }
  html.ab-motion .ab-an-slide-right:not(.is-in) { transform: translateX(-44px); }
  html.ab-motion .ab-an-zoom:not(.is-in) { transform: scale(.94); }
  html.ab-motion .ab-an-blur:not(.is-in) { filter: blur(10px); }
}

/* ------------------------------------------------------------------ icons and features */
.ab-ico { width: 1em; height: 1em; flex: none; vertical-align: -0.125em; }
.ab-brand { width: 1em; height: 1em; flex: none; }
.ab-icon { display: inline-grid; place-items: center; color: var(--ab-accent-ink); line-height: 0; }
.ab-icon--ink { color: var(--ab-ink); } .ab-icon--muted { color: var(--ab-muted); }
.ab-icon--sm { font-size: 18px; } .ab-icon--md { font-size: 22px; } .ab-icon--lg { font-size: 28px; } .ab-icon--xl { font-size: 40px; } .ab-icon--2xl { font-size: 56px; }
.ab-icon--soft, .ab-icon--circle { width: 2.1em; height: 2.1em; background: color-mix(in srgb, currentColor 12%, transparent); }
.ab-icon--soft { border-radius: calc(var(--ab-r-sm) + 4px); } .ab-icon--circle { border-radius: 50%; }
.ab-icon--soft > svg, .ab-icon--circle > svg { width: .9em; height: .9em; }
.ab-icon--sm.ab-icon--soft, .ab-icon--sm.ab-icon--circle { font-size: 16px; }
.ab-icon-link { display: inline-block; border-radius: 12px; }
.ab-icon-link:hover .ab-icon { transform: translateY(-2px); } .ab-icon { transition: transform .2s var(--ab-ease); }
.ab-feature { display: flex; flex-direction: column; gap: 14px; height: 100%; }
.ab-feature--side { flex-direction: row; align-items: flex-start; gap: 18px; }
.ab-feature--card { padding: clamp(22px, 2.6vw, 30px); border-radius: var(--ab-r); background: var(--ab-surface); border: 1px solid var(--ab-line); transition: border-color .2s, box-shadow .25s, transform .25s var(--ab-ease); }
.ab-feature--card:hover { border-color: var(--ab-line-2); box-shadow: var(--ab-shadow); transform: translateY(-2px); }
.ab-feature__words { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.ab-feature__title { margin: 0; font-size: 1.18rem; line-height: 1.3; letter-spacing: -0.01em; }
.ab-feature__text { margin: 0; color: var(--ab-ink-2); line-height: 1.6; }
.ab-feature__more { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 600; color: var(--ab-accent-ink); text-decoration: none; }
.ab-feature__more .ab-ico { transition: transform .2s var(--ab-ease); }
.ab-feature__more:hover .ab-ico { transform: translateX(3px); }

/* ------------------------------------------------------------------ buttons */
.ab-buttons { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.ab-buttons > * { margin: 0 !important; }
.btn .ab-ico, .ar-btn .ab-ico { font-size: 1.05em; transition: transform .2s var(--ab-ease); }
.btn:hover .ab-ico:last-child { transform: translateX(2px); }
.btn.ab-btn--sm { min-height: 34px; padding: 0 14px; font-size: 14px; }
.btn.ab-btn--lg { min-height: 52px; padding: 0 26px; font-size: 16.5px; }
.btn.ab-btn--full { display: flex; width: 100%; }

/* ------------------------------------------------------------------ social */
.ab-social { display: flex; flex-wrap: wrap; gap: 10px; margin-block: 0; padding: 0; list-style: none; }
.ab-social__link { display: inline-grid; place-items: center; width: 40px; height: 40px; color: var(--ab-ink); font-size: 18px; text-decoration: none; transition: transform .2s var(--ab-ease), background-color .2s, color .2s, border-color .2s; }
.ab-social--sm .ab-social__link { width: 32px; height: 32px; font-size: 15px; } .ab-social--lg .ab-social__link { width: 50px; height: 50px; font-size: 22px; }
.ab-social--circle .ab-social__link { border-radius: 50%; border: 1px solid var(--ab-line-2); }
.ab-social--soft .ab-social__link { border-radius: var(--ab-r-sm); background: var(--ab-bg-2); }
.ab-social--plain .ab-social__link { width: auto; height: auto; padding: 4px; }
.ab-social--accent .ab-social__link { color: var(--ab-accent-ink); }
.ab-social__link:hover { transform: translateY(-2px); color: var(--ab-ink); border-color: var(--ab-ink); }
.ab-social--brand [data-net="linkedin"] { color: #0a66c2; } .ab-social--brand [data-net="x"] { color: var(--ab-ink); } .ab-social--brand [data-net="facebook"] { color: #1877f2; }
.ab-social--brand [data-net="instagram"] { color: #e1306c; } .ab-social--brand [data-net="youtube"] { color: #ff0000; } .ab-social--brand [data-net="tiktok"] { color: var(--ab-ink); }
.ab-social--brand [data-net="whatsapp"] { color: #25d366; } .ab-social--brand [data-net="github"] { color: var(--ab-ink); } .ab-social--brand [data-net="dribbble"] { color: #ea4c89; }
.ab-social--brand [data-net="pinterest"] { color: #e60023; } .ab-social--brand [data-net="telegram"] { color: #26a5e4; } .ab-social--brand [data-net="discord"] { color: #5865f2; } .ab-social--brand [data-net="spotify"] { color: #1db954; }
.ab-social__hint { color: var(--ab-muted); font-size: 14px; }

/* ------------------------------------------------------------------ pictures */
.ab-img { position: relative; }
.ab-img img { width: 100%; object-fit: cover; }
.ab-ratio-1x1 img, .ab-ratio-1x1 > a > img { aspect-ratio: 1; } .ab-ratio-4x3 img, .ab-ratio-4x3 > a > img { aspect-ratio: 4 / 3; } .ab-ratio-16x9 img, .ab-ratio-16x9 > a > img { aspect-ratio: 16 / 9; }
.ab-ratio-3x4 img, .ab-ratio-3x4 > a > img { aspect-ratio: 3 / 4; } .ab-ratio-21x9 img, .ab-ratio-21x9 > a > img { aspect-ratio: 21 / 9; }
[data-ab-zoom] { cursor: zoom-in; display: block; }
.ab-gallery { display: grid; gap: var(--ab-gap, 16px); grid-template-columns: repeat(var(--ab-c, 3), minmax(0, 1fr)); }
.ab-gallery.ab-gap-md { --ab-gap: 16px; } .ab-gallery.ab-gap-lg { --ab-gap: 28px; }
.ab-gallery--c2 { --ab-c: 2; } .ab-gallery--c3 { --ab-c: 3; } .ab-gallery--c4 { --ab-c: 4; } .ab-gallery--c5 { --ab-c: 5; } .ab-gallery--c6 { --ab-c: 6; }
.ab-gallery__item { margin: 0; overflow: hidden; border-radius: var(--ab-r); background: var(--ab-bg-2); }
.ab-gallery.ab-gap-none .ab-gallery__item { border-radius: 0; }
.ab-gallery__item img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; transition: transform .6s var(--ab-ease); }
.ab-gallery--square img { aspect-ratio: 1; } .ab-gallery--landscape img { aspect-ratio: 4 / 3; } .ab-gallery--portrait img { aspect-ratio: 3 / 4; } .ab-gallery--original img { height: auto; }
.ab-gallery__item a:hover img, .ab-gallery__item a:focus-visible img { transform: scale(1.04); }
.ab-gallery__item figcaption { padding: 10px 12px; font-size: 14px; color: var(--ab-muted); }
@media (max-width: 900px) { .ab-gallery--c4, .ab-gallery--c5, .ab-gallery--c6 { --ab-c: 3; } }
@media (max-width: 600px) { .ab-gallery { --ab-c: 2 !important; } }

/* the picture opened large */
.ab-lightbox { position: fixed; inset: 0; z-index: 9999; display: grid; grid-template-rows: 1fr auto; place-items: center; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 56px 72px 24px; border: 0; background: rgb(8 9 12 / 92%); color: #fff; }
.ab-lightbox::backdrop { background: transparent; }
.ab-lightbox[open] { animation: ab-fade .2s ease-out; }
.ab-lightbox img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; box-shadow: 0 20px 80px rgb(0 0 0 / 50%); }
.ab-lightbox__cap { margin: 14px 0 0; color: #d6d7dd; font-size: 15px; text-align: center; }
.ab-lightbox button { position: absolute; display: grid; place-items: center; width: 46px; height: 46px; border: 0; border-radius: 50%; background: rgb(255 255 255 / 10%); color: #fff; font-size: 22px; cursor: pointer; }
.ab-lightbox button:hover { background: rgb(255 255 255 / 20%); }
.ab-lightbox__close { top: 14px; right: 14px; } .ab-lightbox__prev { left: 14px; top: 50%; translate: 0 -50%; } .ab-lightbox__next { right: 14px; top: 50%; translate: 0 -50%; }
.ab-lightbox__count { position: absolute; top: 24px; left: 24px; color: #a8aab3; font-size: 14px; font-variant-numeric: tabular-nums; }
@media (max-width: 600px) { .ab-lightbox { padding: 56px 12px 16px; } .ab-lightbox__prev, .ab-lightbox__next { top: auto; bottom: 14px; translate: none; } }
@keyframes ab-fade { from { opacity: 0; } }

/* ------------------------------------------------------------------ video */
.ab-video { position: relative; margin-block: 0; }
.ab-video > a, .ab-video > video, .ab-video > iframe, .ab-video__blank { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: var(--ab-r); overflow: hidden; background: #0d0e12; }
.ab-video.ab-ratio-4x3 > * { aspect-ratio: 4 / 3; } .ab-video.ab-ratio-1x1 > * { aspect-ratio: 1; } .ab-video.ab-ratio-9x16 > * { aspect-ratio: 9 / 16; max-width: 420px; margin-inline: auto; }
.ab-video figcaption { aspect-ratio: auto !important; background: none !important; }
.ab-video__lite { position: relative; }
.ab-video__lite img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ab-ease), opacity .3s; }
.ab-video__lite:hover img { transform: scale(1.02); opacity: .92; }
.ab-video__play { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 74px; height: 74px; margin: -37px 0 0 -37px; border-radius: 50%; background: rgb(255 255 255 / 92%); color: #111; font-size: 28px; box-shadow: 0 10px 40px rgb(0 0 0 / 35%); transition: transform .25s var(--ab-ease); }
.ab-video__play .ab-ico { margin-left: 4px; fill: currentColor; }
.ab-video__lite:hover .ab-video__play { transform: scale(1.08); }
.ab-video.is-empty .ab-video__blank { display: grid; place-items: center; position: relative; }
.ab-video.is-empty figcaption { margin-top: 10px; color: var(--ab-muted); font-size: 14px; }
.ab-video figcaption { margin-top: 10px; color: var(--ab-muted); font-size: 14px; }

/* ------------------------------------------------------------------ tabs */
.ab-tabs__list { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 28px; padding: 0; border-bottom: 1px solid var(--ab-line); }
.ab-tabs__btn { position: relative; padding: 12px 16px; border: 0; background: none; color: var(--ab-muted); font: inherit; font-weight: 600; cursor: pointer; border-radius: var(--ab-r-sm) var(--ab-r-sm) 0 0; transition: color .2s; }
.ab-tabs__btn:hover { color: var(--ab-ink); }
.ab-tabs__btn[aria-selected="true"] { color: var(--ab-ink); }
.ab-tabs--line .ab-tabs__btn[aria-selected="true"]::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: -1px; height: 2px; border-radius: 2px; background: var(--ab-accent); }
.ab-tabs--pills .ab-tabs__list { border: 0; gap: 8px; }
.ab-tabs--pills .ab-tabs__btn { border-radius: 999px; padding: 9px 16px; background: var(--ab-bg-2); }
.ab-tabs--pills .ab-tabs__btn[aria-selected="true"] { background: var(--ab-ink); color: var(--ab-bg); }
.ab-tabs--boxed .ab-tabs__list { border: 0; padding: 4px; gap: 4px; border-radius: calc(var(--ab-r-sm) + 4px); background: var(--ab-bg-2); width: max-content; max-width: 100%; }
.ab-tabs--boxed .ab-tabs__btn { border-radius: var(--ab-r-sm); padding: 9px 16px; }
.ab-tabs--boxed .ab-tabs__btn[aria-selected="true"] { background: var(--ab-surface); box-shadow: 0 1px 3px rgb(0 0 0 / 10%); }
.ab-tab + .ab-tab { margin-top: 32px; }
.ab-tab__label { margin: 0 0 12px; font-size: 1.15rem; }
.ab-tabs.is-ready .ab-tab__label { display: none; }
.ab-tabs.is-ready .ab-tab + .ab-tab { margin-top: 0; }
.ab-tabs.is-ready .ab-tab[hidden] { display: none; }
.ab-tabs.is-ready .ab-tab:not([hidden]) { animation: ab-rise .35s var(--ab-ease); }
.ab-tab__body > :first-child { margin-top: 0; } .ab-tab__body > :last-child { margin-bottom: 0; }
@keyframes ab-rise { from { opacity: 0; transform: translateY(6px); } }

/* ------------------------------------------------------------------ accordion */
.ab-acc { border-top: 1px solid var(--ab-line); }
.ab-acc__item { border-bottom: 1px solid var(--ab-line); }
.ab-acc__item > summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 2px; cursor: pointer; list-style: none; font-weight: 600; font-size: 1.08rem; line-height: 1.4; }
.ab-acc__item > summary::-webkit-details-marker { display: none; }
.ab-acc__item > summary:hover .ab-acc__title { color: var(--ab-accent-ink); }
.ab-acc__icon { position: relative; flex: none; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--ab-line-2); transition: background .2s, border-color .2s; }
.ab-acc__icon::before, .ab-acc__icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 11px; height: 1.6px; margin: -.8px 0 0 -5.5px; background: currentColor; transition: transform .3s var(--ab-ease); }
.ab-acc__icon::after { transform: rotate(90deg); }
.ab-acc__item[open] .ab-acc__icon::after { transform: rotate(0); }
.ab-acc__item[open] .ab-acc__icon { background: var(--ab-ink); border-color: var(--ab-ink); color: var(--ab-bg); }
.ab-acc__body { padding: 0 52px 22px 2px; color: var(--ab-ink-2); }
.ab-acc__body > :first-child { margin-top: 0; } .ab-acc__body > :last-child { margin-bottom: 0; }
.ab-acc__item[open] .ab-acc__body { animation: ab-rise .3s var(--ab-ease); }
.ab-acc--boxed { border: 0; display: flex; flex-direction: column; gap: 10px; }
.ab-acc--boxed .ab-acc__item { border: 1px solid var(--ab-line); border-radius: var(--ab-r); background: var(--ab-surface); padding-inline: 18px; transition: border-color .2s, box-shadow .2s; }
.ab-acc--boxed .ab-acc__item[open] { border-color: var(--ab-line-2); box-shadow: var(--ab-shadow); }

/* ------------------------------------------------------------------ numbers */
.ab-counter { display: flex; flex-direction: column; gap: 6px; }
.ab-counter__figure { display: flex; align-items: baseline; gap: 2px; margin: 0; font-family: var(--ab-display); font-size: clamp(2.4rem, 1.6rem + 2.6vw, 3.8rem); font-weight: 700; line-height: 1; letter-spacing: -0.03em; color: var(--ab-ink); font-variant-numeric: tabular-nums; }
.ab-counter__affix { font-size: .7em; color: var(--ab-accent-ink); white-space: pre; }
.ab-counter__label { margin: 0; color: var(--ab-ink-2); font-weight: 500; }

/* ------------------------------------------------------------------ slider */
.ab-slider { position: relative; --ab-per: 1; }
.ab-slider[data-per-view="2"] { --ab-per: 2; } .ab-slider[data-per-view="3"] { --ab-per: 3; } .ab-slider[data-per-view="4"] { --ab-per: 4; }
@media (max-width: 900px) { .ab-slider[data-per-view="3"], .ab-slider[data-per-view="4"] { --ab-per: 2; } }
@media (max-width: 600px) { .ab-slider { --ab-per: 1 !important; } }
.ab-slider__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--ab-per) - 1) * 20px) / var(--ab-per)); gap: 20px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding-bottom: 2px; }
.ab-slider__track::-webkit-scrollbar { display: none; }
.ab-slide { scroll-snap-align: start; min-width: 0; }
.ab-slide > :first-child { margin-top: 0; } .ab-slide > :last-child { margin-bottom: 0; }
.ab-slider__nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 22px; }
.ab-slider__dots { display: flex; flex-wrap: wrap; gap: 8px; }
.ab-slider__dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: var(--ab-line-2); cursor: pointer; transition: width .3s var(--ab-ease), background .2s; }
.ab-slider__dot[aria-current="true"] { width: 26px; background: var(--ab-ink); }
.ab-slider__arrows { display: flex; gap: 8px; margin-left: auto; }
.ab-slider__arrow { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--ab-line-2); border-radius: 50%; background: var(--ab-surface); color: var(--ab-ink); font-size: 18px; cursor: pointer; transition: border-color .2s, transform .2s, opacity .2s; }
.ab-slider__arrow:hover:not(:disabled) { border-color: var(--ab-ink); }
.ab-slider__arrow:disabled { opacity: .35; cursor: default; }

/* ------------------------------------------------------------------ map */
.ab-map { position: relative; overflow: hidden; border-radius: var(--ab-r); background: var(--ab-bg-2); height: 380px; }
.ab-map--sm { height: 260px; } .ab-map--lg { height: 520px; }
.ab-map iframe { display: block; width: 100%; height: 100%; border: 0; }
.ab-map.is-asking { display: grid; place-items: center; align-content: center; gap: 10px; text-align: center; background: linear-gradient(135deg, var(--ab-bg-2), color-mix(in srgb, var(--ab-accent) 8%, var(--ab-bg-2))); }
.ab-map__ask { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 18px; border: 1px solid var(--ab-line-2); border-radius: 999px; background: var(--ab-surface); color: var(--ab-ink); font: inherit; font-weight: 600; cursor: pointer; }
.ab-map__ask:hover { border-color: var(--ab-ink); }
.ab-map__open { color: var(--ab-muted); font-size: 14px; }

/* ------------------------------------------------------------------ logos */
.ab-logos { --ab-logo-h: 34px; }
.ab-logos--sm { --ab-logo-h: 24px; } .ab-logos--lg { --ab-logo-h: 48px; }
.ab-logos__title { margin: 0 0 22px; text-align: center; color: var(--ab-muted); font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.ab-logos__view { display: flex; overflow: hidden; }
.ab-logos__list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 28px clamp(28px, 5vw, 64px); width: 100%; margin: 0; padding: 0; list-style: none; }
.ab-logos__list img { display: block; height: var(--ab-logo-h); width: auto; max-width: 170px; object-fit: contain; border-radius: 0 !important; transition: filter .3s, opacity .3s; }
.ab-logos--mono img { filter: grayscale(1); opacity: .65; }
.ab-logos--mono li:hover img { filter: none; opacity: 1; }
.ab-logos--scroll .ab-logos__view { -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); }
.ab-logos--scroll .ab-logos__list { flex: none; flex-wrap: nowrap; width: max-content; padding-right: clamp(28px, 5vw, 64px); animation: ab-marquee 40s linear infinite; }
.ab-logos--scroll:hover .ab-logos__list { animation-play-state: paused; }
@keyframes ab-marquee { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .ab-logos--scroll .ab-logos__list { animation: none; flex-wrap: wrap; width: 100%; } .ab-logos--scroll .ab-logos__list[aria-hidden] { display: none; } }

/* ------------------------------------------------------------------ pricing */
.ab-pricing { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); align-items: stretch; }
.ab-plan { position: relative; display: flex; flex-direction: column; gap: 10px; padding: clamp(24px, 3vw, 34px); border-radius: calc(var(--ab-r) + 4px); background: var(--ab-surface); border: 1px solid var(--ab-line); }
.ab-plan.is-picked { border-color: var(--ab-accent); box-shadow: 0 0 0 1px var(--ab-accent), 0 24px 60px color-mix(in srgb, var(--ab-accent) 18%, transparent); }
.ab-plan__badge { position: absolute; top: -12px; left: 24px; margin: 0; padding: 4px 12px; border-radius: 999px; background: var(--ab-accent); color: var(--ab-on-accent); font-size: 12.5px; font-weight: 700; letter-spacing: .02em; }
.ab-plan__name { margin: 0; font-size: 1.15rem; }
.ab-plan__for { margin: 0; color: var(--ab-muted); font-size: 15px; }
.ab-plan__price { display: flex; align-items: baseline; gap: 4px; margin: 10px 0 6px; }
.ab-plan__amount { font-family: var(--ab-display); font-size: clamp(2.2rem, 1.8rem + 1.4vw, 3rem); font-weight: 700; letter-spacing: -0.03em; line-height: 1; color: var(--ab-ink); }
.ab-plan__per { color: var(--ab-muted); font-size: 15px; }
.ab-plan__list { display: flex; flex-direction: column; gap: 10px; margin: 8px 0 18px; padding: 0; list-style: none; }
.ab-plan__list li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.45; }
.ab-plan__list .ab-ico { margin-top: .22em; color: var(--ab-accent-ink); }
.ab-plan__go { margin-top: auto; width: 100%; }

/* ------------------------------------------------------------------ people and testimonials */
.ab-person { display: flex; flex-direction: column; gap: 4px; }
.ab-person__photo { width: 96px; height: 96px; margin-bottom: 12px; object-fit: cover; border-radius: 50% !important; background: var(--ab-bg-2); }
.ab-person--soft .ab-person__photo { border-radius: calc(var(--ab-r) + 2px) !important; }
.ab-person--tall .ab-person__photo { width: 100%; height: auto; aspect-ratio: 4 / 5; border-radius: var(--ab-r) !important; }
.ab-person__name { margin: 0; font-size: 1.1rem; }
.ab-person__role { margin: 0; color: var(--ab-accent-ink); font-size: 14.5px; font-weight: 600; }
.ab-person__bio { margin: 8px 0 0; color: var(--ab-ink-2); font-size: 15.5px; line-height: 1.55; }
.ab-person__links { margin-top: 10px; }
.ab.ab-ta-center .ab-person, .ab-ta-center > .ab-person { align-items: center; }
.ab-quote { display: flex; flex-direction: column; gap: 18px; margin-block: 0; height: 100%; }
.ab-quote--card { padding: clamp(24px, 3vw, 34px); border-radius: calc(var(--ab-r) + 4px); background: var(--ab-surface); border: 1px solid var(--ab-line); }
.ab-quote__stars { display: flex; gap: 2px; margin: 0; color: var(--ab-line-2); font-size: 17px; }
.ab-quote__stars .is-on { color: #f5a524; fill: currentColor; }
.ab-quote__text { margin: 0; padding: 0; border: 0; font-size: clamp(1.08rem, 1rem + .3vw, 1.25rem); line-height: 1.55; color: var(--ab-ink); }
.ab-quote__text p { margin: 0; }
.ab-quote__who { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.ab-quote__who img { width: 44px; height: 44px; border-radius: 50% !important; object-fit: cover; }
.ab-quote__who > span { display: flex; flex-direction: column; line-height: 1.35; }
.ab-quote__name { font-weight: 650; color: var(--ab-ink); }
.ab-quote__role { color: var(--ab-muted); font-size: 14px; }

/* ------------------------------------------------------------------ dividers and space */
.block-spacer.size-xs { height: 12px; } .block-spacer.size-2xl { height: 200px; }
.block-divider.ab-div--dashed { border-top-style: dashed; }
.block-divider.ab-div--dots { border: 0; height: 6px; background: radial-gradient(circle, var(--ab-line-2) 2px, transparent 2.5px) center / 18px 6px repeat-x; }
.block-divider.ab-div--short { width: 64px !important; border-top-width: 3px; border-color: var(--ab-accent); margin-inline: auto; }


/* in the Foundry editor, what's hidden on this screen size stays in sight, faded, so it can be changed */
@media (min-width: 901px) { [data-fb-editing] .ab-hide-desktop { opacity: .38; outline: 1px dashed color-mix(in srgb, currentColor 40%, transparent); outline-offset: -1px; } }
@media (min-width: 601px) and (max-width: 900px) { [data-fb-editing] .ab-hide-tablet { opacity: .38; outline: 1px dashed color-mix(in srgb, currentColor 40%, transparent); outline-offset: -1px; } }
@media (max-width: 600px) { [data-fb-editing] .ab-hide-phone { opacity: .38; outline: 1px dashed color-mix(in srgb, currentColor 40%, transparent); outline-offset: -1px; } }

/* ------------------------------------------------------------------ forms */
.ab-form { position: relative; display: flex; flex-direction: column; gap: 22px; }
.ab-form [hidden] { display: none !important; }
.ab-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
.ab-form__grid > * { grid-column: 1 / -1; }
.ab-form__grid > .ab-field--half { grid-column: auto; }
@media (max-width: 600px) { .ab-form__grid { grid-template-columns: minmax(0, 1fr); } .ab-form__grid > * { grid-column: 1 / -1 !important; } .ab-form__send { width: 100%; justify-content: center; } }
.ab-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; margin: 0; padding: 0; border: 0; }
.ab-field__label { font-size: 15px; font-weight: 600; color: var(--ab-ink); padding: 0; }
.ab-field__opt { margin-left: 4px; font-size: 13px; font-weight: 500; color: var(--ab-muted); }
.ab-field__control { width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid var(--ab-line-2); border-radius: var(--ab-r-sm, 8px); background: var(--ab-surface); color: var(--ab-ink); font: inherit; font-size: 16px; line-height: 1.45; transition: border-color .15s, box-shadow .15s; box-sizing: border-box; }
textarea.ab-field__control { min-height: 132px; resize: vertical; }
.ab-field__control::placeholder { color: var(--ab-muted); opacity: .8; }
.ab-field__control:hover { border-color: color-mix(in srgb, var(--ab-ink) 35%, var(--ab-line-2)); }
.ab-field__control:focus { outline: none; border-color: var(--ab-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ab-accent) 22%, transparent); }
.ab-field__msg { min-height: 1.2em; margin: 0; font-size: 13.5px; line-height: 1.4; color: var(--ab-muted); }
.ab-field.is-bad .ab-field__control { border-color: #d0453b; box-shadow: 0 0 0 3px rgb(208 69 59 / 14%); }
.ab-field.is-bad .ab-field__msg { color: #c0392b; }
.ab-field.is-ok .ab-field__control { border-color: color-mix(in srgb, #16a34a 55%, var(--ab-line-2)); }
.ab-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.ab-choice { position: relative; display: inline-flex; cursor: pointer; }
.ab-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ab-choice span { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border: 1px solid var(--ab-line-2); border-radius: 999px; background: var(--ab-surface); color: var(--ab-ink-2); font-size: 15px; font-weight: 500; transition: border-color .15s, background .15s, color .15s; }
.ab-choice:hover span { border-color: var(--ab-ink); color: var(--ab-ink); }
.ab-choice input:checked + span { background: var(--ab-ink); border-color: var(--ab-ink); color: var(--ab-bg); }
.ab-choice input:focus-visible + span { box-shadow: 0 0 0 3px color-mix(in srgb, var(--ab-accent) 30%, transparent); }
.ab-toggle { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.ab-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ab-toggle__track { position: relative; flex: none; width: 42px; height: 24px; margin-top: 1px; border-radius: 99px; background: var(--ab-line-2); transition: background .2s; }
.ab-toggle__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / 25%); transition: transform .2s var(--ab-ease); }
.ab-toggle input:checked + .ab-toggle__track { background: var(--ab-accent); }
.ab-toggle input:checked + .ab-toggle__track::after { transform: translateX(18px); }
.ab-toggle input:focus-visible + .ab-toggle__track { box-shadow: 0 0 0 3px color-mix(in srgb, var(--ab-accent) 30%, transparent); }
.ab-toggle__words { display: flex; flex-direction: column; gap: 2px; }
.ab-toggle__words small { color: var(--ab-muted); font-size: 14px; }
.ab-form__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ab-form__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; }
.ab-form__note { margin: 0; max-width: 34rem; color: var(--ab-muted); font-size: 14px; }
.ab-form__note a { color: inherit; }
.ab-form__send .ab-ico { transition: transform .25s var(--ab-ease); }
.ab-form__send:hover .ab-ico { transform: translate(2px, -2px); }
.ab-form.is-sending .ab-form__send { opacity: .8; pointer-events: none; }
.ab-form.is-sending .ab-form__send .ab-ico { animation: ab-send 1s ease-in-out infinite; }
@keyframes ab-send { 50% { transform: translate(4px, -4px); opacity: .4; } }
.ab-form__error { margin: 0; padding: 12px 14px; border-radius: var(--ab-r-sm, 8px); background: rgb(208 69 59 / 9%); color: #b03a2e; font-size: 14.5px; }
.ab-form__done { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: clamp(24px, 4vw, 40px); border-radius: var(--ab-r); background: color-mix(in srgb, #16a34a 7%, var(--ab-surface)); border: 1px solid color-mix(in srgb, #16a34a 25%, var(--ab-line)); }
.ab-form__done:focus { outline: none; }
.ab-form__done[data-ab-preview] { position: relative; margin-top: 18px; border-style: dashed; }
.ab-form__done[data-ab-preview]::before { content: attr(data-ab-preview); position: absolute; top: -11px; left: 18px; padding: 2px 10px; border-radius: 99px; background: var(--ab-surface); border: 1px dashed color-mix(in srgb, #16a34a 35%, var(--ab-line)); color: var(--ab-muted); font-size: 12px; font-weight: 600; }
.ab-form__done[data-ab-preview] .ab-form__check { animation: none; }
.ab-form__check { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #16a34a; color: #fff; font-size: 26px; animation: ab-pop .4s var(--ab-ease); }
.ab-form__thanks { margin: 6px 0 0; font-size: 1.5rem; }
.ab-form__sent { margin: 0; color: var(--ab-ink-2); max-width: 40rem; }
.ab-form__summary { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 8px 0 6px; font-size: 15px; }
.ab-form__summary:empty { display: none; }
.ab-form__summary dt { color: var(--ab-muted); }
.ab-form__summary dd { margin: 0; color: var(--ab-ink); overflow-wrap: anywhere; }
@keyframes ab-pop { 0% { transform: scale(.4); opacity: 0; } 70% { transform: scale(1.08); } }

/* ------------------------------------------------------------------ buttons, for themes without their own .btn
   (zero specificity: any theme's .btn wins) */
:where(.btn) { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border: 1px solid transparent; border-radius: var(--ab-r-sm); font: inherit; font-weight: 600; line-height: 1; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .15s, border-color .15s, color .15s, box-shadow .2s; }
:where(.btn-primary) { background: var(--ab-accent); color: var(--ab-on-accent); }
:where(.btn-primary):hover { box-shadow: 0 6px 18px color-mix(in srgb, var(--ab-accent) 35%, transparent); }
:where(.btn-secondary) { background: transparent; color: var(--ab-ink); border-color: var(--ab-line-2); }
:where(.btn-secondary):hover { border-color: var(--ab-ink); }
:where(.btn-link) { min-height: 0; padding: 0; background: none; color: var(--ab-ink); text-decoration: underline; text-underline-offset: 4px; }
:where(.btn):focus-visible { outline: 2px solid var(--ab-accent); outline-offset: 3px; }

/* ------------------------------------------------------------------ pictures from the post writer
   In the text, wide, or as wide as the page allows; the caption under it. */
.aw-figure { margin: 2em 0; }
.aw-figure img { display: block; width: 100%; height: auto; border-radius: var(--ab-r); }
.aw-figure figcaption { margin-top: .75em; color: var(--ab-muted); font-size: .88em; line-height: 1.5; text-align: center; }
.aw-figure.aw-figure--wide { --aw-w: min(64rem, 100vw - 40px); width: var(--aw-w); max-width: none; margin-inline: calc((100% - var(--aw-w)) / 2); }
.aw-figure.aw-figure--full { --aw-w: min(88rem, 100vw - 40px); width: var(--aw-w); max-width: none; margin-inline: calc((100% - var(--aw-w)) / 2); }
.aw-embed { margin: 2em 0; }