/*
Theme Name: Barefoot
Theme URI: https://www.barefootdesigner.co.uk
Author: TidyThemes
Author URI: https://www.barefootdesigner.co.uk
Description: ...[unchanged]...
Tags: ...[unchanged]...
Version: 2023
Requires at least: 5.2
Tested up to: 6.1
Requires PHP: 7.0
License: GNU General Public License v3 or Later
License URI: https://www.barefootdesigner.co.uk
Text Domain: blankslate

BlankSlate WordPress Theme © 2011-2023 TidyThemes
BlankSlate is distributed under the terms of the GNU GPL
*/



/* ========== RESET & BASICS ========== */
html, body {
  scroll-behavior: auto !important;
}

:root {
  --color-primary: #625a61;
  --color-accent: #f6e4fa;

}



.fa-phone:before {
content: "\f095";
 transform: scaleX(-1);
  display: inline-block;
  margin-right:20px;
}

#content{

   overflow-x: hidden;
}


/* ========== MODERN CSS RESET ========== */
/* 1. Use a more-intuitive box-sizing model */
*, *::before, *::after {
  box-sizing: border-box;
}

.wp-block-cover__inner-container p{
	
	max-width:600px;
	margin:auto;
	margin-bottom:20px;
}

/* 2. Remove default margin/padding */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* 3. Set core body defaults */
body {
  line-height: 1.5;
  font-family: system-ui, sans-serif;
  background: #fff;
  color: #222;
  min-height: 100vh;
}

/* 4. Remove list styles on ul, ol elements */
ul, ol {
  list-style: none;
}

/* 5. Anchor defaults */
a {
  background-color: transparent;
  color: inherit;
  text-decoration: inherit;
}

/* 6. Images: responsive and block by default */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 7. Remove default table spacing */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* 8. Inherit fonts for form elements */
input, button, textarea, select {
  font: inherit;
}

/* 9. Make sure strong and em actually look bold/italic */
strong { font-weight: bold; }
em { font-style: italic; }


/* ========== BARBA WRAPPER & CONTAINERS ========== */
[data-barba="wrapper"] {
  position: relative;
  min-height: 0;
}

/* Animated main content transitions with Barba */
[data-barba="container"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 0;
}
[data-barba="container"][aria-hidden="false"] {
  position: relative;
  z-index: 1;
}

/* Padding below header (adjust as needed for header height) */
#content {
}

/* ========== HEADER ========== */
#header {
position: relative;
  width: 100%;
  padding: 30px;
  height: 260px; /* slightly taller than logo */
  background: none;
  z-index: 9;
}
.logo-wrapper {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

.logo {

}

.logo img {
  height: 180px;
  width: 180px;
  object-fit: contain;
  display: block;
  border-radius:50%;
}

.call {
  position: absolute;
  top: 40%;
  right: 50px;
  z-index: 2;
  color:#fff;
  font-size:2em;
  background: url(https://pump.barefootdev.co.uk/wp-content/uploads/2025/07/phone.png);
  background-repeat:no-repeat;
  background-size: 32px 32px;  padding-left:40px;
  background-position:left center;

}


#menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 2rem;
  position: relative;
}

#menu li {
  display: inline-block;
  position: relative; /* Needed for submenu absolute positioning */
	padding:10px 0px;
}

#menu a {
  color: #000;
  text-decoration: none;
  font-size: 1.1rem;
  position: relative;
  padding: 40px 0.3em;
  z-index: 2;
}

#menu a:hover,
#menu li:hover > a {
  text-decoration: underline;
}

/* ----- Submenu Dropdown Styling ----- */
#menu ul.sub-menu {
  display: block;
  position: absolute;
	right: 0px;
	top: 100%;
  min-width: 180px;
  background: #fff;
  box-shadow: 0 6px 24px 0 rgba(80,60,120,0.08), 0 1.5px 2.5px rgba(80,60,120,0.05);
  opacity: 0;
  pointer-events: none;
  transform: translateY(16px) scaleY(0.96);
  transition: opacity 0.25s cubic-bezier(.55,.03,.38,1.09), 
              transform 0.25s cubic-bezier(.55,.03,.38,1.09);
  border-radius: 10px;
  padding: 0.75rem 0;
  z-index: 10;
}

