/*
 Theme Name: Flow
 Theme URI: https://flow.co.uk
 Author: Josh Humphries
 Author URI: https://joshhumphries.com
 Description: A simple WordPress theme
 Version: 1.0
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: my-simple-theme
*/


/*
*   Variables
*/

:root {
    --body: #575958;
    
    --white: #FFFFFF;
    --black: #000000;
    
    --green-400: #B5BBB1;
    --green-600: #757F77;

    --shell-400: #FEF5EF;

    --gold-400: #E2CB91;

    --grey-400: #E3E3E3;
    --grey-600: #666666;
    
}

/*
*   Fonts
*/

@font-face {
    font-family: 'Cormorant Garamond';
    src: url(./assets/fonts/CormorantGaramond-Regular.woff2);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Cormorant Garamond';
    src: url(./assets/fonts/CormorantGaramond-Medium.woff2);
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Cormorant Garamond';
    src: url(./assets/fonts/CormorantGaramond-SemiBold.woff2);
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url(./assets/fonts/Poppins-Light.woff2);
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url(./assets/fonts/Poppins-Regular.woff2);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url(./assets/fonts/Poppins-Medium.woff2);
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url(./assets/fonts/Poppins-SemiBold.woff2);
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url(./assets/fonts/Poppins-Bold.woff2);
    font-weight: 700;
    font-style: normal;
}

/*
*  Basic layout styles
*/

body {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.125rem;
    line-height: 20px;
    color: var(--body);
    max-width: 1920px;
}

.container {
    max-width: 738px;
    margin: 0 auto;
    padding: 0 1.25rem;
}


/*
*  Basic typography styles
*/

h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
}

h1 {
    font-size: 1.5rem;
    line-height: 31px;
    letter-spacing: 6px;
}

h2 {
    font-size: 1.625rem;
    line-height: 25px;
    letter-spacing: 3px;
}

h3 {
    font-size: 1.25rem;
    line-height: 22px;
    letter-spacing: 3px;
}

h4 {
    font-size: 0.9375rem;
    line-height: 18px;
    letter-spacing: 3px;
    font-weight: 500;
}

h5 {
    font-size: 0.8125rem;
    line-height: 17px;
    letter-spacing: 3px;
}

p {
    margin: 0 auto 0.625rem;
}

a {
    color: inherit;
    text-decoration: none;
}


ul {
    list-style-type: none;
    padding-left: 0;
}

img {
    max-width: 100%;
}

/* Forms */

.flow-form {
    margin-top: 2rem;
}

.flow-form .gform_fields input, .flow-form .gform_fields textarea {
    border: 1px solid var(--grey-400);
    border-radius: 6px;
    min-height: 3rem;
}

.booking h3 {
    text-align: center;
}

.booking-form {
    border: 1px solid var(--grey-400);
    padding: 3rem 1.125rem 4.5rem;
}

.booking-form .flow-form {
    max-width: 640px;
    margin-inline: auto;
}

.booking-form .flow-form .gform_button.button {
    margin: auto;
}

.booking-form__phone { 
    max-width: 29rem;
    margin: auto;
    text-align: center;
    margin-top: 3.5rem;
    padding-top: 2.5rem;
    border-top: 1px solid var(--grey-400);
}

.booking-form__phone p {
    margin-block: 1.25rem 1rem;
}

/* Accordions */
.ui-widget {
    font-family: inherit;
}

.ui-corner-all, .ui-corner-top, .ui-corner-bottom {
    border-radius: 0;
}

.ui-accordion .ui-accordion-header {
    font-family: 'Poppins', sans-serif;
    font-size: 0.875rem;
    letter-spacing: 3px;
    font-weight: 500;
    line-height: 20px;
    text-transform: uppercase;
    background: none;
    color: inherit;
    border: none;
    padding: 1rem 0;
}

