/*
 * Helioro style kit
 * ---------------------------------------------------------------------
 * Loaded after style-core.css and the generated style-custom.css.
 * Every look is driven by a body class written from the theme options
 * ( General > Helioro Style ) and can be overridden per section by adding
 * the same class to a PixeBuilder wrapper / column / item
 * ( Advanced > CSS Class Selector ).
 *
 *   helioro-cards-{bento|engineering|editorial|architectural}
 *   helioro-form-{pill|square|underline|dark}
 *   helioro-acc-{rounded|hairline|numbered}
 *   helioro-social-{round|square}
 *   helioro-mpanel-{tiles|list}          ( body only )
 *   helioro-header-btn-pill / -header-compact / -sticky-card / -mm-sub-inline /
 *   -footer-grid / -badge-image-bottom   ( body only, General > Helioro Style )
 *   helioro-form-on-accent                ( CF7 on an accent tile, wrapper / column / item )
 *   helioro-bento*, helioro-nowrap-num    ( 1000–1199px squeeze, section 21 )
 *   inner pages ( section 22 ): helioro-tablet-row, helioro-acc-between, helioro-form-filled, helioro-cf7-submit-row,
 *   helioro-cf7-file, helioro-table-section, helioro-toc, helioro-stat-tile, helioro-cta-row, helioro-bento-join,
 *   helioro-shadow-lift, helioro-role-* ; body: helioro-acc-lined, helioro-archive-title-plain, helioro-single-wide-*
 *   UX pass, section 24: helioro-crumb, helioro-tile-hover, helioro-tile-arrow, helioro-on-light ; focus-visible ring, reduced motion
 *   round 4, section 25: helioro-header-contact, helioro-nav-note, helioro-mm-cells, helioro-cf7-bar, helioro-cf7-no-arrow,
 *   helioro-form-labels-plain, helioro-shadow-card, helioro-contact-rows, helioro-note, helioro-btn-full / -full-mobile / -split,
 *   helioro-bg-cols / -cols-3, helioro-dim / -dim-img, helioro-acc-outline, helioro-acc-top-rule, helioro-bento-third / -half ;
 *   token --helioro-on-accent = label colour on accent fills, written by the theme from the accent lightness
 *   round 6, section 27: helioro-cf7-legend / -step / -drop / -tiles-cards / -tiles-ink / -submit-ink / -rule-solid, helioro-form-tall,
 *   helioro-form-body-text, helioro-search-bar, helioro-bento-only / -small / -grid2 / -col-16, helioro-on-light reset, helioro-pager-rule,
 *   helioro-acc-roles-cols, helioro-role-chips-outline, helioro-glyph-*, helioro-chips-tint, helioro-person-role-plain, helioro-shadow-accent
 *
 * Colours / radii are CSS custom properties. Defaults below; the theme
 * options ( Color > Helioro Palette, General > Helioro Style, Typography )
 * write "body.helioro-body{ --helioro-... }" into style-custom.css.
 * Variant rules only consume tokens, so the nearest variant class wins.
 * See build/THEME-STYLE-GUIDE.md for the full class list.
 */

/* ===================================================================
 * 1. Tokens
 * =================================================================== */
:root{
	--helioro-accent: #b8436a;
	--helioro-accent-rgb: 184, 67, 106;
	--helioro-accent-dark: #9c3457;
	--helioro-accent-soft: #f6dce3;
	--helioro-ink: #13262f;
	--helioro-ink-rgb: 19, 38, 47;
	--helioro-text: #4a5358;
	--helioro-muted: #6e767a;
	--helioro-ground: #f4f2ee;
	--helioro-sand: #e9dfcf;
	--helioro-card: #ffffff;
	--helioro-line: #e2d8c9;

	--helioro-radius-card: 20px;
	--helioro-radius-tile: 16px;
	--helioro-radius-button: 999px;
	--helioro-radius-footer: 0px;
	--helioro-radius-submenu: 20px;

	--helioro-ease: cubic-bezier(.2, .7, .2, 1);
	--helioro-fast: .18s ease;

	--helioro-ico-arrow-ur: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17L17 7M8 7h9v9'/%3E%3C/svg%3E");
	--helioro-ico-arrow-r: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
	--helioro-ico-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
	--helioro-ico-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
	--helioro-ico-upload: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M6 10l6-6 6 6M4 20h16'/%3E%3C/svg%3E");
	--helioro-ico-chevron-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	--helioro-ico-chevron-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
	--helioro-ico-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E");
	--helioro-ico-lock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.5' y='10.5' width='15' height='10' rx='2.5'/%3E%3Cpath d='M8 10.5V7.5a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
	--helioro-ico-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E");
	--helioro-ico-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E");
}
/* derived tokens live on the body so they follow the palette written by the theme options
   ( Color > Helioro Palette writes body.helioro-body{ --helioro-accent … } ) */
.helioro-body{
	--helioro-accent-light: color-mix(in srgb, var(--helioro-accent) 45%, #ffffff);
	--helioro-accent-hover: color-mix(in srgb, var(--helioro-accent) 82%, #000000);
	--helioro-focus-ring: var(--helioro-ink);
	--helioro-focus-halo: #ffffff;
	--helioro-sticky-bg: var(--helioro-card);
	--helioro-sticky-line: var(--helioro-line);
	--helioro-footer-line: rgba(255, 255, 255, .14);
	--helioro-on-accent: #ffffff;
	--helioro-on-accent-hover: #ffffff;
}

/* card look tokens ( --hc-* ) */
.helioro-cards-bento{
	--hc-bg: var(--helioro-card);
	--hc-border-w: 0px;
	--hc-border-color: transparent;
	--hc-hover-border: transparent;
	--hc-radius: var(--helioro-radius-card);
	--hc-pad: 8px;
	--hc-img-radius: var(--helioro-radius-tile);
	--hc-body-pad: 18px 14px 0;
	--hc-title-size: 21px;
	--hc-title-ls: -0.3px;
	--hc-meta-font: inherit;
	--hc-meta-size: 13px;
	--hc-meta-transform: none;
	--hc-meta-ls: 0px;
	--hc-meta-color: var(--helioro-accent-dark);
	--hc-rule: 2px dotted var(--helioro-line);
	--hc-arrow-display: block;
	--hc-arrow-size: 40px;
	--hc-arrow-radius: 50%;
	--hc-arrow-bg: var(--helioro-ink);
	--hc-arrow-fg: #ffffff;
	--hc-arrow-border: transparent;
	--hc-arrow-hover-bg: var(--helioro-accent);
	--hc-shadow: none;
	--hc-hover-shadow: 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .35);
	--hc-hover-lift: -3px;
	--hc-chip-radius: var(--helioro-radius-button);
	--hc-chip-bg: #ffffff;
	--hc-chip-color: var(--helioro-ink);
	--hc-img-ratio: .75;
	--hc-blog-img-ratio: .6667;
	--hc-person-ratio: 1 / 1;
	--hc-social-size: 38px;
	--hc-social-bg: var(--helioro-ground);
	--hc-social-border: transparent;
	--hc-spec-bg: var(--helioro-ground);
	--hc-spec-border: transparent;
	--hc-spec-radius: 18px;
	--hc-spec-key-size: 13px;
	--hc-spec-key-transform: none;
	--hc-spec-key-ls: 0px;
	--hc-spec-key-color: var(--helioro-text);
	--hc-spec-value-size: 24px;
	--hc-filter-bar: var(--helioro-sand);
	--hc-filter-chip-bg: #ffffff;
	--hc-page-size: 48px;
	--hc-page-bg: #ffffff;
}
.helioro-cards-engineering{
	--hc-bg: var(--helioro-card);
	--hc-border-w: 1px;
	--hc-border-color: var(--helioro-line);
	--hc-hover-border: var(--helioro-accent);
	--hc-radius: 2px;
	--hc-pad: 0px;
	--hc-img-radius: 0px;
	--hc-body-pad: 18px 20px 18px;
	--hc-title-size: 19px;
	--hc-title-ls: -0.2px;
	--hc-meta-font: var(--helioro-font-meta, monospace);
	--hc-meta-size: 11px;
	--hc-meta-transform: uppercase;
	--hc-meta-ls: 1px;
	--hc-meta-color: var(--helioro-accent);
	--hc-rule: 1px solid var(--helioro-line);
	--hc-arrow-display: block;
	--hc-arrow-size: 26px;
	--hc-arrow-radius: 0px;
	--hc-arrow-bg: transparent;
	--hc-arrow-fg: var(--helioro-ink);
	--hc-arrow-border: transparent;
	--hc-arrow-hover-bg: transparent;
	--hc-shadow: none;
	--hc-hover-shadow: none;
	--hc-hover-lift: 0px;
	--hc-chip-radius: 2px;
	--hc-chip-bg: var(--helioro-ink);
	--hc-chip-color: #ffffff;
}
.helioro-cards-editorial{
	--hc-bg: transparent;
	--hc-border-w: 0px;
	--hc-border-color: transparent;
	--hc-hover-border: transparent;
	--hc-radius: 0px;
	--hc-pad: 0px;
	--hc-img-radius: var(--helioro-radius-tile);
	--hc-body-pad: 18px 0 0;
	--hc-title-size: 22px;
	--hc-title-ls: -0.2px;
	--hc-meta-font: inherit;
	--hc-meta-size: 11px;
	--hc-meta-transform: uppercase;
	--hc-meta-ls: 1.2px;
	--hc-meta-color: var(--helioro-accent);
	--hc-rule: 1px solid var(--helioro-line);
	--hc-arrow-display: block;
	--hc-arrow-size: 26px;
	--hc-arrow-radius: 50%;
	--hc-arrow-bg: transparent;
	--hc-arrow-fg: currentColor;
	--hc-arrow-border: var(--helioro-line);
	--hc-arrow-hover-bg: transparent;
	--hc-shadow: none;
	--hc-hover-shadow: none;
	--hc-hover-lift: 0px;
	--hc-chip-radius: 2px;
	--hc-chip-bg: rgba(var(--helioro-ink-rgb), .72);
	--hc-chip-color: #ffffff;
}
.helioro-cards-architectural{
	--hc-bg: transparent;
	--hc-border-w: 0px;
	--hc-border-color: transparent;
	--hc-hover-border: transparent;
	--hc-radius: 0px;
	--hc-pad: 0px;
	--hc-img-radius: 40px 2px 2px 2px;
	--hc-body-pad: 16px 0 0;
	--hc-title-size: 22px;
	--hc-title-ls: -0.3px;
	--hc-meta-font: inherit;
	--hc-meta-size: 10px;
	--hc-meta-transform: uppercase;
	--hc-meta-ls: 1.5px;
	--hc-meta-color: var(--helioro-muted);
	--hc-rule: 0px solid transparent;
	--hc-arrow-display: block;
	--hc-arrow-size: 24px;
	--hc-arrow-radius: 50%;
	--hc-arrow-bg: transparent;
	--hc-arrow-fg: var(--helioro-ink);
	--hc-arrow-border: var(--helioro-line);
	--hc-arrow-hover-bg: transparent;
	--hc-shadow: none;
	--hc-hover-shadow: none;
	--hc-hover-lift: 0px;
	--hc-chip-radius: 2px;
	--hc-chip-bg: rgba(255, 255, 255, .92);
	--hc-chip-color: var(--helioro-ink);
}

/* form tokens ( --hf-* ) */
.helioro-form-pill{
	--hf-radius: var(--helioro-radius-button);
	--hf-area-radius: 20px;
	--hf-bg: var(--helioro-field-bg, #ffffff);
	--hf-color: var(--helioro-ink);
	--hf-placeholder: var(--helioro-muted);
	--hf-border-w: 1px;
	--hf-border-color: var(--helioro-line);
	--hf-pad: 14px 20px;
	--hf-height: 52px;
	--hf-focus-color: var(--helioro-accent);
	--hf-focus-ring: 0 0 0 4px rgba(var(--helioro-accent-rgb), .16);
	--hf-label-font: inherit;
	--hf-label-transform: none;
	--hf-label-ls: 0px;
	--hf-label-size: 13px;
	--hf-label-color: inherit;
	--hf-weight: 400;
	--hf-btn-radius: var(--helioro-radius-button);
	--hf-btn-bg: var(--helioro-ink);
	--hf-btn-color: #ffffff;
	--hf-btn-hover-bg: var(--helioro-accent-dark);
	--hf-btn-hover-color: #ffffff;
	--hf-arrow: var(--helioro-ico-arrow-ur);
	--hf-joined-radius: var(--helioro-radius-button);
	--hf-joined-pad: 6px;
	--hf-joined-h: 52px;
}
.helioro-form-square{
	--hf-radius: 2px;
	--hf-area-radius: 2px;
	--hf-bg: var(--helioro-field-bg, #ffffff);
	--hf-color: var(--helioro-ink);
	--hf-placeholder: var(--helioro-muted);
	--hf-border-w: 1px;
	--hf-border-color: var(--helioro-line);
	--hf-pad: 12px 14px;
	--hf-height: 46px;
	--hf-focus-color: var(--helioro-accent);
	--hf-focus-ring: 0 0 0 3px rgba(var(--helioro-accent-rgb), .18);
	--hf-label-font: var(--helioro-font-meta, monospace);
	--hf-label-transform: uppercase;
	--hf-label-ls: 1px;
	--hf-label-size: 11px;
	--hf-label-color: inherit;
	--hf-weight: 400;
	--hf-btn-radius: 2px;
	--hf-btn-bg: var(--helioro-accent);
	--hf-btn-color: var(--helioro-on-accent);
	--hf-btn-hover-bg: var(--helioro-accent-dark);
	--hf-btn-hover-color: #ffffff;
	--hf-arrow: var(--helioro-ico-arrow-r);
	--hf-joined-radius: 2px;
	--hf-joined-pad: 4px;
	--hf-joined-h: 44px;
}
.helioro-form-underline{
	--hf-radius: 0px;
	--hf-area-radius: 0px;
	--hf-bg: transparent;
	--hf-color: inherit;
	--hf-placeholder: currentColor;
	--hf-border-w: 0 0 1px 0;
	--hf-border-color: currentColor;
	--hf-pad: 12px 0;
	--hf-height: 46px;
	--hf-focus-color: var(--helioro-accent);
	--hf-focus-ring: none;
	--hf-label-font: inherit;
	--hf-label-transform: uppercase;
	--hf-label-ls: 1.2px;
	--hf-label-size: 11px;
	--hf-label-color: inherit;
	--hf-weight: 400;
	--hf-btn-radius: 2px;
	--hf-btn-bg: var(--helioro-accent);
	--hf-btn-color: var(--helioro-on-accent);
	--hf-btn-hover-bg: var(--helioro-accent-dark);
	--hf-btn-hover-color: #ffffff;
	--hf-arrow: var(--helioro-ico-arrow-r);
	--hf-joined-radius: 0px;
	--hf-joined-pad: 0px;
	--hf-joined-h: 46px;
}
.helioro-form-dark{
	--hf-radius: var(--helioro-radius-button);
	--hf-area-radius: 16px;
	--hf-bg: rgba(255, 255, 255, .06);
	--hf-color: #ffffff;
	--hf-placeholder: rgba(255, 255, 255, .5);
	--hf-border-w: 1px;
	--hf-border-color: rgba(255, 255, 255, .18);
	--hf-pad: 14px 20px;
	--hf-height: 52px;
	--hf-focus-color: var(--helioro-accent-soft);
	--hf-focus-ring: 0 0 0 4px rgba(var(--helioro-accent-rgb), .25);
	--hf-label-font: inherit;
	--hf-label-transform: none;
	--hf-label-ls: 0px;
	--hf-label-size: 13px;
	--hf-label-color: #ffffff;
	--hf-weight: 500;
	--hf-btn-radius: var(--helioro-radius-button);
	--hf-btn-bg: var(--helioro-accent);
	--hf-btn-color: var(--helioro-on-accent);
	--hf-btn-hover-bg: #ffffff;
	--hf-btn-hover-color: var(--helioro-ink);
	--hf-arrow: var(--helioro-ico-arrow-r);
	--hf-joined-radius: var(--helioro-radius-button);
	--hf-joined-pad: 5px;
	--hf-joined-h: 44px;
}
/* form sitting on an accent ( rose ) tile — PixeBuilder item / column / wrapper class "helioro-form-on-accent":
   white borderless fields r16, white labels, full-width ink submit, hover white / ink ( never accent on accent ) */
.helioro-form-on-accent{
	--hf-radius: 16px;
	--hf-area-radius: 16px;
	--hf-bg: #ffffff;
	--hf-color: var(--helioro-ink);
	--hf-placeholder: var(--helioro-muted);
	--hf-border-w: 0px;
	--hf-border-color: transparent;
	--hf-pad: 14px 18px;
	--hf-height: 52px;
	--hf-focus-color: transparent;
	--hf-focus-ring: 0 0 0 2px var(--helioro-ink);
	--hf-label-font: inherit;
	--hf-label-transform: none;
	--hf-label-ls: 0px;
	--hf-label-size: 13px;
	--hf-label-color: #ffffff;
	--hf-weight: 500;
	--hf-btn-radius: var(--helioro-radius-button);
	--hf-btn-bg: var(--helioro-ink);
	--hf-btn-color: #ffffff;
	--hf-btn-hover-bg: #ffffff;
	--hf-btn-hover-color: var(--helioro-ink);
	--hf-arrow: var(--helioro-ico-arrow-ur);
	--hf-joined-radius: var(--helioro-radius-button);
	--hf-joined-pad: 6px;
	--hf-joined-h: 52px;
}

/* accordion tokens ( --ha-* ). Rounded rows are borderless white tiles with a 40px ground disc that turns ink when open
   ( Helioro main boards P03 / P05 / P07 ); General > Helioro Style > Accordion Row Border = enable adds the 1px line border
   ( body class helioro-acc-lined writes --helioro-acc-line / --helioro-acc-active-line, read here as fallbacks ). */
.helioro-acc-lined{ --helioro-acc-line: 1px solid var(--helioro-line); --helioro-acc-active-line: var(--helioro-ink); }
.helioro-acc-rounded{
	--ha-bg: var(--helioro-card);
	--ha-active-bg: var(--helioro-card);
	--ha-border: var(--helioro-acc-line, 0px solid transparent);
	--ha-active-border: var(--helioro-acc-active-line, transparent);
	--ha-radius: 20px;
	--ha-gap: 10px;
	--ha-pad: 22px 26px;
	--ha-pad-x: 26px;
	--ha-icon-size: 40px;
	--ha-icon-radius: 50%;
	--ha-icon-border: transparent;
	--ha-icon-bg: var(--helioro-ground);
	--ha-icon-color: var(--helioro-ink);
	--ha-icon-active-bg: var(--helioro-ink);
	--ha-icon-active-color: #ffffff;
	--ha-rail: 0px;
	--ha-num-display: none;
}
.helioro-acc-hairline{
	--ha-bg: transparent;
	--ha-active-bg: transparent;
	--ha-border: 0px solid transparent;
	--ha-active-border: transparent;
	--ha-radius: 0px;
	--ha-gap: 0px;
	--ha-pad: 22px 0;
	--ha-pad-x: 0px;
	--ha-icon-size: 36px;
	--ha-icon-radius: 50%;
	--ha-icon-border: transparent;
	--ha-icon-bg: var(--helioro-ground);
	--ha-icon-color: var(--helioro-accent);
	--ha-icon-active-bg: var(--helioro-accent);
	--ha-icon-active-color: var(--helioro-on-accent);
	--ha-rail: 0px;
	--ha-num-display: none;
}
.helioro-acc-numbered{
	--ha-bg: var(--helioro-card);
	--ha-active-bg: var(--helioro-card);
	--ha-border: 1px solid var(--helioro-line);
	--ha-active-border: var(--helioro-line);
	--ha-radius: 2px;
	--ha-gap: 8px;
	--ha-pad: 20px 24px;
	--ha-pad-x: 24px;
	--ha-icon-size: 34px;
	--ha-icon-radius: 2px;
	--ha-icon-border: var(--helioro-line);
	--ha-icon-bg: transparent;
	--ha-icon-color: var(--helioro-ink);
	--ha-icon-active-bg: var(--helioro-accent);
	--ha-icon-active-color: var(--helioro-on-accent);
	--ha-rail: 3px;
	--ha-num-display: inline-block;
}
@media only screen and (max-width: 767px){
	.helioro-acc-rounded{ --ha-pad: 18px 16px 18px 20px; --ha-pad-x: 20px; --ha-icon-size: 36px; }
	.helioro-acc-numbered{ --ha-pad: 18px 18px; --ha-pad-x: 18px; }
}

/* social tokens */
.helioro-social-round{ --hs-radius: 50%; --hs-size: 40px; }
.helioro-social-square{ --hs-radius: 2px; --hs-size: 38px; }

/* ===================================================================
 * 2. Header — right button, sub-menu panel, descriptions
 * =================================================================== */
.helioro-header-btn-arrow .helioro-main-menu-right-button{ display: inline-flex; align-items: center; gap: 8px; }
.helioro-header-btn-arrow .helioro-main-menu-right-button:after{ content: ""; display: inline-block; width: 13px; height: 13px; flex-shrink: 0;
	background-color: currentColor; -webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat;
	transition: transform .25s var(--helioro-ease); }
.helioro-header-btn-arrow .helioro-main-menu-right-button:hover:after{ transform: translate(2px, -2px); }

/* right button as a borderless pill ( General > Helioro Style > Header Right Button As Pill ) — 13/22, ≈47px tall, 11/20 when sticky */
.helioro-header-btn-pill .helioro-main-menu-right-button[class*="helioro-style-"]{ padding: var(--helioro-hbtn-pad, 13px 22px); margin-top: -11px; border-width: 0; border-radius: var(--helioro-radius-button); line-height: 1.4; box-shadow: none; }
.helioro-header-btn-pill .helioro-fixed-navigation .helioro-main-menu-right-button[class*="helioro-style-"]{ padding: var(--helioro-hbtn-pad, 11px 20px); margin-top: -10px; }

/* sticky bar as a card ( General > Helioro Style > Sticky Bar Style: card ) — colours: Color > Helioro Palette > Sticky Bar */
.helioro-sticky-card .helioro-sticky-navigation.helioro-fixed-navigation{ box-shadow: none; }
.helioro-sticky-card .helioro-sticky-navigation.helioro-fixed-navigation .helioro-header-background{ background-color: var(--helioro-sticky-bg); border-bottom: 1px solid var(--helioro-sticky-line); }
.helioro-sticky-card .helioro-mobile-header.helioro-fixed-navigation{ background-color: var(--helioro-sticky-bg); border-bottom: 1px solid var(--helioro-sticky-line); box-shadow: none; }

/* sub-menu indicator: chevron down, flips up while open */
.helioro-body .helioro-navigation.helioro-navigation-submenu-indicator .sf-menu > li > a.sf-with-ul-pre:after{
	content: ""; display: inline-block; width: 15px; height: 15px; margin-left: 4px; vertical-align: -2px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-chevron-down) center / contain no-repeat; mask: var(--helioro-ico-chevron-down) center / contain no-repeat; transition: transform .25s var(--helioro-ease); }
.helioro-body .helioro-navigation.helioro-navigation-submenu-indicator .sf-menu > li:hover > a.sf-with-ul-pre:after,
.helioro-body .helioro-navigation.helioro-navigation-submenu-indicator .sf-menu > li.sfHover > a.sf-with-ul-pre:after{ transform: rotate(180deg); }

/* sub-menu panel ( normal menu + mega menu ): the white panel is the ul, items are transparent */
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu,
.helioro-body .helioro-navigation .sf-menu > .helioro-mega-menu .sf-mega{ border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-submenu); background-color: var(--helioro-card); box-shadow: 0 24px 48px -20px rgba(var(--helioro-ink-rgb), .28); }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu{ box-sizing: border-box; min-width: 240px; padding: 10px; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li{ padding: 0; background-color: transparent; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li + li{ margin-top: 2px; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a{ padding: 10px 30px 10px 12px; border-radius: calc(var(--helioro-radius-submenu) * .7); transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a:hover,
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li.sfHover > a{ background-color: var(--helioro-ground); }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a > i{ display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-right: 12px;
	border-radius: 50%; background: var(--helioro-ground); color: var(--helioro-ink); font-size: 14px; vertical-align: middle; transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a:hover > i{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-menu-item-desc{ display: block; margin-top: 3px; font-size: 13px; font-weight: 500; line-height: 1.35; letter-spacing: 0; text-transform: none; color: var(--helioro-muted); white-space: normal; }
/* with descriptions ( General > Helioro Style > Show Menu Item Description ): 44px icon tile + title + one line */
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu{ min-width: 360px; }
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a{ padding: 12px 30px 12px 12px; font-size: 15px; font-weight: 700; line-height: 1.25; letter-spacing: 0; text-transform: none; color: var(--helioro-ink); }
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a:has(> i){ display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; align-items: center; align-content: center; }
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a > i{ grid-row: span 2; float: none; width: 44px; height: 44px; margin: 0; border-radius: 14px;
	background: var(--helioro-accent-soft); color: var(--helioro-accent); font-size: 18px; }
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a:hover > i,
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li.current-menu-item > a > i{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-submenu-with-desc .helioro-navigation .sf-menu > .helioro-normal-menu .sub-menu li > a > .helioro-menu-item-desc{ grid-column: 2; }

/* 1000–1199px: keep the header on one row ( General > Helioro Style > Compact Header 1000–1199px ) — design 1199 step: 14px items, 22px gaps */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-header-compact .helioro-navigation .sf-menu > li{ padding-left: 11px; padding-right: 11px; }
	.helioro-header-compact .helioro-navigation .sf-menu > li:first-child{ padding-left: 0; }
	.helioro-header-compact .helioro-navigation .sf-menu > li:last-child{ padding-right: 0; }
	.helioro-header-compact .helioro-navigation .sf-menu > li > a{ font-size: 14px; letter-spacing: 0; }
	.helioro-header-compact .helioro-main-menu-right-wrap{ margin-left: 4px; }
	.helioro-header-compact .helioro-main-menu-right-button[class*="helioro-style-"]{ margin-left: 20px; font-size: 14px; }
	.helioro-header-compact.helioro-header-btn-pill .helioro-main-menu-right-button[class*="helioro-style-"]{ padding: var(--helioro-hbtn-pad, 12px 18px); }
	.helioro-header-compact .helioro-logo{ padding-right: 0; }
}

/* ===================================================================
 * 3. Mobile bar + menu panel ( mmenu )
 *    Panel logo / footer text: General > Helioro Style > Mobile Menu Panel Logo / Footer Text.
 *    Sub-menus open inline ( accordion ) with General > Helioro Style > Mobile Sub Menu: inline.
 * =================================================================== */
/* mobile bar: 20px rail ( 30px on tablet ), logo on the rail */
[class*="helioro-mpanel-"]{ --helioro-rail: 30px; }
@media only screen and (max-width: 767px){ [class*="helioro-mpanel-"]{ --helioro-rail: 20px; } }
@media only screen and (max-width: 999px){
	[class*="helioro-mpanel-"] .helioro-mobile-header .helioro-mobile-header-container{ max-width: none; padding-left: var(--helioro-rail); padding-right: var(--helioro-rail); }
	[class*="helioro-mpanel-"] .helioro-mobile-header .helioro-logo.helioro-item-pdlr{ padding-left: 0; padding-right: 0; }
	[class*="helioro-mpanel-"] .helioro-mobile-header .helioro-mobile-menu-right{ right: var(--helioro-rail); }
}
/* tiles: 72px bar, 44px ink burger disc with white lines */
.helioro-mpanel-tiles .helioro-mobile-header{ padding-top: 14px; padding-bottom: 14px; }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-logo-inner{ line-height: 44px; }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-menu-right{ margin-top: -22px; }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-menu{ margin-top: 0; }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-button-hamburger-with-border{ display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0;
	border: 0; border-radius: 50%; background-color: var(--helioro-ink); font-size: 16px; line-height: 1; transition: background-color var(--helioro-fast); }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-button-hamburger-with-border:hover,
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-button-hamburger-with-border.helioro-active{ background-color: var(--helioro-accent); }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-button-hamburger-with-border i{ color: #ffffff; }
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-button-hamburger-with-border:hover i,
.helioro-mpanel-tiles .helioro-mobile-header .helioro-mobile-button-hamburger-with-border.helioro-active i{ color: var(--helioro-on-accent); }

/* panel shell */
:root:has(body.helioro-mpanel-tiles){ --mm-size: calc(100% - 30px); --mm-max-size: 400px; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu--position-right{ border-radius: 28px 0 0 28px; overflow: hidden; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu--position-left{ border-radius: 0 28px 28px 0; overflow: hidden; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel,
.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel{ display: flex; flex-direction: column; padding: 16px 16px 20px; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-panel:after,
.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panel:after{ display: none; }
/* top row: panel logo left, round close right */
.helioro-mpanel-tiles .helioro-mm-menu-wrap .mm-navbar,
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar{ flex-shrink: 0; min-height: 44px; margin: 0 0 14px; padding: 0 2px 0 6px; border-bottom: 0; background: transparent; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap .mm-navbar .mm-navbar__title,
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mm-navbar__title{ height: 44px; padding: 0; }
.helioro-mm-menu-wrap .mm-navbar .mm-navbar__title > span:has(.helioro-mm-logo){ display: flex; align-items: center; width: 100%; overflow: visible; }
.helioro-mm-logo{ display: inline-flex; align-items: center; }
.helioro-mm-logo img{ display: block; width: auto; max-width: 160px; max-height: 34px; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close,
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close{ display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0 0 0 auto;
	border-radius: 50%; background-color: rgba(255, 255, 255, .1); color: #ffffff; font-size: 20px; line-height: 1; transition: background-color var(--helioro-fast); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close:hover,
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close:hover{ background-color: var(--helioro-accent); color: var(--helioro-on-accent); }
/* items: Title Case ( no uppercase ), 16/600 */
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem__text,
.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem__text{ text-transform: none; letter-spacing: 0; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview{ display: flex; flex: 1 0 auto; flex-direction: column; gap: 6px; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem{ border-radius: 24px; background: rgba(255, 255, 255, .06); overflow: hidden; transition: background-color var(--helioro-fast); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem:hover{ background: rgba(255, 255, 255, .12); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem:after{ display: none; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem__text{ display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 12px 16px; font-size: 16px; font-weight: 600; line-height: 1.3; white-space: normal; }
/* chevron on plain items */
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem:not(.mm-listitem--vertical):not(.helioro-menu-cta):not(:has(> .mm-btn)) > .mm-listitem__text:after{
	content: ""; flex-shrink: 0; width: 15px; height: 15px; margin-left: auto; background-color: currentColor; opacity: .5;
	-webkit-mask: var(--helioro-ico-chevron-right) center / contain no-repeat; mask: var(--helioro-ico-chevron-right) center / contain no-repeat; }
/* current page: light accent text + sun dot */
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem.current-menu-item > .mm-listitem__text{ color: var(--helioro-accent-light); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem.current-menu-item > .mm-listitem__text:before{
	content: ""; flex-shrink: 0; width: 16px; height: 16px; box-sizing: border-box; border: 1.5px solid rgba(255, 255, 255, .4); border-radius: 50%;
	background: radial-gradient(circle, var(--helioro-accent-soft) 3.5px, transparent 4px); }
/* inline ( vertical ) sub-menu: the parent tile opens in place */
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--opened{ padding: 4px 4px 8px; background: rgba(255, 255, 255, .1); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--opened > .mm-listitem__text{ min-height: 44px; padding: 10px 12px; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-listitem__btn{ align-self: center; width: 32px; height: 32px; margin: 0 8px 0 0; padding: 0; border: 0; border-radius: 50%;
	background-color: rgba(255, 255, 255, .1); transition: background-color var(--helioro-fast); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-listitem__btn:after{ content: ""; position: absolute; inset: 0; width: auto; height: auto; margin: 0; border: 0; transform: none;
	background-color: #ffffff; -webkit-mask: var(--helioro-ico-plus) center / 14px no-repeat; mask: var(--helioro-ico-plus) center / 14px no-repeat; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--opened > .mm-listitem__btn{ margin-right: 2px; background-color: var(--helioro-accent); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--opened > .mm-listitem__btn:after{ right: 0; background-color: var(--helioro-on-accent); -webkit-mask-image: var(--helioro-ico-minus); mask-image: var(--helioro-ico-minus); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-panel{ padding: 0; background: transparent; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-panel > .mm-navbar{ display: none; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical .mm-listitem{ border-radius: 16px; background: transparent; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical .mm-listitem:hover{ background: rgba(255, 255, 255, .06); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-panel .mm-listitem__text{ min-height: 38px; padding: 8px 12px; font-size: 15px; font-weight: 500; opacity: .8; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical .mm-listitem:hover > .mm-listitem__text{ opacity: 1; }
/* list look */
.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem__text{ padding-top: 16px; padding-bottom: 16px; padding-left: 0; font-family: var(--helioro-font-heading, inherit); font-size: 22px; letter-spacing: -0.3px; }
.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem:after{ inset-inline-start: 0; }
/* last item as pill CTA: menu item CSS class "helioro-menu-cta" ( pinned to the bottom of the panel ) */
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta{ margin-top: auto; border-radius: var(--helioro-radius-button); background: var(--helioro-mm-cta-bg, var(--helioro-accent)); }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listview > .mm-listitem.helioro-menu-cta{ margin-top: auto; }
.helioro-mpanel-tiles .helioro-mm-menu-wrap.mm-menu .mm-listview > .mm-listitem.helioro-menu-cta:not(:last-child){ margin-top: 14px; }
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta:hover{ background: var(--helioro-mm-cta-hover-bg, var(--helioro-accent-hover)); }
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta:hover > .mm-listitem__text{ color: var(--helioro-mm-cta-hover-color, var(--helioro-on-accent-hover)); }
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta:after{ display: none; }
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta > .mm-listitem__text{ justify-content: center; gap: 8px; min-height: 52px; text-align: center; color: var(--helioro-mm-cta-color, var(--helioro-on-accent)); padding-left: 20px; font-family: inherit; font-size: 15px; letter-spacing: 0; }
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta > .mm-listitem__text:after{ content: ""; flex-shrink: 0; width: 13px; height: 13px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; }
.helioro-navigation .sf-menu > li.helioro-menu-cta{ display: none; }
/* panel footer text ( chips ) under the menu */
.helioro-mm-extra{ display: none; }
.helioro-mm-menu-wrap .helioro-mm-footer{ display: flex; flex-shrink: 0; flex-wrap: wrap; gap: 8px; margin-top: 14px; color: #ffffff; font-size: 13px; }
.helioro-mm-menu-wrap .helioro-mm-footer > p{ display: contents; }
.helioro-mm-menu-wrap .helioro-mm-footer .helioro-chip{ padding: 5px 13px 5px 5px; gap: 8px; border-color: rgba(255, 255, 255, .16); color: #ffffff; font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.helioro-mm-menu-wrap .helioro-mm-footer .helioro-chip > i{ width: 28px; height: 28px; font-size: 13px; }

/* ===================================================================
 * 4. Footer — top radius, social buttons, newsletter, chips
 * =================================================================== */
.helioro-body .helioro-footer-wrapper{ border-radius: var(--helioro-radius-footer) var(--helioro-radius-footer) 0 0; }
.helioro-body .helioro-footer-wrapper .helioro-footer-container{ overflow: visible; }
@media only screen and (max-width: 767px){
	.helioro-body .helioro-footer-wrapper{ border-radius: min(var(--helioro-radius-footer), 28px) min(var(--helioro-radius-footer), 28px) 0 0; }
}

/* round / square social buttons ( FW3 social network item, theme top bar social, personnel social ) */
.helioro-social-round .helioro-footer-wrapper .gdlr-core-social-network-item .gdlr-core-social-network-icon,
.helioro-social-square .helioro-footer-wrapper .gdlr-core-social-network-item .gdlr-core-social-network-icon,
.helioro-social-round .gdlr-core-personnel-list-social .gdlr-core-social-network-icon,
.helioro-social-square .gdlr-core-personnel-list-social .gdlr-core-social-network-icon,
[class*="helioro-social-"] .helioro-social-buttons .gdlr-core-social-network-icon{
	display: inline-flex; align-items: center; justify-content: center; width: var(--hs-size); height: var(--hs-size);
	margin: 0 8px 8px 0; border: 1px solid rgba(255, 255, 255, .18); border-radius: var(--hs-radius); font-size: 15px; line-height: 1;
	transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-social-round .helioro-footer-wrapper .gdlr-core-social-network-item .gdlr-core-social-network-icon:hover,
.helioro-social-square .helioro-footer-wrapper .gdlr-core-social-network-item .gdlr-core-social-network-icon:hover,
[class*="helioro-social-"] .helioro-social-buttons .gdlr-core-social-network-icon:hover{ background-color: var(--helioro-accent); border-color: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-social-round .gdlr-core-personnel-list-social .gdlr-core-social-network-icon,
.helioro-social-square .gdlr-core-personnel-list-social .gdlr-core-social-network-icon{ width: var(--hc-social-size, 34px); height: var(--hc-social-size, 34px); margin: 0 6px 0 0;
	border-color: var(--hc-social-border, var(--helioro-line)); background: var(--hc-social-bg, transparent); color: var(--helioro-ink); font-size: 14px; }
.helioro-social-round .gdlr-core-personnel-list-social .gdlr-core-social-network-icon:hover,
.helioro-social-square .gdlr-core-personnel-list-social .gdlr-core-social-network-icon:hover{ background: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
.helioro-social-buttons.helioro-on-light .gdlr-core-social-network-icon{ border-color: var(--helioro-line); color: var(--helioro-ink); }

/* footer newsletter as pill ( FW3 newsletter + Newsletter plugin form ) */
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-form,
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-form,
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-form{
	display: flex; align-items: center; padding: 5px 5px 5px 18px; border: 1px solid rgba(255, 255, 255, .18); border-radius: var(--helioro-radius-button); background: rgba(255, 255, 255, .04); }
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-form:focus-within,
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-form:focus-within,
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-form:focus-within{ border-color: var(--helioro-accent-soft); }
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-email,
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-email,
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-email{ flex: 1; min-width: 0; float: none; width: auto; }
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-email input[type="email"],
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-email input[type="email"],
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-email input[type="email"]{ width: 100%; height: 42px; padding: 0; border: 0; background: transparent; color: #ffffff; box-shadow: none; }
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-submit,
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-submit,
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-submit{ float: none; width: auto; }
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-submit input[type="submit"],
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-submit input[type="submit"],
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-submit input[type="submit"]{ height: 42px; padding: 0 22px; border: 0; border-radius: var(--helioro-radius-button); background: var(--helioro-footer-btn-bg, var(--helioro-accent)); color: var(--helioro-footer-btn-color, var(--helioro-on-accent)); font-weight: 600; }
.helioro-form-pill .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-submit input[type="submit"]:hover,
.helioro-form-dark .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-submit input[type="submit"]:hover,
.helioro-footer-wrapper .helioro-newsletter-pill .gdlr-core-newsletter-submit input[type="submit"]:hover{ background: #ffffff; color: var(--helioro-ink); }
/* underline newsletter ( Vesper ) */
.helioro-form-underline .helioro-footer-wrapper .gdlr-core-newsletter-item .gdlr-core-newsletter-email input[type="email"]{ border-width: 0 0 1px 0; border-radius: 0; background: transparent; padding-left: 0; }

/* chips — usable in Text widgets / text boxes: <a class="helioro-chip"><i class="..."></i>+1-555-0142</a> */
.helioro-chip{ display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-button);
	font-size: 14px; font-weight: 600; line-height: 1.2; color: inherit; text-decoration: none; transition: border-color var(--helioro-fast), background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-chip:not(.helioro-on-dark):hover{ border-color: var(--helioro-ink); background-color: var(--helioro-ink); color: #ffffff; }
.helioro-chip:not(.helioro-on-dark):hover > i{ color: var(--helioro-accent-light); }
.helioro-chip > i{ color: var(--helioro-accent); }
/* on dark ( footer, mobile panel, helioro-on-dark ): 32px translucent icon disc, light accent glyph, r22 so two-line chips stay round */
.helioro-footer-wrapper .helioro-chip,
.helioro-chip.helioro-on-dark,
.helioro-on-dark .helioro-chip{ padding: 6px 16px 6px 6px; gap: 10px; border-color: rgba(255, 255, 255, .14); border-radius: min(var(--helioro-radius-button), 22px); color: #ffffff; line-height: 1.4; }
.helioro-footer-wrapper .helioro-chip:hover,
.helioro-chip.helioro-on-dark:hover,
.helioro-on-dark .helioro-chip:hover{ border-color: var(--helioro-accent-light); background-color: transparent; color: #ffffff; }
.helioro-footer-wrapper .helioro-chip > i,
.helioro-chip.helioro-on-dark > i,
.helioro-on-dark .helioro-chip > i,
.helioro-mm-menu-wrap .helioro-chip > i{ display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%;
	background: rgba(255, 255, 255, .08); color: var(--helioro-accent-light); font-size: 15px; }
.helioro-chip-dot:before{ content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); flex-shrink: 0; }
.helioro-chip-list{ display: flex; flex-wrap: wrap; gap: 8px; }
.helioro-footer-wrapper .helioro-chip-list{ flex-direction: column; align-items: flex-start; gap: 10px; }

/* footer grid ( General > Helioro Style > Footer Layout: grid ) — design columns 1.25 / .7 / 1 / 1.3, 56px gap,
   2 columns under 1200px, 1 column under 768px, 40 / 30 / 20px rail, hairline above the copyright row.
   Column widths: General > Helioro Style > Footer Grid Columns ( any grid-template-columns value ). */
.helioro-footer-grid{ --helioro-footer-cols: minmax(0, 1.25fr) minmax(0, .7fr) minmax(0, 1fr) minmax(0, 1.3fr); --helioro-footer-rail: 40px; }
.helioro-footer-grid .helioro-footer-wrapper .helioro-footer-container{ display: grid; grid-template-columns: var(--helioro-footer-cols); gap: 48px 56px;
	padding-left: var(--helioro-footer-rail); padding-right: var(--helioro-footer-rail); overflow: visible; }
.helioro-footer-grid .helioro-footer-wrapper .helioro-footer-container:after{ display: none; }
.helioro-footer-grid .helioro-footer-wrapper .helioro-footer-column,
.helioro-footer-grid .helioro-footer-wrapper.helioro-with-column-divider .helioro-footer-column{ float: none; width: auto; min-width: 0; margin-bottom: 0; padding: 0; border: 0; }
.helioro-footer-grid .helioro-footer-wrapper .helioro-widget-title{ margin-bottom: 20px; }
.helioro-footer-grid .helioro-footer-wrapper .widget{ margin-bottom: 40px; }
.helioro-footer-grid .helioro-footer-wrapper .widget:last-child{ margin-bottom: 0; }
/* plain link list ( Navigation Menu widget ): no › bullets, 15/500, 36px pitch */
.helioro-footer-grid .helioro-footer-wrapper .widget_nav_menu ul li{ margin: 0 0 12px; padding: 0; border: 0; font-size: 15px; font-weight: 500; line-height: 1.6; }
.helioro-footer-grid .helioro-footer-wrapper .widget_nav_menu ul li:last-child{ margin-bottom: 0; }
.helioro-footer-grid .helioro-footer-wrapper .widget_nav_menu ul li:before{ display: none; content: none; }
.helioro-footer-grid .helioro-footer-wrapper .gdlr-core-social-network-item .gdlr-core-social-network-icon,
.helioro-footer-grid .helioro-footer-wrapper .helioro-social-buttons .gdlr-core-social-network-icon{ --hs-size: 44px; margin: 0 10px 10px 0; }
/* copyright row on the same rail, hairline on top */
.helioro-footer-grid .helioro-copyright-wrapper .helioro-copyright-container{ position: relative; padding-left: var(--helioro-footer-rail); padding-right: var(--helioro-footer-rail); }
.helioro-footer-grid .helioro-copyright-container:before{ content: ""; position: absolute; top: 0; left: var(--helioro-footer-rail); right: var(--helioro-footer-rail); border-top: 1px solid var(--helioro-footer-line); }
.helioro-footer-grid .helioro-copyright-container .helioro-item-pdlr{ padding-left: 0; padding-right: 0; }
@media only screen and (max-width: 1199px){
	.helioro-footer-grid{ --helioro-footer-cols: repeat(2, minmax(0, 1fr)); }
	.helioro-footer-grid .helioro-footer-wrapper .helioro-footer-container{ gap: 48px 40px; }
}
@media only screen and (max-width: 999px){
	.helioro-footer-grid{ --helioro-footer-rail: 30px; }
	.helioro-footer-grid .helioro-footer-wrapper{ padding-top: 80px; }
}
@media only screen and (max-width: 767px){
	.helioro-footer-grid{ --helioro-footer-cols: minmax(0, 1fr); --helioro-footer-rail: 20px; }
	.helioro-footer-grid .helioro-footer-wrapper{ padding-top: 64px; }
	.helioro-footer-grid .helioro-footer-wrapper .helioro-footer-container{ gap: 40px; }
	.helioro-footer-grid .helioro-footer-wrapper .helioro-footer-container,
	.helioro-footer-grid .helioro-copyright-wrapper .helioro-copyright-container{ max-width: none; }
	.helioro-footer-grid .helioro-footer-wrapper .widget_nav_menu ul.menu{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; }
	.helioro-footer-grid .helioro-footer-wrapper .widget_nav_menu ul.menu > li{ margin: 0; }
	.helioro-footer-grid .helioro-copyright-container .helioro-copyright-left,
	.helioro-footer-grid .helioro-copyright-container .helioro-copyright-right{ float: none; text-align: left; }
	.helioro-footer-grid .helioro-copyright-container .helioro-copyright-right{ margin-top: 12px; }
	.helioro-footer-grid .helioro-copyright-container.helioro-style-center{ text-align: left; }
}

/* ===================================================================
 * 5. fw3-portfolio — grid card ( Portfolio Style: Grid, Content Style: Normal )
 * =================================================================== */
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-badge-wrap{ position: relative; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid{
	position: relative; display: flex; flex-direction: column; height: 100%; box-sizing: border-box;
	padding: var(--hc-pad); background: var(--hc-bg); border: var(--hc-border-w) solid var(--hc-border-color); border-radius: var(--hc-radius); box-shadow: var(--hc-shadow);
	transition: box-shadow var(--helioro-fast), border-color var(--helioro-fast), transform .35s var(--helioro-ease); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover{ border-color: var(--hc-hover-border); box-shadow: var(--hc-hover-shadow); transform: translateY(var(--hc-hover-lift)); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail{ margin: 0; border-radius: var(--hc-img-radius); overflow: hidden; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img{ border-radius: 0; transition: transform .6s var(--helioro-ease); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-thumbnail img{ transform: scale(1.03); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap{
	position: relative; flex: 1; display: flex; flex-direction: column; padding: var(--hc-body-pad); margin: 0; text-align: left; border: 0; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-info-tag{
	order: -1; margin: 0 0 6px; font-family: var(--hc-meta-font); font-size: var(--hc-meta-size); font-weight: 600; letter-spacing: var(--hc-meta-ls); text-transform: var(--hc-meta-transform); color: var(--hc-meta-color); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-info-tag a{ color: inherit; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-info-date{ order: -1; margin: 0 0 6px; font-size: 12px; color: var(--helioro-muted); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-title{
	margin: 0 0 14px; font-size: var(--hc-title-size); line-height: 1.25; letter-spacing: var(--hc-title-ls); text-transform: none; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-title a{ color: var(--helioro-ink); transition: color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-title a{ color: var(--helioro-accent-dark); }
/* spec line = the portfolio excerpt ( keep it to one short line, e.g. "112 MWh/yr · cold store on sun" ) */
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content{
	margin-top: auto; padding: 14px calc(var(--hc-arrow-size) + 14px) 4px 0; border-top: var(--hc-rule); font-size: 14px; line-height: 1.5; color: var(--helioro-muted); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content p{ margin: 0; padding: 0; }
/* round arrow ( decorative, the title is the link ) */
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap:before,
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap:after{
	content: ""; display: var(--hc-arrow-display); position: absolute; right: max(12px, var(--hc-pad)); bottom: 10px; width: var(--hc-arrow-size); height: var(--hc-arrow-size); pointer-events: none; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap:after{
	box-sizing: border-box; border: 1px solid var(--hc-arrow-border); border-radius: var(--hc-arrow-radius); background: var(--hc-arrow-bg); transition: background-color var(--helioro-fast), border-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap:before{
	z-index: 1; background-color: var(--hc-arrow-fg); -webkit-mask: var(--helioro-ico-arrow-ur) center / 13px no-repeat; mask: var(--helioro-ico-arrow-ur) center / 13px no-repeat; transition: transform .25s var(--helioro-ease), background-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-content-wrap:after{ background-color: var(--hc-arrow-hover-bg); border-color: var(--helioro-accent); }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-content-wrap:before{ transform: translate(1px, -1px); }
.helioro-cards-engineering .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-content-wrap:before,
.helioro-cards-architectural .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-content-wrap:before,
.helioro-cards-editorial .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid:hover .gdlr-core-portfolio-content-wrap:before{ background-color: var(--helioro-accent); }
/* kWp chip = portfolio badge ( Portfolio post option "Badge Text" + item option "Enable Badge" ) */
[class*="helioro-cards-"] .gdlr-core-portfolio-item .gdlr-core-portfolio-badge{
	position: absolute; top: calc(var(--hc-pad, 0px) + 12px); left: calc(var(--hc-pad, 0px) + 12px); right: auto; z-index: 2; display: inline-flex; align-items: center; gap: 8px; width: auto; height: auto;
	padding: 7px 14px 7px 7px; border-radius: var(--hc-chip-radius); background: var(--hc-chip-bg); color: var(--hc-chip-color); box-shadow: none; transform: none;
	font-size: 13px; font-weight: 600; line-height: 1; letter-spacing: .1px; text-transform: none; white-space: nowrap; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item .gdlr-core-portfolio-badge:before{ content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); margin-left: 5px; }
.helioro-cards-engineering .gdlr-core-portfolio-item .gdlr-core-portfolio-badge{ font-family: var(--helioro-font-meta, monospace); font-size: 11px; letter-spacing: .8px; text-transform: uppercase; padding: 6px 10px; }
.helioro-cards-engineering .gdlr-core-portfolio-item .gdlr-core-portfolio-badge:before{ border-radius: 0; box-shadow: none; margin-left: 0; }
/* bento card ( design B02 ): 8/8/20 frame, 4:3 inset image, category 13/600, 24px title, dotted 2px rule, 14/600 spec + 40px ink arrow */
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-grid{ padding-bottom: 20px; }
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img{ width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-info-tag{ font-size: 13px; }
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-title{ margin-bottom: 18px; line-height: 1.12; }
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content{ display: flex; align-items: center; min-height: var(--hc-arrow-size);
	padding: 14px calc(var(--hc-arrow-size) + 12px) 0 0; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--helioro-text); }
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap:before,
.helioro-cards-bento .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-content-wrap:after{ right: 14px; bottom: 0; }
/* kWp chip at the bottom-left of the image ( General > Helioro Style > Portfolio Badge Position: image-bottom ).
   margin-top % follows the card width, so the 32px chip lands 12px above the bottom of the forced 4:3 image ( top is already pad + 12px ). */
.helioro-badge-image-bottom .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-badge{
	margin-top: calc((100% - 2 * var(--hc-pad, 0px)) * var(--hc-img-ratio) - 56px); }

/* metro / modern portfolio ( Aurelle metro, captions under images ) */
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-metro .gdlr-core-portfolio-thumbnail,
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-metro-no-space .gdlr-core-portfolio-thumbnail,
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-modern .gdlr-core-portfolio-thumbnail{ border-radius: var(--hc-img-radius); overflow: hidden; }
/* arch-top image frame: add "helioro-arch-top" to the fw3-portfolio item wrapper ( PixeBuilder item CSS class ) */
.helioro-arch-top .gdlr-core-portfolio-thumbnail,
.helioro-arch-top .gdlr-core-blog-thumbnail,
.helioro-arch-top.gdlr-core-image-item .gdlr-core-image-item-wrap,
.helioro-arch-top .pixe-image img,
img.helioro-arch-top{ border-radius: 999px 999px var(--helioro-radius-tile) var(--helioro-radius-tile); overflow: hidden; }

/* filter chips ( Filterer: Button ) */
[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button{ display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; }
[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button.gdlr-core-center-align{ justify-content: center; }
[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button.gdlr-core-right-align{ justify-content: flex-end; }
[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer{
	margin: 0; padding: 10px 18px; border: 1px solid var(--helioro-line); border-radius: var(--hc-chip-radius); background: transparent; color: var(--helioro-ink); line-height: 1.2; transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer:not(.gdlr-core-active):hover{ background: var(--helioro-accent-soft); border-color: var(--helioro-accent-soft); color: var(--helioro-accent-dark); }
[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer.gdlr-core-active{ background: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
.helioro-cards-engineering .gdlr-core-filterer-wrap.gdlr-core-style-button{ font-family: var(--helioro-font-meta, monospace); font-size: 12px; letter-spacing: .6px; text-transform: uppercase; }

/* pagination pills */
[class*="helioro-cards-"] .gdlr-core-pagination{ display: flex; flex-wrap: wrap; gap: 8px; }
[class*="helioro-cards-"] .gdlr-core-pagination.gdlr-core-center-align{ justify-content: center; }
[class*="helioro-cards-"] .gdlr-core-pagination.gdlr-core-right-align{ justify-content: flex-end; }
[class*="helioro-cards-"] .gdlr-core-pagination a,
[class*="helioro-cards-"] .gdlr-core-pagination span{
	display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; margin: 0; padding: 0 14px; box-sizing: border-box;
	border: 1px solid var(--helioro-line); border-radius: var(--hc-chip-radius); background: transparent; color: var(--helioro-ink); font-size: 14px; font-weight: 600; line-height: 1; }
[class*="helioro-cards-"] .gdlr-core-pagination a{ transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-pagination a:hover{ background: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
[class*="helioro-cards-"] .gdlr-core-pagination a.gdlr-core-active,
[class*="helioro-cards-"] .gdlr-core-pagination span.current{ background: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
[class*="helioro-cards-"] .gdlr-core-pagination.gdlr-core-style-plain a:before,
[class*="helioro-cards-"] .gdlr-core-pagination.gdlr-core-style-plain span:before{ display: none; }
/* load more */
[class*="helioro-cards-"] .gdlr-core-load-more-wrap .gdlr-core-load-more{ border-radius: var(--hc-chip-radius); }

/* ===================================================================
 * 6. fw3-blog — column card, left-thumbnail featured, list
 * =================================================================== */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid{
	position: relative; display: flex; flex-direction: column; box-sizing: border-box;
	padding: var(--hc-pad); background: var(--hc-bg); border: var(--hc-border-w) solid var(--hc-border-color); border-radius: var(--hc-radius); box-shadow: var(--hc-shadow);
	transition: box-shadow var(--helioro-fast), border-color var(--helioro-fast), transform .35s var(--helioro-ease); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid:hover{ border-color: var(--hc-hover-border); box-shadow: var(--hc-hover-shadow); transform: translateY(var(--hc-hover-lift)); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid.gdlr-core-blog-grid-with-frame{ border-style: solid; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail{ margin: 0; border-radius: var(--hc-img-radius); overflow: hidden; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-frame{ position: relative; flex: 1; display: flex; flex-direction: column; padding: var(--hc-body-pad); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-date{ order: -1; margin-bottom: 8px; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info{ font-family: var(--hc-meta-font); font-size: 12px; letter-spacing: var(--hc-meta-ls); text-transform: var(--hc-meta-transform); color: var(--helioro-muted); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info a{ color: inherit; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-date .gdlr-core-head{ display: none; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-date:before{
	content: ""; display: inline-block; width: 13px; height: 13px; margin-right: 7px; vertical-align: -2px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-calendar) center / contain no-repeat; mask: var(--helioro-ico-calendar) center / contain no-repeat; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-title{ margin-bottom: 10px; font-size: var(--hc-title-size); line-height: 1.3; letter-spacing: var(--hc-title-ls); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-title a{ color: var(--helioro-ink); transition: color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-blog-title a{ color: var(--helioro-accent-dark); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-content{ font-size: 14px; line-height: 1.6; color: var(--helioro-muted); padding-bottom: 0; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-wrapper{ margin-top: auto; padding: 14px calc(var(--hc-arrow-size) + 14px) 4px 0; border-top: var(--hc-rule); border-bottom: 0; }
/* category chip on the image: the chip is positioned against the card ( .gdlr-core-blog-grid ), so the content wrap must not be a containing block */
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap{ position: static; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category{
	position: absolute; top: calc(var(--hc-pad) + 12px); left: calc(var(--hc-pad) + 12px); z-index: 2; display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 7px 14px 7px 7px;
	border-radius: var(--hc-chip-radius); background: var(--hc-chip-bg); color: var(--hc-chip-color); font-size: 13px; font-weight: 600; line-height: 1; letter-spacing: .1px; text-transform: none; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category:before{ content: ""; width: 8px; height: 8px; margin-left: 5px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); }
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category{ padding: 7px 12px; }
/* the meta row disappears when it only held the category ( now on the image ) */
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-wrapper:not(:has(.gdlr-core-blog-info:not(.gdlr-core-blog-info-category))),
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-wrapper:not(:has(.gdlr-core-blog-info:not(.gdlr-core-blog-info-category))){ margin: 0; padding: 0; border: 0; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category .gdlr-core-head,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category .gdlr-core-head,
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category + .gdlr-core-blog-info-sep{ display: none; }
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category{ color: var(--hc-meta-color); font-weight: 600; }
/* arrow on blog card */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:before,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:after{
	content: ""; display: var(--hc-arrow-display); position: absolute; right: max(12px, var(--hc-pad)); bottom: 10px; width: var(--hc-arrow-size); height: var(--hc-arrow-size); pointer-events: none; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:after{ box-sizing: border-box; border: 1px solid var(--hc-arrow-border); border-radius: var(--hc-arrow-radius); background: var(--hc-arrow-bg); transition: background-color var(--helioro-fast), border-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:before{ z-index: 1; background-color: var(--hc-arrow-fg); -webkit-mask: var(--helioro-ico-arrow-ur) center / 13px no-repeat; mask: var(--helioro-ico-arrow-ur) center / 13px no-repeat; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-blog-grid-content-wrap:after{ background-color: var(--hc-arrow-hover-bg); border-color: var(--helioro-accent); }
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-blog-grid-content-wrap:before,
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-blog-grid-content-wrap:before,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-blog-grid-content-wrap:before{ background-color: var(--helioro-accent); }
/* no corner arrow when there is no meta row, or when the read-more row carries its own arrow */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:not(:has(.gdlr-core-blog-info-wrapper)):before,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:not(:has(.gdlr-core-blog-info-wrapper)):after,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:has(.gdlr-core-excerpt-read-more):before,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap:has(.gdlr-core-excerpt-read-more):after{ display: none; }
/* "Read article" row ( fw3-blog Excerpt + Read More ): dotted rule, 14/600 label, round arrow that turns accent on card hover */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-content{ display: flex; flex: 1 0 auto; flex-direction: column; gap: 16px; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-content:has(.gdlr-core-excerpt-read-more){ margin-bottom: 0; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-content > .clear,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-content:after{ display: none; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-excerpt-read-more{ display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: auto 0 0;
	padding: 14px 0 0; border-top: var(--hc-rule); font-size: 14px; font-weight: 600; line-height: 1.4; letter-spacing: 0; text-transform: none; color: var(--helioro-text); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-excerpt-read-more i{ position: relative; display: inline-block; flex-shrink: 0; width: var(--hc-arrow-size); height: var(--hc-arrow-size); margin: 0;
	box-sizing: border-box; border: 1px solid var(--hc-arrow-border); border-radius: var(--hc-arrow-radius); background: var(--hc-arrow-bg); font-size: 0; transition: background-color var(--helioro-fast), border-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-excerpt-read-more i:before{ content: ""; position: absolute; inset: 0; background-color: var(--hc-arrow-fg);
	-webkit-mask: var(--helioro-ico-arrow-ur) center / 13px no-repeat; mask: var(--helioro-ico-arrow-ur) center / 13px no-repeat; transition: background-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-excerpt-read-more i{ background-color: var(--hc-arrow-hover-bg); border-color: var(--helioro-accent); }
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-excerpt-read-more i:before,
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-excerpt-read-more i:before,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-excerpt-read-more i:before{ background-color: var(--helioro-accent); }
/* engineering card style: crop blog grid thumbnails to 3:2 like bento / architectural, set --hc-blog-ratio to change */
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail img{ width: 100%; height: auto; aspect-ratio: var(--hc-blog-ratio, 3 / 2); object-fit: cover; }
@media only screen and (min-width: 768px) and (max-width: 999px){
	.helioro-cards-engineering .helioro-tablet-row .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail img{ height: 100%; aspect-ratio: auto; }
}
/* equal-height blog grid cards per row, read-more row on the card bottom */
.helioro-body .gdlr-core-blog-item-holder:has(> .gdlr-core-item-list > .gdlr-core-blog-grid){ display: flex; flex-wrap: wrap; }
.helioro-body .gdlr-core-blog-item-holder > .gdlr-core-item-list:has(> .gdlr-core-blog-grid){ display: flex; flex-direction: column; }
.helioro-body .gdlr-core-blog-item-holder > .gdlr-core-item-list > .gdlr-core-blog-grid{ flex: 1 1 auto; }
/* bento blog card ( design B03 ): r24 frame 10/10/18, 3:2 image r18, 13/600 date with calendar, 15px excerpt */
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid{ height: 100%; padding: 10px 10px 18px; border-radius: calc(var(--hc-radius) + 4px); }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail{ border-radius: calc(var(--hc-img-radius) + 2px); }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail img{ width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-content-wrap{ padding: 16px 12px 0; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-grid-date{ margin-bottom: 10px; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info{ font-size: 13px; font-weight: 600; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-title{ line-height: 1.18; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-content{ font-size: 15px; line-height: 1.6; color: var(--helioro-text); }

/* left-thumbnail ( featured post row ) */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium.gdlr-core-blog-left-thumbnail,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium.gdlr-core-blog-right-thumbnail{
	padding: var(--hc-pad); background: var(--hc-bg); border: var(--hc-border-w) solid var(--hc-border-color); border-radius: var(--hc-radius); box-sizing: border-box; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-thumbnail{ border-radius: var(--hc-img-radius); overflow: hidden; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-medium-content-wrapper{ padding: 12px 16px 12px 0; }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-title a{ color: var(--helioro-ink); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-title a:hover{ color: var(--helioro-accent-dark); }
@media only screen and (max-width: 767px){
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-medium-content-wrapper{ padding: 16px 8px 8px; }
}
/* thumbnail-less list ( Blog Style: Blog List, Aurelle / Vesper journal ) */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-list{ padding-top: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--helioro-line); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-list .gdlr-core-blog-title a{ color: var(--helioro-ink); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-list .gdlr-core-blog-title a:hover{ color: var(--helioro-accent-dark); }

/* ===================================================================
 * 7. fw3-personnel — grid card
 * =================================================================== */
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list,
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid-with-background .gdlr-core-personnel-list{
	padding: var(--hc-pad); background: var(--hc-bg); border: var(--hc-border-w) solid var(--hc-border-color); border-radius: calc(var(--hc-radius) + 4px); box-sizing: border-box;
	transition: box-shadow var(--helioro-fast), border-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list:hover{ border-color: var(--hc-hover-border); box-shadow: var(--hc-hover-shadow); }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-image,
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid-with-background .gdlr-core-personnel-list-image{ border-radius: var(--hc-radius); overflow: hidden; margin-bottom: 0; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap,
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid-with-background .gdlr-core-personnel-list-content-wrap{ padding: var(--hc-body-pad); background: transparent; }
[class*="helioro-cards-"] .gdlr-core-personnel-item .gdlr-core-personnel-list-title{ margin-bottom: 4px; font-size: 20px; letter-spacing: -0.2px; }
[class*="helioro-cards-"] .gdlr-core-personnel-item .gdlr-core-personnel-list-title a{ color: var(--helioro-ink); }
[class*="helioro-cards-"] .gdlr-core-personnel-item .gdlr-core-personnel-list-position{ font-family: var(--hc-meta-font); font-size: var(--hc-meta-size); font-style: normal; letter-spacing: var(--hc-meta-ls); text-transform: var(--hc-meta-transform); color: var(--hc-meta-color); }
[class*="helioro-cards-"] .gdlr-core-personnel-item .gdlr-core-personnel-list-divider{ border-color: var(--helioro-line); border-bottom-style: dotted; width: 100%; }
[class*="helioro-cards-"] .gdlr-core-personnel-item .gdlr-core-personnel-list-content{ font-size: 14px; color: var(--helioro-muted); }

/* ===================================================================
 * 8. fw3-price-table — rounded tiles, featured tile raised
 * =================================================================== */
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table{
	border: var(--hc-border-w) solid var(--hc-border-color); border-radius: var(--hc-radius); background: var(--hc-bg); overflow: hidden; box-shadow: none;
	transition: transform .35s var(--helioro-ease), box-shadow var(--helioro-fast); }
.helioro-cards-editorial .gdlr-core-price-table-item .gdlr-core-price-table,
.helioro-cards-architectural .gdlr-core-price-table-item .gdlr-core-price-table{ border: 1px solid var(--helioro-line); background: var(--helioro-card); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table-head{ background: transparent; }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table-price{ background: var(--helioro-ground); border-radius: calc(var(--hc-radius) * .6); margin-left: var(--hc-pad); margin-right: var(--hc-pad); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table-content *{ border-color: var(--helioro-line); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table-button{ border-radius: var(--hc-chip-radius); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active{
	background: var(--helioro-ink); border-color: var(--helioro-ink); color: rgba(255, 255, 255, .78); box-shadow: 0 32px 64px -32px rgba(var(--helioro-ink-rgb), .55); }
@media only screen and (min-width: 1000px){
	[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active{ transform: translateY(-16px); }
}
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-title,
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-price-number,
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-prefix{ color: #ffffff; }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-caption,
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-suffix{ color: rgba(255, 255, 255, .64); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-price{ background: rgba(255, 255, 255, .06); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-content *{ border-color: rgba(255, 255, 255, .12); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-button{ background: var(--helioro-accent); border-color: var(--helioro-accent); color: var(--helioro-on-accent); }
[class*="helioro-cards-"] .gdlr-core-price-table-item .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-button:hover{ background: #ffffff; border-color: #ffffff; color: var(--helioro-ink); }
/* accent instead of ink for the featured tile: add "helioro-price-accent" to the item */
.helioro-price-accent .gdlr-core-price-table.gdlr-core-active{ background: var(--helioro-accent) !important; border-color: var(--helioro-accent) !important; }
.helioro-price-accent .gdlr-core-price-table.gdlr-core-active .gdlr-core-price-table-button{ background: #ffffff !important; border-color: #ffffff !important; color: var(--helioro-ink) !important; }

/* ===================================================================
 * 9. Accordion / toggle — FW3 ( body option ) + PixeBuilder ( opt-in class )
 * =================================================================== */
[class*="helioro-acc-"] .gdlr-core-accordion-item,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item{ counter-reset: helioro-acc; }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-tab,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab{
	position: relative; counter-increment: helioro-acc; margin-bottom: var(--ha-gap); padding: var(--ha-pad); border: var(--ha-border); border-radius: var(--ha-radius);
	background: var(--ha-bg); box-shadow: inset var(--ha-rail) 0 0 0 transparent; transition: border-color var(--helioro-fast), background-color var(--helioro-fast), box-shadow var(--helioro-fast); }
.helioro-acc-hairline .gdlr-core-accordion-item .gdlr-core-accordion-item-tab,
.helioro-acc-hairline .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab{ border-bottom: 1px solid var(--helioro-line); }
.helioro-acc-hairline .gdlr-core-accordion-item .gdlr-core-accordion-item-tab:first-child,
.helioro-acc-hairline .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab:first-child{ border-top: 1px solid var(--helioro-line); }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-tab.gdlr-core-active,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab.gdlr-core-active{
	border-color: var(--ha-active-border); background: var(--ha-active-bg); box-shadow: inset var(--ha-rail) 0 0 0 var(--helioro-accent); }
.helioro-acc-hairline .gdlr-core-accordion-item .gdlr-core-accordion-item-tab.gdlr-core-active,
.helioro-acc-hairline .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab.gdlr-core-active{ border-bottom-color: var(--helioro-line); }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-title,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-title{ position: relative; padding-right: calc(var(--ha-icon-size, 34px) + 18px); padding-left: 0; margin: 0; font-size: 18px; line-height: 1.4; text-transform: none; letter-spacing: -0.1px; color: var(--helioro-ink); }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-title:before,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-title:before{
	content: counter(helioro-acc, decimal-leading-zero); display: var(--ha-num-display); float: none; min-width: 38px; margin-left: 0; font-weight: 400; margin-right: 10px; font-family: var(--helioro-font-meta, monospace); font-size: 13px; color: var(--helioro-accent); }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-content,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-content{ padding-top: 12px; padding-right: 52px; font-size: 15px; line-height: 1.7; color: var(--helioro-text); }
.helioro-acc-numbered .gdlr-core-accordion-item .gdlr-core-accordion-item-content,
.helioro-acc-numbered .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-content{ padding-left: 48px; }
/* plus / minus icon ( replaces the FW3 icon font glyph ) */
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-icon,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-icon{ display: none; }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-title:after,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-title:after{
	content: ""; position: absolute; right: 0; top: 50%; width: var(--ha-icon-size, 34px); height: var(--ha-icon-size, 34px); margin-top: calc(var(--ha-icon-size, 34px) / -2); box-sizing: border-box; border: 1px solid var(--ha-icon-border, var(--helioro-line)); border-radius: var(--ha-icon-radius);
	background:
		linear-gradient(currentColor, currentColor) center / 12px 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) center / 1.5px 12px no-repeat,
		var(--ha-icon-bg);
	color: var(--ha-icon-color, var(--helioro-ink)); transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast), transform .3s var(--helioro-ease); }
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-active .gdlr-core-accordion-item-title:after,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-active .gdlr-core-toggle-box-item-title:after{
	border-color: var(--ha-icon-active-bg); color: var(--ha-icon-active-color, #ffffff);
	background:
		linear-gradient(currentColor, currentColor) center / 12px 1.5px no-repeat,
		var(--ha-icon-active-bg);
	transform: rotate(180deg); }

/* PixeBuilder accordion — opt in with the item CSS class helioro-acc-rounded / -hairline / -numbered */
.pixe-item[class*="helioro-acc-"]{ counter-reset: helioro-pacc; }
.pixe-item[class*="helioro-acc-"] .pixe-accordion{
	position: relative; counter-increment: helioro-pacc; margin-bottom: var(--ha-gap); border: var(--ha-border); border-radius: var(--ha-radius); background: var(--ha-bg);
	box-shadow: inset var(--ha-rail) 0 0 0 transparent; transition: border-color var(--helioro-fast), box-shadow var(--helioro-fast); }
.pixe-item.helioro-acc-hairline .pixe-accordion{ border-bottom: 1px solid var(--helioro-line); }
.pixe-item.helioro-acc-hairline .pixe-accordion:first-child{ border-top: 1px solid var(--helioro-line); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion.pixe-active{ border-color: var(--ha-active-border); background: var(--ha-active-bg); box-shadow: inset var(--ha-rail) 0 0 0 var(--helioro-accent); }
.pixe-item.helioro-acc-hairline .pixe-accordion.pixe-active{ border-bottom-color: var(--helioro-line); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title{ padding: var(--ha-pad); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-content{ padding-left: var(--ha-pad-x, 26px); padding-right: var(--ha-pad-x, 26px); }
.pixe-item.helioro-acc-numbered .pixe-accordion-title .pixe-text:before{ content: counter(helioro-pacc, decimal-leading-zero); display: inline-block; min-width: 38px; font-family: var(--helioro-font-meta, monospace); font-size: 13px; color: var(--helioro-accent); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title .pixe-plus,
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title .pixe-minus{ box-sizing: border-box; width: var(--ha-icon-size, 34px); height: var(--ha-icon-size, 34px); padding: 0;
	border: 1px solid var(--ha-icon-border, var(--helioro-line)); border-radius: var(--ha-icon-radius); background: var(--ha-icon-bg);
	color: var(--ha-icon-color); fill: var(--ha-icon-color); --pixe--svg--color: var(--ha-icon-color); transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast), fill var(--helioro-fast); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title .pixe-icon svg{ width: 14px; height: auto; }
.pixe-item[class*="helioro-acc-"] .pixe-accordion.pixe-active .pixe-accordion-title .pixe-minus{ border-color: var(--ha-icon-active-bg); background: var(--ha-icon-active-bg);
	color: var(--ha-icon-active-color, #ffffff); fill: var(--ha-icon-active-color, #ffffff); --pixe--svg--color: var(--ha-icon-active-color, #ffffff); }
/* Side Text ( e.g. "01" ) keeps one line next to a wrapping question ( the theme body has word-break: break-word ) */
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title .pixe-text-wrap{ flex: 1 1 auto; min-width: 0; align-items: baseline; gap: 14px; }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title .pixe-text-wrap > .pixe-text{ flex: 1 1 auto; min-width: 0; }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-side-text{ flex-shrink: 0; min-width: 2.4em; word-break: normal; overflow-wrap: normal; white-space: nowrap; color: var(--helioro-accent); }
/* open-role rows ( Careers ): 52px disc, open = ink ( row border follows Accordion Row Border ) */
.helioro-acc-roles{ --ha-radius: 24px; --ha-icon-size: 52px; --ha-icon-active-bg: var(--helioro-ink); --ha-icon-color: var(--helioro-ink); }
@media only screen and (max-width: 767px){ .helioro-acc-roles{ --ha-icon-size: 44px; } }
/* hairline rows inside a tile: add "helioro-acc-between" ( lines only between rows, nothing above the first / below the last ) */
.helioro-body .pixe-item.helioro-acc-between .pixe-accordion,
.helioro-body .pixe-item.helioro-acc-between .pixe-accordion:first-child,
.helioro-body .pixe-item.helioro-acc-between .pixe-accordion.pixe-active{ margin-bottom: 0; border-top: 0; border-bottom: 0; }
.helioro-body .pixe-item.helioro-acc-between .pixe-accordion + .pixe-accordion{ border-top: 1px solid var(--helioro-line); }
.helioro-body .helioro-acc-between .gdlr-core-accordion-item-tab,
.helioro-body .helioro-acc-between .gdlr-core-accordion-item-tab:first-child,
.helioro-body .helioro-acc-between .gdlr-core-toggle-box-item-tab,
.helioro-body .helioro-acc-between .gdlr-core-toggle-box-item-tab:first-child{ margin-bottom: 0; border-top: 0; border-bottom: 0; }
.helioro-body .helioro-acc-between .gdlr-core-accordion-item-tab + .gdlr-core-accordion-item-tab,
.helioro-body .helioro-acc-between .gdlr-core-toggle-box-item-tab + .gdlr-core-toggle-box-item-tab{ border-top: 1px solid var(--helioro-line); }

/* ===================================================================
 * 10. Contact Form 7
 * =================================================================== */
[class*="helioro-form-"] .wpcf7 label{ display: block; margin-bottom: 6px; font-family: var(--hf-label-font); font-size: var(--hf-label-size); font-weight: 600; letter-spacing: var(--hf-label-ls); text-transform: var(--hf-label-transform); color: var(--hf-label-color, inherit); }
[class*="helioro-form-"] .wpcf7 label .wpcf7-form-control-wrap{ margin-top: 6px; }
[class*="helioro-form-"] .wpcf7 .wpcf7-form-control-wrap{ display: block; }
[class*="helioro-form-"] .wpcf7 input[type="text"],
[class*="helioro-form-"] .wpcf7 input[type="email"],
[class*="helioro-form-"] .wpcf7 input[type="tel"],
[class*="helioro-form-"] .wpcf7 input[type="url"],
[class*="helioro-form-"] .wpcf7 input[type="number"],
[class*="helioro-form-"] .wpcf7 input[type="date"],
[class*="helioro-form-"] .wpcf7 select,
[class*="helioro-form-"] .wpcf7 textarea{
	width: 100%; box-sizing: border-box; height: var(--hf-height); margin: 0; padding: var(--hf-pad);
	border-style: solid; border-width: var(--hf-border-w); border-color: var(--hf-border-color); border-radius: var(--hf-radius);
	background-color: var(--hf-bg); color: var(--hf-color); font-size: 15px; font-weight: var(--hf-weight, 400); line-height: 1.4; box-shadow: none; outline: none;
	transition: border-color var(--helioro-fast), box-shadow var(--helioro-fast), background-color var(--helioro-fast); }
[class*="helioro-form-"] .wpcf7 textarea{ height: auto; min-height: 140px; border-radius: var(--hf-area-radius); resize: vertical; }
[class*="helioro-form-"] .wpcf7 select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 44px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e767a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 18px center; background-size: 16px; }
.helioro-form-underline .wpcf7 select{ background-position: right 2px center; padding-right: 28px; }
[class*="helioro-form-"] .wpcf7 input::placeholder,
[class*="helioro-form-"] .wpcf7 textarea::placeholder{ color: var(--hf-placeholder); opacity: .75; }
[class*="helioro-form-"] .wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus,
[class*="helioro-form-"] .wpcf7 select:focus,
[class*="helioro-form-"] .wpcf7 textarea:focus{ border-color: var(--hf-focus-color); box-shadow: var(--hf-focus-ring); }
[class*="helioro-form-"] .wpcf7 input[type="submit"],
[class*="helioro-form-"] .wpcf7 button[type="submit"]{
	display: inline-flex; align-items: center; justify-content: center; height: var(--hf-height); padding: 0 28px; border: 0; border-radius: var(--hf-btn-radius);
	background: var(--hf-btn-bg); color: var(--hf-btn-color); font-size: 15px; font-weight: 600; letter-spacing: 0; text-transform: none; cursor: pointer; transition: background-color var(--helioro-fast), color var(--helioro-fast); }
[class*="helioro-form-"] .wpcf7 input[type="submit"]:hover,
[class*="helioro-form-"] .wpcf7 button[type="submit"]:hover{ background: var(--hf-btn-hover-bg); color: var(--hf-btn-hover-color, #ffffff); }
.helioro-form-dark .wpcf7 select{ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); }
.helioro-form-dark .wpcf7 select option{ color: var(--helioro-ink); }
[class*="helioro-form-"] .wpcf7 .wpcf7-spinner{ margin: 0 12px; }
/* submit with an arrow: a paragraph that holds only the submit becomes a flex row, the arrow sits inside the button's right padding
   and follows the button text colour ( also on hover ); the spinner floats below so it never leaves a dead tail */
[class*="helioro-form-"] .wpcf7 p:has(> .wpcf7-submit):not(:has(> label, > .wpcf7-form-control-wrap, > select, > textarea, > input:not([type="submit"]):not([type="hidden"]))){
	position: relative; display: flex; flex-wrap: wrap; align-items: center; }
[class*="helioro-form-"] .wpcf7 p:has(> .wpcf7-submit):not(:has(> label, > .wpcf7-form-control-wrap, > select, > textarea, > input:not([type="submit"]):not([type="hidden"]))) > .wpcf7-submit{ padding-right: var(--hf-arrow-pad, 47px); }
[class*="helioro-form-"] .wpcf7 p:has(> .wpcf7-submit):not(:has(> label, > .wpcf7-form-control-wrap, > select, > textarea, > input:not([type="submit"]):not([type="hidden"]))):after{
	content: ""; display: var(--hf-arrow-display, block); position: relative; z-index: 1; flex-shrink: 0; width: 15px; height: 15px; margin-left: -39px; pointer-events: none; background-color: var(--hf-btn-color);
	-webkit-mask: var(--hf-arrow) center / contain no-repeat; mask: var(--hf-arrow) center / contain no-repeat; transition: background-color var(--helioro-fast); }
[class*="helioro-form-"] .wpcf7 p:has(> .wpcf7-submit:hover):after{ background-color: var(--hf-btn-hover-color, #ffffff); }
[class*="helioro-form-"] .wpcf7 p:has(> .wpcf7-submit) > .wpcf7-spinner{ position: absolute; top: 100%; right: 0; margin: 8px 0 0; }
/* full-width submit: helioro-form-on-accent, or "helioro-cf7-submit-full" on the paragraph / a wrapper */
.helioro-form-on-accent .wpcf7 p > .wpcf7-submit,
.helioro-cf7-submit-full > .wpcf7-submit,
.helioro-cf7-submit-full .wpcf7 p > .wpcf7-submit{ flex: 0 0 100%; width: 100%; }
.helioro-form-on-accent .wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus,
.helioro-form-on-accent .wpcf7 select:focus,
.helioro-form-on-accent .wpcf7 textarea:focus{ outline: 2px solid var(--helioro-ink); outline-offset: 1px; box-shadow: none; }
.helioro-form-on-accent .helioro-form-note{ color: rgba(255, 255, 255, .86); }
[class*="helioro-form-"] .wpcf7 .wpcf7-not-valid{ border-color: #c0392b; }
[class*="helioro-form-"] .wpcf7 .wpcf7-not-valid-tip{ margin-top: 6px; font-size: 13px; }
[class*="helioro-form-"] .wpcf7 form .wpcf7-response-output{ margin: 18px 0 0; padding: 12px 18px; border-radius: min(var(--hf-radius), 16px); font-size: 14px; }

/* grid helpers for CF7 markup: <div class="helioro-cf7-grid"> <p>…</p> <p>…</p> </div> */
.helioro-cf7-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 16px; }
.helioro-cf7-grid > *{ margin: 0; }
.helioro-cf7-grid > .helioro-cf7-full{ grid-column: 1 / -1; }
@media only screen and (max-width: 767px){ .helioro-cf7-grid{ grid-template-columns: 1fr; } }
/* inline row ( input + button in one pill ): <span class="helioro-cf7-inline helioro-cf7-joined">[email …][submit …]</span>
   ( use a span — CF7 autop wraps block tags in <p> ). The field never drops under 10em: when the row is too narrow it wraps and
   the field + a full-width button stack ( e.g. the CTA at 390 ); a row that fits stays joined ( e.g. the footer at 390 ). */
.helioro-cf7-inline{ position: relative; display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; }
.helioro-cf7-inline > *{ margin: 0; }
.helioro-cf7-inline .wpcf7-form-control-wrap{ flex: 999 1 10em; min-width: min(10em, 100%); }
.helioro-cf7-inline input[type="submit"]{ flex: 1 0 auto; }
.helioro-cf7-inline .wpcf7-spinner{ position: absolute; top: 100%; right: 0; margin: 8px 0 0; }
[class*="helioro-form-"] .helioro-cf7-inline input[type="submit"]{ padding-right: var(--hf-arrow-pad, 48px); }
[class*="helioro-form-"] .helioro-cf7-inline:after{ content: ""; position: absolute; z-index: 1; right: calc(var(--hf-joined-pad, 0px) + 24px); bottom: calc(var(--hf-joined-pad, 0px) + (var(--hf-joined-h, 52px) - 13px) / 2);
	display: var(--hf-arrow-display, block); width: 13px; height: 13px; pointer-events: none; background-color: var(--hf-btn-color);
	-webkit-mask: var(--hf-arrow) center / contain no-repeat; mask: var(--hf-arrow) center / contain no-repeat; transition: background-color var(--helioro-fast); }
[class*="helioro-form-"] .helioro-cf7-inline:not(.helioro-cf7-joined):after{ bottom: calc((var(--hf-height) - 13px) / 2); right: 24px; }
[class*="helioro-form-"] .helioro-cf7-inline:has(input[type="submit"]:hover):after{ background-color: var(--hf-btn-hover-color, #ffffff); }
/* joined: one white pill, field + button inside ( pill / dark / on-accent looks ) */
.helioro-form-pill .helioro-cf7-inline.helioro-cf7-joined,
.helioro-form-dark .helioro-cf7-inline.helioro-cf7-joined,
.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined{ gap: var(--hf-joined-pad); padding: var(--hf-joined-pad); border: 1px solid var(--hf-border-color); border-radius: min(var(--hf-joined-radius), 32px); background: var(--hf-bg); }
.helioro-form-pill .helioro-cf7-inline.helioro-cf7-joined:focus-within,
.helioro-form-dark .helioro-cf7-inline.helioro-cf7-joined:focus-within,
.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined:focus-within{ border-color: var(--hf-focus-color); box-shadow: var(--hf-focus-ring); }
.helioro-form-pill .helioro-cf7-inline.helioro-cf7-joined input:not([type="submit"]),
.helioro-form-dark .helioro-cf7-inline.helioro-cf7-joined input:not([type="submit"]),
.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined input:not([type="submit"]){ height: var(--hf-joined-h); padding: 0 16px 0 18px; border: 0; border-radius: min(var(--hf-joined-radius), 32px); box-shadow: none; outline: none; background: transparent; }
.helioro-form-pill .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-form-dark .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined input[type="submit"]{ height: var(--hf-joined-h); padding-left: 24px; }
/* joined on an accent tile: the pill is white, so a darker accent hover reads ( white on white would vanish ) */
.helioro-form-on-accent .helioro-cf7-joined{ --hf-btn-hover-bg: var(--helioro-accent-dark); --hf-btn-hover-color: #ffffff; --hf-border-color: transparent; }
.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined:focus-within{ box-shadow: 0 0 0 2px var(--helioro-ink); }
@media only screen and (max-width: 479px){
	.helioro-form-pill .helioro-cf7-inline.helioro-cf7-joined,
	.helioro-form-dark .helioro-cf7-inline.helioro-cf7-joined,
	.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined{ border-radius: min(var(--hf-joined-radius), 24px); }
}
/* dashed file upload */
[class*="helioro-form-"] .wpcf7 input[type="file"]{
	width: 100%; box-sizing: border-box; padding: 26px 20px 26px 64px; border: 1.5px dashed var(--helioro-line); border-radius: min(var(--hf-area-radius), 20px);
	background: var(--helioro-ground) var(--helioro-ico-upload) no-repeat 22px center / 0 0; color: var(--helioro-muted); font-size: 14px; cursor: pointer; position: relative; }
[class*="helioro-form-"] .wpcf7 .wpcf7-form-control-wrap:has(input[type="file"]){ position: relative; }
[class*="helioro-form-"] .wpcf7 .wpcf7-form-control-wrap:has(input[type="file"]):before{
	content: ""; position: absolute; left: 22px; top: 50%; z-index: 1; width: 24px; height: 24px; margin-top: -12px; background-color: var(--helioro-accent); pointer-events: none;
	-webkit-mask: var(--helioro-ico-upload) center / contain no-repeat; mask: var(--helioro-ico-upload) center / contain no-repeat; }
[class*="helioro-form-"] .wpcf7 input[type="file"]:hover{ border-color: var(--helioro-accent); }
[class*="helioro-form-"] .wpcf7 input[type="file"]::file-selector-button{ margin-right: 14px; padding: 8px 16px; border: 0; border-radius: var(--hf-btn-radius); background: var(--helioro-ink); color: #ffffff; font-weight: 600; cursor: pointer; }
/* radio / checkbox tiles: wrap the CF7 radio tag with <div class="helioro-cf7-tiles"> */
.helioro-cf7-tiles .wpcf7-radio,
.helioro-cf7-tiles .wpcf7-checkbox{ display: flex; flex-wrap: wrap; gap: 10px; }
.helioro-cf7-tiles .wpcf7-list-item{ margin: 0; }
/* CF7 wraps the tiles in a paragraph whose bottom margin doubles the grid gap */
.helioro-body .wpcf7 .helioro-cf7-tiles > p:last-child{ margin-bottom: 0; }
/* native date / time inputs on iOS WebKit ignore height, keep a min width and centre the value */
.helioro-body .wpcf7 input:is([type="date"], [type="time"], [type="datetime-local"]){ -webkit-appearance: none; appearance: none; display: block; width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; text-align: left; }
.helioro-body .wpcf7 input:is([type="date"], [type="time"], [type="datetime-local"])::-webkit-date-and-time-value{ min-height: 1.5em; text-align: left; }
.helioro-cf7-tiles .wpcf7-list-item label{ display: inline-flex; align-items: center; gap: 10px; margin: 0; padding: 12px 18px; border: 1px solid var(--helioro-line); border-radius: min(var(--hf-radius, 14px), 14px);
	font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: 0; text-transform: none; cursor: pointer; transition: border-color var(--helioro-fast), background-color var(--helioro-fast); }
.helioro-cf7-tiles .wpcf7-list-item label:has(input:checked){ border-color: var(--helioro-accent); background: var(--helioro-accent-soft); }
.helioro-cf7-tiles .wpcf7-list-item input{ accent-color: var(--helioro-accent); }
/* privacy note under the button */
.helioro-form-note{ display: flex; align-items: center; gap: 7px; margin-top: 12px; font-size: 13px; color: var(--helioro-muted); }
.helioro-form-note:before{ content: ""; flex-shrink: 0; width: 13px; height: 13px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-lock) center / contain no-repeat; mask: var(--helioro-ico-lock) center / contain no-repeat; }
.helioro-footer-wrapper .helioro-form-note,
.helioro-form-dark .helioro-form-note,
.helioro-on-dark .helioro-form-note{ color: rgba(255, 255, 255, .6); }
/* note under a full-width CF7 submit: the PixeBuilder paragraph reset beats the 12px top margin above */
.helioro-body .wpcf7 .helioro-form-note{ margin-top: 16px; }

/* ===================================================================
 * 11. Icon list — accent check in circle ( add "helioro-icon-check" to the fw3-icon-list item )
 * =================================================================== */
.helioro-icon-check .gdlr-core-icon-list-icon-wrap{ position: relative; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-top: 1px; border-radius: 50%; background: rgba(var(--helioro-accent-rgb), .14); }
.helioro-icon-check .gdlr-core-icon-list-icon-wrap i,
.helioro-icon-check .gdlr-core-icon-list-icon-wrap img{ display: none; }
.helioro-icon-check .gdlr-core-icon-list-icon-wrap:before{ content: ""; width: 12px; height: 12px; background-color: var(--helioro-accent);
	-webkit-mask: var(--helioro-ico-check) center / contain no-repeat; mask: var(--helioro-ico-check) center / contain no-repeat; }
.helioro-icon-check.helioro-icon-solid .gdlr-core-icon-list-icon-wrap{ background: var(--helioro-accent); }
.helioro-icon-check.helioro-icon-solid .gdlr-core-icon-list-icon-wrap:before{ background-color: var(--helioro-on-accent); }

/* ===================================================================
 * 12. Tables — PixeBuilder table ( item CSS class ) + post content tables
 * =================================================================== */
.helioro-body .helioro-table table{ width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-card); background: var(--helioro-card); }
.helioro-body .helioro-table .pixe-table-scroll{ border-radius: var(--helioro-radius-card); }
.helioro-body .helioro-table th,
.helioro-body .helioro-table td{ border: 0; border-bottom: 1px solid var(--helioro-line); background-color: transparent; text-align: left; vertical-align: middle;
	word-break: normal; overflow-wrap: normal; }
/* cell padding at low specificity: beats the style-core table reset, loses to the PixeBuilder table Head / Body / Foot Cell Padding options */
:where(.helioro-body) .helioro-table th,
:where(.helioro-body) .helioro-table td{ padding: 16px 20px; }
/* the theme option zebra ( Color > Table odd / even ) paints every tr: the kit table is white with hairlines */
.helioro-body .helioro-table tr,
.helioro-body .helioro-table tbody tr:nth-child(odd),
.helioro-body .helioro-table tbody tr:nth-child(even){ background-color: var(--helioro-card); color: inherit; }
/* cells never break inside a figure ( "$14,280" ); add "helioro-table-nowrap" to keep every cell on one line ( with PXB mobile mode Scroll ) */
.helioro-body .helioro-table-nowrap td,
.helioro-body .helioro-table-nowrap th{ white-space: nowrap; }
.helioro-body .helioro-table tfoot td,
.helioro-body .helioro-table tfoot th{ border-top: 2px dotted rgba(var(--helioro-ink-rgb), .2); border-bottom: 0; background-color: var(--helioro-card); }
.helioro-body .helioro-table thead td,
.helioro-body .helioro-table thead th{ background: var(--helioro-ground); color: var(--helioro-ink); font-weight: 600; }
.helioro-body .helioro-table tbody tr:last-child td,
.helioro-body .helioro-table tfoot tr:last-child td{ border-bottom: 0; }
.helioro-body .helioro-table tbody tr{ transition: background-color var(--helioro-fast); }
.helioro-body .helioro-table tbody tr:hover{ background: rgba(var(--helioro-accent-rgb), .04); }
/* highlight a column: helioro-table-hl-2 / -3 / -4 ( n = column number, 1 = first ); soft tint = accent-soft at 50 % ( #fbeef2 on main ),
   head cell accent, foot cell rounded at the bottom */
.helioro-body .helioro-table{ --helioro-table-tint: color-mix(in srgb, var(--helioro-accent-soft) 50%, var(--helioro-card)); }
.helioro-body .helioro-table-hl-2 tr > *:nth-child(2),
.helioro-body .helioro-table-hl-3 tr > *:nth-child(3),
.helioro-body .helioro-table-hl-4 tr > *:nth-child(4),
.helioro-body .helioro-table-hl-5 tr > *:nth-child(5){ background: var(--helioro-table-tint); }
.helioro-body .helioro-table-hl-2 tfoot tr:last-child > *:nth-child(2),
.helioro-body .helioro-table-hl-3 tfoot tr:last-child > *:nth-child(3),
.helioro-body .helioro-table-hl-4 tfoot tr:last-child > *:nth-child(4),
.helioro-body .helioro-table-hl-5 tfoot tr:last-child > *:nth-child(5){ border-radius: 0 0 14px 14px; }
/* soft head for the highlighted column ( accent-soft + ink instead of accent + white ): add "helioro-table-hl-soft" */
.helioro-body .helioro-table-hl-soft.helioro-table thead tr > *:nth-child(n){ color: var(--helioro-ink); }
.helioro-body .helioro-table-hl-soft.helioro-table-hl-2 thead tr > *:nth-child(2),
.helioro-body .helioro-table-hl-soft.helioro-table-hl-3 thead tr > *:nth-child(3),
.helioro-body .helioro-table-hl-soft.helioro-table-hl-4 thead tr > *:nth-child(4),
.helioro-body .helioro-table-hl-soft.helioro-table-hl-5 thead tr > *:nth-child(5){ background: var(--helioro-accent-soft); border-radius: 14px 14px 0 0; }
/* section row ( stands in for colspan ): put the label in cell 1 as <span class="helioro-table-section">System</span> —
   the row turns ground, 11px padding, no inner lines, the label runs across the empty cells */
.helioro-body .helioro-table tr:has(.helioro-table-section) > *{ padding-top: 11px; padding-bottom: 11px; background: var(--helioro-ground); }
.helioro-body .helioro-table tr:has(.helioro-table-section) > *:first-child{ overflow: visible; white-space: nowrap; }
.helioro-table-section{ position: relative; z-index: 1; font-size: 12px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--helioro-ink); }
.helioro-body .helioro-table-hl-2 thead tr > *:nth-child(2),
.helioro-body .helioro-table-hl-3 thead tr > *:nth-child(3),
.helioro-body .helioro-table-hl-4 thead tr > *:nth-child(4),
.helioro-body .helioro-table-hl-5 thead tr > *:nth-child(5){ background: var(--helioro-accent); color: var(--helioro-on-accent); }
/* highlight a row: add "helioro-table-hl-row-N" ( 1-6, counts body rows ) */
.helioro-body .helioro-table-hl-row-1 tbody tr:nth-child(1),
.helioro-body .helioro-table-hl-row-2 tbody tr:nth-child(2),
.helioro-body .helioro-table-hl-row-3 tbody tr:nth-child(3),
.helioro-body .helioro-table-hl-row-4 tbody tr:nth-child(4),
.helioro-body .helioro-table-hl-row-5 tbody tr:nth-child(5),
.helioro-body .helioro-table-hl-row-6 tbody tr:nth-child(6){ background: var(--helioro-table-tint); }
/* dark table ( Northbeam ROI, Vesper savings ) */
.helioro-body .helioro-table-dark table{ background: var(--helioro-ink); border-color: rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .78); }
.helioro-body .helioro-table-dark th,
.helioro-body .helioro-table-dark td{ border-bottom-color: rgba(255, 255, 255, .1); }
.helioro-body .helioro-table-dark thead td,
.helioro-body .helioro-table-dark thead th{ background: rgba(255, 255, 255, .05); color: #ffffff; }
.helioro-body .helioro-table-dark tbody tr:hover{ background: rgba(255, 255, 255, .04); }
/* dark table rows stay on the ink fill: the zebra reset above paints rows with the card colour, the highlight tint is accent at 14 %,
   the highlighted head accent at 22 % with a 3px accent rule on top, highlighted cells white 600 */
.helioro-body .helioro-table-dark{ --helioro-table-tint: rgba(var(--helioro-accent-rgb), .14); }
.helioro-body .helioro-table-dark tr,
.helioro-body .helioro-table-dark tbody tr:nth-child(odd),
.helioro-body .helioro-table-dark tbody tr:nth-child(even),
.helioro-body .helioro-table-dark tfoot td,
.helioro-body .helioro-table-dark tfoot th{ background-color: transparent; }
.helioro-body .helioro-table-dark tfoot td,
.helioro-body .helioro-table-dark tfoot th{ border-top-color: rgba(255, 255, 255, .16); }
.helioro-body .helioro-table-dark.helioro-table-hl-soft thead tr > *:nth-child(n){ color: #ffffff; }
.helioro-body .helioro-table-dark.helioro-table-hl-2 thead tr > *:nth-child(2),
.helioro-body .helioro-table-dark.helioro-table-hl-3 thead tr > *:nth-child(3),
.helioro-body .helioro-table-dark.helioro-table-hl-4 thead tr > *:nth-child(4),
.helioro-body .helioro-table-dark.helioro-table-hl-5 thead tr > *:nth-child(5){ background: rgba(var(--helioro-accent-rgb), .22); color: #ffffff; box-shadow: inset 0 3px 0 var(--helioro-accent); border-radius: 0; }
.helioro-body .helioro-table-dark.helioro-table-hl-2 tbody tr > *:nth-child(2),
.helioro-body .helioro-table-dark.helioro-table-hl-3 tbody tr > *:nth-child(3),
.helioro-body .helioro-table-dark.helioro-table-hl-4 tbody tr > *:nth-child(4),
.helioro-body .helioro-table-dark.helioro-table-hl-5 tbody tr > *:nth-child(5),
.helioro-body .helioro-table-dark.helioro-table-hl-2 tfoot tr > *:nth-child(2),
.helioro-body .helioro-table-dark.helioro-table-hl-3 tfoot tr > *:nth-child(3),
.helioro-body .helioro-table-dark.helioro-table-hl-4 tfoot tr > *:nth-child(4),
.helioro-body .helioro-table-dark.helioro-table-hl-5 tfoot tr > *:nth-child(5){ color: #ffffff; font-weight: 600; }
.helioro-body .helioro-table-dark .helioro-table-section{ color: #ffffff; }
.helioro-body .helioro-table-dark tr:has(.helioro-table-section) > *{ background: rgba(255, 255, 255, .06); }
.helioro-body .helioro-table-square table,
.helioro-body .helioro-table-square .pixe-table-scroll{ border-radius: 2px; }
/* check / dash cells: put "✓" or "—" in a cell wrapped with <span class="helioro-yes"></span> / <span class="helioro-no"></span> */
.helioro-yes{ display: inline-flex; width: 22px; height: 22px; border-radius: 50%; background: rgba(var(--helioro-accent-rgb), .14); vertical-align: middle; position: relative; }
.helioro-yes:before{ content: ""; position: absolute; inset: 5px; background-color: var(--helioro-accent); -webkit-mask: var(--helioro-ico-check) center / contain no-repeat; mask: var(--helioro-ico-check) center / contain no-repeat; }
.helioro-no{ display: inline-block; width: 12px; height: 1.5px; background: var(--helioro-muted); vertical-align: middle; opacity: .6; }
/* hide extra columns on phones: helioro-table-hide-4-mobile ( hides column 4+ ) */
@media only screen and (max-width: 767px){
	.helioro-body .helioro-table th,
	.helioro-body .helioro-table td{ font-size: 14px; }
	:where(.helioro-body) .helioro-table th,
	:where(.helioro-body) .helioro-table td{ padding: 12px 14px; }
	.helioro-body .helioro-table-hide-3-mobile tr > *:nth-child(n+3),
	.helioro-body .helioro-table-hide-4-mobile tr > *:nth-child(n+4){ display: none; }
	/* stacked table: every row becomes a card */
	.helioro-body .helioro-table-stack table,
	.helioro-body .helioro-table-stack tbody,
	.helioro-body .helioro-table-stack tr,
	.helioro-body .helioro-table-stack td{ display: block; width: 100%; box-sizing: border-box; }
	.helioro-body .helioro-table-stack table{ border: 0; background: transparent; }
	.helioro-body .helioro-table-stack thead{ display: none; }
	.helioro-body .helioro-table-stack tbody tr{ margin-bottom: 12px; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-tile); background: var(--helioro-card); overflow: hidden; }
	.helioro-body .helioro-table-stack tbody td{ border-bottom: 1px dotted var(--helioro-line); }
	.helioro-body .helioro-table-stack tbody td:first-child{ background: var(--helioro-ground); font-weight: 600; color: var(--helioro-ink); }
}
/* post / page content tables scroll sideways on small screens */
@media only screen and (max-width: 767px){
	.helioro-single-article-content table,
	.helioro-table-scroll table{ display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
}

/* ===================================================================
 * 13. Single post — typography, tags, share, author box, comments
 * =================================================================== */
.helioro-single-article-content{ font-size: 17px; line-height: 1.75; }
.helioro-single-article-content > p{ margin-bottom: 22px; }
.helioro-single-article-content h2{ margin-top: 48px; margin-bottom: 16px; font-size: 30px; line-height: 1.2; letter-spacing: -0.5px; }
.helioro-single-article-content h3{ margin-top: 36px; margin-bottom: 12px; font-size: 22px; line-height: 1.3; letter-spacing: -0.2px; }
.helioro-single-article-content ul,
.helioro-single-article-content ol{ margin-left: 0; padding-left: 0; margin-bottom: 24px; list-style: none; }
.helioro-single-article-content ul > li,
.helioro-single-article-content ol > li{ position: relative; padding-left: 30px; margin-bottom: 10px; }
.helioro-single-article-content ul > li:before{ content: ""; position: absolute; left: 6px; top: .72em; width: 8px; height: 8px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 4px rgba(var(--helioro-accent-rgb), .16); }
.helioro-single-article-content ol{ counter-reset: helioro-ol; }
.helioro-single-article-content ol > li{ counter-increment: helioro-ol; }
.helioro-single-article-content ol > li:before{ content: counter(helioro-ol, decimal-leading-zero); position: absolute; left: 0; top: 0; font-size: 13px; font-weight: 700; line-height: 1.75rem; color: var(--helioro-accent); }
.helioro-single-article-content blockquote,
.helioro-single-article-content .wp-block-pullquote{ position: relative; margin: 36px 0; padding: 30px 34px 30px 38px; border: 0; border-left: 3px solid var(--helioro-accent); border-radius: 0 var(--helioro-radius-tile) var(--helioro-radius-tile) 0; background: var(--helioro-ground); font-size: 21px; line-height: 1.5; color: var(--helioro-ink); }
.helioro-single-article-content blockquote p:last-child{ margin-bottom: 0; }
.helioro-single-article-content blockquote cite{ display: block; margin-top: 14px; font-size: 14px; font-style: normal; color: var(--helioro-muted); }
.helioro-single-article-content figure img,
.helioro-single-article-content .wp-block-image img{ border-radius: var(--helioro-radius-tile); }
.helioro-single-article-content figcaption,
.helioro-single-article-content .wp-caption-text{ margin-top: 10px; font-size: 13px; color: var(--helioro-muted); text-align: left; }
.helioro-single-article .helioro-single-article-thumbnail img{ border-radius: var(--helioro-radius-card); }
/* tags as chips */
.helioro-single-author-tags a,
.helioro-single-magazine-author-tags a{ display: inline-block; margin: 0 6px 8px 0; padding: 7px 14px; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-button); font-size: 13px; font-weight: 600; line-height: 1.2; color: var(--helioro-ink); transition: border-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-single-author-tags a:hover,
.helioro-single-magazine-author-tags a:hover{ border-color: var(--helioro-accent); color: var(--helioro-accent-dark); }
/* share buttons */
[class*="helioro-social-"] .helioro-single-social-share .gdlr-core-social-share-item a,
[class*="helioro-social-"] .gdlr-core-social-share-item.helioro-share-buttons a{
	display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; margin: 0 6px 6px 0; border: 1px solid var(--helioro-line); border-radius: var(--hs-radius); color: var(--helioro-ink); font-size: 14px; transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
[class*="helioro-social-"] .helioro-single-social-share .gdlr-core-social-share-item a:hover,
[class*="helioro-social-"] .gdlr-core-social-share-item.helioro-share-buttons a:hover{ background: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
/* author box */
.helioro-single-author{ margin-top: 40px; }
.helioro-single-author .helioro-single-author-wrap{ display: flex; align-items: flex-start; gap: 22px; padding: 28px; border: 0; border-radius: var(--helioro-radius-card); background: var(--helioro-ground); text-align: left; }
.helioro-single-author .helioro-single-author-avartar{ float: none; flex-shrink: 0; width: 72px; height: 72px; margin: 0; border-radius: 50%; overflow: hidden; }
.helioro-single-author .helioro-single-author-avartar img{ width: 72px; height: 72px; border-radius: 50%; }
.helioro-single-author .helioro-single-author-content-wrap{ overflow: visible; }
.helioro-single-author .helioro-single-author-caption{ margin-bottom: 4px; font-size: 12px; font-style: normal; letter-spacing: 1px; text-transform: uppercase; color: var(--helioro-accent-dark); }
.helioro-single-author .helioro-single-author-title{ margin-bottom: 8px; font-size: 20px; }
.helioro-single-author .helioro-single-author-description{ font-size: 15px; line-height: 1.65; }
@media only screen and (max-width: 767px){
	.helioro-single-author .helioro-single-author-wrap{ flex-direction: column; padding: 22px; }
	.helioro-single-article-content{ font-size: 16px; }
	.helioro-single-article-content h2{ font-size: 25px; }
}
/* prev / next: two cards, label over the title, one column on phones - the old inline pill broke the label letter by letter at 390 */
.helioro-body .helioro-single-nav-area{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0 0 48px; padding: 0; border: 0; }
.helioro-body .helioro-single-nav-area:before,
.helioro-body .helioro-single-nav-area:after{ content: none; }
.helioro-body .helioro-single-nav-area .helioro-single-nav{ display: flex; flex-direction: column; align-items: flex-start; gap: 6px; float: none; max-width: none; min-width: 0; box-sizing: border-box;
	padding: 20px 24px; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-tile); transition: border-color var(--helioro-fast); }
.helioro-body .helioro-single-nav-area .helioro-single-nav-right{ grid-column: 2; align-items: flex-end; text-align: right; }
.helioro-body .helioro-single-nav-area .helioro-single-nav .helioro-text{ display: block; margin: 0; font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: 1.2px; text-transform: uppercase; word-break: normal; color: var(--helioro-muted); }
.helioro-body .helioro-single-nav-area .helioro-single-nav a{ display: block; }
.helioro-body .helioro-single-nav-area .helioro-single-nav .helioro-single-nav-title{ display: block; font-size: 18px; font-weight: 600; line-height: 1.3; letter-spacing: -0.2px; color: var(--helioro-ink); transition: color var(--helioro-fast); }
.helioro-body .helioro-single-nav-area .helioro-single-nav:hover{ border-color: var(--helioro-ink); }
.helioro-body .helioro-single-nav-area .helioro-single-nav:hover .helioro-single-nav-title{ color: var(--helioro-accent-dark); }
@media only screen and (max-width: 767px){
	.helioro-body .helioro-single-nav-area{ grid-template-columns: minmax(0, 1fr); gap: 12px; }
	.helioro-body .helioro-single-nav-area .helioro-single-nav-right{ grid-column: auto; }
	.helioro-body .helioro-single-nav-area .helioro-single-nav{ padding: 18px 20px; }
	.helioro-body .helioro-single-nav-area .helioro-single-nav .helioro-single-nav-title{ font-size: 17px; }
}
/* comments */
.helioro-comments-area .comment-body{ padding: 22px 24px; border-radius: var(--helioro-radius-tile); background: var(--helioro-ground); }
.helioro-comments-area .children{ border-left: 2px solid var(--helioro-line); padding-left: 24px; }
.helioro-comments-area .comment-author img,
.helioro-comments-area .avatar{ border-radius: 50%; }
[class*="helioro-form-"] .helioro-comments-area .comment-form input[type="text"],
[class*="helioro-form-"] .helioro-comments-area .comment-form input[type="email"],
[class*="helioro-form-"] .helioro-comments-area .comment-form input[type="url"],
[class*="helioro-form-"] .helioro-comments-area .comment-form textarea{ box-sizing: border-box; border-style: solid; border-width: var(--hf-border-w); border-color: var(--hf-border-color); border-radius: var(--hf-radius); background-color: var(--hf-bg); padding: var(--hf-pad); }
[class*="helioro-form-"] .helioro-comments-area .comment-form textarea{ border-radius: var(--hf-area-radius); }
[class*="helioro-form-"] .helioro-comments-area .comment-form input:focus,
[class*="helioro-form-"] .helioro-comments-area .comment-form textarea:focus{ border-color: var(--hf-focus-color); box-shadow: var(--hf-focus-ring); outline: none; }
[class*="helioro-form-"] .helioro-comments-area .form-submit input[type="submit"]{ border-radius: var(--hf-btn-radius); }

/* ===================================================================
 * 14. fw3-port-info — spec sheet grid ( add "helioro-spec-grid" to the item )
 * =================================================================== */
.helioro-spec-grid .gdlr-core-port-info-wrap{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.helioro-spec-grid .gdlr-core-port-info{ display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 18px 20px 20px; border: 1px solid var(--hc-spec-border, var(--helioro-line)); border-radius: var(--hc-spec-radius, var(--helioro-radius-tile)); background: var(--hc-spec-bg, var(--helioro-card)); }
.helioro-spec-grid .gdlr-core-port-info-key{ display: block; float: none; width: auto; font-size: var(--hc-spec-key-size, 12px); font-weight: 600; letter-spacing: var(--hc-spec-key-ls, .6px); text-transform: var(--hc-spec-key-transform, uppercase); color: var(--hc-spec-key-color, var(--helioro-muted)); }
.helioro-spec-grid .gdlr-core-port-info-value{ display: block; overflow: visible; font-family: var(--helioro-font-heading, inherit); font-size: var(--hc-spec-value-size, 22px); font-weight: 600; line-height: 1.15; letter-spacing: -0.4px; color: var(--helioro-ink); }
/* icon in the key ( [gdlr_core_icon icon="…"] typed in the port-info Key ) = 42px white disc, accent glyph; unit = <span class="helioro-unit">kW</span> in the value */
.helioro-spec-grid .gdlr-core-port-info-key > i,
.helioro-spec-grid .gdlr-core-port-info-key .gdlr-core-icon-item{ display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin: 0 0 12px; border-radius: 50%;
	background: var(--helioro-card); color: var(--helioro-accent); font-size: 18px; line-height: 1; }
.helioro-spec-grid .gdlr-core-port-info-key .gdlr-core-icon-item i{ margin: 0; color: inherit; }
.helioro-unit{ margin-left: 4px; font-family: var(--helioro-font-body, inherit); font-size: .6em; font-weight: 600; letter-spacing: 0; color: var(--helioro-accent); }
.helioro-spec-grid .gdlr-core-port-info-value a{ color: inherit; }
.helioro-spec-grid.helioro-spec-3 .gdlr-core-port-info-wrap{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.helioro-cards-engineering .helioro-spec-grid .gdlr-core-port-info{ border-radius: 2px; }
.helioro-cards-engineering .helioro-spec-grid .gdlr-core-port-info-key{ font-family: var(--helioro-font-meta, monospace); }
@media only screen and (max-width: 767px){
	.helioro-spec-grid.helioro-spec-3 .gdlr-core-port-info-wrap{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ===================================================================
 * 15. fw3-timeline — dotted line, sun-dot nodes ( add "helioro-timeline-dots" )
 * =================================================================== */
.helioro-timeline-dots .gdlr-core-timeline-item-divider{ border-left-style: dotted; border-color: var(--helioro-accent); opacity: .6; }
.helioro-timeline-dots .gdlr-core-timeline-item-bullet{ width: 14px; height: 14px; border: 0; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 6px rgba(var(--helioro-accent-rgb), .18); }
.helioro-timeline-dots .gdlr-core-timeline-item-date{ color: var(--helioro-accent-dark); font-weight: 700; }
.helioro-timeline-dots .gdlr-core-timeline-item-content-wrap{ padding: 20px 22px; border-radius: var(--helioro-radius-tile); background: var(--helioro-sand); }

/* ===================================================================
 * 16. WooCommerce — product grid card
 * =================================================================== */
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-grid,
.helioro-cards-bento.woocommerce ul.products li.product,
.helioro-cards-bento .woocommerce ul.products li.product{
	padding: var(--hc-pad); background: var(--hc-bg); border: var(--hc-border-w) solid var(--hc-border-color); border-radius: var(--hc-radius); box-sizing: border-box;
	transition: box-shadow var(--helioro-fast), transform .35s var(--helioro-ease), border-color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-grid:hover,
.helioro-cards-bento.woocommerce ul.products li.product:hover,
.helioro-cards-bento .woocommerce ul.products li.product:hover{ border-color: var(--hc-hover-border); box-shadow: var(--hc-hover-shadow); transform: translateY(var(--hc-hover-lift)); }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-thumbnail,
.helioro-cards-bento.woocommerce ul.products li.product a img,
.helioro-cards-bento .woocommerce ul.products li.product a img{ border-radius: var(--hc-img-radius); overflow: hidden; background: var(--helioro-ground); }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-grid-content-wrap{ padding: var(--hc-body-pad); text-align: left; }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-title{ font-size: 17px; letter-spacing: -0.1px; }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-title a{ color: var(--helioro-ink); }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-price{ font-weight: 700; color: var(--helioro-ink); }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-price del{ color: var(--helioro-muted); font-weight: 400; }
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-thumbnail-info > a,
[class*="helioro-cards-"] .gdlr-core-product-item .gdlr-core-product-thumbnail-info .added_to_cart{ border-radius: var(--hc-chip-radius); }
.helioro-body.woocommerce span.onsale,
.helioro-body .woocommerce span.onsale{ min-width: 0; min-height: 0; padding: 6px 12px; border-radius: var(--helioro-radius-button); background: var(--helioro-accent); font-size: 12px; line-height: 1.2; }
.helioro-body.woocommerce a.button,
.helioro-body.woocommerce button.button,
.helioro-body.woocommerce input.button,
.helioro-body .woocommerce a.button,
.helioro-body .woocommerce button.button{ border-radius: var(--helioro-radius-button); }

/* ===================================================================
 * 17. Testimonial helpers ( add to the fw3-testimonial item )
 * =================================================================== */
.helioro-testimonial-italic .gdlr-core-testimonial-content{ font-style: italic; }
.helioro-testimonial-square .gdlr-core-testimonial-author-image,
.helioro-testimonial-square .gdlr-core-testimonial-author-image img{ border-radius: 2px; }
.helioro-testimonial-square .gdlr-core-flexslider-nav li a{ border-radius: 2px; }

/* ===================================================================
 * 18. Decorative backgrounds & frames ( PixeBuilder wrapper / column CSS class )
 * =================================================================== */
/* graph paper — 24px minor + 120px major lines */
.helioro-bg-grid{
	background-image:
		linear-gradient(rgba(var(--helioro-ink-rgb), .07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(var(--helioro-ink-rgb), .07) 1px, transparent 1px),
		linear-gradient(rgba(var(--helioro-ink-rgb), .035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(var(--helioro-ink-rgb), .035) 1px, transparent 1px);
	background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px; background-position: -1px -1px; }
.helioro-bg-grid-lg{
	background-image: linear-gradient(rgba(var(--helioro-ink-rgb), .07) 1px, transparent 1px), linear-gradient(90deg, rgba(var(--helioro-ink-rgb), .07) 1px, transparent 1px);
	background-size: 96px 96px; background-position: -1px -1px; }
.helioro-bg-grid-dark{
	background-image:
		linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px),
		linear-gradient(rgba(255, 255, 255, .03) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .03) 1px, transparent 1px);
	background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px; background-position: -1px -1px; }
/* dot grid */
.helioro-bg-dots{ background-image: radial-gradient(rgba(var(--helioro-ink-rgb), .18) 1.2px, transparent 1.4px); background-size: 22px 22px; }
.helioro-bg-dots-dark{ background-image: radial-gradient(rgba(255, 255, 255, .16) 1.2px, transparent 1.4px); background-size: 22px 22px; }
.helioro-bg-dots-accent{ background-image: radial-gradient(rgba(var(--helioro-accent-rgb), .35) 1.2px, transparent 1.4px); background-size: 22px 22px; }
/* ruler ticks along the top edge */
.helioro-bg-ruler{
	background-image:
		linear-gradient(90deg, rgba(var(--helioro-ink-rgb), .28) 1px, transparent 1px),
		linear-gradient(90deg, rgba(var(--helioro-ink-rgb), .14) 1px, transparent 1px);
	background-size: 80px 14px, 8px 7px; background-repeat: repeat-x; background-position: 0 0, 0 0; }
.helioro-bg-ruler-dark{
	background-image: linear-gradient(90deg, rgba(255, 255, 255, .3) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .14) 1px, transparent 1px);
	background-size: 80px 14px, 8px 7px; background-repeat: repeat-x; }
/* fade the pattern out towards the bottom */
.helioro-bg-fade{ -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
/* glows */
.helioro-glow{ box-shadow: 0 0 0 1px rgba(var(--helioro-accent-rgb), .25), 0 18px 60px -12px rgba(var(--helioro-accent-rgb), .45); }
.helioro-glow-radial{ background-image: radial-gradient(60% 55% at 70% 20%, rgba(var(--helioro-accent-rgb), .28), transparent 70%); }
.helioro-glow-radial-left{ background-image: radial-gradient(55% 60% at 15% 80%, rgba(var(--helioro-accent-rgb), .24), transparent 70%); }
/* stripes ( gantt bars ) */
.helioro-bg-stripes{ background-image: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .28) 0 6px, transparent 6px 12px); }
/* dotted "your part" box */
.helioro-dotted-box{ border: 2px dotted rgba(var(--helioro-accent-rgb), .55); border-radius: var(--helioro-radius-card); }
.helioro-dashed-box{ border: 1.5px dashed var(--helioro-line); border-radius: var(--helioro-radius-card); }
/* hairline frame */
.helioro-hairline{ border: 1px solid var(--helioro-line); }
.helioro-hairline-top{ border-top: 1px solid var(--helioro-line); }
/* radius helpers */
.helioro-radius-card{ border-radius: var(--helioro-radius-card); overflow: hidden; }
.helioro-radius-tile{ border-radius: var(--helioro-radius-tile); overflow: hidden; }
.helioro-radius-tl{ border-top-left-radius: 120px !important; overflow: hidden; }
.helioro-radius-top{ border-radius: var(--helioro-radius-footer) var(--helioro-radius-footer) 0 0; }
@media only screen and (max-width: 767px){ .helioro-radius-tl{ border-top-left-radius: 64px !important; } .helioro-radius-top{ border-radius: 28px 28px 0 0; } }
/* sun arc: partial accent border on the top-left quarter */
.helioro-sun-arc{ position: relative; }
.helioro-sun-arc:before{ content: ""; position: absolute; left: -40px; top: -40px; width: 320px; height: 320px; border: 1px solid rgba(var(--helioro-accent-rgb), .55); border-radius: 50%;
	-webkit-mask-image: linear-gradient(135deg, #000 35%, transparent 55%); mask-image: linear-gradient(135deg, #000 35%, transparent 55%); pointer-events: none; z-index: 0; }
/* shadows */
.helioro-shadow{ box-shadow: 0 24px 48px -20px rgba(var(--helioro-ink-rgb), .28); }
.helioro-shadow-soft{ box-shadow: 0 12px 32px -16px rgba(var(--helioro-ink-rgb), .2); }
/* sticky column ( FAQ topic list ) — desktop only */
@media only screen and (min-width: 1000px){
	.helioro-sticky,
	.helioro-body .pixe-column.helioro-sticky,
	.helioro-body .pixe-item.helioro-sticky{ position: -webkit-sticky; position: sticky; top: var(--helioro-sticky-top, 96px); align-self: flex-start; }
}
/* active row in a custom menu / topic list */
.helioro-topic-list a{ display: block; padding: 12px 18px; border-radius: var(--helioro-radius-button); color: var(--helioro-ink); transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-topic-list a:hover,
.helioro-topic-list .current-menu-item > a,
.helioro-topic-list .helioro-active{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
/* map placeholder tile */
.helioro-map-tile,
.helioro-map-tile iframe,
.helioro-map-tile .pixe-map{ border-radius: var(--helioro-radius-card); overflow: hidden; }
.helioro-map-muted iframe,
.helioro-map-muted .pixe-map{ filter: grayscale(1) contrast(.92) brightness(1.04); }
.helioro-map-dark iframe,
.helioro-map-dark .pixe-map{ filter: grayscale(1) invert(.92) hue-rotate(180deg) contrast(.9); }

/* ===================================================================
 * 19. One-page helpers — smooth scroll ( any wrapper with "helioro-onepage" ) + anchor offset under the sticky header
 * =================================================================== */
@media (prefers-reduced-motion: no-preference){
	html:has(.helioro-onepage){ scroll-behavior: smooth; }
}
.helioro-body .pixe-wrapper[id],
.helioro-body .gdlr-core-pbf-wrapper[id],
.helioro-anchor{ scroll-margin-top: 110px; }
@media only screen and (max-width: 999px){
	.helioro-body .pixe-wrapper[id],
	.helioro-body .gdlr-core-pbf-wrapper[id],
	.helioro-anchor{ scroll-margin-top: 80px; }
}

/* ===================================================================
 * 20. Dark sections — add "helioro-on-dark" to a PixeBuilder wrapper with a dark background
 *     ( re-points the line / card / ground tokens; keep it after the variant token sets )
 * =================================================================== */
.helioro-on-dark{
	--helioro-line: rgba(255, 255, 255, .16);
	--helioro-card: rgba(255, 255, 255, .04);
	--helioro-ground: rgba(255, 255, 255, .06);
	--helioro-muted: rgba(255, 255, 255, .64);
	--helioro-text: rgba(255, 255, 255, .78);
	--ha-active-border: rgba(255, 255, 255, .5);
	--ha-icon-bg: transparent;
	--ha-icon-border: rgba(255, 255, 255, .16);
	--ha-icon-color: #ffffff;
	--hc-arrow-bg: rgba(255, 255, 255, .1);
	--hc-chip-bg: rgba(255, 255, 255, .92);
	--hc-chip-color: var(--helioro-ink);
}
.helioro-on-dark .gdlr-core-accordion-item-title,
.helioro-on-dark .gdlr-core-toggle-box-item-title,
.helioro-on-dark .gdlr-core-portfolio-title a,
.helioro-on-dark .gdlr-core-blog-title a,
.helioro-on-dark .gdlr-core-personnel-list-title a,
.helioro-on-dark .gdlr-core-accordion-item-title:after,
.helioro-on-dark .gdlr-core-toggle-box-item-title:after,
.helioro-on-dark .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer,
.helioro-on-dark .gdlr-core-pagination a,
.helioro-on-dark .helioro-table thead td,
.helioro-on-dark .helioro-table thead th{ color: #ffffff; }
.helioro-on-dark .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer.gdlr-core-active,
.helioro-on-dark .gdlr-core-pagination a.gdlr-core-active,
.helioro-on-dark .gdlr-core-pagination span.current{ background: #ffffff; border-color: #ffffff; color: var(--helioro-ink); }

/* ===================================================================
 * 21. Bento squeeze 1000–1199px — opt-in classes for PixeBuilder FREE ( it has no breakpoint between desktop and ≤999 ).
 *     Put the classes in Advanced > CSS Class Selector. Placement per page: build/<demo>/BENTO-CLASSES.md.
 *       helioro-bento        wrapper   big type steps down ( h1 / display .78, stat .8, h2 .85, h3 .87, quote .9 ) and enables the classes below
 *       helioro-bento-stack  column    takes the full row ( side gutters dropped, 16px gap above when it follows another column )
 *       helioro-bento-wide   column    takes half a row ( two in a row after a stack column line up on the rail )
 *       helioro-bento-tall   column    min-height 350px, so absolutely placed chips / icons clear the text below them
 *       helioro-bento-drop   item      absolutely placed chip moves under the first chip row ( top 76px, left 40px )
 *       helioro-bento-hide   item / column  hidden in this range
 *       helioro-nowrap-num   item / column / wrapper  stat / display numbers never break, fluid size 30px → 4.2vw → 50px
 *       helioro-bento-even   column    staircase tiles reset to one even height ( 440px, offsets removed )
 *       helioro-nowrap       item      short unit labels ( "per kWh, fixed" ) never wrap in this range; words never split at any width
 *     Gutter nodes marked "hide on tablet" inside a stack / wide column are hidden automatically ( the junction they mark is gone ).
 *     Autoptimize note: never write a CSS function name followed by "(" ( c-a-l-c, m-i-n, m-a-x, c-l-a-m-p ) inside a comment in this file.
 *     AO hides those functions behind markers with a regex that runs before comments are stripped; inside a comment the match runs past
 *     the comment end and the whole next block is lost ( this section was dropped that way ). The theme also excludes this file from AO
 *     ( helioro_ao_exclude_kit in include/function-regist.php ).
 * =================================================================== */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-body .helioro-bento [data-typo-preset="h1"],
	.helioro-body .helioro-bento [data-typo-preset="display"]{ zoom: .78; }
	.helioro-body .helioro-bento [data-typo-preset="stat"]{ zoom: .8; }
	.helioro-body .helioro-bento [data-typo-preset="h2"]{ zoom: .85; }
	.helioro-body .helioro-bento [data-typo-preset="h3"]{ zoom: .87; }
	.helioro-body .helioro-bento [data-typo-preset="quote"]{ zoom: .9; }

	.helioro-body .helioro-bento .pixe-column.helioro-bento-stack{ width: 100%; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-wide{ width: 50%; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-stack > .pixe-column-content{ margin-left: 0; margin-right: 0; }
	.helioro-body .helioro-bento .pixe-column ~ .pixe-column.helioro-bento-stack > .pixe-column-content,
	.helioro-body .helioro-bento .pixe-column ~ .pixe-column.helioro-bento-wide > .pixe-column-content{ margin-top: var(--hb-gap, 16px); }
	.helioro-body .helioro-bento .helioro-bento-stack + .helioro-bento-wide > .pixe-column-content{ margin-left: 0; margin-right: var(--hb-gutter, 8px); }
	.helioro-body .helioro-bento .helioro-bento-wide + .helioro-bento-wide > .pixe-column-content{ margin-left: var(--hb-gutter, 8px); margin-right: 0; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-tall{ min-height: 350px; }
	.helioro-body .helioro-bento .pixe-item.helioro-bento-drop{ top: 76px; right: auto; left: 40px; }
	.helioro-body .helioro-bento .helioro-bento-hide,
	.helioro-body .helioro-bento .helioro-bento-stack .pixe-hide-tablet,
	.helioro-body .helioro-bento .helioro-bento-wide .pixe-hide-tablet{ display: none !important; }

	.helioro-body .helioro-bento .pixe-column.helioro-bento-even{ min-height: 0; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-even > .pixe-column-content{ margin-top: 16px !important; min-height: 440px; }
	.helioro-body .helioro-bento .pixe-item + .pixe-column.helioro-bento-even > .pixe-column-content,
	.helioro-body .helioro-bento .pixe-item + .pixe-column.helioro-bento-even + .pixe-column.helioro-bento-even > .pixe-column-content{ margin-top: 36px !important; }
	.helioro-body .helioro-nowrap,
	.helioro-body .helioro-nowrap .pixe-inline{ white-space: nowrap; }

	.helioro-body .helioro-nowrap-num [data-typo-preset="stat"],
	.helioro-body .helioro-nowrap-num [data-typo-preset="display"],
	.helioro-body .pixe-item.helioro-nowrap-num .pixe-inline{ zoom: 1; font-size: clamp(30px, 4.2vw, 50px); white-space: nowrap; }
}

/* ===================================================================
 * 22. Inner pages ( Helioro main P01–P14 ): tablet grids, personnel card, filter bar, pagination, featured blog row,
 *     single post, archive title, CF7 extras, bento extras. Options: General > Helioro Style / Helioro Blog.
 * =================================================================== */
:root{
	--helioro-ico-quote: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M4 18.5v-5.6C4 8.6 6.4 5.8 10.2 5l.8 1.7C8.9 7.5 7.8 9 7.6 11H10v7.5zm9.5 0v-5.6c0-4.3 2.4-7.1 6.2-7.9l.8 1.7c-2.1.8-3.2 2.3-3.4 4.3h2.4v7.5z'/%3E%3C/svg%3E");
	--helioro-ico-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M18.24 2.25h3.31l-7.23 8.26 8.5 11.24h-6.65l-5.21-6.82-5.97 6.82H1.68l7.73-8.84L1.25 2.25h6.83l4.71 6.23zm-1.16 17.52h1.83L7.08 4.13H5.12z'/%3E%3C/svg%3E");
}
.helioro-body{ --helioro-wide-rail: 40px; }
@media only screen and (max-width: 999px){ .helioro-body{ --helioro-wide-rail: 30px; } }
@media only screen and (max-width: 767px){ .helioro-body{ --helioro-wide-rail: 20px; } }

/* 22.1 card grids — 2 columns at 768–999 ( fw3-portfolio / fw3-blog / fw3-personnel keep one Column Size for every width ) */
@media only screen and (min-width: 768px) and (max-width: 999px){
	[class*="helioro-cards-"] .gdlr-core-portfolio-item-holder > .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10),
	[class*="helioro-cards-"] .gdlr-core-blog-item-holder > .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10),
	[class*="helioro-cards-"] .gdlr-core-personnel-item-holder > .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10){ width: 50%; clear: none; }
	[class*="helioro-cards-"] .gdlr-core-portfolio-item-holder > .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10):nth-child(2n+1),
	[class*="helioro-cards-"] .gdlr-core-blog-item-holder > .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10):nth-child(2n+1),
	[class*="helioro-cards-"] .gdlr-core-personnel-item-holder > .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10):nth-child(2n+1){ clear: left; }
	/* "helioro-tablet-row" on the PXB item around fw3-portfolio / fw3-blog: one horizontal card per row instead ( related case studies ) */
	.helioro-body .helioro-tablet-row .gdlr-core-item-list:is(.gdlr-core-column-20, .gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10){ width: 100%; clear: both; }
	.helioro-body .helioro-tablet-row .gdlr-core-portfolio-grid,
	.helioro-body .helioro-tablet-row .gdlr-core-blog-grid{ flex-direction: row; align-items: stretch; }
	.helioro-body .helioro-tablet-row .gdlr-core-portfolio-thumbnail,
	.helioro-body .helioro-tablet-row .gdlr-core-blog-thumbnail{ flex: 0 0 44%; }
	.helioro-body .helioro-tablet-row .gdlr-core-portfolio-thumbnail img,
	.helioro-body .helioro-tablet-row .gdlr-core-blog-thumbnail img{ height: 100%; min-height: 220px; aspect-ratio: auto; object-fit: cover; }
	.helioro-body .helioro-tablet-row .gdlr-core-portfolio-content-wrap,
	.helioro-body .helioro-tablet-row .gdlr-core-blog-grid-content-wrap{ padding: 20px 14px 4px 24px; }
	.helioro-body .helioro-tablet-row .gdlr-core-portfolio-badge{ margin-top: 0; }
}

/* 22.2 fw3-personnel Grid ( P06 ): square photo, category chip on the photo, chips row, one-line excerpt with 38px filled social discs beside it.
   Chips: type them in the personnel Excerpt as <p class="helioro-person-chips"><span class="helioro-chip">9 yrs at Helioro</span><span class="helioro-chip">NABCEP PV</span></p><p>One line…</p> */
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list{ position: relative; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-image img{ display: block; width: 100%; height: auto; aspect-ratio: var(--hc-person-ratio, auto); object-fit: cover; }
.helioro-personnel-category{ position: absolute; z-index: 2; top: calc(var(--hc-pad, 0px) + 12px); left: calc(var(--hc-pad, 0px) + 12px); display: inline-flex; align-items: center; gap: 8px;
	padding: 7px 14px 7px 7px; border-radius: var(--hc-chip-radius, 999px); background: var(--hc-chip-bg, #ffffff); color: var(--hc-chip-color, var(--helioro-ink));
	font-size: 13px; font-weight: 600; line-height: 1; letter-spacing: .1px; white-space: nowrap; }
.helioro-personnel-category:before{ content: ""; width: 8px; height: 8px; margin-left: 5px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap{ position: static; display: flex; flex-wrap: wrap; align-items: center; column-gap: 12px; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > *{ flex: 0 0 100%; min-width: 0; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > .gdlr-core-personnel-list-title{ order: 0; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > .gdlr-core-personnel-list-position{ order: 1; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > .gdlr-core-personnel-list-divider{ order: 3; margin: 16px 0 14px; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content{ display: contents; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content > *{ order: 4; flex: 1 1 0; min-width: 0; margin: 0; padding: 0; font-size: 14px; line-height: 1.5; color: var(--helioro-muted); }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content > .helioro-person-chips{ order: 2; flex: 0 0 100%; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > .gdlr-core-personnel-list-social{ order: 5; flex: 0 0 auto; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-social .gdlr-core-social-network-item{ display: flex !important; gap: 6px; }
[class*="helioro-cards-"] .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-social .gdlr-core-social-network-icon{ margin: 0; }
.gdlr-core-personnel-list .helioro-chip{ padding: 6px 11px; border: 0; background: var(--helioro-ground); color: var(--helioro-ink); font-size: 12px; font-weight: 600; }

/* 22.3 filter chips ( Filterer: Button ) — bento: white chips in a sand bar; phones: one row that scrolls sideways */
.helioro-cards-bento .gdlr-core-filterer-wrap.gdlr-core-style-button{ box-sizing: border-box; width: fit-content; max-width: calc(100% - 2 * var(--hc-filter-inset, 8px)); margin-left: var(--hc-filter-inset, 8px); margin-right: var(--hc-filter-inset, 8px);
	padding: 10px; border-radius: calc(var(--helioro-radius-card) + 8px); background: var(--hc-filter-bar); }
.helioro-cards-bento .gdlr-core-filterer-wrap.gdlr-core-style-button.gdlr-core-center-align{ margin-left: auto; margin-right: auto; }
.helioro-cards-bento .gdlr-core-filterer-wrap.gdlr-core-style-button.gdlr-core-right-align{ margin-left: auto; }
.helioro-cards-bento .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer{ border-color: transparent; background: var(--hc-filter-chip-bg); }
.helioro-cards-bento .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer:not(.gdlr-core-active):hover{ background: var(--helioro-accent-soft); border-color: var(--helioro-accent-soft); color: var(--helioro-accent-dark); }
.helioro-cards-bento .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer.gdlr-core-active{ background: var(--helioro-ink); border-color: var(--helioro-ink); }
@media only screen and (max-width: 767px){
	[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button{ flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
	[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button::-webkit-scrollbar{ display: none; }
	[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer{ flex-shrink: 0; white-space: nowrap; }
}
/* portfolio tag list separator " / " → " · " */
[class*="helioro-cards-"] .gdlr-core-portfolio-item .gdlr-core-portfolio-info-tag .gdlr-core-sep{ font-size: 0; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item .gdlr-core-portfolio-info-tag .gdlr-core-sep:before{ content: "\00b7"; margin: 0 4px 0 1px; font-size: 13px; }

/* 22.4 pagination — bento: 48px white pills, 40px under the cards */
.helioro-cards-bento .gdlr-core-pagination{ margin-top: 22px; }
.helioro-cards-bento .gdlr-core-pagination a,
.helioro-cards-bento .gdlr-core-pagination span{ min-width: var(--hc-page-size); height: var(--hc-page-size); border-color: transparent; background: var(--hc-page-bg); }
.helioro-cards-bento .gdlr-core-pagination a:hover{ border-color: var(--helioro-ink); background: var(--helioro-ink); color: #ffffff; }
.helioro-cards-bento .gdlr-core-pagination a.gdlr-core-active,
.helioro-cards-bento .gdlr-core-pagination span.current{ background: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
.helioro-cards-bento .gdlr-core-pagination span.dots{ background: transparent; }

/* 22.5 fw3-blog Left Thumbnail ( featured row, P11 ): category as the sun-dot chip on the photo, ink pill read more,
   photo stacks above the text at 768–999, title 28px on phones */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-thumbnail{ position: relative; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category{ position: absolute; top: 12px; left: 12px; right: auto; bottom: auto; z-index: 2;
	display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 7px 14px 7px 7px; border-radius: var(--hc-chip-radius); background: var(--hc-chip-bg); color: var(--hc-chip-color);
	font-size: 13px; font-weight: 600; line-height: 1; letter-spacing: .1px; text-transform: none; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category:before{ content: ""; width: 8px; height: 8px; margin-left: 5px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a{ color: inherit; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-medium-content-wrapper{ padding: 24px 28px 24px 12px; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-excerpt-read-more{ display: inline-flex; align-items: center; gap: 10px; margin-top: 26px; padding: 14px 22px;
	border: 0; border-radius: var(--helioro-radius-button); background: var(--helioro-ink); color: #ffffff; font-size: 15px; font-weight: 600; line-height: 1.2; letter-spacing: 0; text-transform: none; transition: background-color var(--helioro-fast); }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-excerpt-read-more:hover{ background: var(--helioro-accent-dark); color: #ffffff; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-excerpt-read-more i{ width: 13px; height: 13px; margin: 0; font-size: 0; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-excerpt-read-more i:before{ content: none; }
@media only screen and (min-width: 768px) and (max-width: 999px){
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium,
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium > div,
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium > div.clearfix{ display: block; }
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-thumbnail-wrap{ width: 100%; padding: 0; margin-bottom: 0; }
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-medium-content-wrapper{ padding: 22px 16px 12px; }
}
@media only screen and (max-width: 767px){
	[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-title{ font-size: 28px !important; line-height: 1.12; }
	.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-medium .gdlr-core-blog-medium-content-wrapper{ padding: 18px 10px 10px; }
}

/* 22.6 single post title ( Title Style 4 ): breadcrumb pill + category chip, excerpt, icon meta with author photo, width + size ramp */
.helioro-single-title-top{ display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 22px; }
.helioro-single-blog-title-style-4 .helioro-single-title-top{ justify-content: center; }
.helioro-kit-breadcrumb{ display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 15px; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-button);
	background: var(--helioro-card); font-size: 13px; font-weight: 600; line-height: 1.2; color: var(--helioro-muted); }
.helioro-kit-breadcrumb a{ color: var(--helioro-ink); transition: color var(--helioro-fast); }
.helioro-kit-breadcrumb a:hover{ color: var(--helioro-accent-dark); }
.helioro-breadcrumb-sep{ display: inline-block; width: 12px; height: 12px; background-color: currentColor; opacity: .6;
	-webkit-mask: var(--helioro-ico-chevron-right) center / contain no-repeat; mask: var(--helioro-ico-chevron-right) center / contain no-repeat; }
.helioro-single-category-chip{ display: inline-flex; align-items: center; gap: 8px; padding: 8px 15px 8px 10px; border-radius: var(--helioro-radius-button); background: var(--helioro-accent);
	color: var(--helioro-on-accent); font-size: 13px; font-weight: 600; line-height: 1.2; transition: background-color var(--helioro-fast); }
.helioro-single-category-chip:before{ content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ffffff; box-shadow: 0 0 0 4px rgba(255, 255, 255, .25); }
.helioro-single-category-chip:hover{ background: var(--helioro-accent-dark); color: #ffffff; }
.helioro-single-article-excerpt{ max-width: 720px; margin-top: 18px; font-size: 19px; line-height: 1.6; color: var(--helioro-text); }
.helioro-single-blog-title-style-4 .helioro-single-article-excerpt{ margin-left: auto; margin-right: auto; }
.helioro-blog-title-wrap .helioro-single-article-title{ max-width: var(--helioro-blog-title-max, 960px); }
.helioro-blog-title-wrap .helioro-single-blog-title-style-4 .helioro-single-article-title{ margin-left: auto; margin-right: auto; }
.helioro-title-meta-icons .helioro-single-article-head .helioro-blog-info-wrapper .helioro-blog-info .helioro-head{ display: inline-block; margin-right: 7px; color: var(--helioro-accent); }
.helioro-title-meta-icons .helioro-single-article-head .helioro-blog-info-wrapper .helioro-blog-info-author:has(.helioro-blog-info-avatar) .helioro-head{ display: none; }
.helioro-blog-info-avatar img{ display: inline-block; width: 28px; height: 28px; margin-right: 8px; border-radius: 50%; vertical-align: middle; object-fit: cover; }
@media only screen and (max-width: 999px){
	.helioro-body .helioro-blog-title-wrap .helioro-single-article-title{ font-size: var(--helioro-blog-title-tablet, 48px); }
}
@media only screen and (max-width: 767px){
	.helioro-body .helioro-blog-title-wrap .helioro-single-article-title{ font-size: var(--helioro-blog-title-mobile, 36px); }
	.helioro-single-article-excerpt{ font-size: 17px; }
}

/* 22.7 wide featured image + caption ( General > Helioro Blog > Wide Featured Image ) */
.helioro-single-wide-thumb .helioro-single-article .helioro-single-article-thumbnail{ --helioro-wide: min(1280px, calc(100vw - 2 * var(--helioro-wide-rail))); width: var(--helioro-wide); max-width: none; margin-left: calc(50% - var(--helioro-wide) / 2); }
.helioro-single-wide-thumb .helioro-single-article .helioro-single-article-thumbnail img{ display: block; width: 100%; aspect-ratio: 32 / 15; object-fit: cover; border-radius: calc(var(--helioro-radius-card) + 4px); }
.helioro-single-article-thumbnail-caption{ margin: 12px 0 40px; font-size: 13px; line-height: 1.5; color: var(--helioro-muted); text-align: center; }
@media only screen and (max-width: 767px){
	.helioro-single-wide-thumb .helioro-single-article .helioro-single-article-thumbnail img{ aspect-ratio: 4 / 3; border-radius: var(--helioro-radius-card); }
	.helioro-single-article-thumbnail-caption{ margin-bottom: 28px; }
}

/* 22.8 post content: pull quote tile, TOC tile ( class helioro-toc on a Group block ), stat tile ( class helioro-stat-tile on a Columns / Group block ) */
.helioro-single-article-content blockquote,
.helioro-single-article-content .wp-block-quote,
.helioro-single-article-content .wp-block-pullquote{ position: relative; margin: 40px 0; padding: 34px 36px 34px 100px; border: 0; border-radius: calc(var(--helioro-radius-card) + 4px);
	background: var(--helioro-accent-soft); font-size: 24px; font-weight: 600; line-height: 1.3; letter-spacing: -0.3px; color: var(--helioro-ink); }
.helioro-single-article-content blockquote:before,
.helioro-single-article-content .wp-block-quote:before{ content: ""; position: absolute; left: 36px; top: 34px; width: 44px; height: 44px; border-radius: 50%;
	background: var(--helioro-accent) var(--helioro-ico-quote) center / 0 0 no-repeat; }
.helioro-single-article-content blockquote:after,
.helioro-single-article-content .wp-block-quote:after{ content: ""; position: absolute; left: 49px; top: 47px; width: 18px; height: 18px; background-color: #ffffff;
	-webkit-mask: var(--helioro-ico-quote) center / contain no-repeat; mask: var(--helioro-ico-quote) center / contain no-repeat; }
.helioro-single-article-content blockquote cite,
.helioro-single-article-content .wp-block-quote cite{ display: block; margin-top: 16px; font-size: 14px; font-weight: 600; font-style: normal; letter-spacing: 0; color: var(--helioro-accent-dark); }
@media only screen and (max-width: 767px){
	.helioro-single-article-content blockquote,
	.helioro-single-article-content .wp-block-quote,
	.helioro-single-article-content .wp-block-pullquote{ padding: 84px 22px 26px; font-size: 20px; }
	.helioro-single-article-content blockquote:before,
	.helioro-single-article-content .wp-block-quote:before{ left: 22px; top: 24px; }
	.helioro-single-article-content blockquote:after,
	.helioro-single-article-content .wp-block-quote:after{ left: 35px; top: 37px; }
}
.helioro-toc{ margin: 32px 0; padding: 24px 28px 12px; border-radius: calc(var(--helioro-radius-card) + 4px); background: var(--helioro-sand); color: var(--helioro-ink); }
.helioro-single-article-content .helioro-toc ol,
.helioro-single-article-content .helioro-toc ul{ margin: 0; }
.helioro-single-article-content .helioro-toc ol > li,
.helioro-single-article-content .helioro-toc ul > li{ margin: 0; padding-top: 12px; padding-bottom: 12px; border-top: 2px dotted rgba(var(--helioro-ink-rgb), .18); font-size: 16px; font-weight: 600; }
.helioro-single-article-content .helioro-toc ol > li:first-child,
.helioro-single-article-content .helioro-toc ul > li:first-child{ border-top: 0; }
.helioro-single-article-content .helioro-toc ol > li:before{ top: 12px; }
.helioro-single-article-content .helioro-toc ul > li:before{ top: calc(12px + .72em); }
.helioro-toc a{ color: var(--helioro-ink); transition: color var(--helioro-fast); }
.helioro-toc a:hover{ color: var(--helioro-accent-dark); }
.helioro-stat-tile{ margin: 28px 0; padding: 28px 32px; border-radius: calc(var(--helioro-radius-card) + 4px); background: var(--helioro-ink); color: rgba(255, 255, 255, .72); }
.helioro-stat-tile h1, .helioro-stat-tile h2, .helioro-stat-tile h3, .helioro-stat-tile h4{ margin: 0; color: #ffffff; }
.helioro-stat-tile.wp-block-columns > .wp-block-column + .wp-block-column,
.helioro-stat-tile > .wp-block-group__inner-container > * + *{ padding-left: 24px; border-left: 2px dotted rgba(255, 255, 255, .18); }
@media only screen and (max-width: 781px){
	.helioro-stat-tile.wp-block-columns > .wp-block-column + .wp-block-column{ padding-left: 0; padding-top: 18px; border-left: 0; border-top: 2px dotted rgba(255, 255, 255, .18); }
}

/* 22.9 tags, share, author box, related posts, comments */
.helioro-blog-style-5.helioro-body .helioro-single-magazine-author-tags a,
.helioro-body .helioro-single-magazine-author-tags a{ padding: 7px 14px; border: 1px solid transparent; border-radius: var(--helioro-radius-button); background: var(--helioro-card); font-size: 13px; font-weight: 600; color: var(--helioro-ink); }
.helioro-blog-style-5.helioro-body .helioro-single-magazine-author-tags a:hover,
.helioro-body .helioro-single-magazine-author-tags a:hover{ border-color: var(--helioro-accent); color: var(--helioro-accent-dark); }
.helioro-body .helioro-single-magazine-author-tags i{ margin-right: 10px; font-size: 16px; color: var(--helioro-muted); }
[class*="helioro-social-"] .helioro-single-social-share .gdlr-core-social-share-item a{ width: 40px; height: 40px; padding: 0; border-color: transparent; background-color: var(--helioro-card); font-size: 15px; }
[class*="helioro-social-"] .helioro-single-social-share .gdlr-core-social-share-item a:hover{ background-color: var(--helioro-ink); border-color: var(--helioro-ink); color: #ffffff; }
/* X ( twitter ) glyph: the share element prints an fa6 class whose font is not loaded */
.helioro-body .gdlr-core-social-share-item i.fa6-x-twitter,
.helioro-body .gdlr-core-social-network-item i.fa6-x-twitter{ display: inline-block; width: 14px; height: 14px; font-size: 0; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-x) center / contain no-repeat; mask: var(--helioro-ico-x) center / contain no-repeat; }
.helioro-body .gdlr-core-social-share-item i.fa6-x-twitter:before,
.helioro-body .gdlr-core-social-network-item i.fa6-x-twitter:before{ content: none; }
/* author box: no shadow frame ( style 5 ), hairline on top, square r16 photo */
.helioro-body .helioro-single-author{ margin-bottom: 56px; padding: 0; border: 0; box-shadow: none; }
.helioro-body .helioro-single-author .helioro-single-author-wrap{ padding: 28px 0 0; border-top: 1px solid var(--helioro-line); border-radius: 0; background: transparent; }
.helioro-body .helioro-single-author .helioro-single-author-avartar{ float: none; width: 96px; height: 96px; max-width: none; margin: 0; border-radius: var(--helioro-radius-tile); }
.helioro-body .helioro-single-author .helioro-single-author-avartar img{ width: 96px; height: 96px; border-radius: var(--helioro-radius-tile); object-fit: cover; }
.helioro-body .helioro-single-author .helioro-single-author-title{ margin-bottom: 10px; font-size: 22px; }
/* related posts: bento cards ( the holder sits in .gdlr-core-blog-item.helioro-related-blog-item ), heading row with caption + button, wide */
.helioro-single-related-post-head{ display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 24px; margin-bottom: 28px; }
.helioro-single-related-post-head .helioro-single-related-post-title{ margin: 0; font-size: 44px; line-height: 1.05; letter-spacing: -1px; }
.helioro-single-related-post-caption{ display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 7px 14px 7px 9px; border-radius: var(--helioro-radius-button); background: var(--helioro-card);
	font-size: 13px; font-weight: 600; line-height: 1; color: var(--helioro-ink); }
.helioro-single-related-post-caption:before{ content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); }
.helioro-single-related-post-button{ display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px; border: 1px solid var(--helioro-ink); border-radius: var(--helioro-radius-button);
	font-size: 15px; font-weight: 600; line-height: 1.2; color: var(--helioro-ink); transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-single-related-post-button:after{ content: ""; width: 13px; height: 13px; background-color: currentColor; -webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; }
.helioro-single-related-post-button:hover{ background: var(--helioro-ink); color: #ffffff; }
.helioro-single-wide-related .helioro-single-related-post-wrap{ --helioro-wide: min(1280px, calc(100vw - 2 * var(--helioro-wide-rail))); width: calc(var(--helioro-wide) + 16px); max-width: none;
	margin-left: calc(50% - var(--helioro-wide) / 2 - 8px); margin-right: 0; }
.helioro-related-blog-item .gdlr-core-blog-grid .gdlr-core-blog-title{ font-size: 23px !important; }
@media only screen and (max-width: 767px){
	.helioro-single-related-post-head .helioro-single-related-post-title{ font-size: 32px; }
	.helioro-related-blog-item .gdlr-core-blog-grid .gdlr-core-blog-title{ font-size: 21px !important; }
}
/* comments: white bodies on the ground page, 44px avatars, author badge, ink submit */
.helioro-body .helioro-comments-area .comment-body{ background: var(--helioro-card); }
.helioro-body .helioro-comments-area .comment-avatar{ width: 44px; }
.helioro-body .helioro-comments-area .comment-avatar img{ width: 44px; height: 44px; object-fit: cover; }
.helioro-comment-author-badge{ display: inline-block; margin-left: 10px; padding: 4px 10px; border-radius: var(--helioro-radius-button); background: var(--helioro-accent-soft);
	font-family: var(--helioro-font-body, inherit); font-size: 12px; font-weight: 600; line-height: 1.2; letter-spacing: 0; text-transform: none; color: var(--helioro-accent-dark); vertical-align: 2px; }
[class*="helioro-form-"] .helioro-comments-area .form-submit input[type="submit"]{ background: var(--hf-btn-bg); color: var(--hf-btn-color); border: 0; transition: background-color var(--helioro-fast); }
[class*="helioro-form-"] .helioro-comments-area .form-submit input[type="submit"]:hover{ background: var(--hf-btn-hover-bg); color: var(--hf-btn-hover-color, #ffffff); }

/* 22.10 widget area under the post ( Appearance > Widgets > Single Post Bottom ) + short CTA row markup for a Custom HTML widget:
   <div class="helioro-cta-row"><div class="helioro-cta-main"><h3>Get your own number.</h3><p>…</p><a class="helioro-cta-button" href="/contact/">Get My Estimate</a></div>
   <div class="helioro-cta-side"><h4>Rather talk to a person?</h4><a class="helioro-chip" href="tel:…">…</a></div></div> */
.helioro-single-post-bottom{ padding-top: 24px; padding-bottom: 96px; }
.helioro-single-post-bottom .helioro-single-post-bottom-widget + .helioro-single-post-bottom-widget{ margin-top: 16px; }
.helioro-cta-row{ display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 16px; }
.helioro-cta-main,
.helioro-cta-side{ box-sizing: border-box; padding: 48px; border-radius: calc(var(--helioro-radius-card) + 8px); }
.helioro-cta-main{ background: var(--helioro-accent); color: color-mix(in srgb, var(--helioro-on-accent) 86%, transparent); }
.helioro-cta-main h2,
.helioro-cta-main h3{ margin-bottom: 14px; font-size: 48px; line-height: 1.02; letter-spacing: -1.2px; color: var(--helioro-on-accent); }
.helioro-cta-side{ display: flex; flex-direction: column; align-items: flex-start; gap: 10px; background: var(--helioro-sand); color: var(--helioro-text); }
.helioro-cta-side h3,
.helioro-cta-side h4{ margin-bottom: 8px; font-size: 26px; line-height: 1.12; color: var(--helioro-ink); }
.helioro-cta-side .helioro-chip{ background: var(--helioro-card); border-color: transparent; color: var(--helioro-ink); }
.helioro-cta-button{ display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; padding: 14px 24px; border-radius: var(--helioro-radius-button); background: #ffffff;
	font-size: 15px; font-weight: 600; line-height: 1.2; color: var(--helioro-ink); transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-cta-button:after{ content: ""; width: 13px; height: 13px; background-color: currentColor; -webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; }
.helioro-cta-button:hover{ background: var(--helioro-ink); color: #ffffff; }
@media only screen and (max-width: 999px){ .helioro-cta-row{ grid-template-columns: minmax(0, 1fr); } }
@media only screen and (max-width: 767px){
	.helioro-single-post-bottom{ padding-bottom: 64px; }
	.helioro-cta-main,
	.helioro-cta-side{ padding: 28px 24px; }
	.helioro-cta-main h2,
	.helioro-cta-main h3{ font-size: 34px; }
}

/* 22.11 archive / search page title ( General > Helioro Style > Archive Page Title Style: plain ): ground, no photo / overlay,
   the small "Category" title becomes a sun-dot chip and the term name ( caption ) the big heading — 64 / 48 / 36px */
body.helioro-archive-title-plain .helioro-page-title-wrap{ background-image: none; background-color: var(--helioro-ground); }
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title-overlay,
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title-top-gradient,
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title-bottom-gradient{ display: none; }
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title-content{ padding-top: 72px; padding-bottom: 40px; }
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title{ display: inline-flex; align-items: center; gap: 8px; margin: 0 0 18px; padding: 7px 14px 7px 9px;
	border-radius: var(--helioro-radius-button); background: var(--helioro-card); font-family: var(--helioro-font-body, inherit); font-size: 13px; font-weight: 600; line-height: 1;
	letter-spacing: 0; text-transform: none; color: var(--helioro-ink); }
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title:before{ content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--helioro-accent); box-shadow: 0 0 0 5px rgba(var(--helioro-accent-rgb), .18); }
body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-caption{ margin: 0; font-family: var(--helioro-font-heading, inherit); font-size: 64px; font-weight: 600; font-style: normal;
	line-height: 1.02; letter-spacing: -1.6px; text-transform: none; color: var(--helioro-ink); }
@media only screen and (max-width: 999px){
	body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-caption{ font-size: 48px; letter-spacing: -1.2px; }
}
@media only screen and (max-width: 767px){
	body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title-content{ padding-top: 48px; padding-bottom: 28px; }
	body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-title{ margin-bottom: 14px; font-size: 12px; }
	body.helioro-archive-title-plain .helioro-page-title-wrap .helioro-page-caption{ font-size: 36px; letter-spacing: -0.8px; }
}

/* 22.12 CF7 extras
   helioro-form-filled ( PXB item / wrapper ): ground fields without border on a white tile, 54px, ink labels; <span class="helioro-req">*</span> in a label = accent
   helioro-cf7-submit-row ( class on the <p> holding the submit ): dotted rule above, note inline right of the button, arrow stays on the button
   helioro-cf7-file ( <span class="helioro-cf7-file" data-hint="PDF, up to 10 MB">[file …]</span> ): dashed pill, white chip button, hint on the right */
.helioro-form-filled{ --hf-bg: var(--helioro-ground); --hf-border-w: 0px; --hf-border-color: transparent; --hf-height: 54px; --hf-label-color: var(--helioro-ink);
	--hf-focus-color: transparent; --hf-focus-ring: 0 0 0 2px var(--helioro-ink); --hf-btn-hover-bg: var(--helioro-accent); --hf-btn-hover-color: var(--helioro-on-accent); }
.helioro-form-filled .wpcf7 label{ margin-bottom: 0; }
.helioro-form-filled .wpcf7 label .wpcf7-form-control-wrap{ margin-top: 8px; }
.helioro-form-filled .wpcf7 form > p{ margin-bottom: 16px; }
.wpcf7 .helioro-req{ margin-left: 2px; color: var(--helioro-accent); }
[class*="helioro-form-"] .wpcf7 p.helioro-cf7-submit-row{ display: flex; flex-wrap: wrap; align-items: center; column-gap: 20px; row-gap: 12px; margin-top: 8px; padding-top: 22px; border-top: 2px dotted var(--helioro-line); }
[class*="helioro-form-"] .wpcf7 p.helioro-cf7-submit-row > .wpcf7-submit{ order: 0; }
[class*="helioro-form-"] .wpcf7 p.helioro-cf7-submit-row:has(> .wpcf7-submit):not(:has(> label, > .wpcf7-form-control-wrap, > select, > textarea, > input:not([type="submit"]):not([type="hidden"]))):after{ order: 1; margin-left: -59px; }
[class*="helioro-form-"] .wpcf7 p.helioro-cf7-submit-row > .helioro-form-note{ order: 2; flex: 1 1 200px; margin: 0 0 0 20px; }
[class*="helioro-form-"] .wpcf7 p.helioro-cf7-submit-row > br{ display: none; }
.helioro-cf7-file{ position: relative; display: block; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-file input[type="file"]{ height: 54px; padding: 7px 150px 7px 7px; border-radius: var(--hf-radius); background-image: none; font-size: 14px; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-file .wpcf7-form-control-wrap:before{ display: none; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-file input[type="file"]::file-selector-button{ height: 38px; margin-right: 14px; padding: 0 18px; border: 1px solid var(--helioro-line); background: var(--helioro-card); color: var(--helioro-ink); }
.helioro-cf7-file[data-hint]:after{ content: attr(data-hint); position: absolute; right: 22px; top: 27px; transform: translateY(-50%); font-size: 13px; color: var(--helioro-muted); pointer-events: none; }
@media only screen and (max-width: 479px){
	[class*="helioro-form-"] .wpcf7 .helioro-cf7-file input[type="file"]{ padding-right: 7px; }
	.helioro-cf7-file[data-hint]:after{ display: none; }
}

/* 22.13 open-role accordion title as a grid ( Careers ). Accordion title text:
   <span class="helioro-role-main">Solar Installer<span class="helioro-role-summary">Roof crew…</span></span>
   <span class="helioro-role-chips"><span class="helioro-role-chip">Install</span><span class="helioro-role-chip">Sunvale</span></span>
   <span class="helioro-role-pay"><small>Salary</small>$58–72k</span>   ( no <br> ) */
.helioro-role-main{ display: block; }
.helioro-role-summary{ display: block; margin-top: 4px; font-family: var(--helioro-font-body, inherit); font-size: 15px; font-weight: 400; line-height: 1.5; letter-spacing: 0; color: var(--helioro-text); }
.helioro-role-chips{ display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.helioro-role-chip{ display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: var(--helioro-role-chip-radius, var(--helioro-radius-button)); background: var(--helioro-role-chip-bg, var(--helioro-ground)); box-shadow: inset 0 0 0 1px var(--helioro-role-chip-border, transparent);
	font-family: var(--helioro-font-body, inherit); font-size: 13px; font-weight: 600; line-height: 1.2; letter-spacing: 0; color: var(--helioro-ink); }
.helioro-role-pay{ display: block; margin-top: 12px; font-size: 18px; color: var(--helioro-ink); }
.helioro-role-pay small{ display: block; font-family: var(--helioro-font-body, inherit); font-size: 12px; font-weight: 600; color: var(--helioro-muted); }
@media only screen and (min-width: 1000px){
	.helioro-acc-roles .pixe-accordion-title .pixe-text:has(> .helioro-role-main),
	.helioro-acc-roles .gdlr-core-accordion-item-title:has(> .helioro-role-main){ display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) auto; align-items: center; column-gap: 28px; }
	.helioro-acc-roles .helioro-role-chips,
	.helioro-acc-roles .helioro-role-pay{ margin-top: 0; }
	.helioro-acc-roles .helioro-role-pay{ text-align: right; }
}

/* 22.14 bento extras ( 1000–1199 ) + shadows on PXB columns
   helioro-bento-join  column  two columns that paint one box ( corners joined ) stack with no gap: first keeps the top corners, second the bottom ones */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join{ width: 100%; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join > .pixe-column-content{ margin-left: 0; margin-right: 0; }
	.helioro-body .helioro-bento .pixe-column ~ .pixe-column.helioro-bento-join > .pixe-column-content{ margin-top: var(--hb-gap, 16px); }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join > .pixe-column-content,
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join > .pixe-column-content > .pixe-bg-style{ border-radius: var(--helioro-join-radius, 28px) var(--helioro-join-radius, 28px) 0 0; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join + .pixe-column.helioro-bento-join > .pixe-column-content{ margin-top: 0; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join + .pixe-column.helioro-bento-join > .pixe-column-content,
	.helioro-body .helioro-bento .pixe-column.helioro-bento-join + .pixe-column.helioro-bento-join > .pixe-column-content > .pixe-bg-style{ border-radius: 0 0 var(--helioro-join-radius, 28px) var(--helioro-join-radius, 28px); }
	.helioro-body .helioro-bento .helioro-bento-join .pixe-hide-tablet{ display: none !important; }
	/* two leading wides ( first columns of the row ) sit side by side without a top gap */
	.helioro-body .helioro-bento .pixe-column.helioro-bento-wide:not(.pixe-column ~ .pixe-column) + .pixe-column.helioro-bento-wide > .pixe-column-content{ margin-top: 0; }
}
.helioro-shadow-lift{ box-shadow: 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .55); }
.pixe-column.helioro-shadow,
.pixe-column.helioro-shadow-soft,
.pixe-column.helioro-shadow-lift{ box-shadow: none; }
.pixe-column.helioro-shadow > .pixe-column-content{ box-shadow: 0 24px 48px -20px rgba(var(--helioro-ink-rgb), .28); }
.pixe-column.helioro-shadow-soft > .pixe-column-content{ box-shadow: 0 12px 32px -16px rgba(var(--helioro-ink-rgb), .2); }
.pixe-column.helioro-shadow-lift > .pixe-column-content{ box-shadow: 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .55); }

/* ===================================================================
 * 23. Full-site audit ( round 3 ): sticky columns, CF7 rhythm, words that never split, chip contrast, equal-height cards,
 *     personnel card rhythm, personnel single, archive cards, 404, comments, author box, mobile panel chips.
 *     PHP: include/function-regist.php ( AO exclude, personnel template, archive settings, author helpers ), single-personnel.php,
 *     header/header-title.php ( archive h1 ), content/archive-*.php, 404.php, include/navigation-menu.php + js/script-core.js ( panel logo link ).
 * =================================================================== */

/* 23.1 sticky columns ( helioro-sticky, FAQ topics ): overflow hidden on the page shell made it the scroll container, so sticky never
   stuck. clip paints exactly like hidden but is not a scroll container; flow-root keeps the block formatting context hidden gave.
   html goes visible so the body overflow ( x clipped ) moves to the viewport. Browsers without overflow: clip keep the old hidden. */
@supports (overflow: clip){
	:root{ overflow: visible; }
	body.helioro-body{ overflow-x: clip; overflow-y: visible; }
	.helioro-body .helioro-body-outer-wrapper{ display: flow-root; overflow: clip; }
}

/* 23.2 CF7 rhythm: label → field 7px, 16px rows ( 14px on an accent tile ), no 20px paragraph margin inside a grid, and no empty
   lines from the <br> CF7 autop leaves after a block label / joined row / field ( footer newsletter: label 10px, note 10px ) */
[class*="helioro-form-"] .wpcf7 label{ margin-bottom: 7px; line-height: 1.3; }
[class*="helioro-form-"] .wpcf7 label:has(.wpcf7-form-control-wrap){ margin-bottom: 0; }
[class*="helioro-form-"] .wpcf7 label .wpcf7-form-control-wrap{ margin-top: 7px; }
[class*="helioro-form-"] .wpcf7 p > label + br,
[class*="helioro-form-"] .wpcf7 p > .helioro-cf7-inline + br,
[class*="helioro-form-"] .wpcf7 p > .wpcf7-form-control-wrap + br{ display: none; }
.helioro-body .wpcf7 .helioro-cf7-grid > *{ margin: 0; }
.helioro-form-on-accent .helioro-cf7-grid{ row-gap: 14px; }
.helioro-body .helioro-footer-wrapper .wpcf7 form > p{ margin-bottom: 0; }
.helioro-body .helioro-footer-wrapper .wpcf7 label{ margin-bottom: 10px; }
.helioro-body .helioro-footer-wrapper .wpcf7 .helioro-form-note{ margin-top: 14px; }
/* note paragraph in a footer text widget right after the form */
.helioro-body .helioro-footer-wrapper :is(.wpcf7, div:has(> .wpcf7)) + p{ margin-top: 14px; }

/* 23.3 words never split ( the theme body has word-break: break-word ): e-mail addresses in chips / contact pills.
   helioro-nowrap ( PXB item ) = words stay whole at every width, one line at 1000–1199 ( section 21 ) */
.helioro-chip,
.helioro-body .helioro-nowrap,
.helioro-body .helioro-nowrap .pixe-inline{ overflow-wrap: normal; word-break: normal; }

/* 23.4 chip contrast: the single post category chip lost to ".helioro-body a" ( accent text on the accent pill ); goodlayers-core paints
   the fw3-blog style-2 / style-3 thumbnail category white with !important, which put white text on the kit's white chip */
.helioro-body a.helioro-single-category-chip{ color: var(--helioro-on-accent); }
.helioro-body a.helioro-single-category-chip:hover,
.helioro-body a.helioro-single-category-chip:focus{ color: #ffffff; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category,
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a,
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a:hover,
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category,
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category a,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-info-category a{ color: var(--hc-chip-color) !important; }
.helioro-cards-bento .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category,
.helioro-cards-engineering .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category{ background: var(--hc-chip-bg); }

/* 23.5 equal-height cards: fw3-portfolio Grid rows ( Layout: Fit Rows ) line up at the bottom — the holder becomes a wrapping flex row,
   each card fills its column ( spec rule + arrow stay at the bottom ) */
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-item-holder[data-layout="fitrows"]{ display: flex; flex-wrap: wrap; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-item-holder[data-layout="fitrows"]:before,
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-item-holder[data-layout="fitrows"]:after{ content: none; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-item-holder[data-layout="fitrows"] > .gdlr-core-item-list{ display: flex; flex-direction: column; float: none; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-item-holder[data-layout="fitrows"] > .gdlr-core-item-list > .gdlr-core-portfolio-badge-wrap{ display: flex; flex: 1 1 auto; flex-direction: column; }
[class*="helioro-cards-"] .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-item-holder[data-layout="fitrows"] > .gdlr-core-item-list .gdlr-core-portfolio-grid{ flex: 1 1 auto; height: auto; }

/* 23.6 fw3-personnel bento card rhythm ( P06 board ): name 24/1.12, role 4px under it, chips 12px, dotted rule 18px under the chips,
   14px to the excerpt + social row, 20px card bottom */
.helioro-cards-bento .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-title{ line-height: 1.12; }
.helioro-cards-bento .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-position{ margin-bottom: 0; line-height: 1.4; }
.helioro-cards-bento .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap{ padding-bottom: 12px; }
.helioro-cards-bento .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > .gdlr-core-personnel-list-divider{ margin: 18px 0 14px; padding: 0; border-bottom-width: 2px; }
.helioro-cards-bento .gdlr-core-personnel-item-style-grid .gdlr-core-personnel-list-content-wrap > .gdlr-core-personnel-list-social{ margin: 0; }

/* 23.7 accordion icon in ink ( FAQ board ): add "helioro-acc-ink" next to helioro-acc-hairline / -numbered on the accordion item */
.helioro-acc-ink{ --ha-icon-color: var(--helioro-ink); --ha-icon-active-bg: var(--helioro-ink); --ha-icon-active-color: #ffffff; }

/* 23.8 single personnel ( General > Personnel Style > Single Personnel Layout: kit ): photo 5/12 + profile 7/12 in one card */
.helioro-personnel-single-wrap{ padding: 56px 0 96px; background: var(--helioro-ground); }
.helioro-personnel-single .helioro-kit-breadcrumb{ margin-bottom: 24px; }
.helioro-personnel-single-card{ display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); align-items: start; column-gap: 48px; padding: 8px;
	border-radius: calc(var(--helioro-radius-card) + 4px); background: var(--helioro-card); }
.helioro-personnel-single-no-photo .helioro-personnel-single-card{ grid-template-columns: minmax(0, 1fr); }
.helioro-personnel-single-photo{ position: relative; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--helioro-radius-card); background: var(--helioro-sand); }
.helioro-personnel-single-photo img{ display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 22%; }
.helioro-personnel-single-photo .helioro-personnel-category{ top: 14px; left: 14px; }
.helioro-personnel-single-body{ display: flex; flex-direction: column; align-self: center; align-items: flex-start; min-width: 0; padding: 40px 40px 32px 0; }
.helioro-personnel-single-no-photo .helioro-personnel-single-body{ padding: 40px; }
.helioro-personnel-single-body > .helioro-personnel-category{ position: static; margin-bottom: 20px; }
.helioro-body .helioro-personnel-single-name{ margin: 0; font-family: var(--helioro-font-heading, inherit); font-size: 56px; font-weight: 600; line-height: 1.04; letter-spacing: -1.4px; text-transform: none; color: var(--helioro-ink); }
.helioro-personnel-single-position{ margin-top: 10px; font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--helioro-accent-dark); }
.helioro-personnel-single .helioro-person-chips{ display: flex; flex-wrap: wrap; gap: 6px; margin: 22px 0 0; padding: 0; }
.helioro-personnel-single .helioro-chip{ padding: 7px 12px; border: 0; background: var(--helioro-ground); color: var(--helioro-ink); font-size: 13px; font-weight: 600; line-height: 1.1; }
.helioro-personnel-single-lede{ margin-top: 26px; font-size: 20px; line-height: 1.5; color: var(--helioro-ink); }
.helioro-personnel-single-lede > *,
.helioro-personnel-single-content > :last-child{ margin-bottom: 0; }
.helioro-personnel-single-content{ align-self: stretch; margin-top: 22px; font-size: 16px; line-height: 1.7; color: var(--helioro-text); }
.helioro-personnel-single-lede + .helioro-personnel-single-content{ margin-top: 16px; }
.helioro-personnel-single-footer{ display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; align-self: stretch; gap: 16px;
	margin-top: 32px; padding-top: 20px; border-top: 2px dotted var(--helioro-line); }
.helioro-personnel-single-social .gdlr-core-social-network-item{ display: flex !important; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0 !important; }
.helioro-body .helioro-personnel-single-social .gdlr-core-social-network-icon{ display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0 !important;
	border-radius: var(--hs-radius, 50%); background: var(--helioro-ground); color: var(--helioro-ink) !important; font-size: 16px; line-height: 1; transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-body .helioro-personnel-single-social .gdlr-core-social-network-icon:hover{ background: var(--helioro-ink); color: #ffffff !important; }
.helioro-body a.helioro-personnel-single-button{ display: inline-flex; align-items: center; gap: 10px; padding: 14px 22px; border-radius: var(--helioro-radius-button);
	background: var(--helioro-ink); color: #ffffff; font-size: 15px; font-weight: 600; line-height: 1.2; transition: background-color var(--helioro-fast); }
.helioro-body a.helioro-personnel-single-button:after{ content: ""; width: 13px; height: 13px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; }
.helioro-body a.helioro-personnel-single-button:hover{ background: var(--helioro-accent-dark); color: #ffffff; }
@media only screen and (max-width: 999px){
	.helioro-personnel-single-wrap{ padding: 40px 0 72px; }
	.helioro-personnel-single-card{ grid-template-columns: minmax(0, 1fr); }
	.helioro-personnel-single-photo{ aspect-ratio: 4 / 3; }
	.helioro-personnel-single-body,
	.helioro-personnel-single-no-photo .helioro-personnel-single-body{ padding: 28px 20px 20px; }
	.helioro-body .helioro-personnel-single-name{ font-size: 44px; letter-spacing: -1px; }
}
@media only screen and (max-width: 767px){
	.helioro-personnel-single-wrap{ padding: 28px 0 56px; }
	.helioro-personnel-single-photo{ aspect-ratio: 1 / 1; }
	.helioro-personnel-single-body,
	.helioro-personnel-single-no-photo .helioro-personnel-single-body{ padding: 24px 12px 14px; }
	.helioro-body .helioro-personnel-single-name{ font-size: 36px; letter-spacing: -0.8px; }
	.helioro-personnel-single-lede{ font-size: 18px; }
}

/* 23.9 archive cards ( General > Helioro Style > Archive Cards: kit ): term description as a lede above the cards */
body.helioro-archive-title-plain .helioro-archive-taxonomy-description{ max-width: 720px; margin-bottom: 32px; font-size: 17px; line-height: 1.6; color: var(--helioro-text); }

/* 23.10 404 + empty search ( General > Helioro Style > 404 Page Style: kit ): ground, ink headline, pill search, ink "Back to Home" pill */
.helioro-404-kit .helioro-not-found-wrap{ background-color: var(--helioro-ground); }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-background{ display: none; }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-content{ max-width: 640px; margin: 0 auto; padding: 120px 0 128px; }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-head{ margin-bottom: 20px; font-family: var(--helioro-font-heading, inherit); font-size: 168px; font-weight: 600; line-height: .9; letter-spacing: -6px; color: var(--helioro-ink); }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-title{ margin-bottom: 14px; font-family: var(--helioro-font-heading, inherit); font-size: 36px; font-weight: 600; line-height: 1.1; letter-spacing: -0.6px; text-transform: none; color: var(--helioro-ink); }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-caption{ font-size: 18px; line-height: 1.6; color: var(--helioro-text); }
.helioro-404-kit .helioro-not-found-wrap form.search-form{ max-width: 480px; margin: 40px auto 0; }
.helioro-404-kit .helioro-not-found-wrap form.search-form input.search-field{ height: 56px; padding: 0 60px 0 24px; border: 1px solid var(--helioro-line); border-radius: var(--helioro-radius-button);
	background: var(--helioro-card); color: var(--helioro-ink); font-family: var(--helioro-font-body, inherit); font-size: 15px; box-shadow: none; }
.helioro-404-kit .helioro-not-found-wrap form.search-form input.search-field:focus{ border-color: var(--helioro-accent); box-shadow: 0 0 0 4px rgba(var(--helioro-accent-rgb), .16); outline: none; }
.helioro-404-kit .helioro-not-found-wrap input::placeholder{ color: var(--helioro-muted); opacity: 1; }
.helioro-404-kit .helioro-not-found-wrap form.search-form input.search-submit{ width: 56px; height: 56px; }
.helioro-404-kit .helioro-not-found-wrap form.search-form .helioro-top-search-submit{ right: 22px; color: var(--helioro-ink); font-size: 16px; }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-back-to-home{ margin-top: 28px; }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-back-to-home a{ display: inline-flex; align-items: center; gap: 10px; padding: 14px 24px; border-radius: var(--helioro-radius-button);
	background: var(--helioro-ink); color: #ffffff; font-size: 15px; font-weight: 600; line-height: 1.2; letter-spacing: 0; text-transform: none; transition: background-color var(--helioro-fast); }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-back-to-home a:after{ content: ""; width: 13px; height: 13px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; mask: var(--helioro-ico-arrow-ur) center / contain no-repeat; }
.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-back-to-home a:hover{ background: var(--helioro-accent-dark); color: #ffffff; }
@media only screen and (max-width: 767px){
	.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-content{ padding: 72px 0 80px; }
	.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-head{ font-size: 112px; letter-spacing: -4px; }
	.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-title{ font-size: 28px; }
	.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-caption{ font-size: 16px; }
}
body.search.helioro-404-kit .helioro-not-found-wrap .helioro-not-found-head{ font-size: 72px; letter-spacing: -2px; text-transform: none; }

/* 23.11 comments: compact rows, sentence-case date and reply ( strings: theme translation; avatar: Settings > Discussion ) */
.helioro-body .helioro-comments-area .comment-body{ padding: 18px 22px; }
.helioro-body .helioro-comments-area .comment-meta{ margin-bottom: 8px; }
.helioro-body .helioro-comments-area .comment-time{ font-family: var(--helioro-font-body, inherit); font-size: 13px; font-style: normal; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--helioro-muted); }
.helioro-body .helioro-comments-area .comment-reply,
.helioro-body .helioro-comments-area .edit-link{ font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.helioro-body .helioro-comments-area .comment-content{ font-size: 15px; line-height: 1.6; }

/* 23.12 author box: role line under the name ( Users > Profile > Role Line ), "All articles by …" link under the bio */
.helioro-single-author-role{ margin: -4px 0 12px; font-size: 14px; font-weight: 600; color: var(--helioro-accent-dark); }
.helioro-body a.helioro-single-author-posts-link{ display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 14px; font-weight: 600; color: var(--helioro-ink); }
.helioro-body a.helioro-single-author-posts-link:after{ content: ""; width: 12px; height: 12px; background-color: currentColor;
	-webkit-mask: var(--helioro-ico-arrow-r) center / contain no-repeat; mask: var(--helioro-ico-arrow-r) center / contain no-repeat; transition: transform .2s; }
.helioro-body a.helioro-single-author-posts-link:hover{ color: var(--helioro-accent-dark); }
.helioro-body a.helioro-single-author-posts-link:hover:after{ transform: translateX(3px); }

/* 23.13 mobile panel: phone + e-mail chips stay on one row at 390 ( smaller chips under 420px ) */
@media only screen and (max-width: 419px){
	.helioro-mm-menu-wrap .helioro-mm-footer{ gap: 6px; }
	.helioro-mm-menu-wrap .helioro-mm-footer .helioro-chip{ padding: 4px 10px 4px 4px; gap: 6px; font-size: 12px; }
	.helioro-mm-menu-wrap .helioro-mm-footer .helioro-chip > i{ width: 24px; height: 24px; font-size: 12px; }
}

/* ===================================================================
 * 24. UX pass: keyboard focus, missing hovers, transitions, reduced motion
 *     Focus ring = 2px ink outline + white halo, readable on ground, white, rose, ink and photo tiles.
 *     On dark chrome - footer, copyright, helioro-on-dark, mobile panel - the ring is accent light without the halo.
 *     JS: js/script-core.js gives PixeBuilder accordion rows tabindex + role button + aria-expanded,
 *     and keeps the mobile menu burger aria-expanded in sync. PHP: include/navigation-menu.php labels.
 * =================================================================== */

/* 24.1 focus-visible: the style-core reset removes outlines on a, input submit and button, this restores them inside the theme */
html body.helioro-body :where(a, button, input[type="submit"], input[type="button"], input[type="reset"], summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible{
	outline: 2px solid var(--helioro-focus-ring); outline-offset: 2px; box-shadow: 0 0 0 4px var(--helioro-focus-halo); }
html body.helioro-body :where(input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="hidden"]), select, textarea):focus-visible{
	outline: 2px solid var(--helioro-focus-ring); outline-offset: 1px; }
/* CF7 fields keep their own ring from the form tokens; the footer newsletter pill shows focus on the pill */
html body.helioro-body [class*="helioro-form-"] .wpcf7 :is(input:not([type="submit"]):not([type="button"]), select, textarea):focus-visible,
html body.helioro-body .helioro-footer-wrapper .gdlr-core-newsletter-email input:focus-visible{ outline: none; }
/* dark chrome */
html body.helioro-body :where(.helioro-footer-wrapper, .helioro-copyright-wrapper, .helioro-on-dark) :where(a, button, input[type="submit"], input[type="button"], summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible,
html body.helioro-body :where(.helioro-chip.helioro-on-dark):focus-visible{ outline-color: var(--helioro-accent-light); box-shadow: none; }
/* mobile panel: items clip their overflow, so the ring sits inside */
.helioro-mm-menu-wrap.mm-menu{ --mm-color-focusring: var(--helioro-accent-light); }
html body.helioro-body .helioro-mm-menu-wrap :where(a, button, [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible{
	outline: 2px solid var(--helioro-accent-light); outline-offset: -3px; box-shadow: none; }
/* linked tiles: the overlay link draws its ring inside the tile, or on the tile itself where :has is supported */
html body.helioro-body .pixe-column-link:focus-visible{ outline-offset: -4px; box-shadow: none; }
/* card thumbnails clip their overflow: ring inside */
html body.helioro-body :is(.gdlr-core-portfolio-thumbnail, .gdlr-core-blog-thumbnail, .gdlr-core-personnel-list-image) a:focus-visible{ outline-offset: -4px; box-shadow: none; }
/* accordion rows: ring inside the title */
html body.helioro-body .pixe-accordion-title:focus-visible{ outline-offset: -2px; box-shadow: none; }
@supports selector(:has(a)){
	html body.helioro-body .pixe-column > .pixe-column-link:focus-visible,
	html body.helioro-body .pixe-accordion > .pixe-accordion-title:focus-visible{ outline: none; }
	html body.helioro-body .pixe-column:has(> .pixe-column-link:focus-visible) > .pixe-column-content,
	html body.helioro-body .pixe-accordion:has(> .pixe-accordion-title:focus-visible){
		outline: 2px solid var(--helioro-focus-ring); outline-offset: 2px; box-shadow: 0 0 0 4px var(--helioro-focus-halo); }
	html body.helioro-body .helioro-on-dark .pixe-accordion:has(> .pixe-accordion-title:focus-visible){ outline-color: var(--helioro-accent-light); box-shadow: none; }
}

/* 24.2 accordion rows: question turns accent dark, the disc fills accent with a white glyph - PixeBuilder + FW3 */
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title{ cursor: pointer; }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title .pixe-text,
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-title,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-title{ transition: color var(--helioro-fast); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title:is(:hover, :focus-visible),
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-tab:hover,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab:hover{
	--ha-icon-bg: var(--helioro-accent); --ha-icon-border: var(--helioro-accent); --ha-icon-color: var(--helioro-on-accent);
	--ha-icon-active-bg: var(--helioro-accent); --ha-icon-active-color: var(--helioro-on-accent); }
.pixe-item[class*="helioro-acc-"] .pixe-accordion-title:is(:hover, :focus-visible) .pixe-text,
[class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-tab:hover .gdlr-core-accordion-item-title,
[class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab:hover .gdlr-core-toggle-box-item-title{ color: var(--helioro-accent-dark); }
.helioro-on-dark .pixe-item[class*="helioro-acc-"] .pixe-accordion-title:is(:hover, :focus-visible) .pixe-text,
.helioro-on-dark[class*="helioro-acc-"] .pixe-accordion-title:is(:hover, :focus-visible) .pixe-text,
.helioro-on-dark [class*="helioro-acc-"] .gdlr-core-accordion-item .gdlr-core-accordion-item-tab:hover .gdlr-core-accordion-item-title,
.helioro-on-dark [class*="helioro-acc-"] .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab:hover .gdlr-core-toggle-box-item-title{ color: var(--helioro-accent-light); }

/* 24.3 breadcrumb + inline links
   helioro-crumb on the PixeBuilder text box that holds a breadcrumb over a photo or ink tile: links go white on hover;
   add helioro-on-light next to it on a light tile: links go accent dark. Plain links inside other text boxes get an underline,
   which reads on every ground. */
.helioro-body .helioro-crumb a{ transition: color var(--helioro-fast); }
.helioro-body .helioro-crumb a:hover{ color: #ffffff !important; }
.helioro-body .helioro-crumb.helioro-on-light a:hover,
.helioro-body .helioro-on-light .helioro-crumb a:hover{ color: var(--helioro-accent-dark) !important; }
.helioro-body .pixe-item-text-box:not(.helioro-crumb) .pixe-inline a:not([class]):hover{ text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* 24.4 linked tile hover - add helioro-tile-hover to a PixeBuilder column that has a Column Link but no hover of its own:
   the photo zooms 1.03 like the cards, and the last icon disc - or one marked helioro-tile-arrow - fills accent */
.helioro-tile-hover > .pixe-column-content > .pixe-bg-style{ overflow: hidden; }
.helioro-tile-hover .pixe-image img,
.helioro-tile-hover > .pixe-column-content > .pixe-bg-style .pixe-bg-inner{ transition: transform .6s var(--helioro-ease); }
.helioro-body .helioro-tile-hover:hover .pixe-image img,
.helioro-body .helioro-tile-hover:hover > .pixe-column-content > .pixe-bg-style .pixe-bg-inner{ transform: scale(1.03); }
.helioro-body .helioro-tile-hover:hover > .pixe-column-content > .pixe-item-icon:last-child .pixe-icon,
.helioro-body .helioro-tile-hover:hover .helioro-tile-arrow .pixe-icon{
	border-color: var(--helioro-accent); background: var(--helioro-accent); color: var(--helioro-on-accent); fill: var(--helioro-on-accent); --pixe--svg--color: var(--helioro-on-accent); }

/* 24.5 fw3 cards: blog and personnel thumbnails zoom 1.03 like the portfolio card, personnel name turns accent dark */
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-thumbnail img,
[class*="helioro-cards-"] .gdlr-core-personnel-list-image img{ transition: transform .6s var(--helioro-ease), opacity var(--helioro-fast), filter var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-thumbnail:hover img,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-blog-grid:hover .gdlr-core-blog-thumbnail img,
[class*="helioro-cards-"] .gdlr-core-blog-item .gdlr-core-item-list:hover .gdlr-core-blog-thumbnail img,
[class*="helioro-cards-"] .gdlr-core-zoom-on-hover:hover img,
[class*="helioro-cards-"] .gdlr-core-personnel-list:hover .gdlr-core-zoom-on-hover img{ transform: scale(1.03); }
[class*="helioro-cards-"] .gdlr-core-personnel-list .gdlr-core-personnel-list-title a{ transition: color var(--helioro-fast); }
[class*="helioro-cards-"] .gdlr-core-personnel-list:hover .gdlr-core-personnel-list-title a{ color: var(--helioro-accent-dark); }
.helioro-on-dark .gdlr-core-personnel-list:hover .gdlr-core-personnel-list-title a{ color: var(--helioro-accent-light); }

/* 24.6 filter chips + pagination on dark, mobile panel chips keep white text */
.helioro-on-dark .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer:not(.gdlr-core-active):hover{ background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .12); color: #ffffff; }
.helioro-on-dark .gdlr-core-pagination a:not(.gdlr-core-active):hover{ background: #ffffff; border-color: #ffffff; color: var(--helioro-ink); }
.helioro-mm-menu-wrap.mm-menu .helioro-mm-footer a.helioro-chip:hover{ border-color: var(--helioro-accent-light); color: #ffffff; }

/* 24.7 transitions: 180ms ease on colour, background, border and shadow - never on layout properties.
   Overrides the 300ms PixeBuilder default on buttons, text links, icon discs and links. */
.helioro-body .pixe-button,
.helioro-body .pixe-text-link,
.helioro-body .pixe-item-icon .pixe-icon,
.helioro-body .pixe-accordion-title .pixe-icon,
.helioro-body .pixe-editor a,
.helioro-body .helioro-navigation .sf-menu > li > a,
.helioro-body .helioro-main-menu-right-button,
.helioro-body .helioro-mobile-menu-button,
.helioro-body .helioro-footer-wrapper a,
.helioro-body .helioro-copyright-wrapper a,
.helioro-body .gdlr-core-portfolio-title a,
.helioro-body .gdlr-core-blog-title a,
.helioro-body .wpcf7 .wpcf7-submit,
.helioro-body .helioro-mm-menu-wrap.mm-menu a{
	transition: color var(--helioro-fast), background-color var(--helioro-fast), border-color var(--helioro-fast), box-shadow var(--helioro-fast), fill var(--helioro-fast); }

/* 24.8 prefers-reduced-motion: no PixeBuilder entrance animation, no card lift or zoom, colour changes are instant.
   PixeBuilder 1.1.5 ships no guard of its own; an animated node gets pixe-animation-init, then pixe-animated on scroll. */
@media (prefers-reduced-motion: reduce){
	.helioro-body .pixe-animation-init,
	.helioro-body .pixe-animation-init.pixe-animated,
	.helioro-body .pixe-seq-anim{ opacity: 1 !important; visibility: visible !important; transform: none !important; animation: none !important; transition: none !important; }
	.helioro-body [data-scroll-motion]{ visibility: visible !important; transform: none !important; }
	.helioro-body *,
	.helioro-body *::before,
	.helioro-body *::after{ transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
	.helioro-body .gdlr-core-portfolio-grid:hover,
	.helioro-body .gdlr-core-blog-grid:hover,
	.helioro-body .gdlr-core-personnel-list:hover,
	.helioro-body .gdlr-core-portfolio-thumbnail img,
	.helioro-body .gdlr-core-blog-thumbnail img,
	.helioro-body .gdlr-core-personnel-list-image img,
	.helioro-body .gdlr-core-zoom-on-hover img,
	.helioro-body .helioro-tile-hover .pixe-image img,
	.helioro-body .helioro-tile-hover .pixe-bg-inner{ transform: none !important; }
}

/* 24.9 the mobile panel close control is a button now: strip the browser button look, keep it at the end of the navbar row */
.helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close{ flex: 0 0 auto; align-self: center; margin-left: auto; padding: 0; border: 0; background: transparent; color: inherit;
	font-family: inherit; cursor: pointer; -webkit-appearance: none; appearance: none; }

/* ===================================================================
 * 25. Theme round 4 - demos 2 to 4: header one row from 1000px, right button arrow / padding / block, sticky bar logo,
 * boxed header shadow, menu row lines and left text, header contact blocks, mobile button / search / panel, form labels,
 * submit arrows, footer button, labelled quote bar, card shadow, footer contact rows, PixeBuilder button / background helpers.
 * Options: General > Helioro Style, Color > Helioro Palette. Classes: build/THEME-STYLE-GUIDE.md section 3.
 * =================================================================== */

/* 25.1 one header row between 1000px and 1199px for every header style the demos use - body class helioro-header-compact.
 Boxed and plain menu-right rows become a non-wrapping flex row - logo shrinks, menu and button keep their width;
 center logo and center menu rows put the right button back in the flow so it can never sit on the menu. */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-header-compact .helioro-header-style-boxed .helioro-header-container-item{ padding-left: 22px; padding-right: 22px; }
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-header-container-item,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner{ display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: space-between; }
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-header-container-item:before,
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-header-container-item:after,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner:before,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner:after{ display: none; }
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-logo,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-logo{ float: none; flex: 0 1 auto; min-width: 0; }
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-logo-inner img,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-logo-inner img{ max-width: 100%; height: auto; }
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-navigation,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-navigation{ float: none; flex: 0 0 auto; margin-left: auto; white-space: nowrap; }
	.helioro-header-compact .helioro-header-style-boxed .helioro-main-menu-right-wrap,
	.helioro-header-compact .helioro-header-style-plain .helioro-main-menu-right-wrap{ margin-left: 4px; }
	.helioro-header-compact .helioro-header-style-boxed .helioro-main-menu-right-button[class*="helioro-style-"]{ margin-left: 16px; }

	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-logo .helioro-navigation,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation{ display: flex; flex-wrap: nowrap; align-items: flex-start; }
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-logo .helioro-navigation:before,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-logo .helioro-navigation:after,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:before,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:after{ display: none; }
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-logo .helioro-main-menu,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-main-menu{ flex: 1 1 auto; min-width: 0; text-align: center; white-space: nowrap; }
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-logo .helioro-main-menu .sf-menu,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-main-menu .sf-menu{ display: inline-block; }
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-logo .helioro-main-menu-right-wrap,
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-main-menu-right-wrap{ position: static; flex: 0 0 auto; margin-right: 0; }

	/* bar header: the sticky bar logo needs the full desktop width */
	.helioro-header-compact .helioro-bar-sticky-logo{ display: none !important; }
}
/* left text of the menu row hides with the right button squeeze, below 1200px */
@media only screen and (max-width: 1199px){ .helioro-nav-left-text{ display: none; } }

/* 25.2 header right button: right arrow icon, full-height block on the bar header */
.helioro-header-btn-arrow-r .helioro-main-menu-right-button:after{ -webkit-mask-image: var(--helioro-ico-arrow-r); mask-image: var(--helioro-ico-arrow-r); }
.helioro-header-btn-arrow-r .helioro-main-menu-right-button:hover:after{ transform: translateX(3px); }
@media only screen and (min-width: 1000px){
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-navigation{ display: flex; flex-wrap: nowrap; align-items: stretch; }
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-navigation:before,
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-navigation:after{ display: none; }
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu{ margin-right: auto; }
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu-right-wrap{ display: flex; flex: 0 0 auto; align-items: stretch; float: none;
		margin-top: calc(-1 * var(--helioro-nav-pt, 25px)) !important; line-height: 1.4; }
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu-right-wrap > .helioro-main-menu-search,
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu-right-wrap > .helioro-main-menu-cart{ display: flex; align-items: center; margin: 0; padding: 0 22px;
		border-left: 1px solid color-mix(in srgb, var(--helioro-header-line, #ffffff) 16%, transparent); }
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu-right-wrap > .helioro-main-menu-right-button[class*="helioro-style-"]{ display: inline-flex; align-items: center;
		margin: 0 0 0 0; padding: 0 28px; border-width: 0; border-radius: 0; box-shadow: none; }
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu-search + .helioro-top-search-wrap + .helioro-main-menu-right-button,
	.helioro-header-btn-block .helioro-navigation-bar-wrap .helioro-main-menu-cart + .helioro-main-menu-right-button{ margin-left: 0; }
}

/* sticky bar logo - bar / bar2 header: only while the navigation bar is sticky */
.helioro-bar-sticky-logo{ display: none; }
.helioro-navigation-bar-wrap.helioro-fixed-navigation .helioro-bar-sticky-logo{ display: inline-block; flex: 0 0 auto; margin: -5px 40px 0 0; line-height: 0; vertical-align: top; }
.helioro-bar-sticky-logo img{ display: block; width: auto; max-width: 180px; max-height: 32px; }
.helioro-header-btn-block .helioro-navigation-bar-wrap.helioro-fixed-navigation .helioro-bar-sticky-logo{ align-self: flex-start; }

/* boxed header shadow */
.helioro-boxed-header-shadow .helioro-header-style-boxed .helioro-header-background{ box-shadow: 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .55); }
.helioro-boxed-header-shadow .helioro-header-style-boxed.helioro-fixed-navigation .helioro-header-background{ box-shadow: 0 12px 32px -18px rgba(var(--helioro-ink-rgb), .4); }

/* hairlines above and below the center logo / center menu row, inside the rail */
@media only screen and (min-width: 1000px){
	.helioro-header-nav-lines .helioro-header-style-plain.helioro-style-center-logo:not(.helioro-fixed-navigation) .helioro-navigation,
	.helioro-header-nav-lines .helioro-header-style-plain.helioro-style-center-menu:not(.helioro-fixed-navigation) .helioro-navigation{ position: relative; }
	.helioro-header-nav-lines .helioro-header-style-plain.helioro-style-center-logo:not(.helioro-fixed-navigation) .helioro-navigation:before,
	.helioro-header-nav-lines .helioro-header-style-plain.helioro-style-center-menu:not(.helioro-fixed-navigation) .helioro-navigation:before{ content: ""; display: block; position: absolute; top: 0; bottom: 0;
		left: var(--helioro-nav-line-inset, 20px); right: var(--helioro-nav-line-inset, 20px); border-top: 1px solid color-mix(in srgb, var(--helioro-header-line, #ffffff) 16%, transparent);
		border-bottom: 1px solid color-mix(in srgb, var(--helioro-header-line, #ffffff) 16%, transparent); pointer-events: none; }
}

/* left text of the center logo / center menu row - General > Helioro Style > Menu Row Left Text */
.helioro-nav-left-text{ position: absolute; left: 0; z-index: 2; line-height: 1.7; text-align: left; font-size: 14px; white-space: nowrap; }
.helioro-nav-note{ display: inline-flex; align-items: center; gap: 8px; }
.helioro-nav-note > i{ color: var(--helioro-accent-light); font-size: 14px; }
.helioro-nav-note a{ color: inherit; font-weight: 600; }

/* header contact blocks - Header Right Text of the bar header: <div class="helioro-header-contact"><span><i class="fa fa-phone"></i>
 <span><span class="helioro-info-font">SALES DESK</span>+1-555-0188</span></span> ... </div> - 42px hairline icon tile,
 small label line, value in the heading font, left aligned, no outer border */
.helioro-header-contact{ display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 14px 32px; text-align: left; }
.helioro-header-contact > span,
.helioro-header-contact > a{ display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.helioro-header-contact > span > i,
.helioro-header-contact > a > i{ display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 42px; height: 42px; box-sizing: border-box;
	border: 1px solid var(--helioro-line); border-radius: min(var(--helioro-radius-button), 50%); color: var(--helioro-accent); font-size: 16px; }
.helioro-header-contact > span > span,
.helioro-header-contact > a > span{ display: flex; flex-direction: column; gap: 3px; font-family: var(--helioro-font-heading, inherit); font-size: 15px; font-weight: 600; line-height: 1.25; color: var(--helioro-ink); }
.helioro-header-contact > span > span > span:first-child,
.helioro-header-contact > a > span > span:first-child,
.helioro-header-contact .helioro-header-contact-label{ font-family: var(--helioro-font-meta, inherit); font-size: 11px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; color: var(--helioro-muted); }
.helioro-header-contact br{ display: none; }
.helioro-header-contact > a:hover > i{ border-color: var(--helioro-accent); background: var(--helioro-accent); color: var(--helioro-on-accent); }
@media only screen and (min-width: 1000px) and (max-width: 1199px){ .helioro-header-contact{ gap: 12px 20px; } }

/* 25.3 mobile: 44px filled / outline menu button, no search icon, list panel numbers, current bar, sub-menu indent, square close */
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu-button,
.helioro-burger-outline .helioro-mobile-header .helioro-mobile-menu-button{ display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 44px; height: 44px; padding: 0;
	border-radius: min(var(--helioro-radius-button), 50%); font-size: 17px; line-height: 1; transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu-button{ border: 0; background-color: var(--helioro-ink); }
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu-button i{ color: #ffffff; }
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu-button:hover{ background-color: var(--helioro-accent); }
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu-button:hover i{ color: var(--helioro-on-accent); }
.helioro-burger-outline .helioro-mobile-header .helioro-mobile-menu-button{ border: 1px solid var(--helioro-line); background-color: transparent; }
.helioro-burger-outline .helioro-mobile-header .helioro-mobile-menu-button:hover{ border-color: var(--helioro-ink); }
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu-right,
.helioro-burger-outline .helioro-mobile-header .helioro-mobile-menu-right{ margin-top: -22px; }
.helioro-burger-filled .helioro-mobile-header .helioro-mobile-menu,
.helioro-burger-outline .helioro-mobile-header .helioro-mobile-menu{ margin-top: 0; }
@media only screen and (max-width: 999px){
	.helioro-mobile-no-search .helioro-mobile-header .helioro-main-menu-search{ display: none; }
}
/* list panel: square close with a hairline when the Button Radius is square, filled disc stays on round radius */
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close{ box-sizing: border-box; border: 1px solid rgba(255, 255, 255, .18); border-radius: min(var(--helioro-radius-button), 50%); background-color: transparent; }
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close:hover{ border-color: var(--helioro-accent); }
/* numbered list items - General > Helioro Style > Numbered Items In The Mobile Menu Panel */
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview{ counter-reset: helioro-mm; }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem:not(.helioro-menu-cta){ counter-increment: helioro-mm; }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem:not(.helioro-menu-cta) > .mm-listitem__text{ position: relative; display: flex; align-items: baseline; gap: 14px; }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem:not(.helioro-menu-cta) > .mm-listitem__text:before{
	content: counter(helioro-mm, decimal-leading-zero); flex-shrink: 0; min-width: 22px; font-family: var(--helioro-font-meta, monospace); font-size: 12px; font-weight: 500; letter-spacing: 1px; color: rgba(255, 255, 255, .5); }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem.current-menu-item > .mm-listitem__text{ padding-left: 14px; color: var(--helioro-accent-light); }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-panels > .mm-panel > .mm-listview > .mm-listitem.current-menu-item > .mm-listitem__text:after{
	content: ""; position: absolute; left: 0; top: 50%; width: 3px; height: 24px; margin-top: -12px; background: var(--helioro-accent); }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-panel{ margin: 0 0 12px 36px; padding: 0 0 0 16px; border-left: 1px solid rgba(255, 255, 255, .16); background: transparent; }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-panel .mm-listitem__text{ padding-top: 9px; padding-bottom: 9px; font-family: inherit; font-size: 15px; letter-spacing: 0; }
.helioro-mpanel-numbered.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem--vertical > .mm-panel .mm-listitem:after{ display: none; }
/* panel footer: two-cell grid, e.g. <div class="helioro-mm-cells"><a href="tel:..."><small>Sales desk</small>+1-555-0188</a><a href="tel:..."><small>O&amp;M desk</small>24 / 7</a></div> */
.helioro-mm-cells{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); flex: 1 0 100%; border: 1px solid rgba(255, 255, 255, .16); border-radius: min(var(--helioro-radius-button), 16px); overflow: hidden; }
.helioro-mm-cells > *{ display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; color: #ffffff; font-size: 15px; font-weight: 600; line-height: 1.3; text-decoration: none; }
.helioro-mm-cells > * + *{ border-left: 1px solid rgba(255, 255, 255, .16); }
.helioro-mm-cells small{ font-family: var(--helioro-font-meta, inherit); font-size: 11px; font-weight: 500; letter-spacing: 1px; text-transform: uppercase; color: rgba(255, 255, 255, .6); }

/* 25.4 forms: plain labels, no submit arrow, footer button colour, labelled quote bar */
.helioro-form-labels-plain,
.helioro-form-labels-plain [class*="helioro-form-"]{ --hf-label-font: inherit; --hf-label-transform: none; --hf-label-ls: 0px; --hf-label-size: 13px; }
/* no submit arrow: General > Helioro Style > Arrow On Form Submit Buttons = disable, or helioro-cf7-no-arrow on a wrapper / Text widget div */
.helioro-cf7-no-arrow{ --hf-arrow-display: none; --hf-arrow-pad: 28px; }
/* footer submit colour: Color > Helioro Palette > Footer Form Button Background - written into style-custom.css with a label colour that follows its lightness */
/* labelled quote bar: <span class="helioro-cf7-bar"><label>Postcode [text postcode]</label><label>Monthly bill [select bill …]</label>[submit "Get my quote"]</span>
 - one row of labelled cells with hairline dividers and the button at the end, cells stack under 768px */
.helioro-cf7-bar{ display: flex; flex-wrap: nowrap; align-items: stretch; gap: 0; padding: var(--hf-joined-pad, 6px); border: 1px solid var(--hf-border-color, var(--helioro-line));
	border-radius: min(var(--hf-joined-radius, 16px), 24px); background: var(--hf-bg, #ffffff); }
.helioro-body .helioro-cf7-bar > label,
.helioro-body .helioro-cf7-bar > .helioro-cf7-bar-cell{ display: block; flex: 1 1 0; min-width: 0; margin: 0; padding: 8px 18px; border-left: 1px solid var(--hf-border-color, var(--helioro-line));
	font-family: var(--hf-label-font, inherit); font-size: 11px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; color: var(--hf-label-color, inherit); }
.helioro-body .helioro-cf7-bar > label:first-child,
.helioro-body .helioro-cf7-bar > .helioro-cf7-bar-cell:first-child{ border-left: 0; }
.helioro-body .helioro-cf7-bar label .wpcf7-form-control-wrap{ margin-top: 2px; }
.helioro-body .helioro-cf7-bar input:not([type="submit"]),
.helioro-body .helioro-cf7-bar select{ height: 28px; padding: 0 24px 0 0; border: 0; border-radius: 0; background-color: transparent; box-shadow: none;
	font-family: inherit; font-size: 15px; letter-spacing: 0; text-transform: none; background-position: right 0 center; }
.helioro-body .helioro-cf7-bar input:not([type="submit"]):focus,
.helioro-body .helioro-cf7-bar select:focus{ box-shadow: none; }
.helioro-cf7-bar:focus-within{ border-color: var(--hf-focus-color, var(--helioro-accent)); }
.helioro-body .helioro-cf7-bar input[type="submit"]{ flex: 0 0 auto; align-self: stretch; height: auto; min-height: 48px; margin: 0 0 0 6px; }
.helioro-cf7-bar .wpcf7-spinner{ position: absolute; }
@media only screen and (max-width: 767px){
	.helioro-cf7-bar{ flex-direction: column; }
	.helioro-body .helioro-cf7-bar > label,
	.helioro-body .helioro-cf7-bar > .helioro-cf7-bar-cell{ padding: 10px 12px; border-left: 0; border-top: 1px solid var(--hf-border-color, var(--helioro-line)); }
	.helioro-body .helioro-cf7-bar > label:first-child,
	.helioro-body .helioro-cf7-bar > .helioro-cf7-bar-cell:first-child{ border-top: 0; }
	.helioro-body .helioro-cf7-bar input[type="submit"]{ margin: 6px 0 0; }
}

/* 25.5 card shadow - General > Helioro Style > Card Shadow + helioro-shadow-card on a PixeBuilder column, 3:2 blog column images */
.helioro-card-shadow-soft{ --helioro-card-shadow: 0 12px 32px -16px rgba(var(--helioro-ink-rgb), .2); }
.helioro-card-shadow-lift{ --helioro-card-shadow: 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .55); }
.helioro-card-shadow-soft [class*="helioro-cards-"],
.helioro-card-shadow-soft[class*="helioro-cards-"],
.helioro-card-shadow-lift [class*="helioro-cards-"],
.helioro-card-shadow-lift[class*="helioro-cards-"]{ --hc-shadow: var(--helioro-card-shadow); }
.helioro-shadow-card{ box-shadow: var(--helioro-card-shadow, 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .55)); }
.pixe-column.helioro-shadow-card{ box-shadow: none; }
.pixe-column.helioro-shadow-card > .pixe-column-content{ box-shadow: var(--helioro-card-shadow, 0 24px 48px -28px rgba(var(--helioro-ink-rgb), .55)); }
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail img,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-grid .gdlr-core-blog-thumbnail img{ width: 100%; height: auto; aspect-ratio: var(--hc-blog-ratio, 3 / 2); object-fit: cover; }

/* 25.6 footer: contact rows with a hanging icon - Text widget paragraphs that start with an icon, link weight, small note line */
.helioro-footer-wrapper .textwidget p:has(> i:first-child),
.helioro-footer-wrapper .textwidget p:has(> a:first-child > i:first-child),
.helioro-contact-rows p:has(> i:first-child),
.helioro-contact-rows p:has(> a:first-child > i:first-child){ position: relative; padding-left: 28px; }
.helioro-footer-wrapper .textwidget p > i:first-child,
.helioro-footer-wrapper .textwidget p > a:first-child > i:first-child,
.helioro-contact-rows p > i:first-child,
.helioro-contact-rows p > a:first-child > i:first-child{ position: absolute; left: 0; top: .3em; width: 16px; margin-right: 0 !important; text-align: center; }
.helioro-footer-grid .helioro-footer-wrapper .widget_nav_menu ul li{ font-weight: var(--helioro-footer-link-weight, 500); }
.helioro-note{ display: block; font-family: var(--helioro-font-meta, inherit); font-size: 11px; font-weight: 500; line-height: 1.5; letter-spacing: 1px; text-transform: uppercase; color: var(--helioro-muted); }
.helioro-footer-wrapper .helioro-note{ color: rgba(255, 255, 255, .55); }

/* 25.7 PixeBuilder helpers: full-width button, text left + arrow right button, column rules behind a section, dimmed image,
 outline accordion disc + ink rule above the first row */
.pixe-item-button.helioro-btn-full > .pixe-button{ display: flex; box-sizing: border-box; width: 100%; justify-content: center; }
.pixe-item-button.helioro-btn-split > .pixe-button{ display: inline-flex; box-sizing: border-box; min-width: var(--helioro-btn-min, 300px); justify-content: space-between; }
.pixe-item-button.helioro-btn-full.helioro-btn-split > .pixe-button{ display: flex; min-width: 0; }
@media only screen and (max-width: 767px){ .pixe-item-button.helioro-btn-split > .pixe-button{ min-width: 0; width: 100%; } }
/* faint vertical rules on the 1280 rail: helioro-bg-cols = 4 columns, add helioro-bg-cols-3 for 3 */
.helioro-bg-cols{ position: relative; --helioro-cols-n: 4; }
.helioro-bg-cols.helioro-bg-cols-3{ --helioro-cols-n: 3; }
.helioro-bg-cols:before{ content: ""; position: absolute; top: 0; bottom: 0; left: 50%; z-index: 0; box-sizing: border-box; width: min(1280px, 100% - 80px); transform: translateX(-50%);
	border-right: 1px solid var(--helioro-cols-line, var(--helioro-line)); pointer-events: none;
	background: repeating-linear-gradient(90deg, var(--helioro-cols-line, var(--helioro-line)) 0 1px, transparent 1px calc(100% / var(--helioro-cols-n))); }
.helioro-on-dark.helioro-bg-cols,
.helioro-on-dark .helioro-bg-cols{ --helioro-cols-line: rgba(255, 255, 255, .08); }
@media only screen and (max-width: 999px){ .helioro-bg-cols:before{ width: calc(100% - 60px); } }
@media only screen and (max-width: 767px){ .helioro-bg-cols:before{ display: none; } }
.helioro-dim{ opacity: .55; }
.helioro-dim-img img{ opacity: .55; }
.helioro-acc-outline{ --ha-icon-size: 40px; --ha-icon-bg: transparent; --ha-icon-border: var(--helioro-line); --ha-icon-color: var(--helioro-ink);
	--ha-icon-active-bg: var(--helioro-ink); --ha-icon-active-color: #ffffff; }
.helioro-on-dark .helioro-acc-outline,
.helioro-on-dark.helioro-acc-outline{ --ha-icon-border: rgba(255, 255, 255, .24); --ha-icon-color: #ffffff; --ha-icon-active-bg: #ffffff; --ha-icon-active-color: var(--helioro-ink); }
.helioro-body .pixe-item.helioro-acc-top-rule .pixe-accordion:first-child,
.helioro-body .helioro-acc-top-rule .gdlr-core-accordion-item-tab:first-child,
.helioro-body .helioro-acc-top-rule .gdlr-core-toggle-box-item-tab:first-child{ border-top: 1px solid var(--helioro-ink); }
/* full-width button on phones only - add helioro-btn-full-mobile to the PixeBuilder button item */
@media only screen and (max-width: 767px){
	.pixe-item-button.helioro-btn-full-mobile > .pixe-button{ display: flex; box-sizing: border-box; width: 100%; justify-content: center; }
}
/* 1000 to 1199 three-up row: helioro-bento-third on the columns of a helioro-bento wrapper, e.g. a 5-up timeline becomes 3 + 2 */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-body .helioro-bento .pixe-column.helioro-bento-third{ width: 33.3333%; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-third ~ .pixe-column.helioro-bento-third ~ .pixe-column.helioro-bento-third ~ .pixe-column.helioro-bento-third > .pixe-column-content{ margin-top: var(--hb-gap, 24px); }
	/* helioro-bento-half: two per row for a run of 4 or 6 equal columns, gutters 0 and 8px by odd and even, 16px gap from the second row */
	.helioro-body .helioro-bento .pixe-column.helioro-bento-half{ width: 50%; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-half:nth-child(odd of .helioro-bento-half) > .pixe-column-content{ margin-left: 0; margin-right: var(--hb-gutter, 8px); }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-half:nth-child(even of .helioro-bento-half) > .pixe-column-content{ margin-left: var(--hb-gutter, 8px); margin-right: 0; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-half ~ .pixe-column.helioro-bento-half ~ .pixe-column.helioro-bento-half > .pixe-column-content{ margin-top: var(--hb-gap, 16px); }
}
/* menu row note on a dark header: add helioro-on-dark to the span */
.helioro-nav-note.helioro-on-dark{ color: rgba(255, 255, 255, .78); }
.helioro-nav-note.helioro-on-dark a{ color: #ffffff; }

/* ===================================================================
 * 26. Theme round 5 - demos 2 to 4: bento gap tokens, flush / loose rows, accordion joined / roomy / accent outline and the
 * open first row line, table head plain / top align / square highlight with a rule / solid check, engineering card image ratio,
 * stripes over a PixeBuilder background, background image off on phones, quote bar arrow, sticky menu row text, panel close.
 * Classes: build/THEME-STYLE-GUIDE.md section 3.
 * =================================================================== */

/* 26.1 bento gaps 1000-1199: stack, wide, half, third and join read --hb-gap = row gap and --hb-gutter = half the column gap.
 A modifier works on the helioro-bento wrapper or on any column, and reaches every bento column inside it.
   helioro-bento-flush      row gap 0, column gap 0 - photo, text and spec cells inside one framed card, ruled registers
   helioro-bento-loose      row gap 40px, column gap 32px - a 4-up stage grid that becomes 2 + 2
   helioro-bento-gap-0 / -gap-24 / -gap-36   row gap only
   helioro-bento-pad-b0     column: bottom padding 0 in this range
   helioro-bento-rule-top   column: its left hairline turns into a top hairline in this range - a side panel that stacks under */
.helioro-bento-flush{ --hb-gap: 0px; --hb-gutter: 0px; }
.helioro-bento-loose{ --hb-gap: 40px; --hb-gutter: 16px; }
.helioro-bento-gap-0{ --hb-gap: 0px; }
.helioro-bento-gap-24{ --hb-gap: 24px; }
.helioro-bento-gap-36{ --hb-gap: 36px; }
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-body .helioro-bento .pixe-column.helioro-bento-pad-b0 > .pixe-column-content{ padding-bottom: 0; }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-rule-top > .pixe-column-content > .pixe-bg-style{ border-left-width: 0; border-top-width: 1px; border-top-style: solid; }
}

/* 26.2 accordions
   helioro-acc-joined          with -numbered or -rounded: rows touch, no side borders, a hairline under every row and one above the group
   helioro-acc-roomy           26px row padding, 14px from an open question to its answer
   helioro-acc-outline-accent  use instead of -outline: outlined 40px disc, the open disc fills with the accent
   the open first row of -hairline keeps its top line */
.helioro-acc-joined{ --ha-gap: 0px; --ha-radius: 0px; --ha-bg: transparent; --ha-active-bg: transparent; }
.helioro-body .pixe-item.helioro-acc-joined .pixe-accordion,
.helioro-body .pixe-item.helioro-acc-joined .pixe-accordion.pixe-active,
.helioro-body .helioro-acc-joined .gdlr-core-accordion-item-tab,
.helioro-body .helioro-acc-joined .gdlr-core-accordion-item-tab.gdlr-core-active,
.helioro-body .helioro-acc-joined .gdlr-core-toggle-box-item-tab,
.helioro-body .helioro-acc-joined .gdlr-core-toggle-box-item-tab.gdlr-core-active{ margin-bottom: 0; border-width: 0 0 1px; border-style: solid; border-color: var(--helioro-line); border-radius: 0; }
.helioro-body .pixe-item.helioro-acc-joined .pixe-accordion:first-child,
.helioro-body .helioro-acc-joined .gdlr-core-accordion-item-tab:first-child,
.helioro-body .helioro-acc-joined .gdlr-core-toggle-box-item-tab:first-child{ border-top-width: 1px; }
.helioro-on-dark .helioro-acc-joined,
.helioro-on-dark.helioro-acc-joined{ --helioro-line: rgba(255, 255, 255, .16); }

.helioro-acc-roomy{ --ha-pad: 26px var(--ha-pad-x, 0px); }
.helioro-body .pixe-item.helioro-acc-roomy .pixe-accordion.pixe-active .pixe-accordion-title{ padding-bottom: 14px; }
.helioro-body .helioro-acc-roomy .gdlr-core-accordion-item .gdlr-core-accordion-item-content,
.helioro-body .helioro-acc-roomy .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-content{ padding-top: 14px; }
@media only screen and (max-width: 767px){ .helioro-acc-roomy{ --ha-pad: 22px var(--ha-pad-x, 0px); } }

.helioro-acc-outline-accent{ --ha-icon-size: 40px; --ha-icon-bg: transparent; --ha-icon-border: var(--helioro-line); --ha-icon-color: var(--helioro-ink);
	--ha-icon-active-bg: var(--helioro-accent); --ha-icon-active-color: var(--helioro-on-accent); }
.helioro-on-dark .helioro-acc-outline-accent,
.helioro-on-dark.helioro-acc-outline-accent{ --ha-icon-border: rgba(255, 255, 255, .24); --ha-icon-color: #ffffff; }

.pixe-item.helioro-acc-hairline:not(.helioro-acc-between):not(.helioro-acc-top-rule) .pixe-accordion.pixe-active:first-child,
.helioro-acc-hairline:not(.helioro-acc-between):not(.helioro-acc-top-rule) .gdlr-core-accordion-item .gdlr-core-accordion-item-tab.gdlr-core-active:first-child,
.helioro-acc-hairline:not(.helioro-acc-between):not(.helioro-acc-top-rule) .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-tab.gdlr-core-active:first-child{ border-top-color: var(--helioro-line); }

/* 26.3 tables
   helioro-table-head-plain  head row without the tint - transparent on a dark table, the card white on a light one
   helioro-table-top         cells align to the top - a 2-line value beside a 1-line key
   helioro-table-hl-rule     the highlighted head cell gets a 3px accent rule on top and square corners
   helioro-table-square      now also squares the highlighted head and foot cells
   helioro-table-yes-solid   every helioro-yes in the table is drawn solid, see 26.4 */
.helioro-body .helioro-table-head-plain thead td,
.helioro-body .helioro-table-head-plain thead th{ background: transparent; }
.helioro-body .helioro-table-top td,
.helioro-body .helioro-table-top th{ vertical-align: top; }
.helioro-body .helioro-table-hl-rule.helioro-table-hl-2 thead tr > *:nth-child(2),
.helioro-body .helioro-table-hl-rule.helioro-table-hl-3 thead tr > *:nth-child(3),
.helioro-body .helioro-table-hl-rule.helioro-table-hl-4 thead tr > *:nth-child(4),
.helioro-body .helioro-table-hl-rule.helioro-table-hl-5 thead tr > *:nth-child(5){ box-shadow: inset 0 3px 0 var(--helioro-accent); border-radius: 0; }
.helioro-body .helioro-table-square.helioro-table-hl-2 thead tr > *:nth-child(2),
.helioro-body .helioro-table-square.helioro-table-hl-3 thead tr > *:nth-child(3),
.helioro-body .helioro-table-square.helioro-table-hl-4 thead tr > *:nth-child(4),
.helioro-body .helioro-table-square.helioro-table-hl-5 thead tr > *:nth-child(5),
.helioro-body .helioro-table-square.helioro-table-hl-2 tfoot tr:last-child > *:nth-child(2),
.helioro-body .helioro-table-square.helioro-table-hl-3 tfoot tr:last-child > *:nth-child(3),
.helioro-body .helioro-table-square.helioro-table-hl-4 tfoot tr:last-child > *:nth-child(4),
.helioro-body .helioro-table-square.helioro-table-hl-5 tfoot tr:last-child > *:nth-child(5){ border-radius: 0; }

/* 26.4 solid check: <span class="helioro-yes helioro-yes-solid"></span>, or helioro-table-yes-solid on the table item -
 20px accent square on a square Button Radius, a disc on a round one, check in the label colour on the accent */
.helioro-yes.helioro-yes-solid,
.helioro-table-yes-solid .helioro-yes{ width: 20px; height: 20px; border-radius: min(var(--helioro-radius-button), 50%); background: var(--helioro-accent); }
.helioro-yes.helioro-yes-solid:before,
.helioro-table-yes-solid .helioro-yes:before{ background-color: var(--helioro-on-accent); }

/* 26.5 engineering portfolio grid: every card image the same 16 / 10 crop - token --hc-port-ratio */
.helioro-cards-engineering .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img{ width: 100%; height: auto; aspect-ratio: var(--hc-port-ratio, 16 / 10); object-fit: cover; }

/* 26.6 PixeBuilder background helpers
   helioro-bg-stripes on a title item now also wins over its Background colour set in PixeBuilder, e.g. a legend swatch
   helioro-bg-none-mobile  column or wrapper: its background image is hidden under 768px, the colour stays */
.helioro-body .pixe-item.helioro-bg-stripes{ background-image: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .28) 0 6px, transparent 6px 12px); }
@media only screen and (max-width: 767px){
	.helioro-bg-none-mobile > .pixe-column-content > .pixe-bg-style .pixe-bg-inner,
	.helioro-bg-none-mobile > .pixe-bg-style .pixe-bg-inner{ display: none; }
}

/* 26.7 labelled quote bar: the submit arrow, same mask and colour as the other submit buttons, off with Arrow On Form Submit Buttons = disable */
[class*="helioro-form-"] .helioro-cf7-bar{ position: relative; }
.helioro-body [class*="helioro-form-"] .helioro-cf7-bar input[type="submit"]{ padding-right: var(--hf-arrow-pad, 48px); }
[class*="helioro-form-"] .helioro-cf7-bar:after{ content: ""; position: absolute; z-index: 1; top: 50%; right: calc(var(--hf-joined-pad, 6px) + 24px); width: 13px; height: 13px; margin-top: -6.5px;
	display: var(--hf-arrow-display, block); pointer-events: none; background-color: var(--hf-btn-color);
	-webkit-mask: var(--hf-arrow) center / contain no-repeat; mask: var(--hf-arrow) center / contain no-repeat; transition: background-color var(--helioro-fast); }
[class*="helioro-form-"] .helioro-cf7-bar:has(input[type="submit"]:hover):after{ background-color: var(--hf-btn-hover-color, #ffffff); }
@media only screen and (max-width: 767px){
	[class*="helioro-form-"] .helioro-cf7-bar:after{ top: auto; bottom: calc(var(--hf-joined-pad, 6px) + 17.5px); margin-top: 0; }
}

/* 26.8 sticky header: the menu row left text hides while the center logo row is fixed - the sticky logo takes the left end */
.helioro-header-wrap.helioro-fixed-navigation .helioro-nav-left-text{ display: none; }

/* 26.9 list panel close: square or disc with a 1px line, the hover lightens the line and never fills, so a tap that opens the
 panel under the finger shows no filled square on touch screens */
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close:hover,
.helioro-mpanel-list .helioro-mm-menu-wrap .mm-navbar .mmenu-custom-close:focus{ border-color: rgba(255, 255, 255, .6); background-color: rgba(255, 255, 255, .06); color: #ffffff; }

/* 26.10 table extras
   helioro-table-stack-grid  with helioro-table-stack: under 768px no card per row - every row = first cell full width over a 2-column
                             grid of the other cells, hairlines between rows, for a table inside a white tile - put a phone-only
                             label item in each value cell
   helioro-table-last-rule   the last body row keeps its bottom hairline */
.helioro-body .helioro-table-last-rule tbody tr:last-child > td,
.helioro-body .helioro-table-last-rule tbody tr:last-child > th{ border-bottom: 1px solid var(--helioro-line); }
@media only screen and (max-width: 767px){
	.helioro-body .helioro-table-stack.helioro-table-stack-grid table{ border: 0; border-radius: 0; background: transparent; }
	.helioro-body .helioro-table-stack.helioro-table-stack-grid tbody tr{ display: grid; grid-template-columns: repeat(var(--hts-cols, 2), minmax(0, 1fr)); gap: 14px 16px; margin: 0; padding: 18px 20px;
		border: 0; border-bottom: 1px solid var(--helioro-line); border-radius: 0; background: transparent; overflow: visible; }
	.helioro-body .helioro-table-stack.helioro-table-stack-grid tbody tr:last-child{ border-bottom: 0; }
	.helioro-body .helioro-table-stack.helioro-table-stack-grid tbody tr > td{ width: auto; padding: 0; border: 0; background: transparent; }
	.helioro-body .helioro-table-stack.helioro-table-stack-grid tbody tr > td:first-child{ grid-column: 1 / -1; background: transparent; }
	.helioro-body .helioro-table-stack.helioro-table-stack-grid tbody tr:last-child > td{ border-bottom: 0; }
}

/* 26.11 CF7 extras
   helioro-cf7-tiles-plain  with helioro-cf7-tiles: a checked tile stays on the field ground, accent border, the native box fills accent
   helioro-cf7-rows-20      on the CF7 item or a wrapper: 20px between grid cells and between the blocks of the form */
.helioro-cf7-tiles.helioro-cf7-tiles-plain .wpcf7-list-item label:has(input:checked),
.helioro-cf7-tiles-plain .helioro-cf7-tiles .wpcf7-list-item label:has(input:checked){ border-color: var(--helioro-accent); background: var(--hf-bg, #ffffff); }
.helioro-body .helioro-cf7-rows-20 .helioro-cf7-grid{ gap: 20px; }
.helioro-body .helioro-cf7-rows-20 .wpcf7 form > p,
.helioro-body .helioro-cf7-rows-20 .wpcf7 form > div:not(.wpcf7-response-output):not(.hidden-fields-container){ margin-top: 0; margin-bottom: 20px; }
.helioro-body .helioro-cf7-rows-20 .wpcf7 form > div.helioro-cf7-grid:not(.wpcf7-response-output):has(+ .wpcf7-response-output){ margin-bottom: 0; }

/* 26.12 e-mail links in a bento section, 1000-1199: the link steps down 6 % so a long address keeps one line in a narrow tile
 instead of breaking inside the address */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-body .helioro-bento .pixe-item-link a[href^="mailto:"],
	.helioro-body .helioro-bento a.pixe-text-link[href^="mailto:"]{ zoom: .94; }
}

/* 26.13 numbered accordion rows: a wrapped question keeps a hanging indent - its second line starts under the text, not under the number.
   helioro-acc-no-top  with helioro-acc-joined: no hairline above the first row, for a group that already sits under its own rule */
.pixe-item.helioro-acc-numbered .pixe-accordion-title .pixe-text{ padding-left: 38px; text-indent: -38px; }
.pixe-item.helioro-acc-numbered .pixe-accordion-title .pixe-text:before{ text-indent: 0; }
.helioro-acc-numbered .gdlr-core-accordion-item .gdlr-core-accordion-item-title,
.helioro-acc-numbered .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-title{ padding-left: 48px; text-indent: -48px; }
.helioro-acc-numbered .gdlr-core-accordion-item .gdlr-core-accordion-item-title:before,
.helioro-acc-numbered .gdlr-core-toggle-box-item .gdlr-core-toggle-box-item-title:before{ text-indent: 0; }
.helioro-body .pixe-item.helioro-acc-joined.helioro-acc-no-top .pixe-accordion:first-child,
.helioro-body .helioro-acc-joined.helioro-acc-no-top .gdlr-core-accordion-item-tab:first-child,
.helioro-body .helioro-acc-joined.helioro-acc-no-top .gdlr-core-toggle-box-item-tab:first-child{ border-top-width: 0; }

/* ===================================================================
 * 27. Theme round 6 - demos 2 to 4: CF7 group heads, drop zone, radio cards, ink tiles and submit, search bar,
 * 1000-1199 visibility, text step and fw3 grid step, third-row gutters, light sheet inside a dark band, pager,
 * roles accordion columns and chips, chip glyphs, personnel role line, accent shadow, 3-column stacked table.
 * Classes: build/THEME-STYLE-GUIDE.md section 3, v1.7 rows.
 * =================================================================== */

/* 27.1 bento: third-row gutters, column gap tokens, a 1000-1199-only item, a smaller text step, fw3 card grids two-up.
   helioro-bento-third   side margins follow an even 3-up pattern - a row start sits on the rail, a row end too;
                         the column gap is --hb-col-gap, default 0 - gaps then come from the column padding
   helioro-bento-col-16 / -col-24 / -col-32   wrapper or column: --hb-col-gap for the third columns inside
   helioro-bento-only    item or column: shown only between 1000px and 1199px, any wrapper
   helioro-bento-small   item or column: text and icons step down 10 percent between 1000px and 1199px, any wrapper
   helioro-bento-grid2   PixeBuilder item or wrapper around an fw3 portfolio, blog or personnel grid of 4, 5 or 6 columns:
                         two cards per row between 1000px and 1199px */
.helioro-bento-col-16{ --hb-col-gap: 16px; }
.helioro-bento-col-24{ --hb-col-gap: 24px; }
.helioro-bento-col-32{ --hb-col-gap: 32px; }
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-body .helioro-bento .pixe-column.helioro-bento-third:nth-child(3n+1 of .helioro-bento-third) > .pixe-column-content{ margin-left: 0; margin-right: calc(var(--hb-col-gap, 0px) * 2 / 3); }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-third:nth-child(3n+2 of .helioro-bento-third) > .pixe-column-content{ margin-left: calc(var(--hb-col-gap, 0px) / 3); margin-right: calc(var(--hb-col-gap, 0px) / 3); }
	.helioro-body .helioro-bento .pixe-column.helioro-bento-third:nth-child(3n of .helioro-bento-third) > .pixe-column-content{ margin-left: calc(var(--hb-col-gap, 0px) * 2 / 3); margin-right: 0; }
	.helioro-body .helioro-bento-small{ zoom: .9; }
	.helioro-body .helioro-bento-grid2 :is(.gdlr-core-portfolio-item-holder, .gdlr-core-blog-item-holder, .gdlr-core-personnel-item-holder) > .gdlr-core-item-list:is(.gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10){ width: 50%; clear: none; }
	.helioro-body .helioro-bento-grid2 :is(.gdlr-core-portfolio-item-holder, .gdlr-core-blog-item-holder, .gdlr-core-personnel-item-holder) > .gdlr-core-item-list:is(.gdlr-core-column-15, .gdlr-core-column-12, .gdlr-core-column-10):nth-child(2n+1){ clear: left; }
}
@media only screen and (max-width: 999px), only screen and (min-width: 1200px){
	.helioro-body .helioro-bento-only{ display: none !important; }
}

/* 27.2 helioro-on-light inside a helioro-on-dark band: the light tokens come back - a white table sheet on a navy grid band.
   The body keeps a copy of each palette token, the reset reads it */
.helioro-body{ --helioro-line-l: var(--helioro-line); --helioro-card-l: var(--helioro-card); --helioro-ground-l: var(--helioro-ground); --helioro-muted-l: var(--helioro-muted); --helioro-text-l: var(--helioro-text); }
.helioro-on-dark .helioro-on-light,
.helioro-on-dark.helioro-on-light{ --helioro-line: var(--helioro-line-l); --helioro-card: var(--helioro-card-l); --helioro-ground: var(--helioro-ground-l); --helioro-muted: var(--helioro-muted-l); --helioro-text: var(--helioro-text-l);
	--ha-icon-border: var(--helioro-line-l); --ha-icon-color: var(--helioro-ink); --hc-arrow-bg: var(--helioro-ground-l); }
.helioro-on-dark .helioro-on-light .helioro-table thead td,
.helioro-on-dark .helioro-on-light .helioro-table thead th,
.helioro-on-dark .helioro-table.helioro-on-light thead td,
.helioro-on-dark .helioro-table.helioro-on-light thead th,
.helioro-on-dark .helioro-on-light .gdlr-core-blog-title a,
.helioro-on-dark .helioro-on-light .gdlr-core-portfolio-title a,
.helioro-on-dark .helioro-on-light .gdlr-core-personnel-list-title a,
.helioro-on-dark .helioro-on-light .gdlr-core-accordion-item-title,
.helioro-on-dark .helioro-on-light .gdlr-core-toggle-box-item-title{ color: var(--helioro-ink); }

/* 27.3 CF7 group heads. Template, one full grid row:
   <p class="helioro-cf7-full helioro-cf7-legend"><span class="helioro-cf7-step">A</span><span class="helioro-cf7-legend-title">Company</span><span class="helioro-note helioro-cf7-legend-hint">Who we reply to</span></p>
   = letter tile, title in the heading font, hint right - hidden under 768px - and a soft rule under the row.
   helioro-cf7-legend-top on the same p: a step label row instead - soft rule above, 14px padding, the label in
   <span class="helioro-note">01 · You</span> at 12px / 600 / 2px tracking, no rule under */
.helioro-body .wpcf7 .helioro-cf7-legend,
.helioro-cf7-legend{ display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 0; padding: 0 0 12px; border-bottom: 1px solid color-mix(in srgb, var(--helioro-line) 60%, var(--helioro-card)); }
.helioro-cf7-legend > br{ display: none; }
.helioro-cf7-step{ display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: min(var(--helioro-radius-button), 50%);
	background: var(--helioro-ink); color: #ffffff; font-family: var(--helioro-font-meta, monospace); font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: 0; }
.helioro-cf7-legend-title{ font-family: var(--helioro-font-heading, inherit); font-size: 18px; font-weight: 600; line-height: 1.3; letter-spacing: -0.2px; white-space: nowrap; color: var(--helioro-ink); }
.helioro-cf7-legend-hint{ margin-left: auto; text-align: right; }
.helioro-body .wpcf7 .helioro-cf7-legend.helioro-cf7-legend-top,
.helioro-cf7-legend.helioro-cf7-legend-top{ padding: 14px 0 0; border-bottom: 0; border-top: 1px solid color-mix(in srgb, var(--helioro-line) 60%, var(--helioro-card)); }
.helioro-cf7-legend-top .helioro-note{ font-size: 12px; font-weight: 600; letter-spacing: 2px; }
.helioro-on-dark .helioro-cf7-step{ background: #ffffff; color: var(--helioro-ink); }
.helioro-on-dark .helioro-cf7-legend-title{ color: #ffffff; }
@media only screen and (max-width: 767px){ .helioro-cf7-legend-hint{ display: none; } }

/* 27.4 CF7 drop zone. Template, outside any other label:
   <label class="helioro-cf7-drop"><span class="helioro-cf7-drop-icon"></span><span class="helioro-cf7-drop-text"><b>Drop 12 months of bills</b><small>CSV, XLSX or PDF · up to 20 MB</small></span><span class="helioro-cf7-drop-btn">Browse Files</span>[file energy-data …]</label>
   The file field covers the whole tile, so a click or a dropped file both land on it; the chosen file names replace the
   hint - js/script-core.js. helioro-cf7-drop-disc on the label: a 44px round icon instead of the 52px tile */
[class*="helioro-form-"] .wpcf7 .helioro-cf7-drop,
.helioro-cf7-drop{ position: relative; display: flex; align-items: center; gap: 16px; box-sizing: border-box; width: 100%; margin: 0; padding: 22px;
	border: 1px dashed var(--helioro-line); border-radius: min(var(--hf-area-radius, 14px), 20px); background: color-mix(in srgb, var(--helioro-accent-soft) 35%, var(--helioro-card));
	font-family: var(--helioro-font-body, inherit); font-size: 14px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--helioro-text); cursor: pointer;
	transition: border-color var(--helioro-fast), background-color var(--helioro-fast); }
.helioro-cf7-drop > br{ display: none; }
.helioro-cf7-drop:hover,
.helioro-cf7-drop.helioro-drag{ border-color: var(--helioro-accent); }
.helioro-cf7-drop:focus-within{ border-style: solid; border-color: var(--helioro-ink); box-shadow: 0 0 0 2px var(--helioro-card), 0 0 0 4px var(--helioro-ink); }
.helioro-cf7-drop.helioro-has-file{ border-style: solid; border-color: var(--helioro-accent); }
.helioro-cf7-drop-icon{ position: relative; flex: 0 0 auto; width: 52px; height: 52px; border-radius: min(var(--helioro-radius-button), 50%); background: var(--helioro-accent-soft); }
.helioro-cf7-drop-icon:before{ content: ""; position: absolute; top: 50%; left: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; background-color: var(--helioro-accent-dark);
	-webkit-mask: var(--helioro-ico-upload) center / contain no-repeat; mask: var(--helioro-ico-upload) center / contain no-repeat; }
.helioro-cf7-drop.helioro-cf7-drop-disc .helioro-cf7-drop-icon{ width: 44px; height: 44px; border-radius: 50%; }
.helioro-cf7-drop-text{ display: flex; flex: 1 1 auto; flex-direction: column; gap: 4px; min-width: 0; }
.helioro-cf7-drop-text b{ font-family: var(--helioro-font-body, inherit); font-size: 15px; font-weight: 600; line-height: 1.35; letter-spacing: 0; text-transform: none; color: var(--helioro-ink); }
.helioro-cf7-drop-text small{ font-family: var(--helioro-font-body, inherit); font-size: 13px; line-height: 1.45; letter-spacing: 0; text-transform: none; color: var(--helioro-muted); overflow-wrap: anywhere; }
.helioro-cf7-drop-btn{ flex: 0 0 auto; padding: 10px 16px; border: 1px solid var(--helioro-ink); border-radius: var(--hf-btn-radius, var(--helioro-radius-button)); color: var(--helioro-ink);
	font-family: var(--helioro-font-body, inherit); font-size: 14px; font-weight: 600; line-height: 1.2; letter-spacing: 0; text-transform: none; white-space: nowrap; transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-cf7-drop:hover .helioro-cf7-drop-btn{ background: var(--helioro-ink); color: #ffffff; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-drop .wpcf7-form-control-wrap,
.helioro-cf7-drop .wpcf7-form-control-wrap{ position: static; margin: 0; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-drop .wpcf7-form-control-wrap:before{ display: none; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-drop input[type="file"],
.helioro-cf7-drop input[type="file"]{ position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; }
.helioro-cf7-drop .wpcf7-not-valid-tip{ position: absolute; left: 0; top: 100%; margin-top: 6px; }
@media only screen and (max-width: 479px){
	[class*="helioro-form-"] .wpcf7 .helioro-cf7-drop,
	.helioro-cf7-drop{ gap: 14px; padding: 18px; }
	.helioro-cf7-drop-btn{ display: none; }
}

/* 27.5 CF7 choice and submit looks - on the CF7 item, a wrapper or the tiles div
   helioro-cf7-tiles-cards  with helioro-cf7-tiles: equal cards in one row at every width, the control top right, label at the bottom
   helioro-cf7-tiles-ink    a checked tile gets an ink border on the accent-soft fill, the native controls are ink
   helioro-cf7-submit-ink   ink submit with a white label, hover lifts to a lighter ink
   helioro-cf7-rule-solid   the submit row rule is a 1px solid hairline instead of the dotted one
   helioro-form-tall        52px fields and submit on the square and underline looks
   helioro-form-body-text   field text in the body font; consent and single checkbox lines in the body font, sentence case */
.helioro-cf7-tiles-cards .wpcf7-radio,
.helioro-cf7-tiles-cards .wpcf7-checkbox,
.helioro-cf7-tiles-cards.helioro-cf7-tiles .wpcf7-radio,
.helioro-cf7-tiles-cards.helioro-cf7-tiles .wpcf7-checkbox{ display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 10px; }
.helioro-cf7-tiles-cards .wpcf7-list-item{ display: block; min-width: 0; }
.helioro-body .helioro-cf7-tiles-cards .wpcf7-list-item label{ position: relative; display: flex; box-sizing: border-box; height: 100%; min-height: 96px; flex-direction: column; align-items: flex-start; justify-content: flex-end;
	gap: 0; padding: 16px 44px 16px 18px; line-height: 1.3; }
.helioro-body .helioro-cf7-tiles-cards .wpcf7-list-item input{ position: absolute; top: 16px; right: 16px; margin: 0; }
@media only screen and (max-width: 479px){ .helioro-body .helioro-cf7-tiles-cards .wpcf7-list-item label{ min-height: 84px; padding: 14px 12px; font-size: 13px; } .helioro-body .helioro-cf7-tiles-cards .wpcf7-list-item input{ top: 12px; right: 12px; } }
.helioro-body .helioro-cf7-tiles-ink .wpcf7-list-item label:has(input:checked),
.helioro-body .helioro-cf7-tiles-ink.helioro-cf7-tiles .wpcf7-list-item label:has(input:checked){ border-color: var(--helioro-ink); background: var(--helioro-accent-soft); }
.helioro-cf7-tiles-ink .wpcf7 input[type="checkbox"],
.helioro-cf7-tiles-ink .wpcf7 input[type="radio"],
.helioro-cf7-tiles-ink.helioro-cf7-tiles input,
.helioro-body .helioro-cf7-tiles-ink .helioro-cf7-tiles .wpcf7-list-item input{ accent-color: var(--helioro-ink); }
.helioro-cf7-submit-ink{ --hf-btn-bg: var(--helioro-ink); --hf-btn-color: #ffffff; --hf-btn-hover-bg: color-mix(in srgb, var(--helioro-ink) 82%, #ffffff); --hf-btn-hover-color: #ffffff; }
.helioro-body .helioro-cf7-rule-solid .wpcf7 p.helioro-cf7-submit-row,
.helioro-body .wpcf7 p.helioro-cf7-submit-row.helioro-cf7-rule-solid{ border-top: 1px solid var(--helioro-line); }
.helioro-form-tall{ --hf-height: 52px; --hf-joined-h: 50px; }
.helioro-body .helioro-form-body-text .wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.helioro-body .helioro-form-body-text .wpcf7 select,
.helioro-body .helioro-form-body-text .wpcf7 textarea{ font-family: var(--helioro-font-body, inherit); font-size: 15px; letter-spacing: 0; }
.helioro-body .helioro-form-body-text .wpcf7 .wpcf7-acceptance label,
.helioro-body .helioro-form-body-text .wpcf7 .wpcf7-checkbox:not(.helioro-cf7-tiles *) label{ display: inline-flex; align-items: flex-start; gap: 10px; margin: 0;
	font-family: var(--helioro-font-body, inherit); font-size: 14px; font-weight: 400; line-height: 1.5; letter-spacing: 0; text-transform: none; color: var(--helioro-text); }
.helioro-body .helioro-form-body-text .wpcf7 .wpcf7-acceptance input,
.helioro-body .helioro-form-body-text .wpcf7 .wpcf7-checkbox:not(.helioro-cf7-tiles *) input{ flex-shrink: 0; margin: 3px 0 0; }
.helioro-body .helioro-form-body-text .wpcf7 .wpcf7-acceptance .wpcf7-list-item,
.helioro-body .helioro-form-body-text .wpcf7 .wpcf7-checkbox:not(.helioro-cf7-tiles *) .wpcf7-list-item{ margin: 0; }

/* 27.6 search bar on any search form - an html-code item or a Text widget:
   <form role="search" class="helioro-search-bar" method="get" action="/"><i class="fa fa-search" aria-hidden="true"></i>
   <label class="screen-reader-text" for="s-notes">Search the notes</label><input id="s-notes" type="search" name="s" placeholder="Search…">
   <input type="hidden" name="post_type" value="post"><button type="submit">Search</button></form>
   hairline field on the card colour, ink submit inside it - meta font, uppercase on the engineering card look -,
   --helioro-search-max sets the width cap, default 440px */
.helioro-body form.helioro-search-bar{ position: relative; display: flex; align-items: center; gap: 10px; box-sizing: border-box; width: 100%; max-width: var(--helioro-search-max, 440px); margin: 0;
	padding: 6px 6px 6px 16px; border: 1px solid var(--helioro-line); border-radius: min(var(--helioro-radius-button), 30px); background: var(--helioro-card); transition: border-color var(--helioro-fast), box-shadow var(--helioro-fast); }
.helioro-body form.helioro-search-bar:focus-within{ border-color: var(--helioro-ink); box-shadow: 0 0 0 1px var(--helioro-ink); }
.helioro-body form.helioro-search-bar > i{ flex: 0 0 auto; font-size: 15px; color: var(--helioro-muted); }
.helioro-body form.helioro-search-bar .screen-reader-text{ position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.helioro-body form.helioro-search-bar input[type="search"],
.helioro-body form.helioro-search-bar input[type="text"]{ flex: 1 1 auto; min-width: 0; height: 38px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; outline: none;
	font-family: var(--helioro-font-body, inherit); font-size: 15px; color: var(--helioro-ink); }
.helioro-body form.helioro-search-bar input[type="search"]::placeholder{ color: var(--helioro-muted); opacity: 1; }
.helioro-body form.helioro-search-bar input[type="search"]::-webkit-search-cancel-button{ -webkit-appearance: none; }
.helioro-body form.helioro-search-bar button,
.helioro-body form.helioro-search-bar input[type="submit"]{ flex: 0 0 auto; height: 36px; margin: 0; padding: 0 16px; border: 0; border-radius: min(var(--helioro-radius-button), 24px); background: var(--helioro-ink); color: #ffffff;
	font-family: var(--helioro-font-body, inherit); font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none; cursor: pointer; transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-body form.helioro-search-bar button:hover,
.helioro-body form.helioro-search-bar input[type="submit"]:hover{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-cards-engineering form.helioro-search-bar button,
.helioro-cards-engineering form.helioro-search-bar input[type="submit"]{ height: 32px; padding: 0 14px; font-family: var(--helioro-font-meta, monospace); font-size: 11px; font-weight: 500; letter-spacing: .88px; text-transform: uppercase; }
.helioro-on-dark form.helioro-search-bar{ border-color: rgba(255, 255, 255, .24); background: rgba(255, 255, 255, .06); }
.helioro-on-dark form.helioro-search-bar input[type="search"]{ color: #ffffff; }
.helioro-on-dark form.helioro-search-bar button{ background: #ffffff; color: var(--helioro-ink); }

/* 27.7 fw3-blog on dark and the thumbnail chip.
   An fw3-blog inside helioro-on-dark: title white, excerpt and meta in the on-dark text tokens - Left Thumbnail featured row on an ink panel.
   Editorial and architectural thumbnail category chip: label in --helioro-on-accent on the accent pill - ink on a light accent */
.helioro-body .helioro-on-dark .gdlr-core-blog-item :is(.gdlr-core-blog-medium, .gdlr-core-blog-grid, .gdlr-core-blog-list) .gdlr-core-blog-title a{ color: #ffffff; }
.helioro-body .helioro-on-dark .gdlr-core-blog-item :is(.gdlr-core-blog-medium, .gdlr-core-blog-grid, .gdlr-core-blog-list) .gdlr-core-blog-title a:hover{ color: var(--helioro-accent); }
.helioro-body .helioro-on-dark .gdlr-core-blog-item :is(.gdlr-core-blog-medium, .gdlr-core-blog-grid, .gdlr-core-blog-list) .gdlr-core-blog-content{ color: var(--helioro-text); }
.helioro-body .helioro-on-dark .gdlr-core-blog-item .gdlr-core-blog-medium-content-wrapper .gdlr-core-blog-info,
.helioro-body .helioro-on-dark .gdlr-core-blog-item .gdlr-core-blog-medium-content-wrapper .gdlr-core-blog-info a,
.helioro-body .helioro-on-dark .gdlr-core-blog-item .gdlr-core-blog-grid-content-wrap .gdlr-core-blog-info,
.helioro-body .helioro-on-dark .gdlr-core-blog-item .gdlr-core-blog-grid-content-wrap .gdlr-core-blog-info a{ color: var(--helioro-muted); }
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category{ background-color: var(--helioro-accent); }
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category,
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a,
.helioro-cards-editorial .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a:hover,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a,
.helioro-cards-architectural .gdlr-core-blog-item .gdlr-core-blog-thumbnail .gdlr-core-blog-info-category a:hover{ color: var(--helioro-on-accent) !important; }

/* 27.8 pager: FW3 Pagination Style circle / circle-border draws round buttons on every card look;
   helioro-pager-rule on the PixeBuilder item around the fw3 list: a hairline above the pager */
[class*="helioro-cards-"] .gdlr-core-pagination:is(.gdlr-core-style-circle, .gdlr-core-style-circle-border) :is(a, span){ width: var(--hc-page-size, 44px); min-width: 0; padding: 0; border-radius: 50%; }
.helioro-pager-rule .gdlr-core-pagination{ margin-top: 8px; padding-top: 32px; border-top: 1px solid var(--helioro-line); }

/* 27.9 roles accordion and chips
   helioro-acc-roles-cols   with helioro-acc-roles: every row from 768px shares one track set - title 1fr, chips 36 percent left aligned,
                            pay 110px right - so chips and pay line up from row to row; 768-999: chips 46 percent, pay 84px;
                            tokens --helioro-role-chips-w / -pay-w and their -tablet twins
   helioro-role-chips-outline  accordion item or any wrapper: role chips outlined, 40px radius, no fill
   tokens --helioro-role-chip-bg / -border / -radius on any wrapper for other chip looks
   the ink rule of helioro-acc-top-rule now also wins with helioro-acc-joined, open first row included */
@media only screen and (min-width: 768px){
	.helioro-acc-roles-cols .pixe-accordion-title .pixe-text:has(> .helioro-role-main){ flex: 1 1 auto; min-width: 0; }
	.helioro-acc-roles-cols .pixe-accordion-title .pixe-text:has(> .helioro-role-main),
	.helioro-acc-roles-cols .gdlr-core-accordion-item-title:has(> .helioro-role-main){ display: grid; grid-template-columns: minmax(0, 1fr) var(--helioro-role-chips-w, 36%) var(--helioro-role-pay-w, 110px); align-items: center; column-gap: 28px; }
	.helioro-acc-roles-cols .helioro-role-chips,
	.helioro-acc-roles-cols .helioro-role-pay{ margin-top: 0; }
	.helioro-acc-roles-cols .helioro-role-pay{ text-align: right; }
}
@media only screen and (min-width: 768px) and (max-width: 999px){
	.helioro-acc-roles-cols .pixe-accordion-title .pixe-text:has(> .helioro-role-main),
	.helioro-acc-roles-cols .gdlr-core-accordion-item-title:has(> .helioro-role-main){ grid-template-columns: minmax(0, 1fr) var(--helioro-role-chips-w-tablet, 46%) var(--helioro-role-pay-w-tablet, 84px); column-gap: 16px; }
}
.helioro-role-chips-outline{ --helioro-role-chip-bg: transparent; --helioro-role-chip-border: var(--helioro-line); --helioro-role-chip-radius: 40px; }
.helioro-body .pixe-item.helioro-acc-top-rule.helioro-acc-joined .pixe-accordion:first-child,
.helioro-body .pixe-item.helioro-acc-top-rule.helioro-acc-joined .pixe-accordion.pixe-active:first-child,
.helioro-body .helioro-acc-top-rule.helioro-acc-joined .gdlr-core-accordion-item-tab:first-child,
.helioro-body .helioro-acc-top-rule.helioro-acc-joined .gdlr-core-accordion-item-tab.gdlr-core-active:first-child,
.helioro-body .helioro-acc-top-rule.helioro-acc-joined .gdlr-core-toggle-box-item-tab:first-child,
.helioro-body .helioro-acc-top-rule.helioro-acc-joined .gdlr-core-toggle-box-item-tab.gdlr-core-active:first-child{ border-top: 1px solid var(--helioro-ink); }

/* 27.10 chip glyphs: helioro-glyph-users / -pin / -clock / -wallet / -calendar on a helioro-chip or helioro-role-chip span -
   a 14px line icon before the text in the text colour; --helioro-glyph-color recolours it */
.helioro-glyph-users{ --helioro-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E"); }
.helioro-glyph-pin{ --helioro-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E"); }
.helioro-glyph-clock{ --helioro-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E"); }
.helioro-glyph-wallet{ --helioro-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12V7H5a2 2 0 0 1 0-4h14v4'/%3E%3Cpath d='M3 5v14a2 2 0 0 0 2 2h16v-5'/%3E%3Cpath d='M18 12a2 2 0 0 0 0 4h4v-4Z'/%3E%3C/svg%3E"); }
.helioro-glyph-calendar{ --helioro-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E"); }
.helioro-glyph-users:before,
.helioro-glyph-pin:before,
.helioro-glyph-clock:before,
.helioro-glyph-wallet:before,
.helioro-glyph-calendar:before{ content: ""; display: inline-block; flex-shrink: 0; width: 14px; height: 14px; vertical-align: -2px; background-color: var(--helioro-glyph-color, currentColor);
	-webkit-mask: var(--helioro-glyph) center / contain no-repeat; mask: var(--helioro-glyph) center / contain no-repeat; }

/* 27.11 personnel and chips
   helioro-person-role-plain  PixeBuilder item around fw3-personnel: the position line in the body font, 14px / 600, sentence case,
                              accent dark - token --hc-person-role-color - readable on a light accent
   helioro-chips-tint         wrapper or item: light chips get a 6 percent ink tint instead of the ground colour, for chips on a ground section */
.helioro-body .helioro-person-role-plain .gdlr-core-personnel-item .gdlr-core-personnel-list-position{ font-family: var(--helioro-font-body, inherit); font-size: 14px; font-weight: 600; line-height: 1.4; letter-spacing: 0; text-transform: none;
	color: var(--hc-person-role-color, var(--helioro-accent-dark)); }
.helioro-body .helioro-chips-tint .helioro-chip:not(.helioro-on-dark),
.helioro-body .helioro-chips-tint .helioro-role-chip{ background: rgba(var(--helioro-ink-rgb), .06); }

/* 27.12 helioro-shadow-accent on a PixeBuilder column: a soft accent glow under the painted box - a featured tile on an ink band,
   where the ink shadows do not show. helioro-table-stack-grid-3 with helioro-table-stack-grid: three value columns under 768px */
.pixe-column.helioro-shadow-accent{ box-shadow: none; }
.pixe-column.helioro-shadow-accent > .pixe-column-content{ box-shadow: 0 40px 80px -40px color-mix(in srgb, var(--helioro-accent) 30%, transparent); }
.helioro-table-stack-grid-3{ --hts-cols: 3; }

/* ===================================================================
 * 28. v1.8 - single post template, archives, search, cards
 * =================================================================== */

/* 28.1 core Table block in post content - style-core sets figure line-height 0 for images, a figure.wp-block-table
   then printed every cell at line-height 0 and the rows overprinted. Kit cells keep their padding against the core
   .wp-block-table td rule; core head and foot rules are removed. */
.helioro-body figure.wp-block-table{ line-height: inherit; }
.helioro-body .wp-block-table.helioro-table thead,
.helioro-body .wp-block-table.helioro-table tfoot{ border: 0; }
.helioro-body .wp-block-table.helioro-table td,
.helioro-body .wp-block-table.helioro-table th{ padding: 16px 20px; }
/* helioro-table-head-caps: head cells in 12px caps, accent dark */
.helioro-body .helioro-table-head-caps thead td,
.helioro-body .helioro-table-head-caps thead th{ font-size: 12px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; color: var(--helioro-accent-dark); }
@media only screen and (max-width: 767px){
	.helioro-body .wp-block-table.helioro-table td,
	.helioro-body .wp-block-table.helioro-table th{ padding: 12px 14px; }
	/* a stacked table in post content: the sideways scroll rule no longer keeps long first-cell lines on one line */
	.helioro-single-article-content .helioro-table-stack table,
	.helioro-single-article-content .helioro-table-stack td,
	.helioro-single-article-content .helioro-table-stack th{ white-space: normal; }
	/* helioro-table-wrap: the table fits the column on phones - cells wrap, no sideways scroll */
	.helioro-single-article-content .helioro-table-wrap table,
	.helioro-body .helioro-table-wrap.helioro-table-scroll table{ display: table; width: 100%; overflow: visible; white-space: normal; }
	.helioro-body .helioro-table-wrap td,
	.helioro-body .helioro-table-wrap th{ white-space: normal; }
}

/* 28.2 single post title band - General > Helioro Blog > Single Post Title Band Tone: dark, body class helioro-blog-title-dark */
.helioro-blog-title-dark .helioro-blog-title-wrap .helioro-single-article-excerpt{ color: rgba(255, 255, 255, .78); }
.helioro-blog-title-dark .helioro-blog-title-wrap .helioro-kit-breadcrumb{ border-color: rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .62); }
.helioro-blog-title-dark .helioro-blog-title-wrap .helioro-kit-breadcrumb a{ color: #ffffff; }
.helioro-blog-title-dark .helioro-blog-title-wrap .helioro-kit-breadcrumb a:hover{ color: var(--helioro-accent-light); }
/* Single Post Breadcrumb Style: text - 12px caps crumbs, a 32px accent rule between them, the last crumb in accent */
.helioro-breadcrumb-text .helioro-kit-breadcrumb{ gap: 14px; padding: 0; border: 0; border-radius: 0; background: transparent; font-size: 12px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; }
.helioro-blog-title-dark.helioro-breadcrumb-text .helioro-blog-title-wrap .helioro-kit-breadcrumb{ border: 0; background: transparent; }
.helioro-breadcrumb-text .helioro-kit-breadcrumb .helioro-breadcrumb-sep{ width: 32px; height: 1px; opacity: 1; background-color: var(--helioro-accent); -webkit-mask: none; mask: none; }
.helioro-breadcrumb-text .helioro-kit-breadcrumb a{ color: var(--helioro-muted); }
.helioro-breadcrumb-text .helioro-kit-breadcrumb > :last-child{ color: var(--helioro-accent-dark); }
.helioro-blog-title-dark.helioro-breadcrumb-text .helioro-blog-title-wrap .helioro-kit-breadcrumb a{ color: rgba(255, 255, 255, .62); }
.helioro-blog-title-dark.helioro-breadcrumb-text .helioro-blog-title-wrap .helioro-kit-breadcrumb > :last-child{ color: var(--helioro-accent-light); }
.helioro-breadcrumb-text .helioro-kit-breadcrumb a:hover,
.helioro-blog-title-dark.helioro-breadcrumb-text .helioro-blog-title-wrap .helioro-kit-breadcrumb a:hover{ color: var(--helioro-accent); }

/* 28.3 sticky left rail - General > Helioro Blog > Sticky Left Rail, body class helioro-single-rail-on.
   The rail sits in the left margin of the article column from 1280px, the column itself does not move; a helioro-toc
   Group in the post is hidden while the rail shows its own contents list. */
.helioro-single-rail{ display: none; }
@media only screen and (min-width: 1280px){
	.helioro-single-rail-on .helioro-single-article-content{ position: relative; }
	.helioro-single-rail-on .helioro-single-rail{ display: block; position: absolute; top: 0; bottom: 0; right: calc(100% + 48px); width: 200px; }
	.helioro-single-rail-on .helioro-single-article-content .helioro-toc{ display: none; }
}
@media only screen and (min-width: 1400px){
	.helioro-single-rail-on .helioro-single-rail{ right: calc(100% + 64px); width: 220px; }
}
.helioro-single-rail-inner{ position: sticky; top: var(--helioro-rail-top, 120px); display: flex; flex-direction: column; gap: 28px; font-size: 14px; line-height: 1.5; color: var(--helioro-text); }
.helioro-single-rail-author{ display: flex; align-items: center; gap: 12px; }
.helioro-single-rail-avatar{ flex-shrink: 0; width: 48px; height: 48px; }
.helioro-single-rail-avatar img{ display: block; width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.helioro-single-rail-author-text{ display: flex; flex-direction: column; min-width: 0; }
.helioro-single-article-content .helioro-single-rail a.helioro-single-rail-name{ font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--helioro-ink); text-decoration: none; }
.helioro-single-article-content .helioro-single-rail a.helioro-single-rail-name:hover{ color: var(--helioro-accent-dark); }
.helioro-single-rail-role{ font-size: 13px; line-height: 1.4; color: var(--helioro-muted); }
.helioro-single-rail-meta{ display: flex; flex-direction: column; gap: 4px; margin-top: -12px; padding-top: 16px; border-top: 1px solid var(--helioro-line); font-size: 13px; color: var(--helioro-muted); }
.helioro-single-rail-label{ margin-bottom: 10px; font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: 1.2px; text-transform: uppercase; color: var(--helioro-muted); }
.helioro-single-article-content .helioro-single-rail-toc ol{ margin: 0; }
.helioro-single-article-content .helioro-single-rail-toc ol > li{ margin: 0; padding: 9px 0 9px 28px; border-top: 1px solid var(--helioro-line); font-size: 14px; font-weight: 500; line-height: 1.4; }
.helioro-single-article-content .helioro-single-rail-toc ol > li:before{ top: 9px; font-size: 11px; line-height: 1.75; }
.helioro-single-article-content .helioro-single-rail-toc a{ color: var(--helioro-ink); text-decoration: none; transition: color var(--helioro-fast); }
.helioro-single-article-content .helioro-single-rail-toc a:hover{ color: var(--helioro-accent-dark); }
.helioro-single-article-content .helioro-single-rail-share .gdlr-core-social-share-item{ margin: 0; padding: 0; }
.helioro-single-article-content .helioro-single-rail-share .gdlr-core-social-share-item a{ display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; margin: 0 6px 6px 0; padding: 0;
	border: 1px solid var(--helioro-line); border-radius: 50%; background: var(--helioro-card); font-size: 14px; color: var(--helioro-ink); text-decoration: none;
	transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-single-article-content .helioro-single-rail-share .gdlr-core-social-share-item a:hover{ border-color: var(--helioro-ink); background: var(--helioro-ink); color: #ffffff; }
.helioro-single-rail-share .gdlr-core-social-share-count,
.helioro-single-rail-share .gdlr-core-social-share-head{ display: none; }

/* 28.4 related posts band - General > Helioro Blog > Related Posts Band: sand or dark, full width, painted with a spread shadow
   so the page never scrolls sideways. Related Posts Thumbnails: disable = text cards with a hairline on top. */
.helioro-related-band-sand .helioro-single-related-post-wrap,
.helioro-related-band-dark .helioro-single-related-post-wrap{ margin-top: 32px; margin-bottom: 72px; padding-top: 72px; padding-bottom: 56px;
	background: var(--helioro-band); box-shadow: 0 0 0 100vmax var(--helioro-band); clip-path: inset(0 -100vmax); }
.helioro-related-band-sand .helioro-single-related-post-wrap{ --helioro-band: var(--helioro-sand); }
.helioro-related-band-dark .helioro-single-related-post-wrap{ --helioro-band: var(--helioro-ink);
	--helioro-line: rgba(255, 255, 255, .16); --helioro-card: rgba(255, 255, 255, .06); --helioro-ground: rgba(255, 255, 255, .06);
	--helioro-muted: rgba(255, 255, 255, .64); --helioro-text: rgba(255, 255, 255, .78); --hc-arrow-bg: rgba(255, 255, 255, .1); --hc-arrow-fg: #ffffff; color: var(--helioro-text); }
.helioro-related-band-dark .helioro-single-related-post-title{ color: #ffffff; }
.helioro-related-band-dark .helioro-single-related-post-caption{ color: #ffffff; }
.helioro-related-band-dark .helioro-single-related-post-button{ border-color: rgba(255, 255, 255, .5); color: #ffffff; }
.helioro-related-band-dark .helioro-single-related-post-button:hover{ border-color: #ffffff; background: #ffffff; color: var(--helioro-ink); }
.helioro-body.helioro-related-band-dark .helioro-related-blog-item.gdlr-core-blog-item .gdlr-core-blog-title a{ color: #ffffff; }
.helioro-body.helioro-related-band-dark .helioro-related-blog-item.gdlr-core-blog-item .gdlr-core-blog-title a:hover{ color: var(--helioro-accent-light); }
.helioro-body.helioro-related-band-dark .helioro-related-blog-item.gdlr-core-blog-item :is(.gdlr-core-blog-content, .gdlr-core-blog-info, .gdlr-core-blog-info a){ color: var(--helioro-muted); }
.helioro-related-no-thumb .helioro-related-blog-item .gdlr-core-blog-thumbnail{ display: none; }
.helioro-related-no-thumb .helioro-related-blog-item .gdlr-core-blog-grid{ padding-top: 20px; border-top: 1px solid var(--helioro-line); }
@media only screen and (max-width: 767px){
	.helioro-related-band-sand .helioro-single-related-post-wrap,
	.helioro-related-band-dark .helioro-single-related-post-wrap{ margin-bottom: 48px; padding-top: 48px; padding-bottom: 32px; }
}

/* 28.5 closing CTA row - the main tile text follows --helioro-on-accent, ink on a light accent.
   helioro-cta-row-dark   on the row: ink main tile, accent button, the side tile one step lighter
   helioro-cta-side-ink   on the row: the side tile only turns ink - accent main tile beside a night tile */
.helioro-cta-main a:not(.helioro-cta-button){ color: inherit; text-decoration: underline; }
.helioro-cta-row-dark .helioro-cta-main{ background: var(--helioro-ink); color: rgba(255, 255, 255, .78); }
.helioro-cta-row-dark .helioro-cta-main h2,
.helioro-cta-row-dark .helioro-cta-main h3{ color: #ffffff; }
.helioro-cta-row-dark .helioro-cta-button{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-cta-row-dark .helioro-cta-button:hover{ background: #ffffff; color: var(--helioro-ink); }
.helioro-cta-row-dark .helioro-cta-side,
.helioro-cta-side-ink .helioro-cta-side{ background: var(--helioro-ink); color: rgba(255, 255, 255, .72); }
.helioro-cta-row-dark .helioro-cta-side{ background: color-mix(in srgb, var(--helioro-ink) 88%, #ffffff); }
.helioro-cta-row-dark .helioro-cta-side :is(h3, h4),
.helioro-cta-side-ink .helioro-cta-side :is(h3, h4){ color: #ffffff; }
.helioro-cta-row-dark .helioro-cta-side .helioro-chip,
.helioro-cta-side-ink .helioro-cta-side .helioro-chip{ border-color: rgba(255, 255, 255, .16); background: rgba(255, 255, 255, .06); color: #ffffff; }
.helioro-cta-row-dark .helioro-cta-side .helioro-chip:hover,
.helioro-cta-side-ink .helioro-cta-side .helioro-chip:hover{ border-color: var(--helioro-accent-light); }

/* 28.6 post content block classes - Additional CSS class of the block
   helioro-lead          paragraph: 26px heading-font lead, ink
   helioro-stat-soft     with helioro-stat-tile: accent-soft tile, ink figure
   helioro-stat-big      with helioro-stat-tile: 52px figure
   helioro-quote-ink     Quote block: ink tile, white text, accent disc
   helioro-quote-accent  Quote block: accent tile, --helioro-on-accent text
   helioro-check-list    List block: an accent check disc on every item */
.helioro-single-article-content p.helioro-lead,
.helioro-single-article-content .helioro-lead p{ margin-bottom: 28px; font-family: var(--helioro-font-heading, inherit); font-size: 26px; line-height: 1.45; letter-spacing: -0.2px; color: var(--helioro-ink); }
.helioro-stat-tile.helioro-stat-soft{ background: var(--helioro-accent-soft); color: var(--helioro-text); }
.helioro-stat-tile.helioro-stat-soft :is(h1, h2, h3, h4){ color: var(--helioro-ink); }
.helioro-stat-tile.helioro-stat-soft.wp-block-columns > .wp-block-column + .wp-block-column,
.helioro-stat-tile.helioro-stat-soft > .wp-block-group__inner-container > * + *{ border-left-color: rgba(var(--helioro-ink-rgb), .16); }
.helioro-stat-tile.helioro-stat-big :is(h1, h2, h3, h4, .has-x-large-font-size){ font-size: 52px; line-height: 1; letter-spacing: -1.4px; }
.helioro-single-article-content .wp-block-quote.helioro-quote-ink{ background: var(--helioro-ink); color: #ffffff; }
.helioro-single-article-content .wp-block-quote.helioro-quote-ink cite{ color: rgba(255, 255, 255, .7); }
.helioro-single-article-content .wp-block-quote.helioro-quote-ink:after{ background-color: var(--helioro-on-accent); }
.helioro-single-article-content .wp-block-quote.helioro-quote-accent{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-single-article-content .wp-block-quote.helioro-quote-accent:before{ background-color: color-mix(in srgb, var(--helioro-on-accent) 16%, transparent); }
.helioro-single-article-content .wp-block-quote.helioro-quote-accent:after{ background-color: var(--helioro-on-accent); }
.helioro-single-article-content .wp-block-quote.helioro-quote-accent cite{ color: color-mix(in srgb, var(--helioro-on-accent) 72%, transparent); }
.helioro-single-article-content ul.helioro-check-list > li{ padding-left: 34px; }
.helioro-single-article-content ul.helioro-check-list > li:before{ left: 0; top: calc(.875em - 10px); width: 20px; height: 20px; box-shadow: none; background: var(--helioro-accent); }
.helioro-single-article-content ul.helioro-check-list > li:after{ content: ""; position: absolute; left: 5px; top: calc(.875em - 5px); width: 10px; height: 10px; background-color: var(--helioro-on-accent);
	-webkit-mask: var(--helioro-ico-check) center / contain no-repeat; mask: var(--helioro-ico-check) center / contain no-repeat; }
@media only screen and (max-width: 767px){
	.helioro-single-article-content p.helioro-lead,
	.helioro-single-article-content .helioro-lead p{ font-size: 21px; }
	.helioro-stat-tile.helioro-stat-big :is(h1, h2, h3, h4, .has-x-large-font-size){ font-size: 40px; }
}

/* 28.7 featured image corners and caption - General > Helioro Blog > Featured Image Corners: top-left, Caption Align */
.helioro-body.helioro-single-thumb-tl .helioro-single-article .helioro-single-article-thumbnail img{ border-radius: 240px 2px 2px 2px; }
.helioro-single-caption-left .helioro-single-article-thumbnail-caption{ text-align: left; }
.helioro-single-caption-right .helioro-single-article-thumbnail-caption{ text-align: right; }
@media only screen and (max-width: 999px){ .helioro-body.helioro-single-thumb-tl .helioro-single-article .helioro-single-article-thumbnail img{ border-radius: 160px 2px 2px 2px; } }
@media only screen and (max-width: 767px){ .helioro-body.helioro-single-thumb-tl .helioro-single-article .helioro-single-article-thumbnail img{ border-radius: 96px 2px 2px 2px; } }

/* 28.8 archive title and 404 on dark - Archive / Search Page Title Style: plain dark, 404 Page Style: kit dark.
   For demos with a transparent header and white menu text. */
body.helioro-archive-title-dark .helioro-page-title-wrap{ background-color: var(--helioro-ink); }
body.helioro-archive-title-dark .helioro-page-title-wrap .helioro-page-title{ background: rgba(255, 255, 255, .08); color: #ffffff; }
body.helioro-archive-title-dark .helioro-page-title-wrap .helioro-page-caption{ color: #ffffff; }
body.helioro-archive-title-dark .helioro-page-title-wrap .helioro-page-title-content{ padding-bottom: 56px; }
.helioro-404-dark .helioro-not-found-wrap{ background-color: var(--helioro-ink); }
.helioro-404-dark .helioro-not-found-wrap :is(.helioro-not-found-head, .helioro-not-found-title){ color: #ffffff; }
.helioro-404-dark .helioro-not-found-wrap .helioro-not-found-caption{ color: rgba(255, 255, 255, .72); }
.helioro-404-dark .helioro-not-found-wrap form.search-form input.search-field{ border-color: rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .06); color: #ffffff; }
.helioro-404-dark .helioro-not-found-wrap input::placeholder{ color: rgba(255, 255, 255, .5); }
.helioro-404-dark .helioro-not-found-wrap form.search-form .helioro-top-search-submit{ color: #ffffff; }
.helioro-404-dark .helioro-not-found-wrap .helioro-not-found-back-to-home a{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-404-dark .helioro-not-found-wrap .helioro-not-found-back-to-home a:hover{ background: #ffffff; color: var(--helioro-ink); }

/* 28.9 fw3 cards
   editorial portfolio Grid: every image the same crop, token --hc-port-ratio, default 4 / 3 - card heights line up
   helioro-port-crop        on the fw3-portfolio item: the same crop on any card look
   helioro-port-tag-below   on the fw3-portfolio item: the tag line under the title, 12px caps in accent dark
   helioro-feature-ratio    on an fw3-blog Left Thumbnail item: the featured photo cropped 8 / 7, 5 / 3 under 1000px, 10 / 9 on phones
   helioro-filter-pill      on a fw3 item with the Button filterer: round chips
   helioro-filter-wrap      with it: chips wrap on phones instead of one scrolling row */
.helioro-cards-editorial .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img,
.helioro-port-crop .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img,
.helioro-port-crop.gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img{ width: 100%; height: auto; aspect-ratio: var(--hc-port-ratio, 4 / 3); object-fit: cover; }
[class*="helioro-cards-"] .helioro-port-tag-below .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-info-tag,
[class*="helioro-cards-"] .helioro-port-tag-below.gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-info-tag{ order: 0; margin: -6px 0 14px; font-size: 12px; font-style: normal; letter-spacing: 1.2px; color: var(--helioro-accent-dark); }
.helioro-feature-ratio .gdlr-core-blog-medium .gdlr-core-blog-thumbnail img{ width: 100%; height: auto; aspect-ratio: var(--hc-feature-ratio, 8 / 7); object-fit: cover; }
[class*="helioro-cards-"] .helioro-filter-pill .gdlr-core-filterer-wrap.gdlr-core-style-button a.gdlr-core-filterer{ border-radius: 40px; }
@media only screen and (max-width: 999px){ .helioro-feature-ratio{ --hc-feature-ratio: 5 / 3; } }
@media only screen and (max-width: 767px){
	.helioro-feature-ratio{ --hc-feature-ratio: 10 / 9; }
	[class*="helioro-cards-"] .helioro-filter-wrap .gdlr-core-filterer-wrap.gdlr-core-style-button{ flex-wrap: wrap; overflow: visible; }
}

/* 28.10 CF7 helioro-cf7-submit-light: a light submit on a dark card - the footer button colours, white by default */
.helioro-cf7-submit-light{ --hf-btn-bg: var(--helioro-footer-btn-bg, #ffffff); --hf-btn-color: var(--helioro-footer-btn-color, var(--helioro-ink)); --hf-btn-hover-bg: #ffffff; --hf-btn-hover-color: var(--helioro-ink); }

/* ===================================================================
 * 29. v1.9 - demo audit fixes: anchors, focus, forms, personnel top, archives, panel CTA
 * =================================================================== */

/* 29.1 anchor targets land below the sticky bar - the theme script writes --helioro-anchor-offset from the real bar height */
.helioro-body :is(h1, h2, h3, h4, h5, h6)[id],
.helioro-body .pixe-wrapper[id]{ scroll-margin-top: var(--helioro-anchor-offset, 100px); }

/* 29.2 focus ring on PixeBuilder buttons: ink line plus a white halo, so the ring reads on light and on dark sections alike.
   The plugin resets the button shadow, the halo is restored here. */
html body.helioro-body .pixe-item-button a:focus-visible,
html body.helioro-body .pixe-item-button button:focus-visible{ outline: 2px solid var(--helioro-focus-ring); outline-offset: 2px; box-shadow: 0 0 0 4px var(--helioro-focus-halo); }
/* dark wrappers marked helioro-on-dark or helioro-form-dark: light ring, no halo */
html body.helioro-body :is(.helioro-on-dark, .helioro-form-dark) .pixe-item-button :is(a, button):focus-visible,
html body.helioro-body .helioro-form-dark :is(input, select, textarea, button):focus-visible{ outline-color: var(--helioro-accent-light); box-shadow: none; }
html body.helioro-body .helioro-on-dark .pixe-accordion:has(> .pixe-accordion-title:focus-visible){ outline-color: var(--helioro-accent-light); }

/* 29.3 CF7 invalid state: one danger border on every field type, the tip in danger colour, sentence case in the body font */
[class*="helioro-form-"]{ --hf-danger: #c0392b; }
.helioro-form-dark,
.helioro-footer-wrapper [class*="helioro-form-"],
.helioro-form-dark [class*="helioro-form-"]{ --hf-danger: #ff9d8f; }
[class*="helioro-form-"] .wpcf7 :is(input, select, textarea).wpcf7-not-valid{ border-color: var(--hf-danger); }
[class*="helioro-form-"] .wpcf7 span.wpcf7-not-valid-tip{ display: block; margin: 6px 0 0; color: var(--hf-danger); font-family: var(--helioro-font-body, inherit); font-size: 13px; font-weight: 500;
	line-height: 1.4; letter-spacing: 0; text-transform: none; }
[class*="helioro-form-"] .wpcf7 form.invalid .wpcf7-response-output,
[class*="helioro-form-"] .wpcf7 form.unaccepted .wpcf7-response-output{ border-color: var(--hf-danger); }
.helioro-cf7-drop .wpcf7-not-valid-tip{ width: max-content; max-width: 100%; white-space: normal; }
/* inline row: the tip sits under the frame, the joined frame takes the danger line, the arrow stays in the button */
.helioro-cf7-inline .wpcf7-form-control-wrap{ position: static; }
[class*="helioro-form-"] .wpcf7 .helioro-cf7-inline span.wpcf7-not-valid-tip{ position: absolute; left: 0; top: 100%; margin-top: 8px; }
.helioro-cf7-inline:has(.wpcf7-not-valid-tip){ margin-bottom: 28px; }
.helioro-form-pill .helioro-cf7-inline.helioro-cf7-joined:has(.wpcf7-not-valid),
.helioro-form-dark .helioro-cf7-inline.helioro-cf7-joined:has(.wpcf7-not-valid),
.helioro-form-on-accent .helioro-cf7-inline.helioro-cf7-joined:has(.wpcf7-not-valid){ border-color: var(--hf-danger); }

/* 29.4 single personnel under a transparent header - General > Personnel Style > Single Personnel Top Band,
   body class helioro-personnel-top-dark: the header area is painted ink so white menu text stays readable */
.helioro-personnel-top-dark .helioro-header-background-transparent{ background-color: var(--helioro-ink); }

/* 29.5 single post title line height - General > Helioro Blog > Single Post Title Line Height writes the value */

/* 29.6 blog title band without the stock photo - overlay at 100 percent hides it anyway, body class helioro-blog-title-no-photo */
.helioro-blog-title-no-photo .helioro-blog-title-wrap:not(.helioro-feature-image){ background-image: none; }

/* 29.7 archive kit cards: every thumbnail in the same crop so meta and titles line up - token --hc-archive-ratio, default 4 / 3 */
.helioro-archive-kit-cards .gdlr-core-blog-grid .gdlr-core-blog-thumbnail img,
.helioro-archive-kit-cards .gdlr-core-portfolio-item-style-grid .gdlr-core-portfolio-thumbnail img{ width: 100%; height: auto; aspect-ratio: var(--hc-archive-ratio, 4 / 3); object-fit: cover; }

/* 29.8 phone filter strip: an edge fade while more chips sit off screen - the theme script adds helioro-filter-more */
@media only screen and (max-width: 767px){
	[class*="helioro-cards-"] .gdlr-core-filterer-wrap.gdlr-core-style-button.helioro-filter-more{
		-webkit-mask-image: linear-gradient(to right, #000 calc(100% - 56px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 56px), transparent); }
}

/* 29.9 mobile panel CTA: a flex row so the arrow shows, and on the list look it ends on the item hairlines */
.helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta > .mm-listitem__text{ display: flex; align-items: center; }
.helioro-mpanel-list .helioro-mm-menu-wrap.mm-menu .mm-listitem.helioro-menu-cta{ margin-inline-end: var(--helioro-mm-cta-inset, 20px); }

/* 29.10 center-logo sticky bar between 1000 and 1199: the logo is hidden there, the menu needs the full row - as the bar sticky logo */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-animate-fixed-navigation.helioro-header-style-plain.helioro-style-center-logo .helioro-logo{ display: none; }
}

/* 29.11 visually hidden text anywhere: helioro-sr-only, or WordPress screen-reader-text inside a kit form */
.helioro-body .helioro-sr-only,
.helioro-body [class*="helioro-form-"] .screen-reader-text{ position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* ===================================================================
 * 30. v2.0 - remix demos: compact header for every style, header icons, menu bar lines, burger, forms, WooCommerce cards
 * Options: General > Helioro Style. Classes: build/THEME-STYLE-GUIDE.md section 3, v2.0.
 * =================================================================== */

/* 30.1 compact header 1000-1199: the right button hides on the splitted menu by default, on every style with "hide",
   a top bar span with helioro-hide-1199 hides too; the bar and bar2 menu row becomes a non-wrapping flex row */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-header-compact:not(.helioro-compact-btn-keep) .helioro-header-style-plain.helioro-style-splitted-menu .helioro-main-menu-right-button,
	.helioro-header-compact.helioro-compact-btn-hide .helioro-header-wrap .helioro-main-menu-right-button,
	.helioro-header-compact.helioro-compact-btn-hide .helioro-header-wrap .helioro-header-right-text .helioro-main-menu-right-button{ display: none; }
	.helioro-header-compact .helioro-top-bar .helioro-hide-1199,
	.helioro-header-compact .helioro-header-wrap .helioro-hide-1199{ display: none; }
	.helioro-header-compact .helioro-top-bar-container-inner{ display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 24px; }
	.helioro-header-compact .helioro-top-bar-container-inner:before,
	.helioro-header-compact .helioro-top-bar-container-inner:after{ display: none; }
	.helioro-header-compact .helioro-top-bar-left,
	.helioro-header-compact .helioro-top-bar-right{ float: none; min-width: 0; white-space: nowrap; }
	.helioro-header-compact .helioro-top-bar-left{ flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; }
	.helioro-header-compact .helioro-top-bar-right{ flex: 0 0 auto; margin-left: auto; }

	.helioro-header-compact:not(.helioro-header-btn-block) .helioro-navigation-bar-wrap .helioro-navigation{ display: flex; flex-wrap: nowrap; align-items: flex-start; }
	.helioro-header-compact:not(.helioro-header-btn-block) .helioro-navigation-bar-wrap .helioro-navigation:before,
	.helioro-header-compact:not(.helioro-header-btn-block) .helioro-navigation-bar-wrap .helioro-navigation:after{ display: none; }
	.helioro-header-compact:not(.helioro-header-btn-block) .helioro-navigation-bar-wrap .helioro-main-menu{ flex: 0 1 auto; min-width: 0; padding-left: 20px; padding-right: 12px; white-space: nowrap; }
	.helioro-header-compact:not(.helioro-header-btn-block) .helioro-navigation-bar-wrap .helioro-main-menu-right-wrap{ float: none; flex: 0 0 auto; margin-left: auto; padding-left: 0; padding-right: 16px; }
	.helioro-header-compact:not(.helioro-header-btn-block) .helioro-navigation-bar-wrap .helioro-main-menu-right-button[class*="helioro-style-"]{ margin-left: 12px; }
}

/* 30.2 menu bar lines - the top border colour option now wins over Divider Color, General > Helioro Style > Navigation Bar Bottom Line */
.helioro-nav-bar-line-bottom .helioro-navigation-bar-wrap{ border-bottom-width: 1px; border-bottom-style: solid; }

/* 30.3 header contact blocks on a dark logo row: add helioro-on-dark next to helioro-header-contact */
.helioro-header-contact.helioro-on-dark > span > span,
.helioro-header-contact.helioro-on-dark > a > span{ color: #ffffff; }
.helioro-header-contact.helioro-on-dark > span > span > span:first-child,
.helioro-header-contact.helioro-on-dark > a > span > span:first-child{ color: rgba(255, 255, 255, .64); }
.helioro-header-contact.helioro-on-dark > span > i,
.helioro-header-contact.helioro-on-dark > a > i{ border-color: rgba(255, 255, 255, .16); }
.helioro-header-contact.helioro-contact-round > span > i,
.helioro-header-contact.helioro-contact-round > a > i{ width: 40px; height: 40px; border-radius: 50%; }
.helioro-header-contact.helioro-contact-label-plain > span > span > span:first-child,
.helioro-header-contact.helioro-contact-label-plain > a > span > span:first-child,
.helioro-header-contact.helioro-contact-label-plain .helioro-header-contact-label{ font-size: 12.5px; letter-spacing: 0; text-transform: none; }

/* 30.4 header icons - General > Helioro Style > Header Search / Cart / Account Icons: circle */
.helioro-main-menu-account{ float: left; margin-top: -5px; margin-left: 22px; }
.helioro-main-menu-account a{ color: inherit; }
.helioro-main-menu-account i{ font-size: 15px; }
.helioro-header-icons-circle .helioro-main-menu-right-wrap{ display: flex; flex-wrap: nowrap; align-items: center; gap: 10px; }
.helioro-header-icons-circle .helioro-main-menu-right-wrap:before,
.helioro-header-icons-circle .helioro-main-menu-right-wrap:after{ display: none; }
.helioro-header-icons-circle .helioro-main-menu-right-wrap .helioro-main-menu-right-button[class*="helioro-style-"]{ margin-top: 0; margin-left: 6px; }
.helioro-header-icons-circle .helioro-main-menu-search,
.helioro-header-icons-circle .helioro-main-menu-account,
.helioro-header-icons-circle .helioro-main-menu-cart{ position: relative; float: none; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; box-sizing: border-box;
	width: 44px; height: 44px; margin: 0; padding: 0; border: 1px solid var(--helioro-line); border-radius: 50%; line-height: 1; cursor: pointer;
	transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-header-icons-circle .helioro-main-menu-search i,
.helioro-header-icons-circle .helioro-main-menu-account i,
.helioro-header-icons-circle .helioro-main-menu-cart i{ margin: 0; font-size: 16px; line-height: 1; }
.helioro-header-icons-circle .helioro-main-menu-account a{ display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 50%; }
.helioro-header-icons-circle .helioro-main-menu-search:hover,
.helioro-header-icons-circle .helioro-main-menu-account:hover{ border-color: var(--helioro-ink); }
.helioro-header-icons-circle .helioro-main-menu-cart{ border-color: var(--helioro-ink); background-color: var(--helioro-ink); }
.helioro-body.helioro-header-icons-circle .helioro-main-menu-cart > i{ color: #ffffff; }
.helioro-header-icons-circle .helioro-main-menu-cart:hover{ border-color: var(--helioro-accent); background-color: var(--helioro-accent); }
.helioro-body.helioro-header-icons-circle .helioro-main-menu-cart:hover > i{ color: var(--helioro-on-accent); }
.helioro-header-icons-circle .helioro-main-menu-cart > .helioro-top-cart-count{ display: block; top: -4px; right: -4px; min-width: 18px; width: auto; height: 18px; padding: 0 4px; box-sizing: border-box;
	border: 2px solid var(--helioro-card, #ffffff); line-height: 14px; vertical-align: baseline; }
.helioro-header-icons-circle .helioro-mobile-header .helioro-mobile-menu-right{ display: flex; align-items: center; gap: 8px; margin-top: -22px; }
.helioro-header-icons-circle .helioro-mobile-header .helioro-mobile-menu-right > *{ float: none; margin: 0; }
@media only screen and (max-width: 420px){
	.helioro-header-icons-circle .helioro-mobile-header .helioro-mobile-menu-right .helioro-main-menu-search,
	.helioro-header-icons-circle .helioro-mobile-header .helioro-mobile-menu-right .helioro-main-menu-account,
	.helioro-header-icons-circle .helioro-mobile-header .helioro-mobile-menu-right .helioro-main-menu-cart{ width: 40px; height: 40px; }
}
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-header-compact.helioro-header-icons-circle .helioro-main-menu-right-wrap{ gap: 8px; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-main-menu{ padding-left: 56px; box-sizing: border-box; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-main-menu-search,
	.helioro-header-compact.helioro-header-icons-circle .helioro-main-menu-account,
	.helioro-header-compact.helioro-header-icons-circle .helioro-main-menu-cart{ width: 40px; height: 40px; }
}

/* 30.5 mobile menu button: light disc, and the outline disc keeps an ink icon on the tiles panel */
.helioro-burger-light .helioro-mobile-header .helioro-mobile-menu-button{ display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 44px; height: 44px; padding: 0;
	border: 0; border-radius: min(var(--helioro-radius-button), 50%); background-color: var(--helioro-ground); font-size: 17px; line-height: 1;
	transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-burger-light .helioro-mobile-header .helioro-mobile-menu-right{ margin-top: -22px; }
.helioro-burger-light .helioro-mobile-header .helioro-mobile-menu{ margin-top: 0; }
.helioro-body.helioro-burger-light .helioro-mobile-header .helioro-mobile-menu-button i,
.helioro-body.helioro-burger-outline .helioro-mobile-header .helioro-mobile-menu-button i{ color: var(--helioro-ink); }
.helioro-burger-light .helioro-mobile-header .helioro-mobile-menu-button:hover{ background-color: var(--helioro-ink); }
.helioro-body.helioro-burger-light .helioro-mobile-header .helioro-mobile-menu-button:hover i{ color: #ffffff; }
.helioro-mpanel-tiles.helioro-burger-outline .helioro-mobile-header .helioro-mobile-button-hamburger-with-border{ border: 1px solid var(--helioro-line); background-color: transparent; }
.helioro-mpanel-tiles.helioro-burger-outline .helioro-mobile-header .helioro-mobile-button-hamburger-with-border:hover,
.helioro-mpanel-tiles.helioro-burger-outline .helioro-mobile-header .helioro-mobile-button-hamburger-with-border.helioro-active{ border-color: var(--helioro-ink); background-color: var(--helioro-ink); }
.helioro-mpanel-tiles.helioro-burger-outline .helioro-mobile-header .helioro-mobile-button-hamburger-with-border:hover i,
.helioro-mpanel-tiles.helioro-burger-outline .helioro-mobile-header .helioro-mobile-button-hamburger-with-border.helioro-active i{ color: #ffffff; }
.helioro-mpanel-tiles.helioro-burger-light .helioro-mobile-header .helioro-mobile-button-hamburger-with-border{ background-color: var(--helioro-ground); }

/* 30.6 forms: three-up grid, auto-width submit on accent forms, submit colour option, accent submit on a dark form */
.helioro-cf7-grid.helioro-cf7-grid-3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media only screen and (max-width: 1199px){ .helioro-cf7-grid.helioro-cf7-grid-3{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media only screen and (max-width: 767px){ .helioro-cf7-grid.helioro-cf7-grid-3{ grid-template-columns: 1fr; } }
.helioro-cf7-submit-auto .wpcf7 p > .wpcf7-submit,
.helioro-cf7-submit-auto > .wpcf7-submit,
.helioro-form-on-accent .helioro-cf7-submit-auto > .wpcf7-submit,
.helioro-form-on-accent.helioro-cf7-submit-auto .wpcf7 p > .wpcf7-submit{ flex: 0 0 auto; width: auto; }
.helioro-cf7-submit-row{ display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.helioro-cf7-submit-row > p{ margin: 0; }
.helioro-form-submit-accent [class*="helioro-form-"]:not(.helioro-form-dark):not(.helioro-form-on-accent),
.helioro-form-submit-accent[class*="helioro-form-"]:not(.helioro-form-dark),
.helioro-cf7-submit-accent{ --hf-btn-bg: var(--helioro-accent); --hf-btn-color: var(--helioro-on-accent); --hf-btn-hover-bg: var(--helioro-accent-dark); --hf-btn-hover-color: #ffffff; }
.helioro-form-submit-ink [class*="helioro-form-"]:not(.helioro-form-dark):not(.helioro-form-on-accent),
.helioro-form-submit-ink[class*="helioro-form-"]:not(.helioro-form-dark){ --hf-btn-bg: var(--helioro-ink); --hf-btn-color: #ffffff; --hf-btn-hover-bg: var(--helioro-accent); --hf-btn-hover-color: var(--helioro-on-accent); }
html body .helioro-form-dark.helioro-form-dark-accent,
html body .helioro-form-dark-accent .helioro-form-dark,
html body .helioro-form-dark .helioro-form-dark-accent,
html body .helioro-form-dark-accent .wpcf7{ --hf-btn-bg: var(--helioro-accent); --hf-btn-color: #ffffff; --hf-btn-hover-bg: #ffffff; --hf-btn-hover-color: var(--helioro-ink); }

/* 30.7 footer newsletter on one row - General > Helioro Style > Footer Newsletter Field + Button On One Row */
.helioro-footer-form-row .helioro-footer-wrapper .helioro-cf7-inline.helioro-cf7-joined{ flex-wrap: nowrap; }
.helioro-footer-form-row .helioro-footer-wrapper .helioro-cf7-inline.helioro-cf7-joined .wpcf7-form-control-wrap{ flex: 1 1 auto; min-width: 0; }
.helioro-footer-form-row .helioro-footer-wrapper .helioro-cf7-inline.helioro-cf7-joined input:not([type="submit"]){ min-width: 0; padding-left: 16px; padding-right: 8px; }
.helioro-footer-form-row .helioro-footer-wrapper .helioro-cf7-inline.helioro-cf7-joined input[type="submit"]{ flex: 0 0 auto; padding-left: 20px; padding-right: 43px; }
.helioro-footer-form-row .helioro-footer-wrapper [class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined::after{ right: calc(var(--hf-joined-pad, 0px) + 20px); }
.helioro-footer-form-row.helioro-cf7-no-arrow .helioro-footer-wrapper .helioro-cf7-inline.helioro-cf7-joined input[type="submit"]{ padding-right: 18px; }

/* 30.8 WooCommerce: line on product cards, add to cart always visible, sale badge one line, notices in the palette */
.helioro-product-line .gdlr-core-product-item .gdlr-core-product-grid,
.helioro-product-line.woocommerce ul.products li.product,
.helioro-product-line .woocommerce ul.products li.product{ --hc-border-w: 1px; --hc-border-color: var(--helioro-line); border: 1px solid var(--helioro-line); }
.helioro-product-line .gdlr-core-product-item .gdlr-core-product-grid:hover{ border-color: var(--helioro-ink); }
/* the thumbnail box steps aside: image, title + price, then the hover row as a static row with the cart pill - no template change */
.helioro-product-cart-always .gdlr-core-product-grid{ display: flex; flex-direction: column; height: 100%; }
.helioro-product-cart-always .gdlr-core-product-grid > .gdlr-core-product-thumbnail{ display: contents; }
.helioro-product-cart-always .gdlr-core-product-grid > .gdlr-core-product-thumbnail > img,
.helioro-product-cart-always .gdlr-core-product-grid > .gdlr-core-product-thumbnail > a{ order: 0; display: block; width: 100%; border-radius: var(--hc-img-radius); background: var(--helioro-ground); }
.helioro-product-cart-always .gdlr-core-product-grid > .gdlr-core-product-thumbnail > .onsale{ order: 0; }
.helioro-product-cart-always .gdlr-core-product-grid > .gdlr-core-product-grid-content-wrap{ order: 1; flex: 1 1 auto; }
.helioro-body.helioro-product-cart-always .gdlr-core-product-grid .gdlr-core-product-thumbnail-info{ order: 2; position: static; display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
	width: auto; height: auto; margin: 0; padding: 16px 14px 10px; opacity: 1; visibility: visible; transform: none; background: none; text-align: left; }
.helioro-product-cart-always .gdlr-core-product-thumbnail-info .gdlr-core-product-view-detail{ display: none; }
.helioro-body.helioro-product-cart-always .gdlr-core-product-thumbnail-info > a.gdlr-core-product-add-to-cart{ display: inline-flex; align-items: center; justify-content: center; gap: 8px; float: none;
	width: auto; margin: 0; padding: 11px 20px; border: 0; border-radius: var(--helioro-radius-button); background: var(--helioro-ink); color: #ffffff; font-size: 14px; font-weight: 600;
	line-height: 1.2; text-decoration: none; transition: background-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-body.helioro-product-cart-always .gdlr-core-product-thumbnail-info > a.gdlr-core-product-add-to-cart:hover{ background: var(--helioro-accent); color: var(--helioro-on-accent); }
.helioro-body.helioro-product-cart-always .gdlr-core-product-thumbnail-info > a.gdlr-core-product-add-to-cart i{ margin: 0; font-size: 15px; color: inherit; }
.helioro-body.helioro-product-cart-always .gdlr-core-product-thumbnail-info > a.gdlr-core-product-add-to-cart.loading{ opacity: .6; }
.helioro-body.helioro-product-cart-always .gdlr-core-product-thumbnail-info .added_to_cart{ float: none; width: auto; margin: 0; padding: 0; background: none; color: var(--helioro-ink); font-size: 14px; font-weight: 600; text-decoration: underline; }
.helioro-body .gdlr-core-product-item span.onsale,
.helioro-body.woocommerce span.onsale,
.helioro-body .woocommerce span.onsale{ width: auto; min-width: 0; height: auto; white-space: nowrap; }
.helioro-body .woocommerce-info,
.helioro-body .woocommerce-message,
.helioro-body .woocommerce-noreviews,
.helioro-body p.no-comments{ border-top-color: var(--helioro-accent); background-color: var(--helioro-ground); color: var(--helioro-ink); }
.helioro-body .woocommerce-info:before,
.helioro-body .woocommerce-message:before{ color: var(--helioro-accent); }
.helioro-body .woocommerce-info a,
.helioro-body .woocommerce-message a:not(.button){ color: var(--helioro-accent-dark); font-weight: 600; }
.helioro-body .woocommerce-error{ border-top-color: #c0392b; background-color: var(--helioro-ground); }

/* ===================================================================
 * 31. Kit v2.1 - remix demo audit fixes
 * =================================================================== */

/* 31.1 top level drop-down inside the viewport - the theme script measures the panel when it opens:
 * helioro-sub-flip opens it from the right side of its item, helioro-sub-cols sets a long list in two columns,
 * helioro-sub-scroll lets a list still taller than the screen scroll inside the panel */
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu > ul.sub-menu.helioro-sub-flip{ left: auto; right: 0; margin-left: 0; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu > ul.sub-menu.helioro-sub-cols{ column-count: 2; column-gap: 8px; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu > ul.sub-menu.helioro-sub-cols > li{ break-inside: avoid; -webkit-column-break-inside: avoid; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu > ul.sub-menu.helioro-sub-cols > li + li{ margin-top: 0; margin-bottom: 2px; }
.helioro-body .helioro-navigation .sf-menu > .helioro-normal-menu > ul.sub-menu.helioro-sub-scroll{ overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }

/* 31.2 WooCommerce notice button - an ink pill that reads on the sand bar, the notice icon drawn as a mask so it never shows an empty box */
html body.helioro-body .woocommerce-message .button,
html body.helioro-body .woocommerce-info .button,
html body.helioro-body .woocommerce .woocommerce-message .button,
html body.helioro-body .woocommerce .woocommerce-info .button{ display: inline-flex; align-items: center; float: right; margin: -4px 0 0 16px; padding: 9px 18px; border: 0;
	border-radius: var(--helioro-radius-button); background-color: var(--helioro-ink); color: #ffffff; font-size: 14px; font-weight: 600; line-height: 1.2; text-decoration: none;
	transition: background-color var(--helioro-fast), color var(--helioro-fast); }
html body.helioro-body .woocommerce-message .button:hover,
html body.helioro-body .woocommerce-info .button:hover,
html body.helioro-body .woocommerce .woocommerce-message .button:hover,
html body.helioro-body .woocommerce .woocommerce-info .button:hover{ background-color: var(--helioro-accent); color: var(--helioro-on-accent); }
html body.helioro-body .woocommerce-message:before,
html body.helioro-body .woocommerce .woocommerce-message:before{ content: ""; width: 18px; height: 18px; background-color: var(--helioro-accent);
	-webkit-mask: var(--helioro-ico-check) center / contain no-repeat; mask: var(--helioro-ico-check) center / contain no-repeat; }
@media only screen and (max-width: 767px){
	html body.helioro-body .woocommerce-message .button,
	html body.helioro-body .woocommerce-info .button,
	html body.helioro-body .woocommerce .woocommerce-message .button,
	html body.helioro-body .woocommerce .woocommerce-info .button{ float: none; display: flex; width: fit-content; margin: 10px 0 0; }
}

/* 31.3 a chip placed over a tile corner moves under the text from 1199 down - Additional CSS class helioro-chip-static-1199 on the chip item */
@media only screen and (max-width: 1199px){
	html body .helioro-chip-static-1199.pixe-item,
	html body .helioro-chip-static-1199 > .pixe-item{ position: static !important; inset: auto !important; transform: none !important; width: fit-content; max-width: 100%; margin-top: 16px; }
}

/* 31.4 splitted menu with a right button from 1200 up: items 3px tighter each side, so the last item keeps clear of the absolute button */
@media only screen and (min-width: 1200px){
	.helioro-header-style-plain.helioro-style-splitted-menu:has(.helioro-main-menu-right-button) .helioro-navigation .sf-menu > li{ padding-left: 14px; padding-right: 14px; }
}
/* PixeBuilder editor only: wrappers with overflow hidden clip the first row column toolbars and gear */
body.pixe-editor-body .pixe-wrapper-content{ overflow: visible !important; }
/* personnel category filterer as a pill row, replaces the Filter By dropdown */
.helioro-body .gdlr-core-personnel-filterer{ display: flex; justify-content: flex-end; margin-bottom: 40px; }
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-head,
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown-current{ display: none; }
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-tail,
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown{ position: static; display: block; width: auto; max-width: none; min-width: 0; margin: 0; padding: 0; border: 0; }
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown-list{ position: static; display: flex !important; flex-wrap: wrap; justify-content: flex-end; gap: 8px; width: auto; max-width: none; min-width: 0; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; opacity: 1; visibility: visible; transform: none; }
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown-list-item{ display: block !important; flex: 0 0 auto; width: auto; white-space: nowrap; margin: 0; padding: 10px 18px; border: 1px solid var(--helioro-line); border-radius: 40px; background: transparent; color: var(--helioro-ink); font-family: var(--helioro-font-body, inherit); font-size: 13px; font-weight: 500; line-height: 1.4; letter-spacing: 0; cursor: pointer; transition: background-color var(--helioro-fast), border-color var(--helioro-fast), color var(--helioro-fast); }
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown-list-item:hover{ border-color: var(--helioro-accent); color: var(--helioro-accent); }
.helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown-list-item.gdlr-core-active{ border-color: var(--helioro-accent); background: var(--helioro-accent); color: var(--helioro-on-accent); }
@media only screen and (max-width: 767px){ .helioro-body .gdlr-core-personnel-filterer, .helioro-body .gdlr-core-personnel-filterer .gdlr-core-custom-dropdown-list{ justify-content: flex-start; } .helioro-body .gdlr-core-personnel-filterer{ margin-bottom: 28px; } }

/* PixeBuilder editor only: column and wrapper toolbars sit above the padding-resize handles at z 1121, so a short column head and its gear stay hoverable */
body.pixe-editor-body .pixe-column-toolbar,
body.pixe-editor-body .pixe-wrapper-toolbar{ z-index: 1130 !important; }

/* PixeBuilder editor only: a transparent or boxed header takes its own space, so it never covers the first wrapper and its toolbar */
body.pixe-editor-body .helioro-header-background-transparent{ position: relative !important; background-color: var(--helioro-ink, #13262f); }
body.pixe-editor-body .helioro-header-boxed-wrap{ position: relative !important; }

/* 33.1 joined field + button, kit level - content and footer: the button sits on an even inset, its corners follow the box radius minus that inset,
   22px before the label, 20px after the arrow, 10px from label to arrow. When the button drops under the field and stretches,
   the label sits left and the arrow right, so both ends keep the same space - text-align does nothing while the button is content wide */
.helioro-body .helioro-cf7-inline.helioro-cf7-joined,
.helioro-body .helioro-cf7-bar{ --hf-jbtn-l: 22px; --hf-jbtn-r: 20px; --hf-jbtn-tail: 23px; }
.helioro-body.helioro-cf7-no-arrow .helioro-cf7-inline.helioro-cf7-joined,
.helioro-body .helioro-cf7-no-arrow .helioro-cf7-inline.helioro-cf7-joined,
.helioro-body.helioro-cf7-no-arrow .helioro-cf7-bar,
.helioro-body .helioro-cf7-no-arrow .helioro-cf7-bar{ --hf-jbtn-tail: 2px; }
.helioro-body [class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-body[class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-body [class*="helioro-form-"] .helioro-cf7-bar input[type="submit"],
.helioro-body[class*="helioro-form-"] .helioro-cf7-bar input[type="submit"]{ padding-left: var(--hf-jbtn-l); padding-right: calc(var(--hf-jbtn-r) + var(--hf-jbtn-tail)); }
.helioro-body [class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined::after,
.helioro-body[class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined::after{ right: calc(var(--hf-joined-pad, 0px) + var(--hf-jbtn-r)); }
.helioro-body [class*="helioro-form-"] .helioro-cf7-bar::after,
.helioro-body[class*="helioro-form-"] .helioro-cf7-bar::after{ right: calc(var(--hf-joined-pad, 6px) + var(--hf-jbtn-r)); }
.helioro-body :is(.helioro-form-pill, .helioro-form-dark, .helioro-form-on-accent) .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-body:is(.helioro-form-pill, .helioro-form-dark, .helioro-form-on-accent) .helioro-cf7-inline.helioro-cf7-joined input[type="submit"]{
	border-radius: min(var(--hf-btn-radius), max(calc(min(var(--hf-joined-radius), 32px) - var(--hf-joined-pad) - 1px), calc(min(var(--hf-joined-radius), 32px) / 2))); }
@media only screen and (max-width: 767px){
	.helioro-body :is(.helioro-form-pill, .helioro-form-dark, .helioro-form-on-accent) .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
	.helioro-body:is(.helioro-form-pill, .helioro-form-dark, .helioro-form-on-accent) .helioro-cf7-inline.helioro-cf7-joined input[type="submit"]{
		border-radius: min(var(--hf-btn-radius), max(calc(min(var(--hf-joined-radius), 24px) - var(--hf-joined-pad) - 1px), calc(min(var(--hf-joined-radius), 24px) / 2))); }
}
.helioro-body .helioro-cf7-inline.helioro-cf7-joined:not(:is(.helioro-form-pill, .helioro-form-dark, .helioro-form-on-accent) *)::after{ right: var(--hf-jbtn-r); bottom: calc((var(--hf-height) - 13px) / 2); }
.helioro-body [class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-body[class*="helioro-form-"] .helioro-cf7-inline.helioro-cf7-joined input[type="submit"],
.helioro-body [class*="helioro-form-"] .helioro-cf7-bar input[type="submit"],
.helioro-body[class*="helioro-form-"] .helioro-cf7-bar input[type="submit"]{ text-align: left; }

/* 33.2 plain centre menu header from 1000 up - logo, menu text and the right icons share the bar's middle line. The absolute logo spans the
   bar height and centres itself, so Logo Top and Bottom Padding no longer push it up or down here, and the absolute right wrap sits at 50 percent.
   From 1000 to 1199 the circle icons go back to absolute too, the menu keeps clear of them with a right padding of one 48px slot per icon less the last gap */
@media only screen and (min-width: 1000px){
	.helioro-body .helioro-header-style-plain.helioro-style-center-menu .helioro-logo{ top: 0; bottom: 0; padding-top: 0; padding-bottom: 0; align-items: center; }
	.helioro-body .helioro-header-style-plain.helioro-style-center-menu .helioro-main-menu-right-wrap{ top: 50%; margin-top: 0; transform: translateY(-50%); }
}
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:not(:has(.helioro-main-menu-right-button)){ --hic-s: 0; --hic-a: 0; --hic-c: 0; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:not(:has(.helioro-main-menu-right-button)):has(.helioro-main-menu-search){ --hic-s: 1; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:not(:has(.helioro-main-menu-right-button)):has(.helioro-main-menu-account){ --hic-a: 1; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:not(:has(.helioro-main-menu-right-button)):has(.helioro-main-menu-cart){ --hic-c: 1; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:not(:has(.helioro-main-menu-right-button)) .helioro-main-menu-right-wrap{ position: absolute; right: 0; }
	.helioro-header-compact.helioro-header-icons-circle .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:not(:has(.helioro-main-menu-right-button)) .helioro-main-menu{ padding-right: max(0px, calc((var(--hic-s) + var(--hic-a) + var(--hic-c)) * 48px - 4px)); }
	.helioro-header-compact .helioro-header-style-plain.helioro-style-center-menu .helioro-navigation:has(.helioro-main-menu-right-button) .helioro-main-menu-right-wrap{ transform: none; }
}

/* 33.3 CF7 submit row under a field block - the submit paragraph that follows a paragraph or grid holding fields gets 16px above it,
   12px in the footer, so the button never sits flush on the last field. A grid row-gap already spaces a submit inside the grid.
   The note under the button keeps 16px - the submit paragraph drops its own bottom margin when a note follows */
.helioro-body .wpcf7 form :is(p, div):has(input:not([type="submit"]):not([type="hidden"]), select, textarea) + p:has(> .wpcf7-submit):not(.helioro-cf7-grid > *){ margin-top: 16px; }
.helioro-body .helioro-footer-wrapper .wpcf7 form :is(p, div):has(input:not([type="submit"]):not([type="hidden"]), select, textarea) + p:has(> .wpcf7-submit):not(.helioro-cf7-grid > *){ margin-top: 12px; }
.helioro-body .wpcf7 form p:has(> .wpcf7-submit):has(+ .helioro-form-note):not(.helioro-cf7-submit-row){ margin-bottom: 0; }

/* 33.4 product card sale pill in the text block - 12px under the pill before the title. Cards without a sale keep the title on top,
   no empty slot is reserved: the row already steps with one or two title lines, and a blank band would read as a missing badge.
   Related and upsell grids on a single product use the same in-flow pill instead of the old corner sticker */
.helioro-body .gdlr-core-product-item .gdlr-core-product-grid-content-wrap > span.onsale,
.helioro-body .woocommerce ul.products li.product .gdlr-core-product-grid-content-wrap > .onsale,
.helioro-body.woocommerce .products .gdlr-core-product-grid .gdlr-core-product-grid-content-wrap > .onsale{ position: static; display: block; width: fit-content; margin: 0 0 12px; }
.helioro-body .gdlr-core-product-grid-content-wrap > .onsale + .gdlr-core-outer-frame-element{ display: none; }

/* 33.5 compact plain header 1000-1199 - the centred menu leaves about 148px for the logo, so a larger Max Logo Width stays off the first menu item */
@media only screen and (min-width: 1000px) and (max-width: 1199px){ .helioro-header-compact .helioro-header-style-plain .helioro-logo-inner{ max-width: 148px; } }

/* 34.1 plain splitted menu from 1000 up - menu links, logo and right button share the bar's middle line in the normal and sticky states.
   The navigation becomes one flex row of a fixed height, links stretch to it so sub menus still open at the bar's bottom edge,
   and the right button joins the row 24px after the last link, so it can no longer run into Contact */
@media only screen and (min-width: 1000px){
	.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu{ --hsm-bar: 103px; }
	.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu.helioro-fixed-navigation{ --hsm-bar: 80px; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation{ display: flex; flex-wrap: nowrap; align-items: stretch; justify-content: center; min-height: var(--hsm-bar); padding-top: 0; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation:before,
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation:after{ display: none; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-main-menu,
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation .sf-menu{ display: flex; align-items: stretch; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation .sf-menu > li{ display: flex; float: none; align-items: stretch; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation .sf-menu > li > a{ display: flex; align-items: center; padding-top: 0; padding-bottom: 0; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation .sf-menu > li.helioro-center-nav-menu-item{ align-items: center; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-navigation .sf-menu > li > :is(.sub-menu, .sf-mega){ top: 100%; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-logo{ margin-top: 0; padding-top: 0; padding-bottom: 0; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-main-menu-right-wrap{ position: static; display: flex; flex: 0 0 auto; align-items: center; margin-left: 24px; padding-top: 0; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu .helioro-main-menu-right-button{ margin-top: 0; margin-left: 0; }
}
/* 34.2 narrow desktop 1200-1319 - tighter link and logo sides so the splitted menu and its button fit one row */
@media only screen and (min-width: 1200px) and (max-width: 1319px){
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu:has(.helioro-main-menu-right-button) .helioro-navigation .sf-menu > li{ padding-left: 9px; padding-right: 9px; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu:has(.helioro-main-menu-right-button) .helioro-navigation .sf-menu > li.helioro-center-nav-menu-item{ padding-left: 0; padding-right: 0; }
	.helioro-body.helioro-body .helioro-header-style-plain.helioro-style-splitted-menu:has(.helioro-main-menu-right-button) .helioro-logo{ padding-left: 16px; padding-right: 16px; }
}
/* 34.3 small search and cart glyphs beside a button sit on the menu text line, the core offsets leave them about 3.5px high.
   Circle icons and the block button bar centre themselves already */
@media only screen and (min-width: 1000px){
	.helioro-body:not(.helioro-header-icons-circle):not(.helioro-header-btn-block) .helioro-main-menu-right-wrap > :is(.helioro-main-menu-search, .helioro-main-menu-cart){ position: relative; top: 3.5px; }
	.helioro-body .helioro-header-style-plain.helioro-style-center-logo .helioro-main-menu-right-button,
	.helioro-body .helioro-navigation-header-style-bar.helioro-style-2:not(.helioro-fixed-navigation) .helioro-main-menu-right-button{ position: relative; top: 2px; }
	.helioro-body .helioro-header-style-boxed.helioro-style-center-menu .helioro-logo{ top: 0; bottom: 0; padding-top: 0; padding-bottom: 0; align-items: center; }
	.helioro-body .helioro-fixed-navigation.helioro-header-style-plain.helioro-style-center-logo .helioro-logo{ bottom: 0; display: flex; align-items: center; padding-top: 0; padding-bottom: 0; }
}
/* 34.4 compact 1000-1199 - logo and navigation centre in the row, a taller logo no longer leaves the menu high */
@media only screen and (min-width: 1000px) and (max-width: 1199px){
	.helioro-header-compact .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner,
	.helioro-header-compact .helioro-header-style-boxed.helioro-style-menu-right .helioro-header-container-item{ align-items: center; }
}
/* 34.5 plain menu right header from 1200 up - the compact row rule carries on, logo and navigation centre in one flex row in both states */
@media only screen and (min-width: 1200px){
	.helioro-body .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner{ display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; }
	.helioro-body .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner:before,
	.helioro-body .helioro-header-style-plain.helioro-style-menu-right .helioro-header-container-inner:after{ display: none; }
	.helioro-body .helioro-header-style-plain.helioro-style-menu-right .helioro-logo{ float: none; flex: 0 1 auto; min-width: 0; }
	.helioro-body .helioro-header-style-plain.helioro-style-menu-right .helioro-navigation{ float: none; flex: 0 0 auto; margin-left: auto; }
}

/* 35.1 note under a CF7 submit - a PixeBuilder title or text item right after a form item sits 16px under the button, the item padding no longer
   stacks on the form bottom margin. A Text widget note in a sidebar sits 14px under it, as in the footer */
.helioro-body .pixe-item-shortcode:has(.wpcf7):has(+ :is(.pixe-item-title, .pixe-item-text)){ padding-bottom: 0 !important; }
.helioro-body .pixe-item-shortcode:has(.wpcf7):has(+ :is(.pixe-item-title, .pixe-item-text)) .wpcf7 form:not(:has(.helioro-form-note)){ padding-bottom: 16px; }
.helioro-body .pixe-item-shortcode:has(.wpcf7):has(+ :is(.pixe-item-title, .pixe-item-text)) .wpcf7 form > :is(p, div):has(+ .wpcf7-response-output){ margin-bottom: 0; }
.helioro-body .widget .wpcf7 form > p:has(> .wpcf7-submit):has(+ .wpcf7-response-output){ margin-bottom: 0; }
.helioro-body .widget .textwidget :is(.wpcf7, div:has(> .wpcf7)) + p{ margin-top: 14px; }

/* 35.2 CF7 radio, checkbox and acceptance, kit level - an 18px custom control in the demo accent, flush with the field label, 10px before the text,
   wrapped text hangs beside the control. Tiles keep their own layout and take the same control */
.helioro-body .wpcf7{ --hf-check: var(--helioro-accent); --hf-check-mark: var(--helioro-on-accent, #ffffff); }
.helioro-body .helioro-cf7-tiles-ink .wpcf7,
.helioro-body .wpcf7 .helioro-cf7-tiles-ink{ --hf-check: var(--helioro-ink); --hf-check-mark: #ffffff; }
.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance):not(.helioro-cf7-tiles *){ display: flex; flex-wrap: wrap; gap: 10px 22px; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance):not(.helioro-cf7-tiles *) .wpcf7-list-item{ display: block; min-width: 0; margin: 0; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance):not(.helioro-cf7-tiles *) .wpcf7-list-item label{ display: flex; align-items: flex-start; gap: 10px; margin: 0; font-family: var(--helioro-font-body, inherit); font-size: 15px; font-weight: 400; line-height: 22px; letter-spacing: 0; text-transform: none; cursor: pointer; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance):not(.helioro-cf7-tiles *) .wpcf7-list-item-label{ flex: 1 1 auto; min-width: 0; margin: 0; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input:is([type="radio"], [type="checkbox"]){ -webkit-appearance: none; appearance: none; display: inline-grid; flex: 0 0 18px; place-content: center; box-sizing: border-box; width: 18px; min-width: 18px; height: 18px; margin: 2px 0 0; padding: 0; border: 1.5px solid color-mix(in srgb, var(--hf-color, var(--helioro-ink)) 42%, transparent); border-radius: 5px; background: var(--hf-bg, #ffffff); box-shadow: none; outline: none; cursor: pointer; transition: background-color var(--helioro-fast), border-color var(--helioro-fast); }
.helioro-body.helioro-body .wpcf7 .helioro-cf7-tiles :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input:is([type="radio"], [type="checkbox"]){ margin: 0; }
.helioro-body.helioro-body .helioro-cf7-tiles-cards .wpcf7-list-item input:is([type="radio"], [type="checkbox"]){ margin: 0; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input[type="radio"]{ border-radius: 50%; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input:is([type="radio"], [type="checkbox"]):hover{ border-color: var(--hf-check); }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input:is([type="radio"], [type="checkbox"]):checked{ border-color: var(--hf-check); background: var(--hf-check); }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input:is([type="radio"], [type="checkbox"]):focus-visible{ outline: 2px solid var(--hf-check); outline-offset: 2px; }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input[type="radio"]:checked::before{ content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--hf-check-mark); }
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input[type="checkbox"]:checked::before{ content: ""; box-sizing: border-box; width: 6px; height: 10px; margin-top: -2px; border: solid var(--hf-check-mark); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.helioro-body.helioro-body .wpcf7 .wpcf7-not-valid :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input,
.helioro-body.helioro-body .wpcf7 :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance).wpcf7-not-valid input,
.helioro-body.helioro-body .wpcf7 .wpcf7-form-control-wrap:has(.wpcf7-not-valid-tip) :is(.wpcf7-radio, .wpcf7-checkbox, .wpcf7-acceptance) input{ border-color: var(--hf-danger, #c0392b); }

/* 35.3 list and grid pagination - 40px from the last row of a title list, where the row border would otherwise touch the pager, and 40px in all
   from a card grid whose own row padding gives the first 20px. Bento grids and the ruled pager keep their own spacing */
.helioro-body:not(.helioro-cards-bento):not(.helioro-pager-rule) .gdlr-core-blog-item:not(.helioro-pager-rule *) .gdlr-core-blog-item-holder + .gdlr-core-pagination{ margin-top: 20px; }
.helioro-body:not(.helioro-cards-bento):not(.helioro-pager-rule) .gdlr-core-blog-item:not(.helioro-pager-rule *) .gdlr-core-blog-item-holder:has(> .gdlr-core-blog-list) + .gdlr-core-pagination{ margin-top: 40px; }

/* 35.4 compact splitted menu 1000-1199 - the logo sits between the links with the button hidden, so it keeps 180px and its small line stays readable */
@media only screen and (min-width: 1000px) and (max-width: 1199px){ .helioro-header-compact .helioro-header-style-plain.helioro-style-splitted-menu .helioro-logo-inner{ max-width: 180px; } }