/*
    Theme Name: Acx Hello Child Theme
    Theme URI:  https://acxcom.com/
    Description: Child theme made for Hello Elementor.
    Author:     Acxcom
    Author URI: https://www.acxcom.com/
    Template:   hello-elementor
    Version:    2026.1
    License:    GNU General Public License v3 or later
    License URI: https://www.gnu.org/licenses/gpl-3.0.html
    Text Domain: acx-hello-child
*/

/*
 * NOTE: The parent (Hello Elementor) stylesheets are loaded via the enqueue
 * dependencies declared in functions.php. Do NOT @import them here — that would
 * load the parent CSS a second time and block first paint.
 *
 * Keep this file for site-wide styling only. Layout that belongs to a plugin
 * stays in that plugin; visual design stays here or in Elementor.
 */

/* ---------------------------------------------------------------------------
 * Base
 * ------------------------------------------------------------------------- */

sup {
    font-size: 50%;
}

/* Prevent media from overflowing their container. */
img,
video,
iframe {
    max-width: 100%;
    height: auto;
}

/* Reserve the intrinsic ratio so images don't shift the layout while loading
 * (Core Web Vitals — CLS). */
img[width][height] {
    height: auto;
}

/* Keep long words/URLs from blowing out narrow columns on mobile. */
body {
    overflow-wrap: break-word;
}

/* Visible focus ring for keyboard navigation (accessibility). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* Screen-reader-only helper (matches the WordPress core convention). */
.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.screen-reader-text:focus {
    position: static !important;
    width: auto;
    height: auto;
    margin: 0;
    clip: auto;
    white-space: normal;
}

/* Skip link target offset when a sticky header is in use. */
:target {
    scroll-margin-top: 100px;
}

/* Respect the user's reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Hide the WPML "development site" front-end ribbon. */
.otgs-development-site-front-end {
    display: none;
}

/* ---------------------------------------------------------------------------
 * Hello Elementor header / footer
 *
 * With the free Elementor plugin there is no Theme Builder, so the site relies
 * on Hello's own header/footer (Appearance > Customize > Header & Footer).
 * Their markup — target these selectors rather than adding wrappers:
 *
 *   #site-header / .site-header        header container
 *   .site-branding / .site-title       logo and site title
 *   .site-navigation                   desktop menu (<nav>)
 *   .site-navigation-toggle            mobile hamburger button
 *   .site-navigation-dropdown          mobile menu panel
 *   #site-footer / .site-footer        footer container
 *
 * Sticky header, colours and spacing land here once the design is approved.
 * ------------------------------------------------------------------------- */

/* Comfortable touch target for the mobile menu button (WCAG 2.5.8). */
.site-navigation-toggle {
    min-width: 44px;
    min-height: 44px;
}

/* ---------------------------------------------------------------------------
 * Custom site styles below
 * ------------------------------------------------------------------------- */
.hfe-menu-toggle.sub-arrow, p.gform_required_legend {
  display: none;
}