/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/
/* APERA ------------------------------------------------------------------ */

/* Footer menus hold emails, handles and phone numbers: never auto-capitalise. */
.fusion-tb-footer .awb-menu__main-a,
.fusion-tb-footer .awb-menu .menu-text {
	text-transform: none !important;
}

/* Member Network logo grid ([apera_member_logos]): an endless, hover-pausable marquee. */
.apera-logos { overflow: hidden; position: relative; }
.apera-logos--empty p { text-align: center; color: var(--awb-color6); font-style: italic; margin: 0; }
.apera-logos__track { display: flex; gap: 24px; width: max-content; animation: apera-marquee 40s linear infinite; }
.apera-logos:hover .apera-logos__track { animation-play-state: paused; }
.apera-logos__item { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 180px; height: 96px; padding: 14px; background: #fff; border: 1px solid var(--awb-color3); border-radius: 8px; box-shadow: 0 2px 10px rgba(28, 18, 64, .06); transition: transform .2s, box-shadow .2s; }
.apera-logos__item:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(28, 18, 64, .12); }
.apera-logos__item img { max-width: 100%; max-height: 100%; object-fit: contain; }
@keyframes apera-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .apera-logos__track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; } }

/* Homepage cards */
.apera-card .fusion-column-wrapper { transition: transform .2s, box-shadow .2s; }
.apera-card:hover .fusion-column-wrapper { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(28, 18, 64, .12) !important; }
.apera-eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: 13px; font-weight: 600; color: var(--awb-custom_color_2); margin-bottom: 8px; }

/* Homepage hero: headline full width, the two call-to-action buttons side by side. */
.apera-hero .fusion-column-wrapper { flex-direction: row !important; flex-wrap: wrap; align-items: center; }
.apera-hero .fusion-column-wrapper > * { flex: 0 0 100%; }
.apera-hero .fusion-column-wrapper > div:has(> .fusion-button) { flex: 0 0 auto; }
/* Inner card grid gutters */
.fusion-builder-row-inner > .apera-card { margin-bottom: 24px; }
/* Cards in a row share the tallest card's height. */
.fusion-builder-row-inner:has(> .apera-card) { align-items: stretch !important; }
.fusion-builder-row-inner > .apera-card,
.fusion-builder-row > .apera-card { align-self: stretch !important; }
.apera-card > .fusion-column-wrapper { height: 100%; justify-content: flex-start !important; }
.apera-card > .fusion-column-wrapper { box-shadow: 0 4px 18px rgba(28, 18, 64, .08); }
.apera-card--dark > .fusion-column-wrapper { box-shadow: none; }
.apera-wa-button i { margin-right: 8px; }

/* Homepage on phones and small tablets */
@media (max-width: 800px) {
	.apera-hero-section { --awb-background-image: linear-gradient(180deg, rgba(248,250,252,.96) 0%, rgba(248,250,252,.90) 100%) !important; }
	.apera-hero h1 { font-size: 36px !important; line-height: 1.2 !important; }
	.apera-hero .fusion-column-wrapper > div:has(> .fusion-button) { flex: 0 0 100%; }
	.apera-hero .fusion-button { width: 100%; justify-content: center; margin-right: 0 !important; }
}

