/* FluxaCMS public demo design system. See project/DESIGN.md. */
:root {
  --demo-font: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --demo-regular: 400;
  --demo-medium: 500;
  --demo-semibold: 600;
  --demo-text: 1rem;
  --demo-small: .875rem;
  --demo-caption: .8125rem;
  --demo-h1: clamp(2.125rem, 4vw, 3.25rem);
  --demo-h2: clamp(1.75rem, 3vw, 2.5rem);
  --demo-h3: 1.25rem;
  --demo-space-1: .25rem;
  --demo-space-2: .5rem;
  --demo-space-3: .75rem;
  --demo-space-4: 1rem;
  --demo-space-5: 1.5rem;
  --demo-space-6: 2rem;
  --demo-space-7: 3rem;
  --demo-space-8: 4rem;
  --demo-section: 5rem;
  --demo-gutter: 2rem;
  --demo-content: 77.5rem;
  --demo-field-height: 3rem;
  --demo-control-radius: .375rem;
  --demo-card-radius: .625rem;
  --demo-speed: 160ms;
  --text: #1b2635;
  --muted: #5f6b7a;
  --primary: #2448c5;
  --primary-dark: #19379e;
  --line: #d8dee7;
  --line-strong: #aab5c3;
  --danger: #b42338;
  --success: #13734c;
}

/* Scope public rules away from the inline admin/editor interface. */
body.fluxa-demo { font-family: var(--demo-font); font-size: var(--demo-text); font-weight: var(--demo-regular); line-height: 1.65; }
.fluxa-demo :is(main, .default-header, .default-footer) :is(button, input, select, textarea) { font-family: var(--demo-font); }
.fluxa-demo main :is(h1,h2,h3,h4,h5,h6) { font-weight: var(--demo-medium); text-wrap: pretty; }
.fluxa-demo main h1 { font-size: var(--demo-h1); line-height: 1.14; letter-spacing: -.04em; }
.fluxa-demo main h2 { font-size: var(--demo-h2); line-height: 1.2; letter-spacing: -.03em; }
.fluxa-demo main h3 { font-size: var(--demo-h3); line-height: 1.35; letter-spacing: -.02em; }
.fluxa-demo main :is(.default-contact-card,.account-grid article,.account-section,.account-purchases,.account-messages,.account-referral,.fluxa-cart-products,.fluxa-cart-summary,.fluxa-cart-customer,.catalog-related,.site-search-results,.form-heading) h2 { font-size: 1.5rem; line-height: 1.3; }
.fluxa-demo main :is(strong,b) { font-weight: var(--demo-semibold); }
.fluxa-demo main p { line-height: 1.65; }
.fluxa-demo main .default-hero-copy h1 { font-size: clamp(2.5rem, 5vw, 4.25rem); line-height: 1.08; }
.fluxa-demo :is(.default-lead,.hero-text,.publication-lead) { font-size: 1.125rem; line-height: 1.7; color: var(--muted); }
.fluxa-demo :is(.default-eyebrow,.eyebrow,.demo-directory-label,.default-footer-title,.catalog-sidebar-title) { font-size: .75rem; font-weight: var(--demo-medium); line-height: 1.5; letter-spacing: .1em; }
.fluxa-demo :is(.publication-meta,.catalog-card-meta,.catalog-product-kicker,.demo-hero-caption,.default-footer-bottom) { font-size: var(--demo-caption); line-height: 1.6; }
.fluxa-demo main :is(.publication-card,.catalog-product-card,.default-card) :is(h2,strong) { font-size: var(--demo-h3); font-weight: var(--demo-medium); line-height: 1.35; }
.fluxa-demo main :is(.publication-card,.catalog-product-card)>p { font-size: var(--demo-small); line-height: 1.65; }
.fluxa-demo main .publication-card>p:first-of-type { font-size: var(--demo-caption); font-weight: var(--demo-regular); }
.fluxa-demo .default-card>span:not(.demo-feature-arrow) { font-size: var(--demo-text); }
.fluxa-demo :is(.default-button,.primary-button,.default-text-link,.default-nav .menu-item>a,.default-footer a) { font-size: var(--demo-small); font-weight: var(--demo-medium); }
.fluxa-demo .publication-content { max-width: 72ch; font-size: 1.125rem; line-height: 1.8; }
.fluxa-demo :is(.publication-content,.default-content)>*+* { margin-top: var(--demo-space-5); }
.fluxa-demo :is(.publication-content,.default-content)>:is(h2,h3) { margin-top: var(--demo-space-7); margin-bottom: var(--demo-space-4); }
.fluxa-demo :is(.publication-content,.default-content) li+li { margin-top: var(--demo-space-2); }