.ui-accordion-header::after {
    content: '';
    background: url('./assets/img/acc-arrow.svg') no-repeat;
    background-size: contain;
    width: .875rem;
    height: .5rem;
    display: inline-block;
    position: absolute;
    right: 0;
}

.ui-accordion-header.ui-accordion-header-active::after {
    content: '';
    transform: rotate(180deg);
}

.ui-accordion .ui-accordion-header-active {
    border-top: 1px solid var(--grey-400);
}

.ui-accordion .ui-accordion-header span {
    display: none;
}

.ui-accordion .ui-accordion-content {
    padding: 0 0 1rem 0;
    border: none;
    border-bottom: 1px solid var(--grey-400);
}

/* WooCommerce */

img.basket-icon {
    max-width: inherit;
    height: none;
}

.contact-list.unstyled img {
    height: 1.375rem;
}

.woocommerce-result-count, .woocommerce-ordering  {
    display: none;
}

.woocommerce ul.products li.product .price, .woocommerce div.product p.price {
    background: var(--gold-400);
    color: var(--white);
    width: fit-content;
    padding: 0.25rem 0.75rem;
    margin-block: 0.75rem 2.25rem;
    border-radius: 0.375rem;
    font-family: 'Poppins', sans-serif;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 24px;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.625rem;
    line-height: 28px;
    letter-spacing: 4px;
}

#order_review_heading, .woocommerce-additional-fields h3 {
    margin-block: 1rem;
}

.woocommerce.columns-3 ul.products li.product {
    width: 100%;
}

.woocommerce-info, .woocommerce-message {
    border-color: var(--gold-400);
}

.woocommerce-info::before {
    color: var(--body);
}

.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea {
    padding: 0.75rem;
    border: 1px solid var(--grey-400);
}

.woocommerce .quantity .qty {
    padding-block: .25rem;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    text-indent: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before {
    display: none;
}

.woocommerce .cart .button, .woocommerce button.button:disabled, .woocommerce button.button:disabled[disabled] {
    float: right;
    padding: 0.75rem 0.875rem;
}

.woocommerce-page #content div.product div.images, .woocommerce-page #content div.product div.summary {
    width: 100%;
    margin-bottom: 0;
}

.woocommerce div.product .product-summary {
    gap: 2.5rem;
    border-bottom: 4px solid var(--grey-400);
    padding-bottom: 5rem;
    margin-bottom: 2.5rem;
}

.woocommerce div.product .product_title {
    font-size: 1.25rem;
    letter-spacing: 3px;
    line-height: 28px;
}

.woocommerce div.product form.cart .button {
    min-width: 212px;
}

.sku_wrapper {
    font-family: 'Poppins', sans-serif;
    font-size: 0.6875rem;
    color: var(--grey-600);
    letter-spacing: 1px;
}

.posted_in {
    display: none;
}

.scriptlesssocialsharing__buttons {
    column-gap: 1rem;
}

.scriptlesssocialsharing__buttons a.button {
    border-radius: 0;
}

.scriptlesssocialsharing__icon {
    fill: var(--white);
}

.related.products > h2 {
    text-align: center;
    margin-bottom: 2.5rem;
}

.woocommerce-thankyou-order-received,
.woocommerce ul.order_details {
	width: fit-content;
	padding-inline: 1rem;
	margin: 2rem auto;
	display: block;
	text-align: center;
}

.woocommerce ul.order_details li {
	border: none;
	float: none;
	margin-inline: 0;
	padding-inline: 0;
}

.woocommerce ul.order_details li::before {
	display: none;
}

h4.order-notes {
	margin-block: 1rem;
}

.woocommerce-additional-fields__field-wrapper span.optional {
	display: none;
}

#order_comments {
	min-width: 100%;
	min-height: 6.25rem;
	padding: .5rem;
}

.woocommerce-terms-and-conditions-wrapper {
	display: none;
}

/* Other */

