
/* Harmony Farms v1.4.1 — WordPress Elementor parity layer.
   Kept separate so future Elementor/WPCode edits can override this file. */
:root{--hf-primary:#327458;--hf-soft:#cbe2c6;--hf-container:1280px}
html{scroll-padding-top:150px}
body{overflow-x:clip}
.elementor .e-con,.elementor .elementor-widget{min-width:0}
.elementor .e-con>.elementor-widget{max-width:100%}
.elementor img{max-width:100%}
.elementor .elementor-widget-text-editor p:last-child{margin-bottom:0}
.elementor .elementor-button,.hf-btn{background:#327458;color:#fff;border-radius:5px}
.elementor .elementor-button:hover,.hf-btn:hover{background:#265c45;color:#fff}
.elementor .elementor-icon{color:#327458}
.elementor .elementor-icon svg{fill:currentColor}
.elementor .e-con.e-flex{--flex-wrap:nowrap}
.elementor .hf3-inner,.elementor .hf-about-wrap,.elementor .hf-contact-shell,.elementor .hf-services-shell,.elementor .hf-portfolio-wrap,.elementor .hf-team-wrap{
 max-width:1200px;width:min(100% - 48px,1200px);margin-left:auto;margin-right:auto
}
/* Header remains one sticky unit; its children never stick independently. */
.hf-global-header{position:sticky;top:0;z-index:9999;width:100%;isolation:isolate;background:#fff}
.admin-bar .hf-global-header{top:32px}
.hf-global-header .hf-topbar,.hf-global-header .hf-site-header{
 position:relative;top:auto;left:auto;right:auto;bottom:auto;transform:none;margin:0;width:100%;
}
.hf-global-header .hf-topbar{z-index:2}
.hf-global-header .hf-site-header{z-index:1}
.hf-global-header .hf-header-inner{min-height:84px}
.hf-global-header .hf-topbar-inner{display:flex;justify-content:flex-start;gap:32px;align-items:center}
.hf-global-header .hf-nav{min-width:0}
.hf-global-header .hf-menu{gap:clamp(8px,1vw,16px)}
.hf-global-header .hf-menu a{white-space:nowrap}
.hf-global-header .hf-brand{font-family:Georgia,serif;font-weight:700;letter-spacing:0}
.hf-global-header .hf-header-cta{flex-shrink:0}
.hf-global-header .hf-site-header.is-scrolled{background:#327458;color:#fff}
.hf-global-header .hf-site-header.is-scrolled .hf-menu a,
.hf-global-header .hf-site-header.is-scrolled .hf-brand,
.hf-global-header .hf-site-header.is-scrolled .hf-brand small{color:#fff}
.hf-global-header .hf-site-header.is-scrolled .hf-header-cta{background:#cbe2c6;color:#183d2e}
.hf-global-header .hf-topbar.is-scrolled{background:#fff;color:#327458}
.hf-global-header .hf-topbar.is-scrolled a{color:#327458}
.hf-global-header .hf-site-header.is-scrolled .hf-menu-toggle span{background:#fff}
/* All Elementor hero banners: background images must fill the full viewport, not just inner content. */
.elementor .hf-about-hero,.elementor .hf-contact-hero,.elementor .hf-services-hero,
.elementor .hf-portfolio-hero,.elementor .hf-team-hero,
.elementor .hf-v2-page-hero{width:100%;max-width:none;background-size:cover;background-position:center center;background-repeat:no-repeat}
.elementor .hf-about-hero-grid,.elementor .hf-contact-hero-grid,.elementor .hf-services-hero-inner,
.elementor .hf-portfolio-hero-grid,.elementor .hf-team-hero-grid{width:min(100% - 48px,1200px);max-width:1200px;margin-inline:auto}
/* Home hero uses the editable Elementor image as its only image source.
   It is absolutely positioned in the hero rather than taking up its own row. */
body.home .elementor .hf3-hero{position:relative;isolation:isolate;overflow:hidden;width:100%;max-width:none;min-height:650px;background:#204e3b}
body.home .elementor .hf3-hero>.hf3-inner{position:relative;display:flex;flex-direction:row;align-items:flex-start;width:min(100% - 48px,1200px);max-width:1200px;min-height:650px;margin-inline:auto;z-index:1}
body.home .elementor .hf3-hero .hf3-hero-photo{
 display:block!important;position:absolute!important;top:0!important;bottom:0!important;
 left:50%!important;right:auto!important;transform:translateX(-50%)!important;
 width:100vw!important;max-width:none!important;height:100%!important;
 min-height:0!important;z-index:-2!important;overflow:hidden;pointer-events:none;
}
body.home .elementor .hf3-hero .hf3-hero-photo .elementor-widget-container{width:100%;height:100%}
body.home .elementor .hf3-hero .hf3-hero-photo img{
 display:block;width:100%;height:100%!important;max-width:none;object-fit:cover;
 object-position:center 35%;border-radius:0
}
body.home .elementor .hf3-hero::after{
 content:"";display:block!important;position:absolute;inset:0;z-index:0;pointer-events:none;
 background:linear-gradient(90deg,rgba(16,49,35,.90) 0%,rgba(16,49,35,.70) 30%,rgba(16,49,35,.24) 60%,rgba(16,49,35,.05) 100%);
}
body.home .elementor .hf3-hero .hf3-hero-copy{width:min(56%,650px);max-width:650px;padding:65px 12px 180px 0;z-index:2;position:relative}
body.home .elementor .hf3-hero .elementor-heading-title,
body.home .elementor .hf3-hero .elementor-widget-text-editor,
body.home .elementor .hf3-hero .elementor-widget-text-editor p{color:#fff}
body.home .elementor .hf3-hero .hf3-buttons{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px}
body.home .elementor .hf3-quick{position:relative;z-index:3;margin-top:-105px;background:transparent}
body.home .elementor .hf3-quick>.hf3-inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}
body.home .elementor .hf3-quick .elementor-button{background:transparent;color:#fff}
body.home .elementor .hf3-quick .elementor-heading-title,
body.home .elementor .hf3-quick .elementor-widget-text-editor{color:#fff}
/* Keep layout grids from collapsing into single column when Elementor flex defaults change. */
.elementor .hf3-services-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.elementor .hf3-stats>.hf3-inner{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.elementor .hf3-expertise>.hf3-inner,.elementor .hf3-photo-band>.hf3-inner,
.elementor .hf3-testimonial>.hf3-inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}
.elementor .hf-about-two,.elementor .hf-about-hero-grid,
.elementor .hf-contact-columns,.elementor .hf-contact-hero-grid,
.elementor .hf-services-hero-inner,.elementor .hf-services-intro-grid,
.elementor .hf-portfolio-hero-grid,.elementor .hf-team-hero-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;align-items:center}
.elementor .hf-about-service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.elementor .hf-about-faq .elementor-toggle-title,.elementor .hf-about-faq .elementor-tab-title,
.elementor .hf-about-faq .elementor-tab-content,.elementor .hf-about-faq .elementor-tab-content p,
.elementor .hf-about-faq .elementor-toggle-icon{color:#fff}
.elementor .hf-about-faq .elementor-toggle-icon svg{fill:#fff;stroke:#fff}
.elementor .hf-team-card img{width:100%;aspect-ratio:1;object-fit:cover;object-position:center 20%;border-radius:5px}
.elementor .hf-team-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.elementor .hf-team-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.elementor .hf-team-carousel{display:flex;overflow-x:auto;gap:20px}
.elementor .hf-team-carousel>.hf-team-card{flex:0 0 calc((100% - 40px)/3)}
@media(max-width:1100px){
 .hf-global-header .hf-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#fff;z-index:5}
 .hf-global-header .hf-nav.is-open{display:flex}
 .hf-global-header .hf-menu-toggle{display:block}
 .hf-global-header .hf-site-header.is-scrolled .hf-nav{background:#327458}
 .hf-global-header .hf-site-header.is-scrolled .hf-nav .hf-menu a{color:#fff}
}
@media(max-width:900px){
 .elementor .hf3-services-grid,.elementor .hf-about-service-grid,.elementor .hf-team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .elementor .hf-team-four{grid-template-columns:repeat(2,minmax(0,1fr))}
 .elementor .hf-team-carousel>.hf-team-card{flex-basis:calc((100% - 20px)/2)}
}
@media(max-width:782px){.admin-bar .hf-global-header{top:46px}}
@media(max-width:767px){
 .hf-global-header .hf-topbar{display:block}
 .hf-global-header .hf-topbar-inner{gap:8px 16px;flex-wrap:wrap;padding:6px 0}
 .hf-global-header .hf-header-inner{min-height:68px}
 .elementor .hf3-inner,.elementor .hf-about-wrap,.elementor .hf-contact-shell,
 .elementor .hf-services-shell,.elementor .hf-portfolio-wrap,.elementor .hf-team-wrap{width:calc(100% - 36px)}
 body.home .elementor .hf3-hero,body.home .elementor .hf3-hero>.hf3-inner{min-height:630px}
 body.home .elementor .hf3-hero>.hf3-inner{width:calc(100% - 36px)}
 body.home .elementor .hf3-hero .hf3-hero-copy{width:100%;max-width:510px;padding:52px 0 140px}
 body.home .elementor .hf3-hero .hf3-hero-photo img{object-position:60% center}
 body.home .elementor .hf3-quick{margin-top:-48px}
 body.home .elementor .hf3-quick>.hf3-inner{grid-template-columns:1fr}
 .elementor .hf3-services-grid,.elementor .hf3-expertise>.hf3-inner,
 .elementor .hf3-photo-band>.hf3-inner,.elementor .hf3-testimonial>.hf3-inner,
 .elementor .hf-about-two,.elementor .hf-about-hero-grid,.elementor .hf-about-service-grid,
 .elementor .hf-contact-columns,.elementor .hf-contact-hero-grid,
 .elementor .hf-services-hero-inner,.elementor .hf-services-intro-grid,
 .elementor .hf-portfolio-hero-grid,.elementor .hf-team-hero-grid,
 .elementor .hf-team-grid{grid-template-columns:minmax(0,1fr)}
 .elementor .hf3-stats>.hf3-inner{grid-template-columns:repeat(2,minmax(0,1fr))}
 .elementor .hf-team-carousel>.hf-team-card{flex-basis:85%}
}

/* Reliable full-bleed hero on WordPress: photo remains editable in Elementor,
   while CSS/JS paints it as a background to avoid a separate image row. */
body.home .elementor .hf3-hero{
 background-image:url('../images/home-hero.webp');
 background-size:cover;background-position:center 35%;background-repeat:no-repeat;
}
body.home .elementor .hf3-hero .hf3-hero-photo{display:none!important}
body.home .elementor .hf3-hero::after{z-index:0}
body.home .elementor .hf3-hero>.hf3-inner{z-index:1}
@media(max-width:767px){body.home .elementor .hf3-hero{background-position:60% center}}