/* Containers and vertical rhythm. Never constrain the Slick track itself. */
.fluxa-demo .default-brand { gap: 12px; }
.fluxa-demo .default-footer a:has(>i) { display: inline-flex; align-items: center; gap: 8px; }
.fluxa-demo .default-footer a>i { flex: 0 0 auto; line-height: 1; }
.fluxa-demo .default-brand small { border: 0; border-left: 1px solid var(--line); border-radius: 0; padding: 0 0 0 12px; font-size: 12px; letter-spacing: 0; text-transform: none; font-weight: 400; }
.fluxa-demo .default-header-actions { display: flex; align-items: center; gap: 10px; }
.fluxa-demo .default-header-inner { min-height: 90px; gap: 10px; }
.fluxa-demo .default-nav>nav>ul { display: flex; align-items: center; gap: 15px; }
.fluxa-demo :is(.default-container,.publications-page,.catalog-page,.catalog-product-detail,.cart-page,.account-page,.cms-page,.service-page,.search-page) { width: min(var(--demo-content), calc(100% - var(--demo-gutter) * 2)); }
.fluxa-demo .default-section { padding-block: var(--demo-section); }
.fluxa-demo .default-hero { padding-block: var(--demo-section); }
.fluxa-demo .default-section-head { margin-bottom: var(--demo-space-6); gap: var(--demo-space-6); }
.fluxa-demo .default-section-head>p { max-width: 45ch; }
.fluxa-demo :is(.default-grid,.publication-list,.catalog-products,.account-grid) { gap: var(--demo-space-5); }
.fluxa-demo :is(.publications-page,.publication-detail,.catalog-page,.catalog-product-detail,.cart-page,.auth-page,.account-page,.cms-page,.service-page,.search-page) { margin-block: var(--demo-space-7) var(--demo-section); }
.fluxa-demo .default-page { padding-block: var(--demo-space-7) var(--demo-section); }
.fluxa-demo :is(.default-article-head,.catalog-page-head,.publications-page>header,.account-page>header) { margin-bottom: var(--demo-space-6); }
.fluxa-demo :is(.default-article-head,.auth-copy)>p { margin-top: var(--demo-space-5); }
.fluxa-demo .default-article-head>.default-eyebrow { margin-top: 0; margin-bottom: var(--demo-space-3); }
.fluxa-demo :is(.publication-card,.catalog-product-card,.default-contact-card,.auth-panel,.account-section,.account-grid article,.fluxa-cart-summary,.search-result-card) { border-radius: var(--demo-card-radius); }
.fluxa-demo :is(.default-contact-card,.auth-form,.account-section,.account-grid article,.fluxa-cart-summary) { padding: var(--demo-space-6); }
.fluxa-demo .default-contact-grid { gap: var(--demo-space-6); margin-top: var(--demo-space-6); }
.fluxa-demo .default-cta { padding: var(--demo-space-7); gap: var(--demo-space-7); }
.fluxa-demo .default-cta-section { padding-top: 0; }
.fluxa-demo .catalog-tab-panel { padding-top: var(--demo-space-6); }
.fluxa-demo .default-footer-grid { padding-block: var(--demo-space-7); }
.fluxa-demo :is(.catalog-tab-buttons,.auth-tabs) button { font-size: var(--demo-small); font-weight: var(--demo-medium); }
.fluxa-demo :is(.catalog-sidebar a,.default-contact-list dt,.default-social-link,.account-referral-link label) { font-size: var(--demo-small); font-weight: var(--demo-regular); }
.fluxa-demo :is(.catalog-product-price strong,.catalog-product-card>strong,.account-referral-stats strong) { font-weight: var(--demo-medium); }