.tag {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 0.875rem;
    line-height: 16px;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 1.125rem;
}

.site-main ul {
    text-indent: -24px;
    margin-left: 24px;
}

.site-main ul li {
    position: relative;
    margin-top: 0.75rem;
}

.site-main ul li::before {
    content: '';
    background: url('./assets/img/bullet-icon.svg') no-repeat;
    width: .5rem;
    height: .5rem;
    display: inline-block;
    margin-bottom: .15rem;
    margin-right: 1rem;
}

ul.unstyled, ul.products, .woocommerce-checkout #payment ul.payment_methods li {
    text-indent: 0;
    margin-left: 0;
}

ul.unstyled li::before, ul.products li::before, .woocommerce-checkout #payment ul.payment_methods li::before {
    display: none;
    
}

blockquote {
    font-size: 1.875rem;
    line-height: 30px;
    letter-spacing: -1px;
}

/*
*  Components
*/

button {
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
}

.btn, .gform_wrapper.gravity-theme .gform_footer input, .woocommerce button.button, .woocommerce a.button:not(.scriptlesssocialsharing a), .woocommerce-cart .wc-proceed-to-checkout a.checkout-button, .woocommerce #payment #place_order, .woocommerce-page #payment #place_order, .woocommerce button.button.alt {
    display: block;
    border-radius: 3px;
    padding: 0.75rem 0.875rem;
    width: fit-content;
    font-family: 'Poppins', sans-serif;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 13px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    cursor: pointer;
}

.btn--primary, .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce #payment #place_order, .woocommerce-page #payment #place_order, .woocommerce div.product form.cart .button {
    background: var(--green-600);
    color: var(--white);
}

.btn--outline, .gform_wrapper.gravity-theme .gform_footer input, .woocommerce a.button:not(.scriptlesssocialsharing a), .woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    background: transparent;
    color: var(--green-600);
    border: 2px solid var(--green-600);
}

.btn--white {
    background: transparent;
    color: var(--white);
    border: 2px solid var(--white);
} 

.btn--white:hover {
    background: var(--white);
    color: var(--gold-400);
    border: 2px solid var(--white);
} 

.btn--primary:hover {
    background: var(--body);
}

.btn--outline:hover {
    background: var(--grey-400);
}

.btn--center {
    margin: auto;
}

.woocommerce button.button.alt {
    background: var(--gold-400);
    color: var(--white);
}

.woocommerce button.button.alt:hover {
    background: hsl(43 58% 60% / 1)
}

/* Section Constants */

#hero {
    min-height: 8rem;
    position: relative;
    color: var(--white);
    display: grid;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    overflow: hidden;
    text-align: center;
}

#info {
    font-size: 1rem;
    font-weight: 600;
    line-height: 18px;
}

#testimonial {
    text-align: center;
    padding-block: 4rem;
    position: relative;
}

.testimonial__quote, .call-to-action__content {
    font-size: 1.875rem;
    line-height: 30px;
    letter-spacing: -1px;
    margin: 0 auto 1.375rem;
}

.testimonial__name {
    font-family: 'Poppins', sans-serif;
    font-size: 0.625rem;
    font-weight: 600;
    line-height: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.main-content {
    padding-block: 3.75rem;
}

#call-to-action {
    display: block;
    text-align: center;
    padding-block: 3rem 2rem;
}

#call-to-action .btn {
    margin: 1.5rem auto 0;
}

#treatments .treatment_description ul li::before {
    display: inline-block;
    margin-bottom: 0;
}

.contact-list li {
    display: flex;
    flex-direction: row;
    align-items: center;
    column-gap: 1rem;
    margin-bottom: 2.375rem;
    font-weight: 600;
}

.contact-list li p {
    margin: 0;
}

/* Utilities */


.bg-gold {
    background-color: var(--gold-400);
}

.bg-shell {
    background-color: var(--shell-400);
}

