/* Black Shepherd unified palette — matched to About Web Design & SEO, October 2026 */
:root{--bst-ink:#081d18;--bst-forest:#103b30;--bst-green:#175c46;--bst-gold:#c8a46a;--bst-paper:#f6f5ef;--bst-muted:#64756c;--bst-dark:#09251d;--bst-border:#d6dfd5}
@theme{--color-primary:#175c46;--color-secondary:#103b30;--color-neutral:#081d18;--color-gold:#c8a46a;--color-black:#081d18;--color-background:#f6f5ef}
body,.be-site{background:var(--bst-paper);color:var(--bst-ink)}
.be-site p{color:var(--bst-muted)}
.be-site em,.be-text-link,.be-nav-group[open]>summary,.be-mega-links a:hover,.be-project-word,.be-process-grid article>span{color:var(--bst-green)}
.be-btn,.be-nav-cta,.be-ticker,.be-mock-toolbar,.be-mock-action,.be-floating-card,.be-mega-intro,.be-markets-section,.be-cta,.art-1{background:var(--bst-green)!important}
.be-btn:hover,.be-nav-cta:hover{background:var(--bst-forest)!important}
.be-btn.white{background:var(--bst-paper)!important;color:var(--bst-green)!important}
.be-ticker{background:var(--bst-dark)!important;border-color:var(--bst-gold)!important}
.be-ticker svg,.be-ticker i{color:var(--bst-gold)}
.be-nav-cta,.be-btn,.bst-search-dialog form button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce div.product form.cart .single_add_to_cart_button,.wp-block-button__link{border-color:var(--bst-gold)!important;outline-color:var(--bst-gold)!important}
#be-header,.be-mega,.be-service-card,.be-insight,.be-project-card{border-color:var(--bst-border)}
.be-mega{border-top-color:var(--bst-gold)}
.be-service-card:hover,.be-mega-links a:hover{background:#e7ece4}
.be-work-section,.be-insight-placeholder,.be-project-art{background:#edf1eb}
.be-hero-note,.be-client-strip,.be-service-grid,.be-specialist-row{border-color:var(--bst-border)}
.bst-search-trigger{color:var(--bst-green);border-color:var(--bst-green)}
.bst-search-dialog form button{background:var(--bst-green)}
.bst-search-dialog input:focus{border-color:var(--bst-gold)!important;outline-color:var(--bst-gold)!important}
.bst-portfolio-hero{background:radial-gradient(ellipse at 82% 15%,#285f49 0%,transparent 43%),linear-gradient(135deg,#061c16,#0c3226 75%)}
.bst-portfolio-final{background:var(--bst-dark)}
.bst-portfolio-page{background:var(--bst-paper);color:var(--bst-ink)}
.bst-portfolio-outline{border-color:var(--bst-gold);outline-color:var(--bst-gold)}
.be-site a:focus-visible,.be-site button:focus-visible{outline:2px solid var(--bst-gold);outline-offset:3px}

/* Contrast correction: light portfolio / project backgrounds.
   Keep light text on dark hero/CTA blocks and preserve decorative gold. */
.bst-portfolio-page .bst-portfolio-section:not(.bst-portfolio-hero):not(.bst-portfolio-final),
.bst-portfolio-page .bst-portfolio-intro,
.bst-portfolio-page .bst-portfolio-work,
.bst-portfolio-page .bst-portfolio-projects,
.be-work-section,
.be-site .be-section:not(.be-markets-section):not(.be-cta) {
  color:var(--bst-ink);
}
.bst-portfolio-page .bst-portfolio-section:not(.bst-portfolio-hero):not(.bst-portfolio-final) h1,
.bst-portfolio-page .bst-portfolio-section:not(.bst-portfolio-hero):not(.bst-portfolio-final) h2,
.bst-portfolio-page .bst-portfolio-section:not(.bst-portfolio-hero):not(.bst-portfolio-final) h3,
.bst-portfolio-page .bst-portfolio-intro h1,
.bst-portfolio-page .bst-portfolio-intro h2,
.bst-portfolio-page .bst-portfolio-work h2,
.bst-portfolio-page .bst-portfolio-projects h2,
.be-work-section h1,.be-work-section h2,.be-work-section h3 {
  color:#081d18!important;
}
.bst-portfolio-page .bst-portfolio-section:not(.bst-portfolio-hero):not(.bst-portfolio-final) p,
.bst-portfolio-page .bst-portfolio-intro p,
.bst-portfolio-page .bst-portfolio-work p,
.bst-portfolio-page .bst-portfolio-projects p,
.be-work-section p {
  color:#36483f!important;
}
.bst-portfolio-page .bst-portfolio-section:not(.bst-portfolio-hero):not(.bst-portfolio-final) .eyebrow,
.be-work-section .be-label {color:#175c46!important}
.bst-portfolio-hero h1,.bst-portfolio-hero h2,.bst-portfolio-final h2,
.be-markets-section h2,.be-cta h2{color:#fff!important}
.bst-portfolio-hero p,.bst-portfolio-final p,.be-markets-section p,.be-cta p{color:#e1ebe4!important}


/* Header + footer inspired by the approved dark forest and champagne-gold CTA */
:root{--bst-header-footer-bg:#06251b;--bst-header-footer-gold:#c8a46a;--bst-header-footer-white:#f9faf6}
#be-header{background:var(--bst-header-footer-bg)!important;border-bottom:1px solid rgba(200,164,106,.35)!important;color:var(--bst-header-footer-white)!important}
#be-header .be-brand,#be-header .be-brand small,#be-header #be-nav>a:not(.be-nav-cta),#be-header .be-nav-group>summary,#be-header .be-mobile-toggle{color:var(--bst-header-footer-white)!important}
#be-header #be-nav>a:not(.be-nav-cta):hover,#be-header .be-nav-group>summary:hover,#be-header .be-nav-group[open]>summary{color:var(--bst-header-footer-gold)!important}
#be-header .be-nav-cta{background:var(--bst-header-footer-gold)!important;color:#081d18!important;border-color:var(--bst-header-footer-gold)!important}
#be-header .be-nav-cta:hover{background:#e2c18b!important}
#be-header .be-mega{background:#0d3025!important;color:var(--bst-header-footer-white)!important;border-color:rgba(200,164,106,.35)!important;border-top:3px solid var(--bst-header-footer-gold)!important}
#be-header .be-mega-links a,#be-header .be-mega-intro h2{color:var(--bst-header-footer-white)!important}
#be-header .be-mega-links a:hover{background:#174536!important;color:var(--bst-header-footer-gold)!important}
#be-header .be-mega-intro{background:#123d30!important}
#be-header .be-mega-intro p{color:#d6e4dc!important}
#be-header .be-mobile-toggle svg,#be-header .be-mobile-toggle i{color:var(--bst-header-footer-white)!important}
#be-footer,.be-footer,footer.be-footer,footer#be-footer{background:var(--bst-header-footer-bg)!important;color:var(--bst-header-footer-white)!important;border-color:rgba(200,164,106,.35)!important}
#be-footer h2,#be-footer h3,#be-footer h4,#be-footer strong,#be-footer .be-brand,.be-footer h2,.be-footer h3,.be-footer h4,.be-footer strong{color:var(--bst-header-footer-white)!important}
#be-footer p,#be-footer li,#be-footer small,.be-footer p,.be-footer li,.be-footer small{color:#d7e3dc!important}
#be-footer a,.be-footer a{color:#e7e9e3}
#be-footer a:hover,.be-footer a:hover{color:var(--bst-header-footer-gold)!important}
#be-footer .be-label,.be-footer .be-label{color:var(--bst-header-footer-gold)!important}
#be-footer .be-btn,.be-footer .be-btn{background:var(--bst-header-footer-gold)!important;color:#081d18!important;border-color:var(--bst-header-footer-gold)!important}


/* Hostinger-inspired typography using openly licensed font families.
   Exact proprietary Hostinger font identity has not been verified. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Sora:wght@400;500;600;700;800&display=swap');
:root{--bst-font-display:'Sora',sans-serif;--bst-font-body:'DM Sans',sans-serif}
html body,body .be-site,body .bst-about,body .bst-portfolio-page,
body .elementor,body .elementor-widget-text-editor,
body .woocommerce,body input,body textarea,body select,body button {
font-family:var(--bst-font-body)!important;
}
body h1,body h2,body h3,body h4,body h5,body h6,
body .be-site h1,body .be-site h2,body .be-site h3,
body .bst-about h1,body .bst-about h2,body .bst-about h3,
body .bst-portfolio-page h1,body .bst-portfolio-page h2,
body .elementor-heading-title,body .be-project-word {
font-family:var(--bst-font-display)!important;
font-style:normal;
letter-spacing:-.045em;
}
body .be-site h1,body .be-site h2,body .bst-about h1,body .bst-about h2 {font-weight:700}
body .be-site h3,body .bst-about h3 {font-weight:700}
body #be-nav,body #be-header,body #be-footer,body .be-footer,
body .be-btn,body .btn,body .be-label,body .bst-about .eyebrow,
body .bst-about .btn,body .bst-about .hq-card address,
body .elementor-button,body .wp-block-button__link {
font-family:var(--bst-font-body)!important;
}
body .bst-about .serif{font-family:var(--bst-font-display)!important;font-style:normal;font-weight:600}


/* Static, accessible conversion offer replaces the moving header ticker */
.bst-offer-bar{background:#071e17;color:#f8f8f3;border-top:2px solid #c8a46a;border-bottom:1px solid rgba(200,164,106,.4);font-family:var(--bst-font-body,'DM Sans',sans-serif)}
.bst-offer-link{display:flex;align-items:center;justify-content:center;gap:18px;min-height:48px;padding:9px 24px;color:#f8f8f3!important;text-decoration:none!important;text-align:center;flex-wrap:wrap;transition:background .2s ease}
.bst-offer-link:hover,.bst-offer-link:focus-visible{background:#123c2f}
.bst-offer-badge{background:#c8a46a;color:#071e17;padding:6px 10px;border-radius:3px;font-size:10px;font-weight:800;letter-spacing:.12em;white-space:nowrap}
.bst-offer-message{font-size:13px;font-weight:500;line-height:1.45}
.bst-offer-message strong{font-weight:800;color:#fff}
.bst-offer-action{color:#e6be79;font-size:12px;font-weight:800;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.bst-offer-link:focus-visible{outline:3px solid #e6be79;outline-offset:-3px}
@media(max-width:640px){.bst-offer-link{gap:6px 10px;padding:9px 12px}.bst-offer-badge{font-size:9px}.bst-offer-message{font-size:11px}.bst-offer-action{font-size:11px}}


/* Mobile menu usability and dark-header contrast */
@media(max-width:950px){
#be-header .be-nav-wrap{position:relative}
#be-header .be-mobile-toggle{display:inline-flex!important;align-items:center;justify-content:center;gap:10px;min-height:44px;min-width:78px;padding:10px 13px;background:#153e31!important;color:#fff!important;border:1px solid #c8a46a!important;border-radius:8px;cursor:pointer;z-index:5}
#be-header .be-mobile-toggle span{font-size:19px;line-height:1}
#be-header #be-nav{display:none;position:absolute;top:100%;left:0;right:0;z-index:1100;background:#09291f!important;color:#f9faf6!important;border:1px solid rgba(200,164,106,.4);border-top:2px solid #c8a46a;box-shadow:0 22px 35px rgba(0,0,0,.3);padding:12px 18px 22px;max-height:min(75vh,calc(100dvh - 100px));overflow-y:auto;overscroll-behavior:contain}
#be-header #be-nav.be-nav-open{display:block!important}
#be-header #be-nav>a:not(.be-nav-cta),#be-header #be-nav .be-nav-group>summary{display:flex;align-items:center;justify-content:space-between;min-height:46px;padding:13px 6px!important;color:#fff!important;border-bottom:1px solid rgba(255,255,255,.12);font-size:13px;cursor:pointer}
#be-header #be-nav .be-nav-group>summary:after{content:'+';font-size:20px;color:#c8a46a}
#be-header #be-nav .be-nav-group[open]>summary:after{content:'−'}
#be-header #be-nav .be-mega{position:static!important;display:block!important;background:#123a2e!important;border:0!important;border-left:2px solid #c8a46a!important;box-shadow:none!important;margin:4px 0 12px!important;padding:5px 12px!important;max-height:none!important}
#be-header #be-nav .be-mega-intro{display:none!important}
#be-header #be-nav .be-mega-links{display:grid!important;grid-template-columns:1fr!important;gap:0!important}
#be-header #be-nav .be-mega-links a{display:flex;align-items:center;min-height:44px;padding:10px 4px!important;color:#f7f8f3!important;font-size:12px!important;white-space:normal}
#be-header #be-nav .be-nav-cta{display:block!important;text-align:center;margin-top:16px;padding:13px!important;color:#081d18!important;background:#c8a46a!important;border-radius:5px}
}
@media(max-width:480px){#be-header .be-nav-wrap{width:calc(100% - 24px);gap:8px}#be-header .be-mobile-toggle{min-width:70px;padding:8px}#be-header #be-nav{left:0;right:0;padding:10px 12px 18px}}


/* Mobile navigation overlay: independently scrollable, always above search and page content */
@media(max-width:950px){
#be-header{z-index:99999!important;overflow:visible!important}
#be-header .be-nav-wrap{position:relative!important}
#be-header #be-nav{position:fixed!important;top:var(--bst-mobile-nav-top,120px)!important;left:0!important;right:0!important;bottom:0!important;width:100vw!important;height:auto!important;max-height:none!important;min-height:0!important;overflow-y:scroll!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;z-index:100001!important;box-sizing:border-box!important;padding:14px max(18px,env(safe-area-inset-right)) calc(32px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;border-radius:0!important}
#be-header #be-nav.be-nav-open{display:block!important;visibility:visible!important;pointer-events:auto!important}
#be-header #be-nav .be-nav-group{display:block!important}
#be-header #be-nav .be-mega{max-height:none!important;overflow:visible!important}
#be-header #be-nav .be-mega-links a{overflow-wrap:anywhere}
body.bst-mobile-nav-active{overflow:hidden!important;touch-action:none}
body.bst-mobile-nav-active #be-header #be-nav{touch-action:pan-y}
}


/* Prominent close control within the mobile navigation drawer */
.bst-mobile-nav-close{display:none}
@media(max-width:950px){
#be-header #be-nav .bst-mobile-nav-close{display:flex!important;align-items:center;justify-content:center;gap:9px;position:sticky;top:-14px;z-index:3;margin:0 0 12px auto;padding:10px 14px;min-width:110px;min-height:44px;background:#c8a46a!important;color:#081d18!important;border:1px solid #e4c98f;border-radius:6px;font:700 12px var(--bst-font-body,'DM Sans',sans-serif);cursor:pointer;box-shadow:0 3px 14px rgba(0,0,0,.2)}
#be-header #be-nav .bst-mobile-nav-close span:first-child{font-size:25px;line-height:1;font-weight:500}
#be-header #be-nav .bst-mobile-nav-close:focus-visible{outline:3px solid #fff;outline-offset:3px}
}

@media(prefers-reduced-motion:reduce){.be-btn,.be-service-card{transition:none}}