/* Forms: keep hidden fields, checkboxes, radios and third-party widgets out of text-field rules. */
.fluxa-demo main :is(input:not([type]),input[type=text],input[type=email],input[type=tel],input[type=password],input[type=search],input[type=number],input[type=url],input[type=date],input[type=datetime-local],select,textarea) {
  display: block; width: 100%; min-width: 0; min-height: var(--demo-field-height);
  margin: 0; padding: .75rem 1rem; border: 1px solid var(--line-strong); border-radius: var(--demo-control-radius);
  background-color: #fff; color: var(--text); font-size: 1rem; font-weight: var(--demo-regular); line-height: 1.5;
  box-shadow: none; transition: border-color var(--demo-speed), box-shadow var(--demo-speed);
}
.fluxa-demo main select { padding-right: 2rem; }
.fluxa-demo main textarea { min-height: 9rem; resize: vertical; }
.fluxa-demo main :is(input,textarea)::placeholder { color: #697586; opacity: 1; font-size: 1rem; font-weight: var(--demo-regular); }
.fluxa-demo main :is(input,select,textarea):focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-color: var(--primary); box-shadow: none; }
.fluxa-demo main :is(input,select,textarea)[aria-invalid=true],.fluxa-demo main .has-error :is(input,select,textarea) { border-color: var(--danger); }
.fluxa-demo main :is(input,select,textarea):user-invalid { border-color: var(--danger); }
.fluxa-demo main :is(input,select,textarea):disabled { background-color: var(--surface-soft); color: var(--muted); cursor: not-allowed; opacity: .75; }
.fluxa-demo main input[readonly] { background-color: var(--surface-soft); }
.fluxa-demo main :is(input[type=checkbox],input[type=radio]) { display: inline-block; flex: 0 0 auto; width: 1.125rem; height: 1.125rem; min-height: 0; padding: 0; margin: .2rem .5rem 0 0; accent-color: var(--primary); vertical-align: top; box-shadow: none; }
.fluxa-demo main input[type=file] { max-width: 100%; font-size: var(--demo-small); }
.fluxa-demo main input[type=file]::file-selector-button { margin-right: .75rem; padding: .625rem .875rem; border: 1px solid var(--line-strong); border-radius: var(--demo-control-radius); background: var(--surface-soft); color: var(--text); cursor: pointer; }
.fluxa-demo main :is(.form-group,.auth-form label,.fluxa-cart-checkout label,.account-referral-link label) { display: grid; gap: var(--demo-space-2); color: var(--text); font-size: var(--demo-small); font-weight: var(--demo-medium); line-height: 1.5; }
.fluxa-demo main :is(.control-label,.catalog-filter-field>legend) { font-size: var(--demo-small); font-weight: var(--demo-medium); line-height: 1.5; }
.fluxa-demo main :is(.fluxa-form,.default-form-card form,.auth-form) { gap: var(--demo-space-5); }
.fluxa-demo main .fluxa-form-field-checkbox label { display: flex; align-items: flex-start; gap: var(--demo-space-2); font-weight: var(--demo-regular); }
.fluxa-demo main .fluxa-form-field-checkbox input { margin-right: 0; }
.fluxa-demo main :is(.auth-form,.fluxa-form,.fluxa-cart-checkout) label:has(>input[type=checkbox]) { display: flex; align-items: flex-start; gap: var(--demo-space-2); min-height: 2.75rem; font-weight: var(--demo-regular); }
.fluxa-demo main .controls { min-width: 0; }
.fluxa-demo main :is(.help-block,.form-hint,.fluxa-form-help,.form-help) { display: block; margin-top: var(--demo-space-2); color: var(--muted); font-size: var(--demo-small); line-height: 1.5; }
.fluxa-demo main :is(.fluxa-form-error,.field-error) { display: block; color: var(--danger); font-size: var(--demo-small); font-weight: var(--demo-regular); line-height: 1.5; margin-top: var(--demo-space-2); }
.fluxa-demo main :is(.fluxa-form-error,.field-error):empty { display: none; }
.fluxa-demo main fieldset { min-width: 0; }
.fluxa-demo main .catalog-filter-field { margin: 0; padding: var(--demo-space-4) 0; border: 0; border-bottom: 1px solid var(--line); }
.fluxa-demo main .catalog-filter-field label { font-size: var(--demo-small); line-height: 1.5; }
.fluxa-demo main :is(.fluxa-cart-add input,.fluxa-cart-item input[type=number]) { width: 5rem; }
.fluxa-demo main .catalog-sort { flex-wrap: wrap; gap: var(--demo-space-3); }
.fluxa-demo main .catalog-sort select { width: auto; max-width: 100%; }
.fluxa-demo main :is(.site-search-form,.search-page>form) { gap: var(--demo-space-3); }
.fluxa-demo main :is(.site-search-form,.search-page>form)>label { min-width: 0; flex: 1; }