.bg-green--400 {
    background-color: var(--green-400);
}

.bg-green--600 {
    background-color: var(--green-600);
}

.curve::after {
    content: '';
    background-size: contain;
    background-position: bottom;
    background-repeat: no-repeat;
    display: block;
    width: 100%;
    height: 5.625rem;
    position: absolute;
    bottom: 0;
    right: -3px;
}

.curve--white::after {
    background-image: url(./assets/img/curve_white.svg);
}

.curve--green-400::after {
    background-image: url(./assets/img/curve_grey-200.svg);
}

.curve--green-600::after {
    background-image: url(./assets/img/curve_grey.svg);
}

.curve--shell::after {
    background-image: url(./assets/img/curve_shell.svg);
}

.curve--gold::after {
    background-image: url(./assets/img/curve_gold.svg);
    transform: rotate(180deg);
    background-position: top;
    right: 0;
}

.t--centre {
    text-align: center;
}

.t--white {
    color: var(--white); 
}

.m--auto {
    margin-inline: auto;
}

/* Grid Styles */

.grid {
    display: grid;
    gap: 3.125rem 1.875rem;
}

.grid--two, .grid--three {
    grid-template-columns: 1fr;
}

.treatment__image {
    margin-bottom: 2.5rem;
}

.home h3, .main-content h2 {
    margin-bottom: 1.375rem;
}

.grid .price {
    display: inline-block;
    padding: 0.1875rem 0.6875rem;
    border-radius: 0.375rem;
    margin-block: 1.625rem 1.25rem;
    font-family: 'Poppins', sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 24px;
}

/* Hero Banners */

#hero.home, #hero.page {
    min-height: 17rem;
}

.hero__image, .hero__content {
    grid-column: 1;
    grid-row: 1;
}

img.hero__image {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.page .hero__content .wrapper {
    display: block;
}

.home .hero__content .wrapper {
    display: grid;
    grid-template-columns: repeat(2,1fr);
}

.hero__content h1 {
    grid-column: 2;
}

.hero__content p {
    font-family: 'Poppins', sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 1px;
    line-height: 17px;
    max-width: 18.5rem;
    margin: 0 auto 0.625rem;
}

/* Info Section - Mobile */

#info.page {
    padding-block: 3.5rem;
}

/*
*  Basic layout for the site
*/

/* Navigation */

.site-header {
    display: grid;
    grid-template-columns: min-content auto min-content;
    column-gap: 1.125rem;
    align-items: center;
    padding: 0.625rem 1.25rem;
}

.site-nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 1.125rem;
    font-family: 'Poppins', sans-serif;
    font-size: 0.9375rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.site-nav__menu ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.site-nav__menu li {
    padding-block: 1.25rem;
    border-bottom: 1px solid var(--grey-400);
}

.site-nav__menu a {
    display: flex;
    padding-inline: 1.25rem;
    position: relative;
}

.site-nav__menu .menu a::after {
    content: '';
    display: block;
    position: absolute;
    right: 1.25rem;
    align-self: center;
    background: url('./assets/img/nav-arrow.svg') no-repeat;
    width: 10px;
    height: 10px;
}

.site-nav__social li  {
    display: inline-flex;
    padding-block: 2.5rem;
    border: none;
}

.site-nav__menu .btn {
    margin-left: 1.25rem;
}

img.logo {
    max-width: 6.8rem
}

.site-nav__button {
    justify-self: flex-end;
}

.site-nav__basket {
	position: relative;
}

.basket-icon {
    max-width: 1.75rem;
}

.cart-number-items {
    position: absolute;
    bottom: 0;
    right: -5px;
	font-family: 'Poppins', sans-serif;
	font-size: 1rem;
	text-align: center;
    background: var(--green-600);
	color: #fff;
    height: 20px;
    width: 20px;
    padding: 10px 5px 5px 5px;
    line-height: 0;
    margin: 0;
    border-radius: 999px;
}