#menu li:hover > ul.sub-menu,
#menu li:focus-within > ul.sub-menu {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scaleY(1);
}

/* Submenu links */
#menu ul.sub-menu li {
  display: block;
  width: 100%;
}
#menu ul.sub-menu a {
  color: #444;
  font-size: 1rem;
  padding: 0.7em 1.3em;
  background: transparent;
  border-radius: 4px;
  transition: background 0.15s;
  display: block;
}
#menu ul.sub-menu a:hover {
  background: #faf5fb;
  color: #a03692;
  text-decoration: none;
}

/* Submenu indicator arrow */
#menu li.menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  margin-left: 0.38em;
  vertical-align: 0.11em;
  border: solid #a03692;
  border-width: 0 2px 2px 0;
  padding: 0.18em;
  transform: rotate(45deg);
  transition: border-color 0.2s;
}

/* Optional: On hover, arrow color changes */
#menu li.menu-item-has-children:hover > a::after {
  border-color: #6a1a65;
}



/* --- BURGER --- */
.burger {
  display: none;
  position: relative;
  width: 48px;
  height: 48px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 102;
  justify-content: center;
  align-items: center;
}
.burger span {
  position: absolute;
  width: 32px;
  height: 4px;
  background: #a03692;
  border-radius: 2px;
  left: 8px;
  transition: all 0.4s cubic-bezier(.61,-0.06,.48,1.37);
}
.burger span:nth-child(1) { top: 13px; }
.burger span:nth-child(2) { top: 22px; }
.burger span:nth-child(3) { top: 31px; }

.burger.open span:nth-child(1) {
  top: 22px;
  transform: rotate(45deg);
	background:#fff;
}
.burger.open span:nth-child(2) {
  opacity: 0;
}
.burger.open span:nth-child(3) {
  top: 22px;
  transform: rotate(-45deg);
		background:#fff;

}

/* --- SLIDE-OUT MENU PANEL --- */
.menu-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 100vw;        /* Change to 320px or 80vw for a partial menu if you prefer */
  height: 100vh;
  background: #a03692;
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(.61,-0.06,.48,1.37), opacity 0.2s;
  opacity: 0.98;
  z-index: 101;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.menu-panel.open {
  transform: translateX(0);
  pointer-events: auto;
}

.mobile-menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
}
.mobile-menu-list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.menu-panel a {
  color: #fff;
  font-size: 2rem;
  text-decoration: none;
  font-weight: bold;
  letter-spacing: 1px;
}

/* Hide normal nav, show burger on mobile */
@media (max-width: 850px) {
  #menu {
    display: none;
  }
  .burger {
    display: none;
  }
}

/* Hide overlay/menu on desktop */
@media (min-width: 851px) {
  .menu-panel {
    display: none !important;
  }
}


/* Hide normal nav, show burger on mobile */
@media (max-width: 850px) {
  #menu {
    display: none;
  }
  .burger {
    display: none;
  }
}

/* Hide overlay/menu on desktop */
@media (min-width: 851px) {
  .menu-overlay {
    display: none !important;
  }
}


/* ========== (FONTS) ========== */

h1{
	
	font-size:5em;
}


h2{
	
	font-size:3em;
	color: var(--color-primary);
    margin-bottom:20px;
      line-height:1.1em;


}


h3{
	
	font-size:1.5em;
}

h4{
  
  font-size:1.5em;
}

p{

  line-height:1.6em;
  margin-bottom:20px;
}


/* ========== (blocks) ========== */

.wp-block-button__link {
color: #fff;
background-color: var(--color-primary);
border-radius: 0px;
box-shadow: none;
font-size: 1.125em;
}


.wp-block-media-text {
  width: min(1200px, 100% - 40px);
  margin-left: auto;
  margin-right: auto;
  background: #f4f3f3;
  box-shadow: -1px 11px 32px 0px rgba(0,0,0,0.19);
  -webkit-box-shadow: -1px 11px 32px 0px rgba(0,0,0,0.19);
  -moz-box-shadow: -1px 11px 32px 0px rgba(0,0,0,0.19);
}

.ghostkit-grid{
	
	max-width:1200px;
	margin:auto;
	padding:20px;
}


