/* =====================================================================
   BARTRA HOMECARE — BLENDED SITE STYLESHEET (HEADER + FOOTER ONLY)
   Every rule in this file is scoped to .site-header / .site-footer (or is
   itself a header/footer-only class name) — nothing here applies to page
   body content, which is styled separately.
   Base rules below are mirrored directly from the live site's own "used
   CSS" (bartrahomecare.ie), stripped of WordPress/WP Rocket boilerplate
   and of every body-only component (hero, about, services, quote, FAQ,
   career, testimonials, pagination, etc.). Colours, fonts, spacing and
   every breakpoint match the live theme's header/footer 1:1.
   ===================================================================== */

@font-face{
font-display:swap;
font-family:'Albert Sans';
font-style:normal;
font-weight:300;
src:url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/albert-sans-v3-latin-300.woff2') format('woff2')}
@font-face{
font-display:swap;
font-family:'Albert Sans';
font-style:normal;
font-weight:400;
src:url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/albert-sans-v3-latin-regular.woff2') format('woff2')}
@font-face{
font-display:swap;
font-family:'Albert Sans';
font-style:normal;
font-weight:500;
src:url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/albert-sans-v3-latin-500.woff2') format('woff2')}
@font-face{
font-display:swap;
font-family:'Albert Sans';
font-style:normal;
font-weight:600;
src:url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/albert-sans-v3-latin-600.woff2') format('woff2')}
@font-face{
font-display:swap;
font-family:'Albert Sans';
font-style:normal;
font-weight:700;
src:url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/albert-sans-v3-latin-700.woff2') format('woff2')}
@font-face{
font-display:swap;
font-family:Recoleta;
src:url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/font.woff2') format('woff2'),url('https://bartrahomecare.ie/wp-content/themes/bartrahomecare/fonts/font.woff') format('woff')}
:root{
--BH_primary-color:#E23970;
--BH_secondary-color:#023D53;
--BH_site-yellow:#F8D531;
--BH_text-color:#1e1e1e;
--BH_bg-light:#f4f1ea;
--BH_white:#ffffff;
--BH_black:#000000;
--BH_purple:#8b97e6;
--BH_site-heading:'Recoleta',serif;
--BH_site-body:'Albert Sans',-apple-system,Helvetica,sans-serif;
--BH_heading1:100px;
--BH_heading2:65px;
--BH_heading3:36px;
--BH_heading4:30px;
--BH_heading5:28px;
--BH_heading6:26px;
--BH_body-text:22px;
--BH_font-26:26px;
--BH_text-line-height:1.43;
--BH_site-text-bigger:30px}

/* ---- Base resets, scoped to the header/footer only (never the page body) ---- */
.site-header,
.site-header *,
.site-header *::before,
.site-header *::after,
.site-footer,
.site-footer *,
.site-footer *::before,
.site-footer *::after{
box-sizing:border-box}
.site-header a,
.site-footer a{
text-decoration:none;
border:0;
outline:0}
.site-header ul,
.site-header li,
.site-footer ul,
.site-footer li{
list-style:none;
margin:0;
padding:0}
.site-header img,
.site-footer img{
max-width:100%;
display:block;
height:auto}

/* ---- .container grid wrapper, scoped the same way (the page body has its own copy) ---- */
.site-header .container,
.site-footer .container{
--BH_bs-gutter-x:1.5rem;
--BH_bs-gutter-y:0;
width:100%;
padding-right:12px;
padding-left:12px;
margin-right:auto;
margin-left:auto}
@media (min-width:992px){
.site-header .container,
.site-footer .container{
max-width:100%}
}
@media (min-width:1200px){
.site-header .container,
.site-footer .container{
max-width:1170px}
}
@media (min-width:1400px){
.site-header .container,
.site-footer .container{
max-width:1588px}
}

.fixed .header-inn{
position:fixed;
top:0;
left:0;
width:100%;
-webkit-animation-name:stickySlideDown;
animation-name:stickySlideDown;
box-shadow:0 3px 10px rgba(0,0,0,.05);
background-color:var(--BH_white)!important;
transition:0s;
-webkit-transition:none;
z-index:20;
padding:15px 0}
.header-inn{
animation-duration:.7s;
-webkit-animation-duration:.7s}
@keyframes stickySlideDown{
0%{
opacity:1;
transform:translateY(-100%);
-webkit-transform:translateY(-100%)}
100%{
opacity:1;
transform:translateY(0);
-webkit-transform:translateY(0)}
}
.site-header{
height:156px}
.main-navigation.desktop .menu .menu-item.current-menu-item>a{
color:var(--BH_primary-color);
text-decoration:underline}
.main-navigation.desktop .menu .contact-us.current-menu-item a{
text-decoration:none}
.main-navigation.desktop .menu .become-career.current-menu-item a{
text-decoration:underline}
.main-navigation.desktop .menu .contact-us.current-menu-item a{
background:var(--BH_primary-color);
color:var(--BH_white)!important;
border-color:transparent}
.header-inn{
background-color:var(--BH_bg-light);
padding:31px 0}
.site-logo{
max-width:307px;
height:94px;
width:100%;
display:flex;
align-items:end}
.header-inn .header-wrap{
display:flex;
justify-content:space-between;
align-items:flex-end}
.main-navigation.desktop .menu{
display:flex;
width:100%;
align-items:center}
.header-right{
display:flex;
width:100%;
max-width:calc(100% - 306px);
padding-left:100px}
.main-navigation.desktop .menu .become-career{
margin-left:auto!important}
.main-navigation.desktop{
width:100%}
.main-navigation.desktop .menu .menu-item{
margin-left:44px}
.main-navigation.desktop .menu .menu-item.contact-us{
margin-left:24px}
.main-navigation.desktop .menu .menu-item>a{
font-size:18px;
font-weight:500;
color:var(--BH_secondary-color)}
.main-navigation.desktop .menu .become-career a{
font-size:20px;
color:var(--BH_secondary-color);
font-weight:500;
text-decoration:underline}
.main-navigation.desktop .menu .contact-us a{
font-size:20px;
color:var(--BH_primary-color)!important;
font-weight:600;
background-color:transparent;
color:var(--BH_bg-light);
padding:14px 39px;
border-radius:38px;
transition:.3s;
-webkit-transition:.3s;
display:inline-block;
border:2px solid var(--BH_primary-color)}
.humbrg-menu,.mob-menu{
display:none}
.footer-top{
background-color:var(--BH_secondary-color);
padding:97px 0;
color:var(--BH_white)}
.contact-header{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:96px;
margin-bottom:68px}
.contact-title{
font-family:Recoleta,serif;
font-size:80px;
line-height:1.31;
max-width:1160px;
margin:0;
color:var(--BH_white)}
.divider{
border-color:var(--BH_bg-light);
margin:83px 0 53px;
opacity:.1}
.contact-grid{
display:flex;
justify-content:space-between;
flex-wrap:wrap}
.genral-enq-ttl{
color:var(--BH_primary-color);
font-size:22px;
font-weight:700;
margin-bottom:22px;
line-height:var(--BH_text-line-height)}
.enq-linkbx{
font-size:22px;
color:var(--BH_white);
margin-top:12px}
.enq-linkbx:last-child{
margin-top:9px}
.enq-linkbx a{
font-size:22px;
color:var(--BH_white);
line-height:var(--BH_text-line-height)}
.footer-links ul{
list-style:none;
padding:0;
margin:0}
.footer-links li{
margin-bottom:17px}
.footer-links li:last-child{
margin-bottom:0}
.footer-links a{
color:var(--BH_white);
font-size:22px;
text-decoration:none;
line-height:var(--BH_text-line-height)}
.footer-section{
background-color:var(--BH_white);
padding:71px 0}
.footer-content{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:63px}
.footer-info{
width:32%}
.footer-title{
color:var(--BH_primary-color);
font-size:32px;
margin-bottom:20px;
font-weight:700;
line-height:var(--BH_text-line-height);
font-family:var(--BH_site-body);
margin-top:0}
.footer-description{
color:var(--BH_secondary-color);
margin-bottom:20px;
margin-top:25px}
.footer-link{
color:var(--BH_primary-color);
font-size:22px;
font-weight:700;
text-decoration:underline;
position:relative;
padding-right:36px;
transition:.3s;
-webkit-transition:.3s}
.footer-link::before{
content:"";
position:absolute;
top:0;
bottom:0;
right:0;
margin:auto;
width:26px;
height:25px;
transition:.3s;
-webkit-transition:.3s}
.footer-logos{
display:flex;
gap:75px;
width:50%;
justify-content:end;
flex-wrap:wrap;
margin-top:25px}
.footer-logos img{
height:auto;
max-width:162px;
width:100%}
.footer-bottom{
display:flex;
justify-content:space-between;
color:var(--BH_secondary-color);
font-size:18px;
line-height:40px;
font-weight:400}
.footer-bottom a{
font-weight:700;
color:var(--BH_secondary-color)}
.footer-right{
display:flex;
width:32.5%}
.footer-right .footer-links{
width:50%}
.enqbx{
margin-top:65px}
.footer-right .genral-enq-ttl{
margin-bottom:33px}
.footer-description.whysybx p{
color:var(--BH_secondary-color)}
@media(min-width:1200px){
.main-navigation.desktop .menu .menu-item>a:hover{
color:var(--BH_primary-color)}
.main-navigation.desktop .menu .become-career a:hover{
text-decoration:underline}
.footer-link:hover{
color:var(--BH_secondary-color)}
.enq-linkbx a:hover,.footer-bottom a:hover,.footer-links a:hover{
color:var(--BH_primary-color)}
.main-navigation.desktop .menu .contact-us a:hover{
background:var(--BH_primary-color);
color:var(--BH_white)!important;
border-color:transparent}
}
@media(max-width:1399px){
.footer-info{
width:50%}
.contact-title{
font-size:var(--BH_heading2)}
.main-navigation.desktop .menu .menu-item{
margin-left:26px}
.main-navigation.desktop .menu .menu-item>a{
font-size:16px}
.header-right{
padding-left:85PX}
}
@media(max-width:1199px){
.mob-menu-linkwrap{
max-height:calc(100vh - 140px);
overflow-y:auto}
.site-header{
height:101px}
.main-navigation.desktop{
display:none}
.humbrg-menu{
font-size:0;
width:50px;
height:40px;
background-repeat:no-repeat;
background-position:right center;
display:inline-block;
vertical-align:top;
border:0;
margin-left:auto}
.header-right{
padding-left:0;
text-align:right}
.site-logo{
max-width:200px;
height:61px}
.contact-info img{
max-width:200px}
.header-inn{
padding:20px 0}
.mob-menu{
display:block;
position:fixed;
top:0;
right:-100%;
width:100%;
height:100%;
max-width:100%;
background:var(--BH_white);
z-index:999999;
transition:right .5s ease;
-webkit-transition:right .5s}
body.menu-open{
overflow:hidden}
body.menu-open .mob-menu{
right:0}
.mob-header{
display:flex;
align-items:center;
padding:20px;
justify-content:space-between;
border-bottom:1px solid rgba(0,160,156,.3)}
.close-menu{
font-size:0;
width:40px;
height:40px;
background-repeat:no-repeat;
background-position:center;
display:inline-block;
vertical-align:top;
background-size:24px;
border:0}
.mob-menu-linkwrap{
padding:10px 20px;
margin-top:20px}
.main-navigation.mobile .menu{
list-style:none}
.main-navigation.mobile .menu>li{
margin-top:10px;
position:relative}
.main-navigation.mobile .menu>li>a{
font-size:20px;
line-height:40px;
font-weight:600;
color:var(--BH_black);
text-decoration:none;
width:100%;
display:block}
.main-navigation.mobile .menu>li.current-menu-item>a,.main-navigation.mobile .menu>li.current_page_item>a{
color:var(--BH_primary-color);
text-decoration:underline}
.main-navigation.mobile .menu>li{
text-align:left}
.main-navigation.mobile .menu>li.contact-us.current-menu-item>a,.main-navigation.mobile .menu>li.contact-us.current_page_item>a{
background-color:var(--BH_secondary-color);
color:var(--BH_white);
text-decoration:none!important}
.main-navigation.mobile .menu>li.become-career>a{
color:var(--BH_black)}
.main-navigation.mobile .menu>li.become-career.current-menu-item>a{
color:var(--BH_primary-color)}
.main-navigation.mobile .menu>li.contact-us>a{
font-size:20px;
color:var(--BH_primary-color);
font-weight:600;
background-color:var(--BH_primary-color);
color:var(--BH_bg-light);
padding:14px 39px;
border-radius:38px;
transition:.3s;
-webkit-transition:.3s;
text-align:center;
width:100%}
.main-navigation.mobile .menu>li.contact-us{
margin-top:20px}
.contact-header{
gap:30px;
flex-wrap:wrap;
margin-bottom:50px}
.footer-section{
padding:50px 0}
.divider{
margin:50px 0}
.footer-right{
width:100%;
margin-top:30px}
.enqbx{
margin-top:30px}
.genral-enq-ttl{
margin-bottom:0}
.enq-linkbx{
margin-top:10px}
.footer-right .genral-enq-ttl{
margin-bottom:10px}
.footer-title{
font-size:28px}
.footer-description.whysybx p{
font-size:20px}
.footer-content{
margin-bottom:50px}
.footer-top.ptb{
padding:50px 0}
.footer-logos{
gap:30px}
.header-inn .header-wrap{
align-items:center}
}
@media(max-width:767px){
.contact-title{
font-size:40px}
.footer-content{
flex-wrap:wrap}
.footer-info{
width:100%}
.footer-logos{
width:100%;
justify-content:center;
margin-top:30px}
.footer-section{
padding:30px 0}
.divider{
margin:40px 0}
.contact-header{
margin-bottom:40px}
.footer-content{
margin-bottom:40px}
}
@media(max-width:575px){
.footer-right{
flex-wrap:wrap}
.footer-right .footer-links{
width:100%}
.footer-bottom{
flex-wrap:wrap;
justify-content:center}
.copyright{
width:100%;
text-align:center;
line-height:1.3}
.footer-logos{
gap:30px}
.footer-logos img{
max-width:130px}
.footer-right .footer-links{
margin-top:30px}
.footer-right{
margin-top:10px}
.contact-info img{
max-width:200px}
.footer-links a{
font-size:20px}
.enq-linkbx a{
font-size:20px}
.footer-links li{
margin-bottom:10px}
.footer-link{
font-size:20px}
}
@media(max-width:480px){
.contact-title{
font-size:30px}
.footer-bottom{
font-size:16px}
}

/* =====================================================================
   FIREFISH BLENDED ADDITIONS — header & footer only
   Everything below is new — not part of the live bartrahomecare.ie "used
   CSS" above. It (a) redraws the handful of icons the live site loads as
   separate SVG files (button/footer-link arrows, burger, close) using
   plain CSS so this template has zero external image dependencies, and
   (b) styles the Firefish account buttons and the footer "Get in Touch"
   button. Every selector here is scoped under .site-header/.site-footer
   (or is itself a header/footer-only class) so none of it can leak onto
   page-body content, which is styled separately.
   ===================================================================== */

/* ---- secondary-button (footer "Get in Touch" button + its arrow) ----
   The live theme's arrow was two SVGs (btn-arrow-cream.svg / btn-arrow-hov.svg)
   that are just the same chevron in two colours, and that colour always
   matches the button's own text colour — so a single ::before using
   currentColor replaces both the default and :hover background-image rules. */
.site-footer .secondary-button{
	background-color:var(--BH_primary-color);
	color:var(--BH_white);
	padding:21px 37px 20px;
	border-radius:50px;
	font-size:24px;
	font-weight:600;
	text-decoration:none;
	position:relative;
	padding-right:81px;
	transition:.3s;
	-webkit-transition:.3s;
	display:inline-block;
	min-width:305px;
	text-align:left}
.site-footer .secondary-button:before{
	content:'';
	position:absolute;
	left:calc(100% - 49px);
	top:0;
	bottom:0;
	margin:auto;
	width:11px;
	height:11px;
	border-top:2px solid currentColor;
	border-right:2px solid currentColor;
	transform:rotate(45deg)}
.site-footer .secondary-button:hover{
	background:var(--BH_site-yellow);
	color:var(--BH_secondary-color)}
@media(max-width:767px){
	.site-footer .secondary-button{
		padding:16px 80px 16px 30px;
		font-size:22px;
		min-width:230px}
}

/* ---- footer-link arrow (was link-arrow-blue.svg / link-arrow-green.svg) ---- */
.footer-link::before{
	content:'';
	width:8px;
	height:8px;
	border-top:2px solid currentColor;
	border-right:2px solid currentColor;
	transform:rotate(45deg);
	right:6px}

/* ---- FFAccountButtons: styled the same as "Contact Us" (see .contact-us a
   below), sitting immediately to the left of the static "Become a Carer" /
   "Contact Us" links Header.txt now renders directly (not CMS-driven), so
   no flex re-ordering is needed — the markup order is already correct. ---- */
.main-navigation.desktop .menu .account-buttons{
	margin-left:auto!important;
	display:flex;
	align-items:center}
.main-navigation.desktop .menu .become-career{
	margin-left:24px!important}
.main-navigation.desktop .menu .account-buttons .account-btn{
	font-size:20px;
	font-weight:600;
	color:var(--BH_primary-color);
	background-color:transparent;
	padding:14px 39px;
	border-radius:38px;
	border:2px solid var(--BH_primary-color);
	display:inline-block;
	transition:.3s}
.main-navigation.desktop .menu .account-buttons .account-btn:hover{
	background:var(--BH_primary-color);
	color:var(--BH_white)!important;
	border-color:transparent}
.main-navigation.desktop .menu .account-buttons .account-btn + .account-btn{
	margin-left:12px}

/* Mobile nav: account buttons sit above "Become a Carer" in document order
   (see Header.txt), styled as the same solid pill "Contact Us" already uses
   on mobile. */
.main-navigation.mobile .menu>li.account-buttons{
	margin-top:20px}
.main-navigation.mobile .menu>li.account-buttons .account-btn{
	font-size:20px;
	color:var(--BH_bg-light);
	font-weight:600;
	background-color:var(--BH_primary-color);
	padding:14px 39px;
	border-radius:38px;
	border:2px solid var(--BH_primary-color);
	transition:.3s;
	text-align:center;
	width:100%;
	display:block}
.main-navigation.mobile .menu>li.account-buttons .account-btn + .account-btn{
	margin-top:10px}
.main-navigation.mobile .menu>li.account-buttons .account-btn:active{
	background:var(--BH_secondary-color);
	border-color:var(--BH_secondary-color)}

/* ---- hamburger / close icons (was huberg-dark.svg / menu-close-icon.svg) ---- */
.humbrg-menu{
	position:relative;
	background:none!important;
	cursor:pointer}
.humbrg-menu span{
	position:absolute;
	left:10px;
	right:10px;
	height:2px;
	background:var(--BH_secondary-color);
	transition:.3s}
.humbrg-menu span:nth-child(1){top:14px}
.humbrg-menu span:nth-child(2){top:20px}
.humbrg-menu span:nth-child(3){top:26px}
.close-menu{
	position:relative;
	background:none!important;
	cursor:pointer}
.close-menu span{
	position:absolute;
	top:50%;
	left:50%;
	width:20px;
	height:2px;
	background:var(--BH_secondary-color)}
.close-menu span:nth-child(1){transform:translate(-50%,-50%) rotate(45deg)}
.close-menu span:nth-child(2){transform:translate(-50%,-50%) rotate(-45deg)}

/* Skip link — visually hidden until focused (keyboard/screen-reader users only) */
.skip-link{
	position:absolute;
	left:-9999px;
	top:auto;
	width:1px;
	height:1px;
	overflow:hidden;
	z-index:100000}
.skip-link:focus{
	left:12px;
	top:12px;
	width:auto;
	height:auto;
	background:var(--BH_white);
	color:var(--BH_secondary-color);
	padding:12px 20px;
	border-radius:6px}

/* Powered by Firefish — sits in the same row as the copyright line, in place
   of the old "Design by idea.ie" credit. */
.footer-bottom .ff-powered-by{
	display:inline-block}
@media(max-width:575px){
	.footer-bottom .ff-powered-by{
		margin-top:10px}
}