/* Mobile menu */

.site-nav__menu {
    display: none;
    background: var(--white);
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 315px;
    z-index: 1;
    animation: slideInFromLeft 0.5s;
}

.site-nav__menu.open {
    display: block;
}

.open-menu {
    max-width: 1.5rem;
}

.site-nav__close {
    position: absolute;
    right: -60px;
    top: 0;
    background: var(--gold-400);
    padding: 1.25rem 0.8125rem;
}

.bg-overlay {
    display: none;
}

.bg-overlay.open {
    display: block;
    position: fixed;
    background: var(--black);
    opacity: 0.75;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
}

/* Main Content Styles - Mobile */

.main-content_grid.grid {
    gap: 2.25rem;
}

.main-content_grid.grid ul {
    margin-top: 2rem;
}

.main-content_grid.grid--three {
    gap: 0;
}

.home .main-content_grid.grid--three p {
    margin-bottom: 1.5rem;
}

.brows-info__heading {
    padding-block: 1.75rem 1rem;
    margin-bottom: 3rem;
}

.brows-info__heading,
.brows-info__subheading {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

.brows-info__subheading {
    text-transform: uppercase;
}

.brows-info__grid {
    margin-block: 2.75rem 3.75rem;
}

.brows-info__grid ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
}

.brows-info__grid ul::before,
.brows-info__grid ul li:not(:nth-child(3), :nth-child(4))::after {
    content: '';
    background: var(--grey-400);
    position: absolute;
}

.brows-info__grid ul::before {
    width: 1px;
    min-height: calc(100% + 22px);
    right: calc(50% - 1px);
    top: -11px;
}

.brows-info__grid ul li::after {
    width: 100%;
    min-height: 1px;
    bottom: -1.5rem;
    left: 0;
}

.brows-info__grid ul li {
    margin-block: 1.5rem;
    padding-inline: 1rem;
}

.brows-info__grid ul li p {
    margin-block: 0.75rem 0;
}


.secondary-content {
    margin: auto;
    text-align: center;
    padding-block: 2.25rem 7.5rem;
    border-top: 4px solid var(--grey-400);
    position: relative;
}

.secondary-content * {
    max-width: 60rem;
}

.secondary-content a {
    margin-top: 2rem;
}

/* Insta */

.insta {
    padding-block: 3.75rem;
    text-align: center;
    margin: auto;
    position: relative;
}

.insta::before {
    content: '';
    position: absolute;
    z-index: 5;
    display: block;
    top: 0;
    left: 20px;
    width: calc(100% - 40px);
    height: 4px;
    background: var(--grey-400);
}

.insta p {
    font-family: 'Poppins', sans-serif;
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 2px;
}

.insta h2 {
    font-size: clamp(0.75rem, 0.3929rem + 1.7857vw, 2rem);
    margin-bottom: .625rem;
}

/* Footer Styles - Mobile */

.footer-info {
    padding-top: 3.75rem;

}

.site-footer {
    padding-inline: 0;
}

footer h4 {
    margin-bottom: 1.25rem;
}

.footer-info {
    display: grid;
    gap: 2.5rem;
    padding-inline: 1.25rem;
}

.site-footer::before, footer .site-info::before {
    content: '';
    display: block;
    background: var(--grey-400);
    height: 4px;
    width: calc(100% - 2.5rem);
    margin: 3.75rem auto 0;
}

.footer-info .footer-info__item:nth-child(5) {
    
}

footer li {
    margin-bottom: 1.25rem;
}

footer .site-info {
    font-family: 'Poppins', sans-serif;
    font-size: 0.625rem;
    line-height: 16px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-top: 2rem;
}

footer .site-info::before {
    height: 1px;
}

footer .site-info p  {
    padding-block: 1.375rem 1.75rem;
}

footer .footer-accred {
    display: flex;
    column-gap: .5rem;
}