.wp-block-media-text>.wp-block-media-text__content {
padding:80px 80px;
}


#famly-lightbox-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(8px);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

#famly-lightbox {
  position: relative;
  background: white;
  border-radius: 12px;
  max-width: 90%;
  width: 360px;
  height: 667px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

#famly-lightbox iframe {
  width: 100%;
  height: 100%;
  border: none;
}

#famly-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: none;
  border: none;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  color: #666;
  z-index: 10;
}


/* ========== FORMS (Contact Form 7 & more) ========== */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form textarea,
.wpcf7-form select {
  width: 100%;
  font-size: 1.1em;
  padding: 0.9em 1em;
  border: 1.5px solid #eee;
  border-radius: 7px;
  margin-bottom: 1.2em;
  background: #faf5fb;
  transition: border 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
  color: #232323;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
  border-color: var(--color-primary, #a03692);
  box-shadow: 0 2px 12px 0 rgba(160,54,146,0.10);
  outline: none;
}

.wpcf7-form label {
  display: block;
  margin-bottom: 0.5em;
  font-weight: 500;
  color: #a03692;
  font-size: 1em;
}

/* ========== BUTTON ========== */
.wpcf7-form input[type="submit"],
.wpcf7-form button {
  background: var(--color-primary, #a03692);
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 0.85em 2.2em;
  font-size: 1.05em;
  cursor: pointer;
  transition: background 0.18s, box-shadow 0.18s;
  box-shadow: 0 2px 8px rgba(160,54,146,0.10);
  font-family: inherit;
  margin-top: 0.5em;
}

.wpcf7-form input[type="submit"]:hover,
.wpcf7-form button:hover {
  background: #6a1a65;
  color: #fff;
}

/* Remove inner glow on iOS */
input[type="text"], input[type="email"], textarea { -webkit-appearance: none; }

/* ========== CF7 SUCCESS AND ERROR MESSAGES ========== */
.wpcf7-response-output {
  margin-top: 1em;
  margin-bottom: 1em;
  padding: 1em 1.2em;
  border-radius: 7px;
  font-size: 1.09em;
  font-weight: 500;
  border-width: 0;
  box-shadow: 0 2px 14px 0 rgba(160,54,146,0.07);
}

.wpcf7-mail-sent-ok {
  background: #e8fbef;
  color: #2d8257;
  border-left: 5px solid #48c78e;
}

.wpcf7-mail-sent-ng,
.wpcf7-response-output.wpcf7-validation-errors {
  background: #fbe8ea;
  color: #a33643;
  border-left: 5px solid #e55b6a;
}

span.wpcf7-not-valid-tip {
  display: block;
  color: #e55b6a;
  font-size: 0.98em;
  margin-top: -0.9em;
  margin-bottom: 0.8em;
  padding-left: 1em;
}

.wpcf7-form .wpcf7-spinner {
  margin-left: 1em;
  vertical-align: middle;
}

/* Optional: Make checkboxes/radios a bit neater */
.wpcf7-form input[type="checkbox"],
.wpcf7-form input[type="radio"] {
  margin-right: 0.7em;
  accent-color: var(--color-primary, #a03692);
}


@media (max-width: 850px) {


h1{

  line-height:1em;
  margin-bottom:20px;
	FONT-SIZE:3em;
}
	h2{
		
		font-size:2em;
	}


.call {
    position: fixed;
    top: inherit;
    right: 5%;
    bottom:0px;
    transform: translateY(0%);
    z-index: 2;
    color: #fff;
    font-size: 1em;
    background-color:var(--color-primary, #a03692);
    background-position:left 30px center;
    width:90%;
    text-align:center;
    padding:20px;
	border-top-left-radius:20px;
	border-top-right-radius:20px;

}
.wp-block-media-text {

  margin:20px;
}

.wp-block-buttons>.wp-block-button {
    display: inline-block;
    margin: 0;
    width:100%;
}


.wp-block-media-text>.wp-block-media-text__content {
    padding: 30px 30px;
}

.ghostkit-carousel-arrow{display:none;}

body{

      text-align:center;
      PADDING-BOTTOM:90PX;

}


.wp-block-cover, .wp-block-cover-image {
min-height:600px !important;
}


}