/* Buttons and messages: one height and predictable separation from fields. */
.fluxa-demo main :is(.default-button,.primary-button,.fluxa-form button[type=submit],.auth-form button[type=submit],.fluxa-cart-checkout button,.fluxa-cart-add button,.site-search-form button,.search-page>form button,.catalog-filter button,.catalog-filter-actions a) {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--demo-space-2);
  min-height: var(--demo-field-height); padding: .75rem 1.25rem; border-radius: var(--demo-control-radius);
  font-size: var(--demo-small); font-weight: var(--demo-medium); line-height: 1.5; white-space: normal;
  text-align: center; box-shadow: none; transition: background-color var(--demo-speed), border-color var(--demo-speed), color var(--demo-speed), transform var(--demo-speed);
}
.fluxa-demo main :is(.default-actions,.catalog-filter-actions) { gap: var(--demo-space-3); }
.fluxa-demo main :is(.form-actions,.form-buttons,.catalog-filter-actions) { margin-top: var(--demo-space-5); }
.fluxa-demo main :is(.fluxa-form,.auth-form)>button[type=submit] { margin-top: var(--demo-space-2); }
.fluxa-demo main button:disabled { cursor: not-allowed; opacity: .55; transform: none; }
.fluxa-demo main :is(.alert,.form-message,.auth-message,.fluxa-form-message,.flash-message,.account-notice) { margin-block: var(--demo-space-5); padding: var(--demo-space-4) var(--demo-space-5); border: 1px solid var(--line); border-radius: var(--demo-control-radius); font-size: var(--demo-small); font-weight: var(--demo-regular); line-height: 1.6; }
.fluxa-demo main :is(.alert-danger,.alert-error,.fluxa-form-message.is-error) { border-color: #f3b8c0; background: #fff4f5; color: var(--danger); }
.fluxa-demo main :is(.alert-success,.fluxa-form-message.is-success) { border-color: #a8d7bf; background: #f0faf5; color: var(--success); }
.fluxa-demo main :is(.alert,.form-message,.auth-message,.fluxa-form-message):empty { display: none; }
.fluxa-demo :is(main,.default-header,.default-footer) a:focus-visible,.fluxa-demo :is(main,.default-header,.default-footer) button:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }

/* All decorative interface glyphs use the locally hosted Font Awesome 6 family. */
.fluxa-demo .fa-solid { font-family: "Font Awesome 6 Free"; font-weight: 900; font-style: normal; line-height: 1; }
.fluxa-demo :is(.default-button,.default-text-link,.demo-directory,.demo-feature-arrow,.default-header-actions,.default-menu-button,.demo-footer-external) .fa-solid { font-size: .875rem; width: 1.25em; text-align: center; flex: 0 0 auto; }
.fluxa-demo .default-account-link { font-size: 1rem; }
.fluxa-demo .default-text-link::after,.fluxa-demo .default-slick-arrow::before,.fluxa-demo .default-check-list li::before,.fluxa-demo .fluxa-cart-header::before {
  font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 900; font-size: .875rem; line-height: 1;
}
.fluxa-demo .default-text-link::after { content: "\f061"; }
.fluxa-demo .default-nav .menu-item-parent>a::after { content: "\f078"; font-family: "Font Awesome 6 Free"; font-size: .625rem; font-weight: 900; width: auto; height: auto; border: 0; transform: none; }
.fluxa-demo .default-slick-arrow { position: absolute; top: 50%; bottom: auto; transform: translateY(-50%); display: block; font-size: 0; line-height: 0; width: 2.75rem; height: 2.75rem; padding: 0; }
.fluxa-demo .default-slick-arrow.is-prev { left: -3.75rem; right: auto; }
.fluxa-demo .default-slick-arrow.is-next { right: -3.75rem; left: auto; }
.fluxa-demo .default-slick-arrow::before { content: "\f061"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; margin: 0; }
.fluxa-demo .default-slick-arrow.is-prev::before { content: "\f060"; }
/* Reserve a control row when the viewport cannot fit external arrows. */
@media(max-width:1399px) {
  .fluxa-demo .slick-slider:has(>.default-slick-arrow) { padding-bottom: 4rem; }
  .fluxa-demo .default-slick-arrow { top: auto; bottom: 0; transform: none; }
  .fluxa-demo .default-slick-arrow.is-prev { left: calc(50% - 3.125rem); right: auto; }
  .fluxa-demo .default-slick-arrow.is-next { right: calc(50% - 3.125rem); left: auto; }
}
.fluxa-demo .default-check-list li::before { content: "\f00c"; }
.fluxa-demo .fluxa-cart-header::before { content: "\f07a"; }
.fluxa-demo .fluxa-cart-header>svg,.fluxa-demo .fluxa-cart-header>i { display: none; }
.fluxa-demo .default-header .default-site-search button::before { content: none; }
.fluxa-demo .default-header .default-site-search button .fa-solid { font-size: 1rem; }
.fluxa-demo .default-header :is(.default-account-link,.fluxa-cart-header,.default-site-search) { min-height: 2.75rem; }
.fluxa-demo .default-header .default-site-search { width: 2.75rem; min-width: 2.75rem; }
.fluxa-demo .default-header .default-site-search.is-open { width: 13.75rem; }
.fluxa-demo .default-header .default-site-search button { min-height: 2.25rem; flex-basis: 2.25rem; width: 2.25rem; }
.fluxa-demo .default-header .default-site-search input { font-size: 1rem; }
.fluxa-demo .default-header .default-site-search.is-open label { max-width: none; }

@media(hover:hover) and (prefers-reduced-motion:no-preference) {
  .fluxa-demo :is(.publication-card,.catalog-product-card) { transition: border-color var(--demo-speed), box-shadow var(--demo-speed); }
  .fluxa-demo :is(.publication-card,.catalog-product-card):hover { border-color: #a8b8dd; box-shadow: 0 6px 18px #1b263508; transform: none; }
  .fluxa-demo .demo-directory a .fa-solid,.fluxa-demo .default-text-link::after { transition: transform var(--demo-speed); }
  .fluxa-demo .demo-directory a:hover .fa-solid,.fluxa-demo .default-text-link:hover::after { transform: translateX(2px); }
}
@media(max-width:820px) {
  :root { --demo-gutter: 1.25rem; --demo-section: 3.5rem; }
  .fluxa-demo .default-menu-button { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-width: 2.75rem; min-height: 2.75rem; }
  .fluxa-demo .default-menu-button b { font-size: var(--demo-small); font-weight: var(--demo-medium); }
  .fluxa-demo .default-header-inner { gap: 10px; }
  .fluxa-demo .default-nav>nav>ul { display: grid; align-items: stretch; }
  .fluxa-demo .default-brand img { width: 9.375rem; height: auto; }
  .fluxa-demo .default-brand small { display: none; }
  .fluxa-demo .default-cta { padding: var(--demo-space-6); gap: var(--demo-space-5); }
  .fluxa-demo main :is(.default-contact-card,.auth-form,.account-section,.account-grid article,.fluxa-cart-summary) { padding: var(--demo-space-5); }
  .fluxa-demo .default-section-head { gap: var(--demo-space-4); }
}
@media(max-width:560px) {
  :root { --demo-section: 3rem; --demo-space-7: 2rem; }
  .fluxa-demo .default-header .default-site-search { order: 5; }
  .fluxa-demo .default-header .default-site-search.is-open { width: 100%; }
  .fluxa-demo main :is(.site-search-form,.search-page>form) { flex-direction: column; align-items: stretch; }
  .fluxa-demo main :is(.site-search-form,.search-page>form) button { width: 100%; }
  .fluxa-demo .catalog-tab-buttons { overflow-x: auto; }
  .fluxa-demo .catalog-tab-buttons button { flex: 0 0 auto; }
}
/* The optional language switcher is rendered by the multilingual module's editable chunk. */
.fluxa-demo .demo-language-switcher { position: relative; flex: 0 0 auto; }
.fluxa-demo .demo-language-switcher summary { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.75rem; padding: .5rem .625rem; border: 1px solid var(--line); border-radius: 4px; background: #fff; color: var(--primary); font-size: var(--demo-small); line-height: 1.25; cursor: pointer; list-style: none; }
.fluxa-demo .demo-language-switcher summary::-webkit-details-marker { display: none; }
.fluxa-demo .demo-language-switcher summary span { text-transform: uppercase; }
.fluxa-demo .demo-language-switcher summary .fa-chevron-down { font-size: .625rem; }
.fluxa-demo .demo-language-switcher[open] summary { background: var(--surface-blue); }
.fluxa-demo .demo-language-switcher .cms-language-switcher { position: absolute; z-index: 40; top: calc(100% + .5rem); right: 0; display: grid; gap: .25rem; min-width: 10rem; max-width: calc(100vw - 2.5rem); padding: .375rem; border: 1px solid var(--line); border-radius: 4px; background: #fff; box-shadow: 0 8px 24px #15213814; }
.fluxa-demo .demo-language-switcher .cms-language-switcher > :is(a,span) { display: flex; align-items: center; min-height: 2.75rem; padding: .5rem .75rem; border-radius: 3px; color: var(--text); font-size: var(--demo-small); line-height: 1.4; text-decoration: none; white-space: nowrap; }
.fluxa-demo .demo-language-switcher .cms-language-switcher > a:hover,.fluxa-demo .demo-language-switcher .cms-language-switcher > [aria-current="page"] { background: var(--surface-blue); color: var(--primary); }
.fluxa-demo .demo-language-switcher .cms-language-switcher > [aria-disabled="true"] { color: var(--muted); cursor: default; }
.fluxa-demo .demo-language-switcher :is(summary,a):focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
@media(min-width:821px) and (max-width:1280px) {
  .fluxa-demo .default-header-inner:has(.demo-language-switcher) { flex-wrap: wrap; padding-block: 14px; }
  .fluxa-demo .default-header-inner:has(.demo-language-switcher) .default-nav { order: 3; flex-basis: 100%; margin-left: 0; }
  .fluxa-demo .default-header-inner:has(.demo-language-switcher) .default-nav > nav > ul { justify-content: center; }
  .fluxa-demo .default-header-inner:has(.demo-language-switcher) .default-site-search { margin-left: auto; }
}
@media(max-width:560px) {
  .fluxa-demo .default-header-inner:has(.demo-language-switcher) .default-header-actions { margin-left: auto; }
  .fluxa-demo .demo-language-switcher .cms-language-switcher { left: 0; right: auto; }
}
@media(prefers-reduced-motion:reduce) {
  .fluxa-demo { scroll-behavior: auto; }
  .fluxa-demo :is(main,.default-header,.default-footer) *, .fluxa-demo :is(main,.default-header,.default-footer) *::before,.fluxa-demo :is(main,.default-header,.default-footer) *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}