.footer-info__stack {
    display: grid;
    gap: 2.5rem;
}

@media (min-width: 768px) {

    #hero {
        min-height: 11rem;
    }

    body {
        padding: 0 1.25rem;
    }

    .container {
        max-width: 668px;
        padding: 0;
    }

    /*
    *  Basic typography styles - Tablet
    */

    h1 {
        font-size: 2.25rem;
        line-height: 40px;
        letter-spacing: 8px;
    }

    h2 {
        line-height: 27px;
        letter-spacing: 5px;
    }

    h5 {
        font-size: 0.875rem;
        letter-spacing: 4.2px;
    }

    /* WooCommerce */

    .woocommerce.columns-3 ul.products li.product {
        width: 48%;
    }

    .woocommerce div.product .product-summary {
        padding-bottom: 3.75rem;
        margin-bottom: 2.875rem;
    }

    .tag {
        line-height: 17px;
        letter-spacing: 4px;
    }

    /*
    *  Components
    */

    .btn {
        padding: 0.625rem 1.25rem;
        font-size: 0.8125rem;
        line-height: 16px;
        letter-spacing: 3px;
    }

    img.logo {
        max-width: 11.5rem;
    }

    /* Grid Styles - Tablet */
   
    .grid {
        display: grid;
        column-gap: 1.875rem;
    }

    .grid--two, .grid--three {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Section Constants - Tablet */

    #info {
        font-size: 1.25rem;
        line-height: 22px;
    }

    #testimonial {
        padding-block: 3.5rem;
    }

    .testimonial__quote, .call-to-action__content {
        font-size: 2.375rem;
        line-height: 39px;
        margin: 0 auto 1.75rem;
    }

    #call-to-action {
        padding-block: 4.25rem 2.5rem;
    }

    .main-content {
        padding-block: 3.75rem;
    }

    /* Hero Banners - Tablet */

    .hero__content p {
        font-size: 0.875rem;
        line-height: 20px;
        max-width: 33.75rem;
    }

    /* Info Sections - Tablet */

    .info__content p {
        max-width: 37.5rem;
        margin: 0 auto 0.625rem;
    }

    /* Main Content Styles - Tablet */

    .main-content_grid.grid {
        gap: 2.5rem;
    }

    .main-content_grid.grid--three {
        gap: 0;
    }
    
    .main-content_grid.grid--two, .main-content_grid.grid--three {
        grid-template-columns: 1fr;
    }

    .main-content .divider {
        display: none;
    }

    .main-content h2 {
        max-width: 28.75rem;
        margin-inline: auto;
    }

    .brows-info__subheading {
        margin: 3.75rem auto;
        max-width: 33.25rem;
    }

    .brows-info__grid ul {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 3rem;
        position: relative;
    }
    
    .brows-info__grid ul::before {
        display: none;
    }

    .brows-info__grid ul li::after {
        content: '';
        background: var(--grey-400);
        position: absolute;
    }

    .brows-info__grid ul li {
        margin-block: 1.5rem;
        padding-inline: 0;
    }    
    
    .brows-info__grid ul li::after {
        content: '';
        background: var(--grey-400);
        position: absolute;
        width: 1px;
        min-height: calc(100% + 20px);
        left: -1.5rem;
        top: -10px;
    }

    .brows-info__grid ul li:first-child::after {
        display: none;
    }

    .booking-form {
        border: 1px solid var(--grey-400);
        padding: 3rem 2.875rem 4.5rem;
    }    

    /* Footer Styles - Tablet */
  
    .footer-info {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .footer-info__item:nth-child(1) {
        grid-row: 1;
        grid-column: 1/4;
    }

    .footer-info__stack {
        gap: 1rem;
    }

    .footer-info__stack .footer-info__item:nth-child(1) {
        grid-row: 1;
        grid-column: 1;
    }

    .footer-info__stack .footer-info__item:nth-child(2) {
        grid-row: 2;
        grid-column: 1;
    }

    .footer-info__stack .footer-info__item:nth-child(3) {
        grid-row: 3;
        grid-column: 1;
    }

    footer .footer-accred {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: .5rem;
    }

    footer .footer-accred li {
        margin: 0;
    }
    
}