/* Member Directory search (BP Profile Search form 2735) */
#bps_accordion_form_2735 { background: #fff; border: 1px solid var(--awb-color3); border-radius: 10px; padding: 24px 28px; margin: 0 0 28px; box-shadow: 0 4px 18px rgba(28, 18, 64, .06); }
#bps_accordion_form_2735 .bps-form-title { display: block; font-family: var(--awb-typography1-font-family); font-size: 22px; color: var(--awb-color5); margin-bottom: 16px; }
#bps_accordion_form_2735 .ui-accordion-header-icon { display: none; }
.bps-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 18px 24px; align-items: end; }
.bps-form > br, .bps-form > div > br { display: none; }
.bps-form .bps-label { display: block !important; margin-bottom: 6px; color: var(--awb-color7); }
.bps-form .bps-label span { display: none; }
.bps-form input[type=search], .bps-form input[type=text], .bps-form select { display: block !important; width: 100%; height: 44px; padding: 0 12px; border: 1px solid var(--awb-color3); border-radius: 6px; background: var(--awb-color2); }
#field_288_match_any_wrap { grid-column: 1 / -1; }
#field_288_match_any_wrap > label:not(.bps-label) { display: inline-flex !important; align-items: center; gap: 6px; margin: 0 18px 8px 0; padding: 6px 12px; border: 1px solid var(--awb-color3); border-radius: 20px; background: var(--awb-color2); cursor: pointer; font-size: 14px; }
#field_288_match_any_wrap > label:not(.bps-label):has(input:checked) { background: var(--awb-color5); border-color: var(--awb-color5); color: #fff; }
.bps-form input[type=submit], .bps-form button[type=submit] { height: 44px !important; padding: 0 28px !important; border: 0 !important; border-radius: 6px !important; background: var(--awb-custom_color_2) !important; color: #fff !important; font-weight: 600; cursor: pointer; }
.bps-form input[type=submit]:hover, .bps-form button[type=submit]:hover { background: var(--awb-color5) !important; }
/* Youzify directory header in brand colours */
.youzify-members-directory-page .youzify-search-landing-image-container { background-image: none !important; }
#bps_accordion_form_2735 .ui-accordion-header { background: none !important; border: 0 !important; padding: 0 !important; margin: 0 0 16px; color: var(--awb-color5) !important; font-family: var(--awb-typography1-font-family); font-size: 22px; cursor: default; }
#bps_accordion_form_2735 .ui-accordion-content { height: auto !important; overflow: visible !important; border: 0 !important; padding: 0 !important; background: none !important; display: block !important; }
/* Business profiles: no online/offline badge */
.youzify-profile .youzify-user-status, .youzify .youzify-user-status { display: none !important; }

/* Resource Hub cards ([apera_resources]) */
.apera-resources { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.apera-resource { background: #fff; border: 1px solid var(--awb-color3); border-radius: 10px; padding: 22px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 4px 18px rgba(28, 18, 64, .06); }
.apera-resource__meta { display: flex; gap: 8px; flex-wrap: wrap; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--awb-custom_color_3); font-weight: 600; }
.apera-resource__badge { background: var(--awb-custom_color_2); color: #fff; padding: 1px 8px; border-radius: 10px; letter-spacing: 0; text-transform: none; }
.apera-resource__title { margin: 4px 0 0 !important; font-size: 19px !important; }
.apera-resource__summary { margin: 0; color: var(--awb-color6); flex: 1; }
.apera-resource__action { font-weight: 600; color: var(--awb-color5); }
.apera-resource__action--locked { color: var(--awb-custom_color_2); }
.apera-resources-empty { color: var(--awb-color6); font-style: italic; }
/* Portal */
.apera-greeting { font-size: 1.25em; }
.apera-pill { display: inline-block; margin: 0 10px 10px 0; padding: 8px 16px; border-radius: 20px; background: var(--awb-color5); color: #fff !important; font-weight: 600; font-size: 14px; }
.apera-pill:hover { background: var(--awb-custom_color_3); }
.apera-announcements { list-style: none; margin: 0; padding: 0; }
.apera-announcements li { padding: 12px 0; border-bottom: 1px solid var(--awb-color3); }
.apera-announcements__date { color: var(--awb-custom_color_2); font-weight: 600; font-size: 13px; margin-right: 6px; }
.apera-hubs { list-style: none; margin: 0 0 20px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.apera-hubs li { background: #fff; border: 1px solid var(--awb-color3); border-left: 4px solid var(--awb-custom_color_2); border-radius: 8px; padding: 12px 14px; }
/* Footer newsletter (Gravity Forms) on the dark footer */
.apera-newsletter .gform_wrapper form { display: flex; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
.apera-newsletter .gform_body { flex: 1 1 260px; }
.apera-newsletter .gform_wrapper input[type=email] { width: 100%; height: 52px; padding: 0 16px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; background: rgba(255,255,255,.08); color: #fff; }
.apera-newsletter .gform_wrapper input[type=email]::placeholder { color: rgba(255,255,255,.7); }
.apera-newsletter .gform_footer { margin: 0 !important; padding: 0 !important; }
.apera-newsletter .gform_button { height: 52px !important; padding: 0 28px !important; border: 0 !important; border-radius: 4px !important; background: var(--awb-custom_color_2) !important; color: #fff !important; font-weight: 600 !important; }
.apera-newsletter .gform_confirmation_message, .apera-newsletter .validation_message { color: #fff; }
.apera-newsletter .gfield_label, .apera-newsletter .gform_required_legend { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.apera-newsletter .gform_wrapper.gravity-theme input[type=email], .apera-newsletter .gform_wrapper input[type=email] { height: 52px !important; padding: 0 16px !important; border: 1px solid rgba(255,255,255,.25) !important; border-radius: 4px !important; background: rgba(255,255,255,.08) !important; color: #fff !important; }
.apera-newsletter .gform_wrapper.gravity-theme .gform_footer { margin: 0 !important; padding: 0 !important; }

/* About / Contact */
.apera-value-dot { display: inline-block; width: 26px; height: 26px; border-radius: 50%; margin-bottom: 6px; }
.apera-aims { margin: 0; padding-left: 1.2em; }
.apera-aims li { margin-bottom: 12px; }
.apera-hubs--public li { border-left-color: var(--awb-color5); }
.apera-contact-list { list-style: none; margin: 0 0 20px; padding: 0; }
.apera-contact-list li { padding: 10px 0; border-bottom: 1px solid var(--awb-color3); }
.apera-contact-list i { width: 22px; color: var(--awb-custom_color_2); }

/* Events element (Avada fusion_events) as APERA cards */
.fusion-events-shortcode .fusion-events-post .fusion-column-wrapper { background: #fff; border: 1px solid var(--awb-color3); border-radius: 10px; overflow: hidden; box-shadow: 0 4px 18px rgba(28, 18, 64, .06); }
.fusion-events-shortcode .fusion-events-thumbnail img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.fusion-events-shortcode .fusion-events-content-wrapper { padding: 18px 20px 22px !important; }
.fusion-events-shortcode .fusion-events-content-wrapper h2,
.fusion-events-shortcode .fusion-events-content-wrapper h2 a { font-size: 22px !important; line-height: 1.3 !important; color: var(--awb-color8) !important; margin: 0 0 6px !important; }
.fusion-events-shortcode .fusion-events-meta, .fusion-events-shortcode .tribe-event-date-start { color: var(--awb-custom_color_2); font-weight: 600; font-size: 14px; }

/* APERA Team ([apera_team]) */
.apera-team { display: grid; gap: 24px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.apera-team__card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--awb-color3); border-radius: 10px; overflow: hidden; transition: transform .2s, box-shadow .2s; }
.apera-team__card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(28, 18, 64, .12); }
.apera-team__photo { aspect-ratio: 4 / 3; background: linear-gradient(135deg, var(--awb-color5), var(--awb-custom_color_3)); display: flex; align-items: center; justify-content: center; }
.apera-team__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.apera-team__initials { font-family: var(--awb-typography1-font-family); font-size: 56px; color: #fff; letter-spacing: .04em; }
.apera-team__body { padding: 22px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.apera-team__role { margin-bottom: 4px !important; }
.apera-team__name { margin: 0 0 4px !important; font-size: 22px !important; }
.apera-team__business { margin: 0; color: var(--awb-color6); }
.apera-team__bio { margin-top: 12px; font-size: 15px; }
.apera-team__bio p { margin: 0 0 8px; }
.apera-team__link { margin-top: auto; padding-top: 14px; font-weight: 600; color: var(--awb-color5); }
.apera-team__link:hover { color: var(--awb-custom_color_2); }
/* Compact (About page): photo beside the text */
.apera-team--compact { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.apera-team--compact .apera-team__card { flex-direction: row; align-items: center; padding: 20px; gap: 18px; }
.apera-team--compact .apera-team__photo { flex: 0 0 72px; width: 72px; height: 72px; aspect-ratio: auto; border-radius: 50%; overflow: hidden; }
.apera-team--compact .apera-team__initials { font-size: 24px; }
.apera-team--compact .apera-team__body { padding: 0; }
.apera-team--compact .apera-team__name { font-size: 19px !important; }
.apera-team--compact .apera-team__link { padding-top: 6px; font-size: 14px; }

/* ==========================================================================
 * Modern polish + motion (js/apera-motion.js)
 * ======================================================================== */
:root {
	--apera-ease: cubic-bezier(.2, .7, .2, 1);
	--apera-radius: 14px;
	--apera-shadow: 0 6px 24px rgba(28, 18, 64, .08);
	--apera-shadow-hover: 0 20px 44px rgba(28, 18, 64, .16);
	--apera-gap: 28px;
}
html { scroll-behavior: smooth; }
::selection { background: var(--awb-custom_color_2); color: #fff; }

/* Scroll reveal. Uses the `translate` property so hover `transform`s keep working. */
.apera-js .apera-reveal { opacity: 0; translate: 0 28px; transition: opacity .8s var(--apera-ease), translate .8s var(--apera-ease); transition-delay: var(--apera-delay, 0s); }
.apera-js .apera-reveal.is-visible { opacity: 1; translate: 0 0; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.apera-js .apera-reveal { opacity: 1; translate: none; transition: none; }
	.apera-logos__track { animation: none !important; }
}
@media print { .apera-js .apera-reveal { opacity: 1; translate: none; } }

/* Header: lifts off the page once you scroll. */
.fusion-tb-header .fusion-fullwidth { transition: box-shadow .3s, background-color .3s; }
.apera-scrolled .fusion-tb-header .fusion-sticky-container.fusion-container-stuck,
.apera-scrolled .fusion-tb-header .fusion-fullwidth.fusion-sticky-transition { box-shadow: 0 10px 30px rgba(28, 18, 64, .10); }
.fusion-tb-header .awb-menu__main-a { position: relative; }

/* Section eyebrows get a short accent rule. */
.apera-eyebrow::before { content: ""; display: inline-block; width: 28px; height: 2px; margin-right: 10px; vertical-align: middle; background: currentColor; border-radius: 2px; }

/* Buttons: softer corners, lift and glow on hover. */
#main .fusion-button, .fusion-tb-header .fusion-button, .apera-wa-button { border-radius: 8px !important; transition: transform .25s var(--apera-ease), box-shadow .25s, background-color .25s, color .25s, border-color .25s !important; }
#main .fusion-button:hover, .fusion-tb-header .fusion-button:hover, .apera-wa-button:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(28, 18, 64, .18); }

/* Cards: rounder, softer, an accent bar that slides in on hover, icons that respond. */
.apera-card > .fusion-column-wrapper { position: relative; overflow: hidden; border-radius: var(--apera-radius) !important; box-shadow: var(--apera-shadow); transition: transform .35s var(--apera-ease), box-shadow .35s var(--apera-ease) !important; }
.apera-card > .fusion-column-wrapper::before { content: ""; position: absolute; z-index: 2; inset: 0 0 auto 0; height: 3px; background: linear-gradient(90deg, var(--awb-custom_color_2), var(--awb-custom_color_3)); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--apera-ease); }
.apera-card:hover > .fusion-column-wrapper { transform: translateY(-6px); box-shadow: var(--apera-shadow-hover) !important; }
.apera-card:hover > .fusion-column-wrapper::before { transform: scaleX(1); }
.apera-card--dark > .fusion-column-wrapper { box-shadow: none; }
.apera-card--dark:hover > .fusion-column-wrapper { box-shadow: 0 20px 44px rgba(0, 0, 0, .25) !important; }
.apera-card .fontawesome-icon.circle-yes { transition: transform .35s var(--apera-ease), background-color .35s, color .35s !important; }
.apera-card:hover .fontawesome-icon.circle-yes { transform: rotate(-8deg) scale(1.08); background-color: var(--awb-custom_color_2) !important; border-color: var(--awb-custom_color_2) !important; color: #fff !important; }

/* Spacing: cards never touch when a row wraps or stacks, and buttons below a card row get air. */
.fusion-builder-row > .apera-card,
.fusion-builder-row-inner > .apera-card { margin-bottom: var(--apera-gap) !important; }
.fusion-builder-row > .apera-card + .fusion-layout-column:not(.apera-card) { margin-top: 12px !important; }

/* Other APERA cards share the same feel. */
.apera-team__card, .apera-resource { border-radius: var(--apera-radius); box-shadow: var(--apera-shadow); transition: transform .35s var(--apera-ease), box-shadow .35s var(--apera-ease); }
.apera-team__card:hover, .apera-resource:hover { transform: translateY(-6px); box-shadow: var(--apera-shadow-hover); }
.apera-team__photo { overflow: hidden; }
.apera-team__img { transition: transform .6s var(--apera-ease); }
.apera-team__card:hover .apera-team__img { transform: scale(1.05); }
.apera-resources { gap: var(--apera-gap); margin-bottom: var(--apera-gap); }
.fusion-events-shortcode .fusion-events-post .fusion-column-wrapper { border-radius: var(--apera-radius); transition: transform .35s var(--apera-ease), box-shadow .35s var(--apera-ease); }
.fusion-events-shortcode .fusion-events-post:hover .fusion-column-wrapper { transform: translateY(-6px); box-shadow: var(--apera-shadow-hover); }
.fusion-events-shortcode .fusion-events-post { margin-bottom: var(--apera-gap) !important; }
.apera-hubs li { transition: transform .3s var(--apera-ease), box-shadow .3s; }
.apera-hubs li:hover { transform: translateX(4px); box-shadow: var(--apera-shadow); }

/* Hero: a slow drift on the photo. */
.apera-hero-section { background-size: 115% auto; animation: apera-drift 24s ease-in-out infinite alternate; }
@keyframes apera-drift { from { background-position: 100% 30%; } to { background-position: 85% 60%; } }
@media (max-width: 800px), (prefers-reduced-motion: reduce) { .apera-hero-section { animation: none; background-size: cover; } }

/* Numbers band ([apera_stats]) */
.apera-stats { display: grid; grid-template-columns: repeat(4, 1fr); }
.apera-stat { padding: 10px 24px; text-align: center; border-left: 1px solid rgba(255, 255, 255, .18); }
.apera-stat:first-child { border-left: 0; }
.apera-stat p { margin: 0; }
.apera-stat__num { font-family: var(--awb-typography1-font-family); font-size: 52px; line-height: 1.05; color: #fff; }
.apera-stat__suffix { color: var(--awb-custom_color_2); }
.apera-stat__label { margin-top: 10px !important; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
@media (max-width: 800px) {
	.apera-stats { grid-template-columns: repeat(2, 1fr); row-gap: 28px; }
	.apera-stat:nth-child(odd) { border-left: 0; }
	.apera-stat__num { font-size: 40px; }
}

/* Member Network strip without logos: business names drifting in two rows. */
.apera-logos--names { display: flex; flex-direction: column; gap: 16px; padding: 6px 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.apera-logos--names .apera-logos__track { gap: 16px; animation-duration: 70s; }
.apera-logos__track--reverse { animation-direction: reverse; }
.apera-logos--names:hover .apera-logos__track { animation-play-state: paused; }
.apera-logos__name { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 12px; padding: 10px 20px 10px 10px; background: #fff; border: 1px solid var(--awb-color3); border-radius: 999px; box-shadow: 0 2px 10px rgba(28, 18, 64, .05); color: var(--awb-color8); font-weight: 600; white-space: nowrap; transition: transform .25s var(--apera-ease), box-shadow .25s, border-color .25s; }
.apera-logos__name:hover { transform: translateY(-3px); border-color: var(--awb-custom_color_2); box-shadow: 0 10px 22px rgba(28, 18, 64, .12); color: var(--awb-color5); }
.apera-logos__mono { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(135deg, var(--awb-color5), var(--awb-custom_color_3)); color: #fff; font-family: var(--awb-typography1-font-family); font-size: 17px; }

/* Member Directory: proper cards with gutters (Youzify list). */
#youzify-members-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--apera-gap); margin: 0 !important; height: auto !important; }
#youzify-members-list::before, #youzify-members-list::after { display: none !important; }
/* Youzify positions cards with masonry (absolute + inline left/top); the grid replaces it. */
#youzify-members-list > li { position: static !important; left: auto !important; top: auto !important; width: auto !important; margin: 0 !important; float: none !important; background: #fff; border: 1px solid var(--awb-color3); border-radius: var(--apera-radius); box-shadow: var(--apera-shadow); overflow: hidden; transition: transform .35s var(--apera-ease), box-shadow .35s var(--apera-ease); }
#youzify-members-list > li:hover { transform: translateY(-6px); box-shadow: var(--apera-shadow-hover); }

/* Uniform Size Guide (page 3591) */
.apera-size-note { display: inline-block; margin: 6px 0 0; padding: 14px 18px; border-left: 4px solid var(--awb-custom_color_2); border-radius: 8px; background: #fff; box-shadow: var(--apera-shadow); }
.apera-size-chart { width: 100%; max-width: 540px; height: auto; display: block; margin: 0 auto 10px; border-radius: var(--apera-radius); box-shadow: var(--apera-shadow-hover); }
.apera-size-tables { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--apera-gap); align-items: start; }
.apera-size-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: var(--apera-shadow); }
.apera-size-table caption { caption-side: top; text-align: left; padding: 0 0 8px; font-family: var(--awb-typography1-font-family); font-size: 19px; color: var(--awb-color8); }
.apera-size-table th { background: var(--awb-color5); color: #fff; padding: 9px 12px; text-align: left; font-size: 14px; }
.apera-size-table td { padding: 7px 12px; border-bottom: 1px solid var(--awb-color3); }
.apera-size-table tbody tr:nth-child(even) td { background: var(--awb-color2); }

/* ==========================================================================
 * Colour: the logo's palette. Magenta (its brightest colour) is the primary
 * (Avada palette color5); the rest of the star's colours rotate as accents.
 * ======================================================================== */
:root {
	--apera-magenta: #e40289;
	--apera-orange: #f37b1d;
	--apera-yellow: #f8c00d;
	--apera-green: #7fb52f;
	--apera-teal: #01a89c;
	--apera-sky: #0984c2;
	--apera-blue: #0c55a6;
	--apera-purple: #872790;
	--apera-spectrum: linear-gradient(90deg, #e40289, #f37b1d, #f8c00d, #7fb52f, #01a89c, #0984c2, #0c55a6, #872790);
	--apera-accent: var(--apera-magenta);
}
::selection { background: var(--apera-magenta); }

/* A strip of the logo's colours above the header and the footer. */
.fusion-tb-header::after,
.fusion-tb-footer::before { content: ""; display: block; height: 5px; background: var(--apera-spectrum); }

/* Eyebrows in magenta on light sections, sunny yellow on dark ones. */
#main .apera-eyebrow { color: var(--apera-magenta) !important; }
#main .fusion-fullwidth:has(.apera-card--dark) .apera-eyebrow { color: var(--apera-yellow) !important; }

/* Rotating accents: each card, hub, profile and monogram takes the next logo colour. */
:is(.apera-card, .apera-post, .apera-resource, .apera-team__card, .apera-hubs li, .apera-logos__name, #youzify-members-list > li, .fusion-events-shortcode .fusion-events-post):nth-child(5n+2) { --apera-accent: var(--apera-sky); }
:is(.apera-card, .apera-post, .apera-resource, .apera-team__card, .apera-hubs li, .apera-logos__name, #youzify-members-list > li, .fusion-events-shortcode .fusion-events-post):nth-child(5n+3) { --apera-accent: var(--apera-orange); }
:is(.apera-card, .apera-post, .apera-resource, .apera-team__card, .apera-hubs li, .apera-logos__name, #youzify-members-list > li, .fusion-events-shortcode .fusion-events-post):nth-child(5n+4) { --apera-accent: var(--apera-purple); }
:is(.apera-card, .apera-post, .apera-resource, .apera-team__card, .apera-hubs li, .apera-logos__name, #youzify-members-list > li, .fusion-events-shortcode .fusion-events-post):nth-child(5n) { --apera-accent: var(--apera-teal); }

/* Cards: a coloured top bar that grows on hover, icons in the card's colour. */
.apera-card > .fusion-column-wrapper::before { height: 4px; background: var(--apera-accent); transform: scaleX(.18); }
.apera-card:hover > .fusion-column-wrapper::before { transform: scaleX(1); }
.apera-card .fontawesome-icon.circle-yes { --awb-iconcolor: var(--apera-accent) !important; --awb-circlecolor: color-mix(in srgb, var(--apera-accent) 13%, #fff) !important; --awb-circlebordercolor: transparent !important; }
.apera-card:hover .fontawesome-icon.circle-yes { background-color: var(--apera-accent) !important; border-color: var(--apera-accent) !important; }
.apera-card--dark .fontawesome-icon.circle-yes { --awb-circlecolor: color-mix(in srgb, var(--apera-accent) 30%, transparent) !important; --awb-iconcolor: #fff !important; }
.apera-card--dark > .fusion-column-wrapper { border-top: 0 !important; }

.apera-resource, .apera-team__card, #youzify-members-list > li { border-top: 4px solid var(--apera-accent); }
.apera-resource__action, .apera-team__link { color: var(--apera-accent); }
.apera-team__photo, .apera-logos__mono { background: linear-gradient(135deg, var(--apera-accent), color-mix(in srgb, var(--apera-accent) 55%, #1c1240)); }
.apera-hubs li, .apera-hubs--public li { border-left-color: var(--apera-accent); }
.apera-logos__name:hover { border-color: var(--apera-accent); color: var(--apera-accent); }
.fusion-events-shortcode .fusion-events-post .fusion-column-wrapper { border-top: 4px solid var(--apera-accent); }

/* Numbers band: magenta into purple into blue, with each number's suffix in sunshine. */
#main .apera-stats-section { background: linear-gradient(115deg, var(--apera-magenta) 0%, var(--apera-purple) 55%, var(--apera-blue) 100%) !important; background-size: 160% 160% !important; animation: apera-flow 14s ease-in-out infinite alternate; }
@keyframes apera-flow { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
.apera-stat__suffix { color: var(--apera-yellow); }
.apera-stat { border-left-color: rgba(255, 255, 255, .25); }
@media (prefers-reduced-motion: reduce) { #main .apera-stats-section { animation: none; } }

/* Pills, size-chart headers and notes follow the palette. */
.apera-pill:nth-child(5n+2) { background: var(--apera-sky); }
.apera-pill:nth-child(5n+3) { background: var(--apera-orange); }
.apera-pill:nth-child(5n+4) { background: var(--apera-purple); }
.apera-pill:nth-child(5n) { background: var(--apera-teal); }
.apera-size-table:nth-of-type(2) th { background: var(--apera-blue); }

/* Industry Highlights cards ([apera_highlights]) */
.apera-posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--apera-gap); margin-bottom: var(--apera-gap); }
.apera-post { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--awb-color3); border-top: 4px solid var(--apera-accent); border-radius: var(--apera-radius); overflow: hidden; box-shadow: var(--apera-shadow); transition: transform .35s var(--apera-ease), box-shadow .35s var(--apera-ease); }
.apera-post:hover { transform: translateY(-6px); box-shadow: var(--apera-shadow-hover); }
.apera-post__media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: linear-gradient(135deg, var(--apera-accent), color-mix(in srgb, var(--apera-accent) 55%, #1c1240)); }
.apera-post__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--apera-ease); }
.apera-post:hover .apera-post__img { transform: scale(1.05); }
.apera-post__placeholder { display: block; width: 100%; height: 100%; background: url(/wp-content/uploads/2026/10/apera-icon-official-512.png) center / 88px no-repeat; opacity: .9; filter: brightness(0) invert(1); }
.apera-post__body { display: flex; flex-direction: column; flex: 1; padding: 22px 24px 24px; gap: 8px; }
.apera-post__body p { margin: 0; }
.apera-post__date { font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--apera-accent); }
.apera-post__title { margin: 0 !important; font-size: 21px !important; line-height: 1.3 !important; }
.apera-post__title a { color: var(--awb-color8); }
.apera-post__title a:hover { color: var(--apera-accent); }
.apera-post__excerpt { color: var(--awb-color6); flex: 1; }
.apera-post__more { font-weight: 600; color: var(--apera-accent); }

/* Post galleries ([gallery]): an even grid of rounded tiles. */
#main .gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; margin: 28px 0; }
#main .gallery .gallery-item { width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; float: none !important; }
#main .gallery .gallery-icon img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border: 0 !important; border-radius: 10px; transition: transform .4s var(--apera-ease), box-shadow .4s; }
#main .gallery .gallery-icon a:hover img { transform: scale(1.02); box-shadow: var(--apera-shadow-hover); }
#main .gallery br { display: none; }

/* Header: keep the main menu on one line on smaller desktops (1201–1600 px).
 * Avada sets a 34 px gap and 18 px text inline, which wraps "Events" at ~1280 px. */
@media (min-width: 1201px) {
	nav.awb-menu[aria-label="APERA Main"] .awb-menu__main-ul { flex-wrap: nowrap; }
}
@media (min-width: 1441px) and (max-width: 1600px) {
	nav.awb-menu[aria-label="APERA Main"] { --awb-gap: 24px !important; --awb-font-size: 17px !important; }
}
@media (min-width: 1201px) and (max-width: 1440px) {
	nav.awb-menu[aria-label="APERA Main"] { --awb-gap: 20px !important; --awb-font-size: 16px !important; }
}
@media (min-width: 1201px) and (max-width: 1300px) {
	nav.awb-menu[aria-label="APERA Main"] { --awb-gap: 12px !important; --awb-font-size: 15px !important; }
}

/* One "back to top" button: Youzify adds its own on directory/profile pages next to Avada's. */
.youzify-scrolltotop { display: none !important; }
/* Buttons + ☰ stay on one row; slimmer buttons where the header is tight. */
.fusion-tb-header .fusion-layout-column:has(.apera-join-header) > .fusion-column-wrapper { flex-wrap: nowrap !important; }
@media (min-width: 1101px) and (max-width: 1320px) {
	.fusion-tb-header .fusion-layout-column:has(.apera-join-header) .fusion-button { padding-left: 16px !important; padding-right: 16px !important; font-size: 13px !important; }
}

/* Top bar (purple): the current page stays white, with no highlight box. */
nav.awb-menu[aria-label="APERA Top Bar"] { --awb-active-color: #fff !important; --awb-active-bg: transparent !important; --awb-active-border-color: transparent !important; }
nav.awb-menu[aria-label="APERA Top Bar"] .current-menu-item > a,
nav.awb-menu[aria-label="APERA Top Bar"] .menu-item > a:hover { color: #fff !important; background: transparent !important; }

/* Side menu (☰, purple panel): white links, sunny yellow on hover. */
.awb-off-canvas a:not(.fusion-button):not(.awb-off-canvas-close):not([class*="social"]) { color: #fff !important; }
.awb-off-canvas a:not(.fusion-button):not(.awb-off-canvas-close):not([class*="social"]):hover { color: var(--apera-yellow) !important; }

/* Phones: the gala photo is the hero background (deep indigo overlay, white text),
 * and the purple top bar is hidden (its email/WhatsApp/Instagram are in the ☰ menu and footer). */
@media (max-width: 800px) {
	.fusion-tb-header .fusion-fullwidth:has(nav[aria-label="APERA Top Bar"]) { display: none !important; }
	#main .apera-hero-section {
		--awb-background-image: linear-gradient(180deg, rgba(28, 18, 64, .50) 0%, rgba(28, 18, 64, .72) 55%, rgba(28, 18, 64, .90) 100%) !important;
		background-image: linear-gradient(180deg, rgba(28, 18, 64, .50) 0%, rgba(28, 18, 64, .72) 55%, rgba(28, 18, 64, .90) 100%), url(/wp-content/uploads/2026/10/apera-hero-gala-mobile.jpg) !important;
		background-size: cover !important; background-position: center top !important; background-repeat: no-repeat !important;
		min-height: 78vh;
	}
	#main .apera-hero-section .apera-eyebrow { color: var(--apera-yellow) !important; }
	#main .apera-hero-section h1,
	#main .apera-hero-section .fusion-title h1,
	#main .apera-hero-section p { color: #fff !important; }
}

/* Page intro banners with APERA photos (.apera-page-hero): photo on the right, fading behind
 * the text on desktop; on phones the page's own portrait crop fills the banner (indigo overlay, white text). */
.apera-page-hero { background-size: cover !important; }
@media (max-width: 800px) {
	#main .apera-page-hero { background-size: cover !important; background-position: center top !important; background-repeat: no-repeat !important; min-height: 60vh; }
	body.page-id-1431 #main .apera-page-hero { --awb-background-image: none !important; background-image: linear-gradient(180deg, rgba(28,18,64,.55), rgba(28,18,64,.88)), url(/wp-content/uploads/2026/10/apera-page-about-townhall-mobile.jpg) !important; }
	body.page-id-3577 #main .apera-page-hero { --awb-background-image: none !important; background-image: linear-gradient(180deg, rgba(28,18,64,.55), rgba(28,18,64,.88)), url(/wp-content/uploads/2026/10/apera-page-join-press-team-mobile.jpg) !important; }
	body.page-id-3236 #main .apera-page-hero { --awb-background-image: none !important; background-image: linear-gradient(180deg, rgba(28,18,64,.55), rgba(28,18,64,.88)), url(/wp-content/uploads/2026/10/apera-page-events-conference-mobile.jpg) !important; }
	body.page-id-3599 #main .apera-page-hero { --awb-background-image: none !important; background-image: linear-gradient(180deg, rgba(28,18,64,.55), rgba(28,18,64,.88)), url(/wp-content/uploads/2026/10/apera-page-resources-training-mobile.jpg) !important; }
	body.page-id-1981 #main .apera-page-hero { --awb-background-image: none !important; background-image: linear-gradient(180deg, rgba(28,18,64,.55), rgba(28,18,64,.88)), url(/wp-content/uploads/2026/10/apera-page-contact-csr-team-mobile.jpg) !important; }
	#main .apera-page-hero .apera-eyebrow { color: var(--apera-yellow) !important; }
	#main .apera-page-hero h1, #main .apera-page-hero h2, #main .apera-page-hero p, #main .apera-page-hero li { color: #fff !important; }
	#main .apera-page-hero a:not(.fusion-button) { color: var(--apera-yellow) !important; }
}
/* Desktop: banner text stays on the faded left half, the photo stays clear on the right. */
@media (min-width: 801px) {
	#main .apera-page-hero .fusion-column-wrapper > * { max-width: 600px; }
	#main .apera-page-hero { min-height: 460px; }
}

/* Event sidebar details ([apera_event_details]) on the purple panel. */
.apera-event-details { margin: 0; color: #fff; }
.apera-event-details dt { margin: 18px 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--apera-yellow); }
.apera-event-details dt:first-child { margin-top: 0; }
.apera-event-details dd { margin: 0; line-height: 1.6; }
.apera-event-details a { color: #fff !important; text-decoration: underline; text-underline-offset: 3px; }
.apera-event-details a:hover { color: var(--apera-yellow) !important; }
.apera-event-details__muted { opacity: .8; }

/* Images are never cut off: galleries keep each photo's own shape (masonry),
 * and event / post featured images show whole. */
#main .gallery { display: block !important; columns: 3 220px; column-gap: 14px; }
#main .gallery .gallery-item { display: inline-block; width: 100% !important; margin: 0 0 14px !important; break-inside: avoid; }
#main .gallery .gallery-icon img { aspect-ratio: auto !important; height: auto !important; object-fit: contain !important; }
.single-tribe_events #main .fusion-image-element img.img-with-aspect-ratio { aspect-ratio: auto !important; height: auto !important; max-height: 85vh; width: auto; max-width: 100%; object-fit: contain !important; margin: 0 auto; display: block; }
.single-tribe_events #main .fusion-image-element .fusion-imageframe { display: block; text-align: center; background: var(--awb-color2); border-radius: var(--apera-radius); }
.single-post #main .apera-post-cover { background-size: contain !important; background-color: var(--awb-color8) !important; background-position: center !important; }
.single-tribe_events #main .fusion-image-element .awb-imageframe-caption-container { display: none !important; }

/* Directory search: Youzify's "nice-select" adds a stray duplicate next to each native dropdown. */
.bps-form .nice-select { display: none !important; }
/* Post / event titles are H1 (SEO) but keep the H2 size they were designed at. */
.single-post .fusion-tb-page-title-bar h1, .single-tribe_events .fusion-tb-page-title-bar h1, .archive .fusion-tb-page-title-bar h1 { font-size: var(--h2_typography-font-size) !important; line-height: var(--h2_typography-line-height) !important; }
@media (max-width: 800px) { .single-post .fusion-tb-page-title-bar h1, .single-tribe_events .fusion-tb-page-title-bar h1, .archive .fusion-tb-page-title-bar h1 { font-size: 34px !important; line-height: 1.2 !important; } }
