/*
 * Front-end guardrails. Kept deliberately tiny — design lives in theme.json.
 * Only put rules here that theme.json cannot express.
 */

/*
 * Re-anchor the document root font-size.
 *
 * Some of the site owner's pages embed a form widget whose boilerplate CSS sets
 * `html { font-size: 10px }` globally (the old "1rem = 10px" trick). This theme's
 * header, footer and offer bar use rem-based sizes, so on those pages they would
 * shrink to ~62% — the footer renders at 9px instead of 15px.
 *
 * The widget's own form is px-based and does not depend on that 10px root
 * (verified: forcing the root to 16px leaves every form field unchanged), so
 * re-asserting the root is safe and fixes the chrome. `html:root` (specificity
 * 0,1,1) outranks the widget's `:root, html` (0,1,0), and `100%` respects the
 * visitor's own browser font-size preference rather than pinning to 16px.
 */
html:root {
    font-size: 100%;
}

/*
 * Mobile nav overlay: make submenu items subordinate to their parent.
 *
 * In the open mobile menu, WordPress flattens submenu items into the same
 * centered list as the top-level items, so "How it Works / Pricing / FAQ" read
 * as siblings of "Product" rather than children of it. Shrinking and muting the
 * submenu items restores the hierarchy without needing indentation (which reads
 * oddly on a centered overlay).
 */
.wp-block-navigation__responsive-container.is-menu-open
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item__content {
    font-size: 0.8em;
    color: var(--wp--preset--color--muted-foreground);
}