@media (min-width: 1024px) {

    /* WooCommerce */

    .woocommerce.columns-3 ul.products li.product {
        width: 30.75%;
    }

    .woocommerce div.product .product_title {
        font-size: 1.625rem;
        letter-spacing: 4px;
    }    

    .woocommerce div.product .product-summary {
        gap: 6.25rem;
        padding-bottom: 7.25rem;
        margin-bottom: 6rem;
    }

    /* Site Header */

    .site-header {
        padding: 0.625rem 0;
    }

    .container {
        max-width: 1410px;
        padding-inline: 1.25rem;
    }

    .container--inner {
        max-width: 68rem;
    }

    #hero {
        min-height: 15rem;
    }

    /* Section Constants - Desktop */

    #info {
        font-size: 1.5rem;
        line-height: 27px;
    }

    #testimonial {
        padding-block: 5.25rem;
    }

    .testimonial__quote, .call-to-action__content {
        font-size: 3rem;
        line-height: 49px;
        margin: 0 auto 2.375rem;
    }

    #call-to-action {
        padding-block: 2.5rem 4.25rem;
        text-align: left;
    }

    #call-to-action .wrapper {
        display: grid;
        grid-template-columns: 1fr auto;
        column-gap: 3.75rem;
        align-items: center;
    }

    .main-content {
        padding-block: 5rem;
    }

    .call-to-action__content {
        margin: 0;
    }    

    #call-to-action .btn {
        margin: 0;
        min-width: 11rem;
        text-align: center;
        padding: 1rem 0;
    }

    /* Grid Styles - Desktop */

    .grid--three, .main-content_grid.grid--three {
        grid-template-columns: repeat(3, 1fr);
    }

    .treatment__image {
        margin-bottom: 3.125rem;
    }

    /* Hero Banners - Desktop */

    #hero.home {
        min-height: 42.5rem;
    }

    #hero.page {
        min-height: 33.125rem;
    }

    .hero__content p {
        font-size: 1.125rem;
        line-height: 26px;
        letter-spacing: 2px;
        max-width: 53.75rem;
    }

    /* Info Sections - Desktop */

    #info.page {
        padding-block: 4.125rem;
    }

    .info__content p {
        max-width: 61.25rem;
        margin: 0 auto 0.625rem;
    }

    /* Main Content Styles - Desktop */

    .main-content_grid.grid {
        gap: 5.375rem;
    }

    .main-content_grid.grid--two {
        grid-template-columns: repeat(2, 1fr);
    }

    .main-content h2 {
        max-width: 100%;
        margin-inline: auto;
    }

    .home .main-content_grid {
        padding-top: 2.375rem;
    }

    .main-content_grid.grid--three {
        grid-template-columns: 1fr auto 1fr;
        text-align: left;
    }

    .main-content .divider {
        display: block;
        width: 1px;
        background: var(--grey-400);
        margin: 0 auto;
    }

    .brows-info__grid {
        margin-block: 6.25rem;
    }

    .brows-info__subheading {
        max-width: 36rem;
    }

    .contact .contact__info {
        max-width: 22rem;
        margin-inline: auto 12rem;
    }

    /* When mailing list is setup

    .footer-info {
        grid-template-columns: 1fr repeat(3, auto) 1fr;
    }

    */

    .footer-info {
        grid-template-columns: repeat(4, 1fr);
    }

    .footer-info__item {
        grid-row: 1 !important;
    }

    .footer-info__item:nth-child(1) {
        grid-column: 1;
    }

    .footer-info__item:nth-child(2) {
        grid-column: 2;
    }

    .footer-info__item:nth-child(3) {
        grid-column: 3;
    }

    .footer-info__item:nth-child(4) {
        grid-column: 4;
    }

    .footer-info__item:nth-child(5) {
        grid-column: 5;
        text-align: left;
    }

    .footer-info__stack {
        grid-column: 4/6;
        grid-template-rows: auto 1fr 1fr;
    }

    .footer-info__stack .footer-info__item:nth-child(2) {
        grid-row: 1 !important;
    }

    .footer-info__stack .footer-info__item:nth-child(2) {
        grid-row: 2 !important;
    }

    .footer-info__stack .footer-info__item:nth-child(3) {
        grid-row: 3 !important;
    }

    .site-info {
        text-align: left;
    }

}

