/* Header always on top; no blur at top; darken only after scroll */
#site-header{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;z-index:2147483647!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#site-header.header-scrolled{background-color:rgba(0,0,0,.6)!important;border-bottom-color:rgba(255,255,255,.08)!important;box-shadow:0 12px 28px -14px rgba(0,0,0,.6)!important}

/* Pin the decorative background to the top instead of fixed full viewport */
/* Allow main stylesheet to control site-top-bg height (remove fixed 70vh) */
.site-top-bg{position:absolute!important;left:0!important;right:0!important;top:0!important;z-index:0!important;pointer-events:none}

/* Space for fixed header so content doesn't hide under it */
body.has-fixed-header main{padding-top:4.5rem!important}

/* Keep the decorative background to a single viewport height to avoid long empty tails */
.site-top-bg{height:100vh!important}

/* Ensure footer always renders above the overlay */
footer{position:relative;z-index:10}

/* Force Services dropdown backgrounds to solid black (desktop) */
#services-dropdown{background:transparent!important}
#services-dropdown #services-dropdown-panel{background:#000!important}

/* Use Source Sans Variable 'Source Sans 3' for headings and navbar (bold) */
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@700;800&display=swap');

h1, h2, h3 { font-family: 'Source Sans 3', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, 'Noto Sans', sans-serif !important; font-weight: 700 !important; }
#site-header, #site-header a, #site-header .text-base, #site-header .font-semibold { font-family: 'Source Sans 3', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, 'Noto Sans', sans-serif !important; font-weight: 700 !important; }

/* Help widget (floating) */
/* move entire widget up by ~1.25rem (mt-5) */
#help-widget{display:flex;align-items:center;gap:0.75rem;bottom:calc(1.5rem + 2.5rem + 1.25rem); right:1.5rem; position:fixed}

#help-bubble{position:absolute;right:calc(100% + 0.5rem);top:50%;transform:translateY(-50%);background:rgba(255,255,255,0.03);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.06);width:48px;overflow:hidden;opacity:0;padding:0.45rem 0.6rem;transition:opacity .28s ease,transform .28s ease,width .12s ease}
#help-bubble.show{opacity:1}
#help-text{white-space:normal;display:block;line-height:1.05}
#help-widget .typing-cursor::after{content:'|';margin-left:6px;opacity:1;animation:blink 1s steps(2,end) infinite}
@keyframes blink{50%{opacity:0}}

/* small entrance animation - slide up */
#help-widget{transform:translateY(8px);opacity:0;transition:transform .28s ease,opacity .28s ease}
#help-widget.show{transform:translateY(0);opacity:1}

/* help widget button uses site orange to match footer */
#help-whatsapp, #help-whatsapp-mobile{background:#ee4f14}
#help-whatsapp:hover,#help-whatsapp-mobile:hover{background:#d44710}

/* ensure the button stays visually on the right and above the bubble */
/* center the button under the bubble and give stable height to avoid jitter */
.help-wrapper{display:flex;align-items:center;justify-content:center;gap:0.5rem;position:relative;height:40px}
#help-whatsapp{position:relative;z-index:60;margin-top:0;margin-left:-0.3125rem}
#help-whatsapp-mobile{margin-left:-0.3125rem}

/* bubble: vertically centered, use flex to align text and keep min-height to avoid jumps */
#help-bubble{position:absolute;right:calc(100% + 0.75rem);top:50%;transform:translateY(-50%);background:rgba(255,255,255,0.03);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.06);width:48px;overflow:hidden;opacity:0;padding:0 0.75rem;transition:opacity .28s ease,transform .28s ease,width .12s ease;display:flex;align-items:center;box-sizing:border-box;height:40px}
#help-bubble.show{opacity:1}
#help-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;height:100%;line-height:40px;font-size:0.95rem}

/* no pulse animation — bubble will only resize based on text width */
#help-bubble{transform-origin:right center}

/* Prevent accidental horizontal scroll on small devices caused by wide children */
html, body { overflow-x: hidden !important; }

/* Ensure images never exceed their container width */
img { max-width: 100%; height: auto; display: block; }

/* Gallery tile image enforcement: ensure stacked images are flush with no gaps */
.gallery-tile img { width:100%; height:auto; object-fit:cover; display:block; margin:0; padding:0; }

/* Make gallery container and tiles flush (no gap/padding/border) */
#gallery-grid { margin:0; padding:0; gap:5px; }
.gallery-tile { margin:0; padding:0; border:0; background:transparent; display:block; }
.gallery-tile:focus { outline:none; }

/* Improve lightbox controls on small screens: larger touch targets and centered vertically */
#gallery-lightbox button { touch-action: manipulation; }

/* Portfolio banner shadow: desktop only. Remove heavy shadow on small screens to avoid visible overlap under banner. */
.portfolio-banner{box-shadow: 0 60px 120px rgba(0,0,0,0.58);} /* default: desktop-heavy */

/* tablet: reduce shadow intensity and spread */
@media (max-width: 1023px){
	.portfolio-banner{box-shadow: 0 30px 60px rgba(0,0,0,0.5);} 
}

/* mobile: much smaller, subtle shadow so it doesn't intrude under the banner */
@media (max-width: 767px){
	.portfolio-banner{box-shadow: 0 8px 18px rgba(0,0,0,0.32) !important;}
}