/* Global sections (Header / CTA / Footer Elementor templates).
   Only behaviour that Elementor cannot express lives here; colours, type, spacing are edited in Elementor. */

/* The old PHP header was position:fixed and every page got a top padding to clear it.
   The Elementor header is sticky (it takes its own space), so that padding must go. */
.arch-gs-on .elementor{padding-top:0!important}

/* --- Header: sticky bar --------------------------------------------------- */
.arch-tpl-header{position:sticky;top:0;z-index:9999;transition:box-shadow .25s ease}
body.admin-bar .arch-tpl-header{top:32px}
@media(max-width:782px){body.admin-bar .arch-tpl-header{top:46px}}
.arch-tpl-header.is-scrolled{box-shadow:0 2px 20px rgba(0,0,0,.5)}
.arch-tpl-header .arch-global-header{position:relative}

/* Menu: gold underline that grows on hover and stays on the current page */
.arch-hnav .elementor-icon-list-item>a{position:relative}
.arch-hnav:not(.arch-hnav-mobile) .elementor-icon-list-item>a{padding-bottom:4px}
.arch-hnav:not(.arch-hnav-mobile) .elementor-icon-list-item>a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1.5px;background:#B59E5F;border-radius:2px;transform:scaleX(0);transform-origin:left center;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.arch-hnav:not(.arch-hnav-mobile) .elementor-icon-list-item>a:hover::after,
.arch-hnav:not(.arch-hnav-mobile) .elementor-icon-list-item.is-active>a::after{transform:scaleX(1)}
.arch-hnav .elementor-icon-list-item.is-active .elementor-icon-list-text{color:#B59E5F!important}
.arch-hnav .elementor-icon-list-text{transition:color .25s ease}

/* Mobile menu (opens under the bar) */
.arch-hburger .elementor-icon{cursor:pointer;line-height:1}
.arch-hburger .elementor-icon:focus-visible{outline:2px solid #B59E5F;outline-offset:4px;border-radius:4px}
.arch-mobnav{position:absolute!important;left:0;right:0;top:100%;z-index:9998;max-height:0;overflow:hidden;padding-top:0!important;padding-bottom:0!important;border-top-width:0!important;transition:max-height .3s ease,padding .3s ease}
.arch-mobnav.is-open{max-height:640px;padding-top:8px!important;padding-bottom:20px!important;border-top-width:1px!important}
.arch-hnav-mobile .elementor-icon-list-item>a{display:block;padding:13px 0}
.arch-hnav-mobile .elementor-icon-list-item{border-bottom:1px solid rgba(255,255,255,.07)}
.arch-mobnav .elementor-button{display:block;text-align:center}

/* Breakpoint where the bar turns into the hamburger (matches the previous design) */
@media(max-width:900px){.arch-hide-md{display:none!important}}
@media(min-width:901px){.arch-show-md,.arch-mobnav{display:none!important}}

/* Footer / CTA: keep the bands full-bleed inside the wrapper */
.arch-tpl-cta,.arch-tpl-footer{width:100%}

/* In the Elementor editor the mobile menu is shown open (and at every width) so it can be selected and edited */
body.elementor-editor-active.single-elementor_library .arch-mobnav{position:static!important;max-height:none!important;overflow:visible!important;padding-top:8px!important;padding-bottom:20px!important;border-top-width:1px!important}
@media(min-width:901px){body.elementor-editor-active.single-elementor_library .arch-mobnav{display:flex!important}}

/* Responsive safety net --------------------------------------------------- */
/* Elements with a fixed pixel width (set for desktop) must never be wider than their column, or tablets scroll sideways */
.arch-gs-on .elementor-element{max-width:100%}
/* Text links inside paragraphs (e.g. "Get a Free Confidential Valuation") get a comfortable tap area on touch screens */
@media(max-width:1024px){.arch-gs-on .elementor-widget-text-editor a{display:inline-block;padding:8px 0}}