@media (min-width: 1440px) {
    /*
    *  Basic layout styles
    */

    body {
        font-family: 'Cormorant Garamond', serif;
        font-size: 1.25rem;
        line-height: 1.4375;
        max-width: 1800px;
        margin: auto;
        padding: 0 2.5rem;
    }

    /*
    *  Basic typography styles
    */

    h1 {
        font-size: 3.75rem;
        line-height: 72px;
        letter-spacing: 10px;
    }

    h2 {
        font-size: 2.375rem;
        line-height: 46px;
        letter-spacing: 8px;
    }

    h3 {
        font-size: 1.625rem;
        line-height: 28px;
        letter-spacing: 4px;
    }

    h5 {
        font-size: 0.875rem;
        letter-spacing: 4px;
    }

    .tag {
        margin-bottom: 1.75rem;
    }
    
    /*
    *  Components
    */

    button {
        border: none;
        background: none;
        padding: 0;
        cursor: pointer;
    }

    .btn, .gform_wrapper.gravity-theme .gform_footer input {
        font-weight: 700;
        line-height: 16px;
        letter-spacing: 3px;
    }

    .site-header {
        grid-template-columns: auto max-content min-content;
        padding: 0.875rem 0; 
    }

    .site-nav {
        grid-template-columns: min-content auto;
        align-items: center;
    }

    .site-nav__open, .site-nav__close, .site-nav__menu .btn {
        display: none;
    }

    .site-nav__menu {
        display: grid;
        grid-template-columns: 1fr auto;
        position: relative;
        height: auto;
        width: 100%;
        align-items: center;
        justify-items: center;
        animation: none;
    }

    .site-nav__menu .menu {
        display: flex;
    }

    .site-nav__menu ul {
        justify-self: flex-end;
    }

    .site-nav__menu .menu li {
        border: none;
    }

    .site-nav__menu .menu a {
        padding: 0 0.75rem
    }

    .site-nav__menu .menu a::after {
        background: none;
    }

    .site-nav__social {
        display: flex;
        padding: 0;
    }

    .site-nav__social li {
        display: block;
        padding: 0;
    }

    .site-nav__social li a {
        padding: 0 0.5rem;
    }

    img.logo {
        max-width: 13.125rem;
    }

    /* Footer */

    .footer-info {
        grid-template-columns: auto auto 1fr auto auto;
    }

    .footer-info__stack {
        grid-column: 4/6;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto 1fr;
    }

    .footer-info__stack .footer-info__item:nth-child(1) {
        grid-row: 1 !important;
    }

    .footer-info__stack .footer-info__item:nth-child(2) {
        grid-row: 2 !important;
    }

    .footer-info__stack .footer-info__item:nth-child(3) {
        grid-row: 1 !important;
        grid-column: 2 !important;
    }

    footer .footer-accred {
        display: flex;
    }

    footer .footer-accred li img {
        width: unset;
        height: unset;
    }
}

@media (min-width: 1920px) {
    
    body {
        padding: 0 3.75rem;
    }

    .site-nav__menu .menu a {
        padding: 0 1.125rem
    }
}

@keyframes slideInFromLeft {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}