/*
Theme Name: Truestyle
Author: Seven Hills Creative
Author URI: https://www.sevenhillscreative.co.uk/
Description: Another custom theme for a happy customer!
Tags: accessibility-ready, one-column, two-columns, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
Version: 2025.1
Requires at least: 5.2
Requires PHP: 7.0
*/

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}html{scroll-behavior:smooth}body{line-height:1}a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}

/* BASE */
:root {
    --color-white: #ffffff;
    --color-red: #C82621;
    --color-green: #1F7A3D;
    --color-blue: #484F70;
    --color-dark-blue: #3A4060;
    --color-text-blue: #5A6079;
    --color-pink: #FF8B87;
    --color-light-pink: #FFF5F3;
    --color-cream: #F7F4F0;
    --color-light-cream: #FCFBF7;
    --color-dark-cream: #E3DDD2;
}


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    color: #5A6079;
    box-sizing: border-box;
    font-family: "Inter", sans-serif;
    /* outline: 1px solid red !important; */
}

  
body {
    font-family: "Inter", sans-serif;
    display: grid;
}


@media only screen and (max-width: 1100px) {}
@media only screen and (max-width: 960px) {}
@media only screen and (max-width: 760px) {}
@media only screen and (max-width: 660px) {}
@media only screen and (max-width: 560px) {}
@media only screen and (max-width: 460px) {}
@media only screen and (max-width: 360px) {}
@media only screen and (max-width: 320px) {
    body, header, main, section, footer {
        width: 320px;
    }
}


/* LAYOUT */

section, article, main, nav, header, #primary, footer {
    display: grid;
    grid-template-columns: repeat(16, 1fr);
    grid-column: 1 / 17;
    justify-self: center;
    max-width: 2000px;
    width: 100%;
}


/* SLASHES */

.slashes {
    display: flex;
    align-items: center;
    gap: 0.1em;
    color: var(--color-red);
    font-size: 1em;
    font-weight: 700;
    font-style: italic;
    justify-content: center;
    letter-spacing: 2px;
}


.slashes::before {
    content: "//////////";
}


/* BUTTON LINKS */
.all-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 13px !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2.86px;
    cursor: Pointer;
    border-radius: 6px;
    justify-self: center;
    padding: 1.2em 2em;
    line-height: 1;
    text-align: center;
}

.red-button {
    background-color: var(--color-red);
    border: 1px solid var(--color-red);
    color: var(--color-white);
}

.green-button {
    background-color: var(--color-green);
    border: 1px solid var(--color-green);
    color: var(--color-white);
}

.clear-white-button {
    background-color: transparent;
    border: 1px solid var(--color-white);
    color: var(--color-white);
}

.clear-blue-button, .clear-with-blue-border-button {
    background-color: transparent;
    border: 1px solid var(--color-blue);
    color: var(--color-blue);
}



/* TEXT */
h1, h2, h3, h4, h5, h6{
    font-family: "Playfair Display", serif;
    font-weight: 500;
    line-height: 1;
}

h1 {
    font-size: 4.4em;
}

h2 {
    font-size: 2.88em;
}

h3 {
    font-size: 1.063em;
}

h4 {

}

p, li {
    font-size: 1em;
    line-height: 28px;
    font-weight: 400;
    word-break: break-word;
}


label {
    font-size: 0.75em;
    font-weight: 700;
    color: var(--color-red);
    font-family: "Inter", sans-serif;
    letter-spacing: 3.84px;
}

img {
    width: 100%;
}

ul.main-nav{
  padding: 0;
}

li::marker {

}

strong {
  font-weight: 700;
}

em {
  font-style: italic;
}

.underline {
  text-decoration: underline;
}

a {
  cursor: Pointer !important;
  text-decoration: none;
}



@media only screen and (max-width: 800px) {

    h1,  h1 span{
        font-size: 3em;
    }
    
    h2{
        font-size: 2em;
    }
    
    h3{
    
    }
    
    h4{
      
    }
        
    p , li{

    }   
    
    label {

    }

}

/* WP CONTENT */
.wp-content-section {
    grid-column: 4 / 14;
    grid-template-columns: 1fr;
    display: grid;
    gap: 2em;
    margin: 5em 0;
    text-align: center;
    justify-items: center;
}

.wp-content-section ul li {
    font-size: 20px;
    font-weight: 300;
}


@media only screen and (max-width: 1350px) {

    .wp-content-section {
        grid-column: 2 / 16;
    }

}

/* 404 PAGE */

section.error{
    min-height: 60vh;
    align-content: center;
    grid-column: 2 / 16;
}

section.error h1 {
    text-align: center;
    grid-column: 2 / 16;
}

section.error p {
    text-align: center;
    grid-column: 2 / 16;
}









/* HEADER */

#header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 9999;
}


/* CONTACT BAR */

.contact-bar {
    display: grid;
    grid-template-columns: repeat(16, minmax(0, 1fr));
    width: 100%;
    padding: 0.2em 0;
    background-color: var(--color-dark-blue);
}

.inner-contact-bar {
    display: flex;
    grid-column: 2/16;
    flex-wrap: wrap;
    gap: 1.5em;
    justify-content: space-between;
    text-align: center;
}

.inner-contact-bar p ,
.inner-contact-bar p a,
.inner-contact-bar p a i {
    color: #FFFFFFD9;
    font-size: 12.5px;
    gap: 0.5em;
    display: flex;
    align-items: center;
    font-weight: 400;
}

.inner-contact-bar p a i {
    font-size: 18px;
}

.inner-contact-bar a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.inner-contact-bar .inner-social-media {
    display: flex;
    align-items: center;
    justify-content: center;
}



/* MAIN NAVIGATION BAR */

.grid-header-section {
    background-color: var(--color-blue);
}



/* DESKTOP HEADER */

@media only screen and (min-width: 1001px) {

    .grid-header-outer {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-column: 2 / 16;
        gap: 1em;
        padding: 1em 0;
    }

    .grid-header-outer .inner-header-logo-background {
        display: grid;
        align-items: center;
    }

    .grid-header-outer .header-logo-img {
        width: auto;
        max-width: 129px;
    }


    /* Desktop menu */

    .header-menu {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
    }

    .header-menu .main-nav {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 1em;
    }

    .header-menu .main-nav > li {
        position: relative;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .header-menu .main-nav > li > a {
        display: flex;
    }

    .header-menu .main-nav li a span {
        color: #fff;
        font-weight: 400;
        font-size: 16px;
        transition:
            color 0.2s ease,
            opacity 0.2s ease;
    }

    .header-menu .main-nav li a:hover span {
        opacity: 0.75;
    }

    .header-menu .main-nav li.current-menu-item > a,
    .header-menu .main-nav li.current_page_item > a,
    .header-menu .main-nav li.current-menu-ancestor > a,
    .header-menu .main-nav li.current_page_ancestor > a,
    .header-menu .main-nav li.current-menu-item > a span,
    .header-menu .main-nav li.current_page_item > a span,
    .header-menu .main-nav li.current-menu-ancestor > a span,
    .header-menu .main-nav li.current_page_ancestor > a span {
        color: #fff;
        font-weight: 700;
    }


    /* Desktop submenus */

    .header-menu .main-nav .sub-menu {
        position: absolute;
        top: 100%;
        left: 0;
        display: none;
        min-width: 220px;
        padding: 0.75em;
        margin: 0;
        background-color: var(--color-blue);
        list-style: none;
        z-index: 999;
    }

    .header-menu .main-nav li:hover > .sub-menu,
    .header-menu .main-nav li:focus-within > .sub-menu {
        display: block;
    }

    .header-menu .main-nav .sub-menu li {
        width: 100%;
        padding: 0;
        margin: 0;
        list-style: none;
    }

    .header-menu .main-nav .sub-menu a {
        display: block;
        width: 100%;
        padding: 0.75em;
        text-decoration: none;
    }

    #hamburger-input,
    .overlay,
    #hamburger-menu,
    #sidebar-menu,
    .header-bar {
        display: none;
    }

	#menu-main-menu > li.menu-item-has-children > a {
		display: flex;
		align-items: center;
		gap: 0.5rem;
	}

	#menu-main-menu > li.menu-item-has-children > a::after {
		content: "\f078";
		display: inline-block;
		font-family: "Font Awesome 6 Pro";
		font-size: 10px;
		font-style: normal;
		font-weight: 900;
		line-height: 1;
		transition: transform 0.2s ease;
		color: #fff;
	}

	#menu-main-menu > li.menu-item-has-children:hover > a::after,
	#menu-main-menu > li.menu-item-has-children:focus-within > a::after {
		transform: rotate(180deg);
	}
}


.contact-menu-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 13px !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: Pointer;
    border-radius: 6px;
    justify-self: center;
    padding: 0.5em 1em !important;
    background-color: var(--color-red);
    border: 1px solid var(--color-red);
    color: var(--color-white);
}


/* RESPONSIVE MENU */

@media only screen and (max-width: 1000px) {

    .grid-header-outer {
        display: none;
    }

	#bwl-side-nav .menu-link-wrapper {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}

	#bwl-side-nav .menu-link-wrapper > a {
		flex: 1;
		min-width: 0;
	}

	#bwl-side-nav .toggle-icon {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 44px;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		background: transparent;
		color: #fff;
		cursor: pointer;
	}

	#bwl-side-nav .toggle-icon span {
		display: inline-block;
		width: auto;
		height: auto;
		background: none;
		font-family:
			"Font Awesome 6 Free",
			"Font Awesome 5 Free",
			"FontAwesome";
		font-size: 14px;
		font-style: normal;
		font-weight: 400;
		line-height: 1;
		color: #fff;
		transition: transform 0.2s ease;
	}

	#bwl-side-nav .toggle-icon span::before {
		content: "\f078";
	}

	#bwl-side-nav .toggle-icon span::after {
		content: none;
		display: none;
	}

	#bwl-side-nav .toggle-icon.open span {
		transform: rotate(180deg);
	}

	#bwl-side-nav .sub-menu {
		margin: 0;
		padding: 0 0 0 1rem;

		list-style: none;
	}

	#bwl-side-nav .sub-menu.hidden {
		display: none;
	}

	#bwl-side-nav .dropdown-open > .sub-menu {
		display: block;
	}

    .header-bar {
        display: grid;
        grid-column: 2 / 16;
        grid-template-columns:
            minmax(0, 1fr)
            auto;
        align-items: center;
        gap: 1.5em;
        width: 100%;
        min-width: 0;
        padding: 1em 0;
        z-index: 20;
    }

    .header-bar .inner-header-logo-background {
        min-width: 0;
    }

    .header-bar .header-logo-link {
        justify-content: flex-start;
        max-width: 100%;
    }

    .header-bar img {
        display: block;
        width: auto;
        max-width: 180px;
        max-height: 80px;
        object-fit: contain;
    }


    /* Responsive menu wrapper */

    .responsive-menu {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        justify-self: end;
        position: relative;
    }

    #hamburger-input {
        display: none;
    }

    #hamburger-menu {
        display: flex;
        align-items: flex-end;
        justify-content: center;
        flex-direction: column;
        gap: 5px;
        width: 44px;
        min-width: 44px;
        height: 44px;
        cursor: pointer;
        position: relative;
        z-index: 1001;
    }

    .menu-icon {
        display: block;
        width: 34px;
        height: 3px;
        margin: 0;
        background-color: var(--color-white);
        transition:
            transform 0.3s ease,
            opacity 0.3s ease;
    }

    #hamburger-menu #sidebar-menu,
    #sidebar-menu {
        display: block;
        visibility: hidden;
        position: fixed;
        top: 0;
        right: -100%;
        width: min(100%, 520px);
        height: 100vh;
        min-height: 100vh;
        max-height: 100vh;
        padding: 2em;
        overflow-y: auto;
        background-color: var(--color-blue);
        box-sizing: border-box;
        transition:
            right 0.3s ease,
            visibility 0.3s ease;
        z-index: 1000;
    }

    #hamburger-input:checked + #hamburger-menu #sidebar-menu {
        visibility: visible;
        right: 0;
    }

    .side-menu-inner {
        display: flex;
        flex-direction: column;
        width: 100%;
        min-height: 100%;
        padding-top: 1em;
    }

    .inner-mobile-header-logo {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-bottom: 1.5em;
    }

    .inner-mobile-header-logo a {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .inner-mobile-header-logo .header-logo-img {
        width: auto;
        max-width: 180px;
        max-height: 100px;
    }

    #hamburger-menu ul {
        width: 100%;
        padding: 0;
        margin: 1em 0;
        list-style: none;
    }

    #hamburger-menu li {
        width: 100%;
        padding: 0;
        margin: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.7);
        list-style: none;
    }

    #hamburger-menu a {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding: 1em 0;
        color: var(--color-white);
        text-decoration: none;
        box-sizing: border-box;
        transition:
            color 0.2s ease,
            opacity 0.2s ease;
    }

    #hamburger-menu a span {
        color: inherit;
        font-weight: 600;
        font-size: 26px;
        line-height: 1.2;
        text-align: center;
    }

    /* Mobile submenus */

    #hamburger-menu ul .sub-menu {
        width: 100%;
        padding: 0 1em 1em;
        margin: 0;
        box-sizing: border-box;
    }

    #hamburger-menu ul .sub-menu li {
        border-bottom: 0;
    }

    #hamburger-menu ul .sub-menu a {
        padding: 0.6em 0;
    }

    #hamburger-menu ul .sub-menu a span {
        font-size: 18px;
        font-weight: 500;
    }

    .social-menu-bar {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 1em;
    }

    .social-menu-bar a {
        width: auto;
        padding: 0;
    }

    .social-menu-bar a div {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        padding: 0;
        background-color: var(--color-white);
        border-radius: 50%;
    }

    .social-menu-bar a div i {
        display: flex;
        align-items: center;
        justify-content: center;
        width: auto;
        color: #047473;
        font-size: 24px;
    }

    .social-menu-bar-mobile {
        justify-content: center;
        margin-top: auto;
        padding-top: 2em;
    }

    .header-bar .large-logo {
        display: grid;
    }

    .header-bar .small-logo {
        display: none;
    }

    .social-menu-bar-desktop {
        display: none;
    }
}


/* SMALL MOBILE */

@media only screen and (max-width: 600px) {

    .contact-bar {
        grid-template-columns: repeat(16, minmax(0, 1fr));
    }

    .inner-contact-bar {
        grid-column: 2 / 16;
        gap: 0.75em;
        display: grid;
        justify-content: center;
    }

    .header-bar {
        grid-column: 2 / 16;
        gap: 1em;
    }

    .header-bar img {
        max-width: 140px;
    }

    #hamburger-menu #sidebar-menu,
    #sidebar-menu {
        width: 100%;
        max-width: none;
        padding: 1.5em;
    }

    #hamburger-menu a span {
        font-size: 22px;
    }
}











/* FOOTER */

.footer {
    background-color: var(--color-dark-blue);
    padding: 5em 0;
    gap: 1em;
}

.footer-areas {
    display: grid;
    grid-template-columns: 25% 1fr 1fr 25%;
    grid-column: 2 / 16;
    gap: 3em;
    z-index: 2;
    padding-bottom: 2em;
}

.footer-box {
    display: grid;
    align-content: start;
}

.footer-box p {
    color: #FFFFFFB2;
    font-weight: 400;
    display: flex;
    gap: 1em;
}

.footer-box h2 {
    font-weight: 600;
    font-size: 14px;
    color: var(--color-white);
    text-transform: uppercase;
    padding-bottom: 0.5em;
    font-family: "Inter", sans-serif;
    letter-spacing: 2.52px;
}

.footer-box p strong {
   font-weight: 700;
}

.footer-box p a {
    font-size: 16px;
    font-weight: 400;
    color: #FFFFFFB2;
    display: flex;
    gap: 1em;
    align-items: center;
}

.footer-box li a span {
    font-weight: 300;
    font-size: 14.5px;
    color: #FFFFFFB2;
}

.footer-nav-one li,
.footer-nav-two li,
.footer-nav-three li {
    padding: 0.1em 0;
}



/* COL ONE */
.footer-company-logo {
    display: grid;
    max-width: 129px;
}

.footer-column-one {
    display: grid;
    gap: 1em;
}

.footer-social-details {
    display: flex;
    gap: 1em;   
}

.footer-social-details i {
    border: 1px solid #FFFFFF26;
    border-radius: 50%;
    font-size: 1em;
    width: 40px;
    aspect-ratio: 1 / 1;
    display: grid;
    text-align: center;
    align-items: center;
    color: var(--color-white);
}



/* COL FOUR  */

.side-contact-details {
    display: grid;
    gap: 1em;
}

.side-contact-details > p:has(a) {
    display: grid;
    gap: 0;
}

.side-contact-details > p:has(a) span {
    margin-left: 35px;
    color: #FFFFFFB2;
}

.side-contact-details > p:not(:has(a)) {
    display: flex;
}

.side-contact-details p br {
    display: none;
}

.side-contact-details i {
    font-size: 18px;
    color: var(--color-pink);
}

.side-contact-details p a strong {
    font-weight: 700;
    color: var(--color-white);
}



/* LOWER CONTENT */

.lower-footer-content {
    display: flex;
    flex-wrap: wrap;
    grid-column: 2/16;
    justify-content: space-between;
    gap: 1em;
    border-top: 1px solid rgb(255, 255, 255,0.1);
    padding-top: 2em;
}

.lower-footer-message {
    display: flex;
    grid-column: 2/16;
    justify-content: center;
    text-transform: uppercase;
    text-align: center;
}

.lower-footer-message p {
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 2.42px;
    color: #FFFFFF66;
}

.lower-footer-content ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    padding: 0;
    margin: 0;
}

.lower-footer-content ul li a span,
.lower-footer-content {
    color: #FFFFFF8C;
    list-style: none;
}



@media only screen and (max-width: 1000px) {

    .lower-footer-content {
        justify-content: center;
        text-align: center;
    }

    .footer {
        padding: 3em 0;
    } 

    .footer-column-one,
    .footer-col-two {
        grid-template-columns: 1fr;
    }

    .footer-col-two {
       gap: 0;
    }

    .side-contact-details {
        justify-items: center;
    }

    .side-contact-details a {
        flex-wrap: wrap;
        justify-content: center;
    }

    .side-social-details {
        justify-items: center;
    }

    .footer-areas {
        grid-template-columns: 1fr;
        gap: 2em;
        justify-content: center;
        text-align: center;
        justify-items: center;
    }

    .footer-company-logo {
        justify-self: center;
        z-index: 2;
    }

    .footer-social-details {
        justify-content: center;
    }

}











/* HERO BLOCK */

.truestyle-hero-block {
    padding: 5em 0;
    position: relative;
    height: 100vh;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.truestyle-hero-block::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 1;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
            linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(72, 79, 112, 0.4) 100%);
}

.truestyle-hero-block__inner {
    display: grid;
    grid-column: 2/16;
    gap: 1em;
    position: relative;
    z-index: 2;
    justify-content: center;
}

.truestyle-hero-block__content {
    display: grid;
    gap: 1em;
    align-content: center;
    text-align: center;
    justify-items: center;
}

.truestyle-hero-block__content h1 {
    color: var(--color-white);
}

.truestyle-hero-block__content p {
    color: #FFFFFFE5;
    max-width: 640px;
}

.truestyle-hero-block__content label {
    color: #FFFFFFD9;
}

.hero-link {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
}



@media only screen and (max-width: 1000px) {

    .truestyle-hero-block {
        align-items: start;
        padding: 3em 0;
        overflow: visible;
    }

    .truestyle-hero-block__inner {
        grid-template-columns: 1fr;
        align-items: start;
        overflow: visible;
    }

	.truestyle-hero-block {
		height: 80vh;
	}

}












/* Fifty Text Images */

.fifty-text-images {
	padding: 5em 0;
	position: relative;
}

.fifty-text-images .inner-fifty-image-contents {
	position: relative;
	z-index: 1;
}

.inner-fifty-image-contents {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	gap: 4em;
}

.fifty-section-images-left .fifty-contents {
	order: 2;
}

.fifty-section-images-left .fifty-text-images__image-wrapper {
	order: 1;
}

.fifty-contents {
	display: grid;
	gap: 2em;
	align-content: center;
	min-width: 0;
	position: relative;
}

.fifty-contents ul li {
	list-style-type: disc;
	margin-left: 1em;
	/* padding: 1em 0; */
}

.fifty-contents ul li::marker {
	list-style-type: disc;
	color: var(--color-green);
}

.fifty-contents ul li h3 {
	font-family: "Inter", sans-serif;
	font-size: 23px;
	font-weight: 700;
}

/* Image */

.fifty-text-images__image-wrapper {
	position: relative;
	min-width: 0;
	overflow: hidden;
	border-radius: 6px;
    box-shadow: 0px 18px 40px 0px #484F702E;
	min-height: 400px;
}

.fifty-text-images-background-image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* Contact details */

.fifty-contents__content {
	display: grid;
	gap: 1em;
}

.fifty-contents__content p label {
	text-transform: uppercase;
}

.fifty-contact-details {
	display: flex;
	flex-direction: column;
	gap: 2em;
	padding: 2em 0;
}

.fifty-contact-details__item {
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr);
	gap: 12px;
	align-items: start;
}

.fifty-contact-details__text p {
	display: grid;
	line-height: 1;
}

.fifty-contact-details__icon i {
	color: var(--color-red);
	font-size: 20px;
	font-weight: 500;
}

.fifty-contact-details__text strong {
	color: #8a8fa5;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 2.16px;
	text-transform: uppercase;
}

.fifty-contact-details__text a {
	color: var(--color-red);
	font-weight: 500;
}

.fifty-text-images__links {
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
}


@media only screen and (max-width: 1000px) {

	.inner-fifty-image-contents {
		grid-template-columns: 1fr;
		grid-column: 2 / 16;
		gap: 3em;
	}

	.fifty-text-images {
		padding: 3em 0;
	}

	.fifty-contents {
		text-align: center;
		justify-items: center;
	}

	.fifty-section-images-left .fifty-contents {
		order: initial;
	}

	.fifty-section-images-left .fifty-text-images__image-wrapper {
		order: initial;
	}

	.fifty-text-images__image-wrapper {
		min-height: clamp(300px, 70vw, 500px);
	}

	.fifty-contents ul {
		display: grid;
		gap: 0;
		padding-left: 0;
		margin-left: 0;
	}

	.fifty-contents ul li {
        justify-self: center;
	}

    .fifty-contact-details__text p {
        text-align: left;
    }

    .hero-link {
        justify-content: center;
    }

}

@media only screen and (max-width: 500px) {
	.fifty-contents ul li {
        justify-self: start;
		text-align: left;
	}
}








/* GREEN INFO BAR */

.green-info-bar {
    background-color: var(--color-green);
    padding: 1.5em 0;
}

.green-info-bar-inner {
    display: flex;
    grid-column: 2/16;   
    flex-wrap: wrap;
    justify-content: space-between;
    text-align: center;  
}

.info-grid-box * {
    color: var(--color-white);
}


@media only screen and (max-width: 1000px) {

    .green-info-bar-inner {
        gap: 1em;
        justify-content: center;
    }
}





/* Services Gallery Links */

.services-gallery-links {
    padding: 5em 0;
}

.services-gallery-links-inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column: 2/16;  
    gap: 1em;
}

.services-gallery-links-grid-box {
    height: 368px;
    border-radius: 6px;
    display: grid;
    align-items: end;
    padding: 2em;
    box-shadow: 0px 10px 24px 0px #00000014;
    position: relative;
}

.services-gallery-links-grid-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 6px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0) 100%);
}

.services-gallery-links-grid-box * {
    color: var(--color-white);
}

.services-gallery-links-grid-box a {
    z-index: 2;
    font-weight: 500;
    font-size: 22px;
}

@media only screen and (max-width: 900px) {

    .services-gallery-links {
        padding: 3em 0;
    }

    .services-gallery-links-inner {
        grid-template-columns: 1fr;
    }

}







/* Centred Content with Background Image */

.truestyle-centred-content-with-background-image-block {
    align-items: center;
    background-size: cover;
    background-position: center;       
    min-height: 420px; 
    position: relative;
}

.truestyle-centred-content-with-background-image-block::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: 1;
    background: #484F70BF;
}

.truestyle-centred-content-with-background-image-block__inner {
    display: grid;
    grid-column: 2/16;
    justify-self: center;
    text-align: center;
    z-index: 2;
}

.truestyle-centred-content-with-background-image-block__content {
    display: grid;
    gap: 1em;
    max-width: 732px;
}


.truestyle-centred-content-with-background-image-block__content * {
    color: var(--color-white);
}














/* Fifty Text Icon Grid */

.truestyle-fifty-text-icon-grid {
    padding: 5em 0;
}

.truestyle-fifty-text-icon-grid__inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2em;
    grid-column: 2/16;
    padding-top: 3em;
}

.truestyle-fifty-text-icon-grid__header {
    display: grid;
    gap: 1em;
    grid-column: 2/16;
    text-align: center;
}

.truestyle-fifty-text-icon-grid__text ul {
    display: grid;
    gap: 1em;
    grid-template-columns: 1fr 1fr;
    padding: 2em 0;
}

.truestyle-fifty-text-icon-grid__text ul li::before {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;
    color: var(--color-red);
    font-size: 1em;
    margin-right: 0.5em;
}

.truestyle-fifty-text-icon-grid__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);  
    gap: 1em;
    align-content: center;
}

.truestyle-fifty-text-icon-grid__box {
    background-color: var(--color-white);
    display: grid;
    gap: 1em;   
    align-items: center;
    text-align: center;
    border-radius: 6px;
    padding: 2em;
    box-shadow: 0px 8px 24px 0px #484F7014;
}

.truestyle-fifty-text-icon-grid__box p {
    text-transform: uppercase;
    font-size: 13px;
}

.truestyle-fifty-text-icon-grid__box p label {
    font-size: 46px;
    font-family: "Playfair Display", serif;
}



@media only screen and (max-width: 1115px) {

    .truestyle-fifty-text-icon-grid__inner {
        grid-template-columns: 1fr;
        padding: 0;
    }

    .truestyle-fifty-text-icon-grid__text {
        justify-items: center;
    }

    .truestyle-fifty-text-icon-grid__text p {
        text-align: center;
    }

}


@media only screen and (max-width: 650px) {

    .truestyle-fifty-text-icon-grid__grid,
    .truestyle-fifty-text-icon-grid__text ul {
        grid-template-columns: 1fr;
    }

    .truestyle-fifty-text-icon-grid {
        padding: 3em 0;
    }

}














/* Testimonials */

.testimonials-block {
    padding: 5em 0;
}

.testimonials-block__inner {
    display: grid;
    grid-column: 2 / 16;
    gap: 2em;
    z-index: 2;
}

.testimonials-content {
    display: grid;
    gap: 1em;
    align-content: start;
    text-align: center;
}

.testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1em;
}

.testimonials-card {
    background-color: var(--color-cream);
    border-radius: 6px;
    padding: 2em;
    display: grid;
    gap: 1em;
}

.stars {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.stars i {
    color: #F5A623;
}

.testimonials-card hr {
    border: 0;
    border-top: 1px solid #E3DDD2;
    width: 100%;
}

.testimonials-card .details p {
    font-size: 12px;
    letter-spacing: 1.92px;
    font-weight: 400;
    text-transform: uppercase;
    color: #8A8FA5;
}

.testimonials-card p label {
    color: var(--color-blue);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0;
}



@media only screen and (max-width: 1000px) {

    .testimonials-grid {
        grid-template-columns: 1fr;
    }

    .testimonials-content {
        justify-self: center;
        text-align: center;
    }

    .testimonials-card {
        text-align: center;
    }

    .stars {
        justify-content: center;
    }

    .testimonials-block {
        padding: 3em 0;
    }
}









/* PROCESS CARDS */

.process-cards-block {
    padding: 5em 0;
    background-color: var(--color-dark-blue);
}

.process-cards-block__inner {
    display: grid;
    grid-column: 2 / 16;
    gap: 2em;
}

.process-cards-block__inner * {
    color: var(--color-white);
    display: grid;
    gap: 0.5em;
}

.process-cards-block__header {
    display: grid;
    gap: 1em;
    text-align: center;
}

.process-cards-block__header label {
    color: var(--color-pink);
}

.process-cards-block__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    justify-content: space-evenly;
}

.process-cards-block__card {
    display: grid;
    gap: 1em;
    align-content: start;
    background-color: #FFFFFF0A;
    border-radius: 6px;
    padding: 2em;
    border: 1px solid #FFFFFF1A;
    max-width: 220px
}

.process-cards-block__number {
    font-family: "Playfair Display", serif;
    font-size: 40px;    
    color: var(--color-pink);
}

.process-cards-block__content h3 {
    font-weight: 600;
    font-size: 17px;
    font-family: "Inter", sans-serif;
}

.process-cards-block__link {
    padding-top: 1em;
}


@media only screen and (max-width: 1000px) {

    .process-cards-block__card {
        text-align: center;
		max-width: 100%;
    }

}











/* Free Quote Form */

.truestyle-free-quote-form-block {
    padding: 5em 0;
}

.truestyle-free-quote-form-block__inner {
    display: grid;
    grid-column: 2 / 16;
    gap: 4em;
}

.quote-form-header {
    text-align: center;
    max-width: 620px;
    justify-self: center;
}

.quote-form-header .slashes{
    padding: 2em 0;
}


/* Quote form outer panel */

.quote-form {
	padding: 3.5em;
	background-color: #f7f4f0;
	border-radius: 6px;
    max-width: 820px;
    justify-self: center;
}




/* Contact Form 7 form */

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) form {
	display: grid;
	gap: 1.25em;
	margin: 0;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .form-grid {
	display: grid;
	gap: 1.25em;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .two-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .full-width {
	grid-template-columns: minmax(0, 1fr);
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .form-item {
	min-width: 0;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .form-item p,
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
	margin: 0;
}


/* Fields */

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="text"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="email"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="tel"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="number"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="url"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) select,
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) textarea {
	display: block;
	width: 100%;
	margin: 0;
	padding: 1.1em;
	box-sizing: border-box;
	color: var(--color-blue);
	font-family: inherit;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	background-color: #ffffff;
	border: 1px solid #ded9d3;
	border-radius: 6px;
	outline: none;
	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="text"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="email"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="tel"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="number"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="url"],
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) select {
	min-height: 48px;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) textarea {
	min-height: 110px;
	resize: vertical;
}


/* Placeholder text */

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input::placeholder,
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) textarea::placeholder {
	color: #a8adbf;
	opacity: 1;
}


/* Focus state */

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input:focus,
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) select:focus,
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) textarea:focus {
	border-color: var(--color-red);
	box-shadow: 0 0 0 2px rgba(210, 35, 31, 0.1);
}


/* Submit button */

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="submit"] {
	display: block;
	min-width: 250px;
	margin: 1em auto 0;
	padding: 1.2em 2em;
	color: #ffffff;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.2em;
	text-align: center;
	text-transform: uppercase;
	background-color: var(--color-red);
	border: 2px solid var(--color-red);
	border-radius: 5px;
	cursor: pointer;
	transition:
		color 0.2s ease,
		background-color 0.2s ease;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="submit"]:hover,
:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) input[type="submit"]:focus {
	color: var(--color-red);
	background-color: transparent;
}


/* Contact Form 7 messages */

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .wpcf7-not-valid-tip {
	margin-top: 0.5em;
	color: var(--color-red);
	font-size: 13px;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .wpcf7-response-output {
	margin: 1em 0 0 !important;
	padding: 1em !important;
	border-radius: 5px;
}

:is(.quote-form, .fifty-text-form__form, .contact-text-form__form) .wpcf7-spinner {
	display: block;
	margin: 1em auto 0;
}

















@media only screen and (max-width: 700px) {

	:is(.quote-form, .fifty-text-form__form) .two-grid {
		grid-template-columns: 1fr;
	}

	:is(.quote-form, .fifty-text-form__form) input[type="submit"] {
		width: 100%;
		min-width: 0;
	}
}
.quote-form p {
    text-align: center;
}

/* Mobile */

@media only screen and (max-width: 700px) {

	.quote-form {
		padding: 2em 1.25em;
	}

	.quote-form .two-grid {
		grid-template-columns: 1fr;
	}

	.quote-form input[type="submit"] {
		width: 100%;
		min-width: 0;
	}
}

















/* Fifty Text Image with Floating Content Bar */

.fifty-text-image-with-floating-content-bar {
	position: relative;
	padding: 5em 0;
	overflow: visible;
}

/* Main layout */

.fifty-text-image-with-floating-content-bar__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
    grid-column: 2 / 16;
	gap: 4em;
}

.top-line {
    border-top: 1px solid #E3DDD2;
    margin-bottom: 2em;
    display: grid;
    grid-column: 2 / 16;
}



/* Image position */

.fifty-text-image-with-floating-content-bar--image-left
	.fifty-text-image-with-floating-content-bar__content {
	order: 2;
}

.fifty-text-image-with-floating-content-bar--image-left
	.fifty-text-image-with-floating-content-bar__image-wrapper {
	order: 1;
}


/* Content */

.fifty-text-image-with-floating-content-bar__main-content {
    display: grid;
    gap: 1em;
}

.fifty-text-image-with-floating-content-bar__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
    padding-bottom: 2em;
    gap: 2em;
}


/* Content tabs */

.fifty-text-image-with-floating-content-bar__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.fifty-text-image-with-floating-content-bar__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.65rem 1rem;
	background-color: var(--color-white);
	border: 1px solid #ded9d3;
	border-radius: 999px;
    font-weight: 600;
}


/* Links */

.fifty-text-image-with-floating-content-bar__links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
}

.fifty-text-image-with-floating-content-bar__text-link {
    font-weight: 600;
}

/* Image */

.fifty-text-image-with-floating-content-bar__image-wrapper {
	position: relative;
	min-width: 0;
	min-height: 400px;
	overflow: hidden;
	border-radius: 6px;
}

.fifty-text-image-with-floating-content-bar__image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* Content over image */

.fifty-text-image-with-floating-content-bar__image-content {
	position: absolute;
	right: 2rem;
	bottom: 1rem;
	z-index: 2;
	width: 242px;
	padding: 1rem 1.25rem;
	background-color: #ffffff;
	border-radius: 5px;
	box-shadow: 0 8px 30px rgba(31, 42, 68, 0.12);
}


/* Floating content bar */

.fifty-text-image-with-floating-content-bar__floating-bar {
	position: relative;
	z-index: 3;
	display: grid;
	grid-template-columns: minmax(220px, 1.15fr) minmax(0, 4fr);
	grid-column: 2/16;
	background-color: #ffffff;
	border-radius: 6px;
	box-shadow: 0 10px 35px rgba(31, 42, 68, 0.1);
}

.fifty-text-image-with-floating-content-bar__floating-bar-header {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 2rem;
}

.fifty-text-image-with-floating-content-bar__floating-bar-header p {
	line-height: 1.5;
}

.fifty-text-image-with-floating-content-bar__floating-bar-header p label {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 3.36px;
}

/* Floating bar items */

.fifty-text-image-with-floating-content-bar__floating-bar-items {
	display: flex;
}

.fifty-text-image-with-floating-content-bar__floating-bar-item {
	flex: 1 1 0;
	min-width: 0;

	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-content: start;
	gap: 0.75rem;
	padding: 2rem 1.25rem;
	border-left: 1px solid #e3ded8;
}

.fifty-text-image-with-floating-content-bar__floating-bar-number {
	color: var(--color-pink);
    font-family: "Playfair Display", serif;
	font-size: 2em;
}

.fifty-text-image-with-floating-content-bar__floating-bar-content p label {
    color: var(--color-blue);
    font-weight: 600;
    font-size: 17px;
    letter-spacing: 0%;
    text-transform: none;
}



@media only screen and (max-width: 1100px) {

	.fifty-text-image-with-floating-content-bar {
		padding: 4rem 0 6rem;
	}

	.fifty-text-image-with-floating-content-bar__inner {
		grid-template-columns: 1fr;
		gap: 3rem;
	}

	.fifty-text-image-with-floating-content-bar--image-left
		.fifty-text-image-with-floating-content-bar__content,
	.fifty-text-image-with-floating-content-bar--image-left
		.fifty-text-image-with-floating-content-bar__image-wrapper {
		order: initial;
	}

	.fifty-text-image-with-floating-content-bar__image-wrapper {
		min-height: clamp(420px, 65vw, 650px);
	}

	.fifty-text-image-with-floating-content-bar__floating-bar {
		grid-template-columns: 1fr;
		grid-column: 2/16;
		margin-top: 2rem;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-header {
		border-bottom: 1px solid #e3ded8;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-item:first-child {
		border-left: 0;
	}
}

@media only screen and (max-width: 970px) {

	.fifty-text-image-with-floating-content-bar__floating-bar-items {
		flex-wrap: wrap;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-item {
		flex: 0 0 50%;
	}

}


@media only screen and (max-width: 700px) {

	.fifty-text-image-with-floating-content-bar {
		padding: 3rem 0;
	}

	.fifty-text-image-with-floating-content-bar__inner,
	.fifty-text-image-with-floating-content-bar__floating-bar {
		grid-column: 2/16;
	}

	.fifty-text-image-with-floating-content-bar__content {
		align-items: center;
		text-align: center;
	}

	.fifty-text-image-with-floating-content-bar__tabs,
	.fifty-text-image-with-floating-content-bar__links {
		justify-content: center;
	}

	.fifty-text-image-with-floating-content-bar__contact-details {
		width: 100%;
		text-align: left;
	}

	.fifty-text-image-with-floating-content-bar__image-wrapper {
		min-height: 380px;
	}

	.fifty-text-image-with-floating-content-bar__image-content {
		right: 1rem;
		bottom: 1rem;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-header {
		padding: 1.5rem;
		text-align: center;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-items {
		grid-template-columns: 1fr;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-item {
		padding: 1.5rem;
		border-top: 1px solid #e3ded8;
		border-left: 0;
	}

	.fifty-text-image-with-floating-content-bar__floating-bar-item:first-child {
		border-top: 0;
	}
}

@media (max-width: 480px) {
	.fifty-text-image-with-floating-content-bar__floating-bar-item {
		flex-basis: 100%;
	}
}








/* PROCESS CARDS SMALL */

.process-cards-block-small {
	padding: 5em 0;
	background-color: var(--color-dark-blue);
}

.process-cards-block__inner-small {
	display: grid;
	grid-column: 2 / 16;
	gap: 2em;
}

.process-cards-block__inner-small * {
	color: var(--color-white);
}

.process-cards-block__header-small {
	display: grid;
	gap: 1em;
	text-align: center;
    max-width: 640px;
    justify-self: center;
}

.process-cards-block__header-small label {
	color: var(--color-pink);
}

.process-cards-block__grid-small {
	display: grid;
    grid-template-columns: repeat(3,1fr);
	flex-wrap: wrap;
	justify-content: space-evenly;
	gap: 1em;
    border-top: 1px solid #FFFFFF24;
}

.process-cards-block__card-small {
	display: grid;
    grid-template-columns: auto 1fr;
	align-content: start;
	gap: 1em;
	padding: 1em;
    border-right: 1px solid #FFFFFF24;
    margin-top: 1em;
}

.process-cards-block__card-small:last-child {
    border-right: none;
}

.process-cards-block__number-small {
	color: var(--color-pink);
	font-family: "Playfair Display", serif;
	font-size: 40px;
}

.process-cards-block__content-small {
	display: grid;
	gap: 0.5em;
}

.process-cards-block__content-small h3 {
	font-size: 17px;
	font-weight: 600;
    font-family: "Inter", sans-serif;
}

.process-cards-block__content-small p {
    color: #FFFFFFC7;
}

.process-cards-block__link-small {
	padding-top: 1em;
    justify-self: center;
}

@media only screen and (max-width: 1000px) {

	.process-cards-block__card-small {
		text-align: center;
	}

    .process-cards-block__grid-small {
        grid-template-columns: 1fr;
    }

    .process-cards-block__card-small {
        border: none;
        grid-template-columns: 1fr;
    }
}










/* FIFTY TEXT FORM */

.fifty-text-form {
	padding: 5em 0;
    gap: 2em;
}

.fifty-text-form__inner {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: 40% 1fr;
	gap: 4em;
}

.fifty-text-form__header {
    display: grid;
	grid-column: 2 / 16;
    gap: 1em;
    max-width: 640px;
    justify-self: center;
    text-align: center;
}

/* Content */

.fifty-text-form__content {
	display: grid;
    gap: 1em;
	align-content: start;
	gap: 1em;
}

.fifty-text-form__content h3 {
    font-weight: 500;
    font-size: 42px;    
}

.fifty-text-form__content ul {
	display: grid;
	gap: 1em;
	margin: 1em 0;
	padding-left: 1.25em;
}

.fifty-text-form__content ul li {
	list-style-type: disc;
}

.fifty-text-form__content ul li::marker {
	color: var(--color-red);
}

.fifty-text-form__content ul li > * {
	color: var(--color-dark-blue);
}

.fifty-text-form-two {
    display: grid;
    padding: 2em;
    border-radius: 6px;
    box-shadow: 0px 12px 24px 0px #484F7014;
    background-color: var(--color-cream);
}

.fifty-text-form-two p {
    text-align: center;
}


/* Tablet and mobile */

@media only screen and (max-width: 1000px) {

    .fifty-text-form-two {
        padding: 1em;
    }

	.fifty-text-form {
		padding: 3em 0;
        gap: 1em;
	}

	.fifty-text-form__inner {
		grid-template-columns: 1fr;
		grid-column: 2 / 16;
		gap: 3em;
	}

	.fifty-text-form__content {
		justify-items: center;
		text-align: center;
	}

	.fifty-text-form__image-wrapper {
		min-height: clamp(320px, 65vw, 550px);
	}
}

@media only screen and (max-width: 600px) {

	.fifty-text-form__inner {
		gap: 2em;
	}

	.fifty-text-form__image-wrapper {
		min-height: 320px;
	}
}








/* TEXT IMAGE FLOATING ADVERTS */

.text-image-with-floating-adverts {
    padding: 5em 0;
    background-color: var(--color-cream);
}

.text-image-with-floating-adverts__inner {
    display: grid;
    grid-column: 2/16;
    gap: 1em;
}

.text-image-with-floating-adverts__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2em;
}

.text-image-with-floating-adverts__content-item {
    display: grid;
    align-content: center;
    gap: 1em;
}

.text-image-with-floating-adverts__content-item span {
    display: flex;
    gap: 1em;
    flex-wrap: wrap;
    align-items: center;
    padding: 1em 0;
}

.text-image-with-floating-adverts__content-item p span strong {
    font-weight: 500;
}

.text-image-with-floating-adverts__image-wrapper {
    position: relative;
    max-height: 470px;
}

.text-image-with-floating-adverts__image {
    border-radius: 6px;
    height: 100%;
    object-fit: cover;
}

.text-image-with-floating-adverts__advert {
    position: absolute;
    background-color: #fff;
    border-radius: 6px;
    padding: 1em;
    display: grid;
    gap: 1em;
    box-shadow: 0px 10px 24px 0px #484F7014;
}

.text-image-with-floating-adverts__advert p {
    line-height: 1.3;
}

.text-image-with-floating-adverts__advert:first-child {
    bottom: -3em;
    left: 0;
    max-width: 312px;
}

.text-image-with-floating-adverts__advert:last-child {
    bottom: -1em;
    right: 2em;
    max-width: 252px;
}


@media only screen and (max-width: 1000px) {

    .text-image-with-floating-adverts__content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .text-image-with-floating-adverts__content-item span {
        justify-content: center;
    }

}


@media only screen and (max-width: 700px) {

    .text-image-with-floating-adverts {
        padding: 2em 0;
    }

    .text-image-with-floating-adverts__adverts {
        position: relative;
        display: grid;
        gap: 1em;
        padding-top: 1em;
    }

    .text-image-with-floating-adverts__advert {
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        position: relative !important;
    }

    .text-image-with-floating-adverts__image-wrapper {
        max-height: 100%;
    }

    .text-image-with-floating-adverts__image {
        height: auto;
    }
}



























/* TEXT IMAGE WITH FOUR FLOATING */

.text-image-with-four-floating {
	padding: 5em 0;
	overflow: hidden;
	background-color: var(--color-cream);
    row-gap: 3em;
}

.text-image-with-four-floating__header {
	display: grid;
	grid-column: 2 / 16;
	justify-self: center;
	gap: 1em;
	text-align: center;
    max-width: 680px;
}

.text-image-with-four-floating__inner {
	display: grid;
	grid-column: 2 / 16;
	gap: 3em;
}

.text-image-with-four-floating__stage {
	position: relative;
	width: min(100%, 420px);
	min-height: 430px;
	margin: 0 auto;
}

.text-image-with-four-floating__image-wrapper {
	position: relative;
	width: 100%;
	height: 430px;
	overflow: hidden;
	border-radius: 6px;
}

.text-image-with-four-floating__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.text-image-with-four-floating__item {
	position: absolute;
	z-index: 2;
	display: grid;
	align-content: center;
	min-width: 220px;
	width: 100%;
	min-height: 135px;
	padding: 1.5em;
	box-sizing: border-box;
	background-color: #ffffff;
	border-radius: 6px;
    box-shadow: 0px 10px 24px 0px #484F7014;

}

.text-image-with-four-floating__item > :first-child {
	margin-top: 0;
}

.text-image-with-four-floating__item > :last-child {
	margin-bottom: 0;
}

.text-image-with-four-floating__item--1 {
	top: 1em;
	right: calc(100% + 3em);
}

.text-image-with-four-floating__item--2 {
	right: calc(100% + 3em);
	bottom: 1em;
}

.text-image-with-four-floating__item--3 {
	top: 1em;
	left: calc(100% + 3em);
}

.text-image-with-four-floating__item--4 {
	bottom: 1em;
	left: calc(100% + 3em);
}

.text-image-with-four-floating__item--1,
.text-image-with-four-floating__item--4 {
	background-color: var(--color-light-pink);
}

.text-image-with-four-floating__bottom-bar {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	padding: 1em 1.5em;
	background-color: var(--color-dark-blue);
	border-radius: 6px;
}

.text-image-with-four-floating__bottom-bar-item {
	position: relative;
	display: grid;
	align-content: center;
	justify-items: center;
	min-height: 50px;
	padding: 0.25em 1.5em;
	text-align: center;
}

.text-image-with-four-floating__bottom-bar-item:not(:first-child)::before {
	content: "";
	position: absolute;
	top: 10%;
	bottom: 10%;
	left: 0;
	width: 1px;
	background-color: rgba(255, 255, 255, 0.2);
}

.text-image-with-four-floating__bottom-bar-item,
.text-image-with-four-floating__bottom-bar-item * {
	color: var(--color-white);
}


@media only screen and (max-width: 1100px) {

	.text-image-with-four-floating {
		padding: 2em 0;
		overflow: visible;
        row-gap: 1em;
	}

	.text-image-with-four-floating__inner {
		gap: 2.5em;
	}

	.text-image-with-four-floating__stage {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1em;
		width: 100%;
		max-width: 760px;
		min-height: 0;
	}

	.text-image-with-four-floating__image-wrapper {
		grid-column: 1 / -1;
		width: min(100%, 420px);
		height: 430px;
		margin: 0 auto 1em;
	}

	.text-image-with-four-floating__item {
		position: static;
		width: auto;
		min-height: 135px;
	}

	.text-image-with-four-floating__bottom-bar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.text-image-with-four-floating__bottom-bar-item:nth-child(odd)::before {
		display: none;
	}

	.text-image-with-four-floating__bottom-bar-item:nth-child(n + 3) {
		border-top: 1px solid rgba(255, 255, 255, 0.2);
	}
}

@media only screen and (max-width: 600px) {

	.text-image-with-four-floating {
		padding: 3em 0;
	}

	.text-image-with-four-floating__header,
	.text-image-with-four-floating__inner {
		grid-column: 2 / 16;
	}

	.text-image-with-four-floating__inner {
		gap: 2em;
	}

	.text-image-with-four-floating__stage {
		grid-template-columns: 1fr;
	}

	.text-image-with-four-floating__image-wrapper {
		grid-column: auto;
		height: clamp(340px, 100vw, 430px);
	}

	.text-image-with-four-floating__item {
		text-align: center;
	}

	.text-image-with-four-floating__bottom-bar {
		grid-template-columns: 1fr;
		padding: 0.75em 1.25em;
	}

	.text-image-with-four-floating__bottom-bar-item {
		min-height: auto;
		padding: 1em 0;
	}

	.text-image-with-four-floating__bottom-bar-item:not(:first-child)::before {
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
		display: block;
		width: auto;
		height: 1px;
	}

	.text-image-with-four-floating__bottom-bar-item:nth-child(n + 3) {
		border-top: 0;
	}
}

















/* IMAGE WITH FOUR FLOATATING BOXES AND CENTRED CTA */

.image-with-four-floating-boxes-centred-cta {
	padding: 5em 0;
	overflow: hidden;
	background-color: var(--color-blue);
	row-gap: 3em;    
}

/* Header */

.image-with-four-floating-boxes-centred-cta__header {
	display: grid;
	grid-column: 2 / 16;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 2em;
    border-top: 1px solid #6E7498;
    padding-top: 1em;
}

.image-with-four-floating-boxes-centred-cta__header-title,
.image-with-four-floating-boxes-centred-cta__header-content {
    display: grid;
    gap: 1em;
}

.image-with-four-floating-boxes-centred-cta__header h2 {
    color: var(--color-white);
    max-width: 520px;
}

.image-with-four-floating-boxes-centred-cta__header-content * {
    color: #E9E9F4;
    max-width: 520px;
}

.image-with-four-floating-boxes-centred-cta__header-content {
    justify-self: end;
}

.image-with-four-floating-boxes-centred-cta__inner {
	display: grid;
	grid-column: 2 / 16;
	gap: 3em;
    background-color: var(--color-dark-blue);
    padding: 4em 2em;
    border-radius: 6px;
}

.image-with-four-floating-boxes-centred-cta__stage {
	position: relative;
	width: min(100%, 416px);
	min-height: 378px;
	margin: 0 auto;
    display: grid;
    gap: 2em;
}

.image-with-four-floating-boxes-centred-cta__image-wrapper {
	position: relative;
	width: 100%;
	height: 430px;
	overflow: hidden;
	border-radius: 6px;
}

.image-with-four-floating-boxes-centred-cta__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.image-with-four-floating-boxes-centred-cta__box {
	position: absolute;
	z-index: 2;
	display: grid;
	align-content: center;
	width: 220px;
	min-height: 135px;
	padding: 1.5em;
	box-sizing: border-box;
	background-color: #ffffff;
	border-radius: 6px;
	box-shadow: 0 10px 24px 0 #484f7014;
}

.image-with-four-floating-boxes-centred-cta__box > :first-child {
	margin-top: 0;
}

.image-with-four-floating-boxes-centred-cta__box > :last-child {
	margin-bottom: 0;
}

.image-with-four-floating-boxes-centred-cta__box--1 {
	top: 0;
	right: calc(100% + 3em);
}

.image-with-four-floating-boxes-centred-cta__box--2 {
	right: calc(100% + 3em);
	bottom: 0;
}

.image-with-four-floating-boxes-centred-cta__box--3 {
	top: 0;
	left: calc(100% + 3em);
}

.image-with-four-floating-boxes-centred-cta__box--4 {
	bottom: 0;
	left: calc(100% + 3em);
}

.image-with-four-floating-boxes-centred-cta__box--1,
.image-with-four-floating-boxes-centred-cta__box--4 {
	background-color: var(--color-light-pink);
}

.image-with-four-floating-boxes-centred-cta__centred-cta {
	display: grid;
	padding: 1em 1.5em;
	background-color: #484F70;
	border-radius: 6px;
}

.image-with-four-floating-boxes-centred-cta__centred-cta p {
      font-family: "Playfair Display", serif;
      font-size: 34px;
      color: #fff;
      text-align: center;
      line-height: 42px;
}


@media only screen and (max-width: 1100px) {

	.image-with-four-floating-boxes-centred-cta {
		padding: 2em 0;
		overflow: visible;
		row-gap: 1em;
	}

	.image-with-four-floating-boxes-centred-cta__inner {
		gap: 2.5em;
	}

	.image-with-four-floating-boxes-centred-cta__stage {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1em;
		width: 100%;
		max-width: 760px;
		min-height: 0;
	}

	.image-with-four-floating-boxes-centred-cta__image-wrapper {
		grid-column: 1 / -1;
		width: min(100%, 420px);
		height: 430px;
		margin: 0 auto 1em;
	}

	.image-with-four-floating-boxes-centred-cta__box {
		position: static;
		width: auto;
		min-height: 135px;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta {
		grid-column: span 2;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta-item:nth-child(odd)::before {
		display: none;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta-item:nth-child(n + 3) {
		border-top: 1px solid rgba(255, 255, 255, 0.2);
	}

    .image-with-four-floating-boxes-centred-cta__header {
        grid-template-columns: 1fr;
        text-align: center;
        justify-items: center;
    }

    .image-with-four-floating-boxes-centred-cta__header-content {
        justify-self: center;
    }
}

@media only screen and (max-width: 600px) {

	.image-with-four-floating-boxes-centred-cta {
		padding: 3em 0;
	}

	.image-with-four-floating-boxes-centred-cta__header,
	.image-with-four-floating-boxes-centred-cta__inner {
		grid-column: 2 / 16;
		gap: 2em;
        padding: 1em;
	}

	.image-with-four-floating-boxes-centred-cta__stage {
		grid-template-columns: 1fr;
	}

	.image-with-four-floating-boxes-centred-cta__image-wrapper {
		grid-column: auto;
		height: clamp(340px, 100vw, 430px);
	}

	.image-with-four-floating-boxes-centred-cta__box {
		text-align: center;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta {
		grid-template-columns: 1fr;
		padding: 0.75em 1.25em;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta-item {
		min-height: auto;
		padding: 1em 0;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta-item:not(:first-child)::before {
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
		display: block;
		width: auto;
		height: 1px;
	}

	.image-with-four-floating-boxes-centred-cta__centred-cta-item:nth-child(n + 3) {
		border-top: 0;
	}

    .image-with-four-floating-boxes-centred-cta__centred-cta {
		grid-column: span 1;
	}
}
















/* FIFTY TEXT INFO GRID */

.fifty-text-info-grid {
	position: relative;
	padding: 5em 0;
	background-color: var(--color-light-cream);
}

.fifty-text-info-grid__inner {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	gap: 4em;
    border-top: 1px solid #E8E4DD;
    padding-top: 2em;
}

.fifty-text-info-grid__column {
	display: grid;
	align-content: start;
	gap: 2em;
	min-width: 0;
}

.fifty-text-info-grid__header {
	display: grid;
	align-content: start;
	gap: 1em;
}

.fifty-text-info-grid__header ul {
	display: grid;
	gap: 1em;
	margin: 1.5em 0 0;
	padding: 0;
}

.fifty-text-info-grid__header ul li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: start;
	gap: 0.75em;
	list-style: none;
}

.fifty-text-info-grid__header ul li::before {
	content: "\f00c";
	color: var(--color-red);
	font-family: "Font Awesome 6 Pro";
	font-size: 1em;
	font-weight: 900;
}

.fifty-text-info-grid__white-box {
	display: grid;
	align-content: center;
	gap: 1em;
	padding: 2em;
	background-color: var(--color-white);
	border-radius: 6px;
	box-shadow: 0 10px 30px rgba(72, 79, 112, 0.1);
    text-align: center;
}

.fifty-text-info-grid__white-box p {
    font-family: "Playfair Display", serif;
    font-size: 38px;
    line-height: 1;
}

.fifty-text-info-grid__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	align-content: start;
	gap: 2em;
}

.fifty-text-info-grid__info-box {
	display: grid;
	align-content: start;
	justify-items: center;
	gap: 1em;
	/* min-height: 170px; */
	padding: 2em;
	background-color: #F8F4F0;
	border-radius: 6px;
}

.fifty-text-info-grid__info-box label {
	color: var(--color-blue);
	font-size: 17px;
	line-height: 1;
    text-transform: none;
    letter-spacing: 0;
}

.fifty-text-info-grid__info-box label::before {
	content: "\e404";
	display: inline-block;
	margin-right: 0.5em;
	color: var(--color-red);
	font-family: "Font Awesome 6 Pro";
	font-size: 1.5em;
	font-weight: 900;
	line-height: 1;
}

.fifty-text-info-grid__pink-box {
	display: grid;
	align-content: center;
	gap: 1em;
	padding: 2em;
	background-color: var(--color-light-pink);
	border-radius: 6px;
    text-align: center;
}

@media only screen and (max-width: 1115px) {

	.fifty-text-info-grid {
		padding: 4em 0;
	}

	.fifty-text-info-grid__inner {
		grid-template-columns: 1fr;
		gap: 3em;
	}

	.fifty-text-info-grid__header {
		justify-items: center;
		text-align: center;
	}

	.fifty-text-info-grid__header ul {
		width: min(100%, 650px);
		text-align: left;
	}

	.fifty-text-info-grid__white-box,
	.fifty-text-info-grid__pink-box {
		text-align: center;
	}
}

@media only screen and (max-width: 650px) {

	.fifty-text-info-grid {
		padding: 3em 0;
	}

	.fifty-text-info-grid__inner {
		gap: 2em;
	}

	.fifty-text-info-grid__column {
		gap: 1.5em;
	}

	.fifty-text-info-grid__grid {
		grid-template-columns: 1fr;
	}

	.fifty-text-info-grid__white-box,
	.fifty-text-info-grid__info-box,
	.fifty-text-info-grid__pink-box {
		padding: 1.5em;
	}

	.fifty-text-info-grid__info-box {
		min-height: 0;
	}
}











/* STYLE BOXES */

.style-boxes {
	position: relative;
	padding: 5em 0;
	background-color: var(--color-light-cream);
	row-gap: 3em;
}

.top-line-styles {
    margin: 0;
}

.style-boxes__header {
	display: grid;
	grid-column: 2 / 16;
	justify-self: center;
	justify-items: center;
	gap: 1em;
	width: 100%;
	max-width: 700px;
	text-align: center;
}

.style-boxes__grid {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	align-items: stretch;
	gap: 3em;
    padding: 4em 2em;
    background-color: #F7F4F0;
    border-radius: 6px;
}

.style-boxes__box {
	display: grid;
	grid-template-rows: auto 1fr;
	min-width: 0;
	overflow: hidden;
	background-color: var(--color-white);
	border-radius: 6px;
	box-shadow: 0px 10px 24px 0px #484F7014;
}

.coloured-box {
    height: 78px;
    border-radius: 6x 6px 0 0;
}

.style-boxes__image-wrapper {
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	max-height: 102px;
}

.style-boxes__image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: transform 0.4s ease;
}

.style-boxes__box--2 .coloured-box,
.style-boxes__box--4 .coloured-box {
    background-color: var(--color-light-cream);
}

.style-boxes__box--1 .coloured-box,
.style-boxes__box--3 .coloured-box {
    background-color: var(--color-light-pink);
}

.style-boxes__content {
	display: grid;
	align-content: start;
	gap: 0.75em;
	padding: 2em;
}

.style-boxes__content h3 {
    font-family: "Inter", sans-serif;
    font-weight: 600;
    font-size: 20px;
}

.style-boxes__bottom-bar {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr));
	align-items: start;
	padding: 2em;
	background-color: var(--color-dark-blue);
	border-radius: 6px;
}

.style-boxes__bottom-bar-content {
	position: relative;
	display: grid;
	align-content: start;
	gap: 0.35em;
	min-width: 0;
	padding: 0 1.75em;
	text-align: left;
}

.style-boxes__bottom-bar-content:first-child {
	padding-left: 0;
}


.style-boxes__bottom-bar-content:last-child {
	padding-right: 0;
}

.style-boxes__bottom-bar-content:not(:first-child)::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 1px;
	background-color: rgba(255, 255, 255, 0.2);
}

.style-boxes__bottom-bar-content,
.style-boxes__bottom-bar-content * {
	color: var(--color-white);
}

.style-boxes__bottom-bar-content h3 {
	font-family: "Inter", sans-serif;
	font-size: 16px;
	font-weight: 600;
}

.style-boxes__bottom-bar-content p {
	font-size: 13px;
	line-height: 1.45;
}

.style-boxes__bottom-bar-content label {
	font-size: 11.5px;
}

@media only screen and (max-width: 1000px) {

	.style-boxes {
		padding: 4em 0;
		row-gap: 2.5em;
	}

	.style-boxes__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.style-boxes__content {
		padding: 1.5em;
	}

	.style-boxes__bottom-bar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding: 1.5em;
	}

	.style-boxes__bottom-bar-content {
		padding: 1.5em;
	}

	.style-boxes__bottom-bar-content:first-child {
		padding-left: 1.5em;
	}

	.style-boxes__bottom-bar-content:last-child {
		padding-right: 1.5em;
	}

	.style-boxes__bottom-bar-content:nth-child(odd)::before {
		display: none;
	}

	.style-boxes__bottom-bar-content:nth-child(n + 3) {
		border-top: 1px solid rgba(255, 255, 255, 0.2);
	}
}

@media only screen and (max-width: 650px) {

	.style-boxes {
		padding: 3em 0;
		row-gap: 2em;
	}

	.style-boxes__header,
	.style-boxes__grid,
	.style-boxes__bottom-bar {
		grid-column: 2 / 16;
	}

	.style-boxes__grid {
		grid-template-columns: 1fr;
	}

	.style-boxes__image-wrapper {
		aspect-ratio: 16 / 10;
	}

	.style-boxes__content {
		padding: 1.5em;
		text-align: center;
	}

	.style-boxes__bottom-bar {
		grid-template-columns: 1fr;
		padding: 1.5em;
	}

	.style-boxes__bottom-bar-content {
		padding: 1.25em 0;
	}

	.style-boxes__bottom-bar-content:first-child {
		padding: 0 0 1.25em;
	}

	.style-boxes__bottom-bar-content:last-child {
		padding-right: 0;
		padding-bottom: 0;
	}

	.style-boxes__bottom-bar-content:not(:first-child)::before {
		top: 0;
		right: 0;
		bottom: auto;
		left: 0;
		display: block;
		width: auto;
		height: 1px;
	}

	.style-boxes__bottom-bar-content:nth-child(n + 3) {
		border-top: 0;
	}
}











.fifty-text-tabs-image-floating-content {
	padding: 5em 0;
    background-color: var(--color-light-cream);
}

.fifty-text-tabs-image-floating-content__inner {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-column: 2 / 16;
	gap: 4em;
    border-top: 1px solid #E3DDD2;
    padding-top: 2em;
}

.slashes-tabs {
    justify-self: start;
    padding: 0;
}

.fifty-text-tabs-image-floating-content__content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2em;
	padding-bottom: 2em;
}

.fifty-text-tabs-image-floating-content__main-content {
	display: grid;
	gap: 1em;
}

.fifty-text-tabs-image-floating-white-box {
    background-color: #fff;
    padding: 2em;
    border-radius: 6px;
    grid-column: 1 / -1;
    box-shadow: 0px 14px 36px 0px #2C324B14;
}

/* Content tabs and links */

.fifty-text-tabs-image-floating-content__content {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-content: center;
	column-gap: 1rem;
	row-gap: 1rem;
	padding-bottom: 2em;
}

.fifty-text-tabs-image-floating-content__main-content {
	display: grid;
	grid-column: 1 / -1;
	gap: 1em;
	margin-bottom: 1rem;
}

.fifty-text-tabs-image-floating-content__links,
.fifty-text-tabs-image-floating-content__tabs {
	display: contents;
}

.fifty-text-tabs-image-floating-content__links a,
.fifty-text-tabs-image-floating-content__tab {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-width: 0;
	min-height: 46px;
	margin: 0;
	padding: 0.65rem 1rem;
	box-sizing: border-box;
	border: 1px solid #ded9d3;
	border-radius: 999px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
    background-color: #fff;
    box-shadow: 0px 10px 20px 0px #2C324B0D;
}

.fifty-text-tabs-image-floating-content__links .red-button {
    color: #fff;
    background-color: var(--color-red);
}

/* Image */

.fifty-text-tabs-image-floating-content__image-wrapper {
	position: relative;
	min-width: 0;
	min-height: 0;
	border-radius: 6px;
}

.fifty-text-tabs-image-floating-content__image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
    border-radius: 6px;
}

.fifty-text-tabs-image-floating-content__floating-content {
	position: absolute;
	left: 2rem;
	bottom: -1rem;
	z-index: 2;
	width: 360px;
	max-width: calc(100% - 2rem);
	padding: 1rem 1.25rem;
	background-color: #ffffff;
	border-radius: 5px;
	box-shadow: 0px 10px 20px 0px #2C324B0D;
}


@media only screen and (max-width: 1100px) {

	.fifty-text-tabs-image-floating-content {
		padding: 4rem 0 6rem;
	}

	.fifty-text-tabs-image-floating-content__inner {
		grid-template-columns: 1fr;
		gap: 3rem;
	}

	.fifty-text-tabs-image-floating-content__image-wrapper {
		min-height: clamp(420px, 65vw, 650px);
	}
}


@media only screen and (max-width: 700px) {

    .slashes-tabs {
        justify-self: center;
    }

	.fifty-text-tabs-image-floating-content {
		padding: 3rem 0;
	}

	.fifty-text-tabs-image-floating-content__inner {
		grid-column: 2 / 16;
	}

	.fifty-text-tabs-image-floating-content__content {
		align-items: center;
		text-align: center;
	}

	.fifty-text-tabs-image-floating-content__tabs,
	.fifty-text-tabs-image-floating-content__links {
		justify-content: center;
	}

	.fifty-text-tabs-image-floating-content__image-wrapper {
		width: 100%;
		min-height: 380px;
	}

	.fifty-text-tabs-image-floating-content__floating-content {
		right: 1rem;
		bottom: 1rem;
		width: auto;
		max-width: calc(100% - 2rem);
	}
}













/* Contact Info Grid */

.truestyle-contact-info-grid {
	position: relative;
	padding: 5rem 0;
}


.contact-slash {
    padding: 0;
}


.truestyle-contact-info-grid__inner {
	display: grid;
	grid-column: 2 / 16;
	gap: 3rem;
}

.truestyle-contact-info-grid__header {
	display: grid;
	gap: 1rem;
	max-width: 540px;
    text-align: center;
    justify-self: center;
}

.truestyle-contact-info-grid__items {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
    justify-content: center;
    background-color: #F7F4F0;
    padding: 4em 2em;
    border-radius: 6px;
    border: 1px solid #E3DDD2;
}

.truestyle-contact-info-grid__item {
	padding: 2rem;
	background-color: #ffffff;
	border: 1px solid #e3ddd2;
	border-radius: 6px;
    max-width: 340px;
    display: grid;
    gap: 1em;
    align-content: start;
}

.truestyle-contact-info-grid__item h3 {
    font-size: 28px;
}

.truestyle-contact-info-grid__item p label {
    line-height: 1;
}



@media only screen and (max-width: 900px) {

	.truestyle-contact-info-grid__items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media only screen and (max-width: 600px) {

	.truestyle-contact-info-grid {
		padding: 3rem 0;
	}

	.truestyle-contact-info-grid__items {
		grid-template-columns: 1fr;
        padding: 1em;
	}
}







/* Contact Text Form  */

.contact-text-form {
	padding: 5em 0;
    background-color: var(--color-cream);
}

/* Main layout */

.contact-text-form__inner {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: 40% minmax(0, 1fr);
	gap: 4em;
}


/* Left content column */

.contact-text-form__content-column {
	display: grid;
	align-content: start;
	gap: 2em;
}

.contact-text-form__content {
	display: grid;
	align-content: start;
	gap: 1em;
}

.slash-contact {
    justify-content: start;
}


/* Content tabs */

.contact-text-form__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.contact-text-form__tab {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.65rem 1rem;
	background-color: var(--color-white);
	border: 1px solid #ded9d3;
	border-radius: 999px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
}


/* White content box */

.contact-text-form__white-box h3 {
	font-size: 34px;
}

.contact-text-form__white-box {
	display: grid;
	gap: 1em;
	padding: 1.5em;
	background-color: var(--color-white);
	border-radius: 6px;
	box-shadow: 0px 14px 36px 0px #2C324B14;
}

.contact-text-form__white-box ul {
	display: grid;
	gap: 0.5em;
	margin: 0.5em 0;
	padding-left: 1.25em;
}

.contact-text-form__white-box ul li {
	list-style-type: disc;
    line-height: 1.2;
}

.contact-text-form__white-box ul li::marker {
	color: var(--color-red);
}



/* Form */

.contact-text-form__form {
	display: grid;
	align-content: start;
	min-width: 0;
	padding: 2em;
	border-radius: 6px;
	box-shadow: 0px 14px 36px 0px #2C324B14;
    background: #fff;
}

.contact-text-form__form p {
	text-align: center;
}

.contact-text-form__form--empty {
	align-content: center;
	min-height: 300px;
}


/* Tablet and mobile */

@media only screen and (max-width: 1000px) {

	.contact-text-form {
		padding: 3em 0;
		gap: 1em;
	}

	.contact-text-form__inner {
		grid-template-columns: 1fr;
		grid-column: 2 / 16;
		gap: 3em;
	}

	.contact-text-form__content-column {
		justify-items: center;
		text-align: center;
	}

	.contact-text-form__content {
		justify-items: center;
		text-align: center;
	}

	.contact-text-form__content ul {
		text-align: left;
	}

	.contact-text-form__tabs {
		justify-content: center;
	}

	.contact-text-form__white-box {
		width: 100%;
	}

	.contact-text-form__form {
		width: 100%;
		padding: 1em;
	}

    .contact-text-form__white-box ul {
        justify-items: center;
    }
}


@media only screen and (max-width: 600px) {

	.contact-text-form {
		padding: 3em 0;
	}

	.contact-text-form__header,
	.contact-text-form__inner {
		grid-column: 2 / 16;
	}

	.contact-text-form__inner {
		gap: 2em;
	}

	.contact-text-form__content h3 {
		font-size: 34px;
	}

	.contact-text-form__tabs {
		display: grid;
		grid-template-columns: 1fr;
		width: 100%;
	}

	.contact-text-form__tab {
		width: 100%;
	}

	.contact-text-form__white-box {
		padding: 1.25em;
	}
}














/* Contact Map Text */

.contact-map-text {
	padding: 5em 0;
	gap: 2em;
}


/* Header */

.contact-map-text__header {
	display: grid;
	grid-column: 2 / 16;
	max-width: 500px;
	gap: 1em;
}

.contact-map-text__header-content {
	display: grid;
	gap: 1em;
}


/* Main layout */

.contact-map-text__inner {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: 1fr 40%;
	align-items: start;
	gap: 4em;
}




/* Google map */

.contact-map {
	display: grid;
	gap: 1.5em;
    height: 100%;
    border: 1px solid #E3DDD2;
    box-shadow: 0px 10px 20px 0px #2C324B0D;
    border-radius: 6px;
	width: 100%;
	min-height: 500px;
	position: relative;
}

.contact-map .acf-map {
	width: 100%;
	height: 100%;
	min-height: 500px;
	background-color: #eee;
}

.contact-map .acf-map img {
	max-width: inherit !important;
}

.contact-map__google-link {
	position: absolute;
    left: 50%;
    bottom: 1em;
    background-color: #fff;
    border-radius: 50px;
    padding: 1em 2em;
    transform: translate(-50%);
	box-shadow: 0px 10px 20px 0px #2C324B0D;
	text-align: center;
}

.contact-map-text__image-wrapper {
	width: 100%;
	max-height: 320px;
	border-radius: 6px;
}

.contact-map-text__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
    border-radius: 6px;
}

.contact-map-text__content-column {
	display: grid;
	align-content: start;
	gap: 2em;
	min-width: 0;
}


.contact-map-text__white-box {
	display: grid;
	gap: 1.5em;
	padding: 2em;
	background-color: var(--color-white);
	border-radius: 6px;
	box-shadow: 0px 14px 36px 0px #2C324B14;
}

.contact-map-text__white-box-title {
	display: grid;
	gap: 0.5em;
    font-weight: 700;
}

.contact-map-text__white-box-items {
	display: grid;
    grid-template-columns: 1fr 1fr;
	gap: 2em;
}

.contact-map-text__white-box-item {
	display: grid;
	gap: 0.5em;
}

.contact-map-text__social-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
    padding-top: 1em;
}

.contact-map-text__social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.65rem 1.5rem;
	color: var(--color-blue);
	font-weight: 600;
	text-align: center;
	background-color: var(--color-white);
	border: 1px solid #E3DDD2;
	border-radius: 999px;	
}

@media only screen and (max-width: 1000px) {

	.contact-map-text {
		padding: 3em 0;
		gap: 1em;
	}

	.contact-map-text__inner {
		grid-template-columns: 1fr;
		grid-column: 2 / 16;
		gap: 3em;
	}

	.contact-map-text__content-column {
		justify-items: center;
		text-align: center;
	}

	.contact-map-text__content {
		justify-items: center;
		text-align: center;
	}

	.contact-map-text__content ul {
		text-align: left;
	}

	.contact-map {
		width: 100%;
	}

	.contact-map-text__map {
		min-height: clamp(350px, 60vw, 550px);
	}

	.contact-map-text__image-wrapper {
		min-height: clamp(320px, 60vw, 500px);
	}

	.contact-map-text__white-box {
		width: 100%;
		text-align: left;
	}

	.contact-map-text__social-links {
		justify-content: center;
	}
}

@media only screen and (max-width: 600px) {

	.contact-map-text {
		padding: 3em 0;
	}

	.contact-map-text__header {
		text-align: center;
	}

    .slash-contact {
        justify-self: center;
    }

	.contact-map-text__inner {
		gap: 2em;
	}

	.contact-map-text__content h3 {
		font-size: 34px;
	}

	.contact-map-text__map {
		min-height: 320px;
	}

	.contact-map-text__image-wrapper {
		min-height: 320px;
	}

	.contact-map-text__white-box {
		padding: 1.5em;
        text-align: center;
	}

	.contact-map-text__social-links {
		display: grid;
		grid-template-columns: 1fr;
		width: 100%;
	}

	.contact-map-text__social-link {
		width: 100%;
	}

    .contact-map-text__white-box-items {
        grid-template-columns: 1fr;
    }
}















/* Numbered Info */

.truestyle-numbered-info {
	padding: 5rem 0;
    background-color: var(--color-cream);
}

.truestyle-numbered-info__inner {
	display: grid;
	grid-column: 2 / 16;
	gap: 3rem;
}

.truestyle-numbered-info__header {
	display: grid;
	justify-self: center;
	width: 100%;
	max-width: 540px;
	gap: 1rem;
	text-align: center;
}

.truestyle-numbered-info__header-content {
	display: grid;
	gap: 1rem;
}

.truestyle-numbered-info__items {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	gap: 1rem;
	padding: 4em 2em;
	border-radius: 6px;
    background-color: var(--color-white);
    box-shadow: 0px 10px 20px 0px #2C324B0D;
}

.truestyle-numbered-info__item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-content: start;
	width: 100%;
	max-width: 340px;
	gap: 1em;
	padding: 2rem;
	border-radius: 6px;
}

.truestyle-numbered-info__number {
	color: var(--color-red);
	font-family: "Playfair Display", serif;
	font-size: 2em;
	font-weight: 500;
	line-height: 1;
}

.truestyle-numbered-info__content {
	display: grid;
	align-content: start;
	gap: 1em;
	min-width: 0;
}

.truestyle-numbered-info__content p {
    display: grid;
    gap: 1em;
    align-items: start;
}

.truestyle-numbered-info__empty {
	padding: 2rem;
	text-align: center;
	background-color: #f7f4f0;
	border: 1px dashed #e3ddd2;
	border-radius: 6px;
}


@media only screen and (max-width: 900px) {

	.truestyle-numbered-info__items {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.truestyle-numbered-info__item {
		max-width: none;
	}
}

@media only screen and (max-width: 600px) {

	.truestyle-numbered-info {
		padding: 3rem 0;
	}

	.truestyle-numbered-info__inner {
		gap: 2rem;
	}

	.truestyle-numbered-info__items {
		grid-template-columns: 1fr;
		padding: 1em;
	}

	.truestyle-numbered-info__item {
		padding: 1.5rem;
        text-align: center;
	}

	.truestyle-numbered-info__content h3 {
		font-size: 24px;
	}
}













/* BLOG Page */

.resources-archive {
	display: grid;
	padding: 2rem 0 6rem;
	background-color: var(--color-cream)
}

.resources-archive__top-line {
    display: grid;
	grid-column: 2 / 16;
}

.resources-archive__hero {
	display: grid;
	grid-column: 2 / 16;
	grid-template-columns: minmax(200px, 250px) minmax(0, 1fr);
	align-items: start;
	gap: clamp(2rem, 4vw, 4rem);
	padding-bottom: 6rem;
}

.resources-archive__sidebar {
	display: grid;
	align-content: start;
	gap: 3rem;
	min-width: 0;
}

.resources-archive__introduction {
	display: grid;
	gap: 1rem;
}

.resources-archive__slashes {
	padding: 0;
	margin-bottom: 0.25rem;
}

.resources-archive__eyebrow {
	margin: 0;
	color: var(--color-red);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.28em;
	line-height: 1.3;
	text-transform: uppercase;
}

.resources-archive__title {
	margin: 0.4rem 0 1rem;
	color: var(--color-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(48px, 5vw, 68px);
	font-weight: 500;
	line-height: 0.98;
}

.resources-archive__description {
	display: grid;
	gap: 0.75rem;
	color: #626a85;
	font-size: 15px;
	line-height: 1.65;
}

.resources-archive__description p {
	margin: 0;
}

.resources-archive__topics {
	padding: 1.6rem;
	background-color: #ffffff;
	border: 1px solid rgba(227, 221, 210, 0.7);
	border-radius: 18px;
	box-shadow: 0 16px 35px rgba(48, 52, 73, 0.05);
}

.resources-archive__topics-title {
	margin: 0;
	color: var(--color-blue);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

.resources-archive__topics-line {
	margin: 0.9rem 0 1rem;
	border-top: 1px solid #e3ddd2;
}

.resources-archive__topics-list {
	display: grid;
	gap: 0.9rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.resources-archive__topic {
	margin: 0;
}

.resources-archive__topic-link {
	display: grid;
	gap: 0.2rem;
	color: inherit;
	text-decoration: none;
}

.resources-archive__topic-name {
	color: var(--color-blue);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	transition: color 0.2s ease;
}

.resources-archive__topic-description {
	color: #69718a;
	font-size: 12px;
	line-height: 1.55;
}

.resources-archive__topic-link:hover .resources-archive__topic-name,
.resources-archive__topic-link:focus .resources-archive__topic-name,
.resources-archive__topic--active .resources-archive__topic-name {
	color: var(--color-red);
}

.resources-archive__featured {
	position: relative;
	min-width: 0;
	padding-bottom: 4.5rem;
}

.resources-archive__featured-image-link {
	position: relative;
	display: block;
	width: 100%;
	min-height: 490px;
	overflow: hidden;
	border-radius: 24px;
	background-color: #e6e3de;
}

.resources-archive__featured-image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.5s ease;
}

.resources-archive__featured-image-link:hover
	.resources-archive__featured-image {
	transform: scale(1.025);
}

.resources-archive__featured-placeholder {
	position: absolute;
	inset: 0;
	background-color: #e6e3de;
}

.resources-archive__featured-card {
	position: absolute;
	left: 2rem;
	bottom: 0;
	z-index: 2;
	display: grid;
	width: min(430px, calc(100% - 4rem));
	gap: 0.8rem;
	padding: 2rem 2.1rem;
	background-color: #ffffff;
	border: 1px solid rgba(227, 221, 210, 0.55);
	border-radius: 20px;
	box-shadow: 0 18px 40px rgba(48, 52, 73, 0.12);
}

.resources-archive__featured-label {
	margin: 0;
	color: var(--color-red);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.28em;
	text-transform: uppercase;
}

.resources-archive__featured-title {
	margin: 0;
	font-family: "Playfair Display", serif;
	font-size: clamp(34px, 3.5vw, 46px);
	font-weight: 500;
	line-height: 0.98;
}

.resources-archive__featured-title a {
	color: var(--color-blue);
	text-decoration: none;
}

.resources-archive__featured-excerpt {
	color: #626a85;
	font-size: 14px;
	line-height: 1.55;
}

.resources-archive__featured-excerpt p {
	margin: 0;
}

.resources-archive__featured-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 0.25rem;
}

.resources-archive__featured-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
	color: #626a85;
	font-size: 11px;
	line-height: 1.4;
}

.resources-archive__featured-button {
	flex: 0 0 auto;
	margin: 0;
	white-space: nowrap;
}

.resources-archive__posts {
	display: grid;
	grid-column: 2 / 16;
	gap: 2rem;
	padding-top: 2rem;
}

.resources-archive__posts-header {
	padding-bottom: 1rem;
	border-bottom: 1px solid #e3ddd2;
}

.resources-archive__posts-header h2 {
	margin: 0;
	color: var(--color-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(34px, 4vw, 48px);
	font-weight: 500;
}

.resources-archive__posts-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
}

.resources-archive__post-card {
	overflow: hidden;
	background-color: #ffffff;
	border: 1px solid #e3ddd2;
	border-radius: 12px;
}

.resources-archive__post-image-link {
	position: relative;
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background-color: #e6e3de;
}

.resources-archive__post-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.resources-archive__post-image-link:hover
	.resources-archive__post-image {
	transform: scale(1.03);
}

.resources-archive__post-content {
	display: grid;
	align-content: start;
	gap: 0.9rem;
	padding: 1.5rem;
}

.resources-archive__post-category {
	color: var(--color-red);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-decoration: none;
	text-transform: uppercase;
}

.resources-archive__post-title {
	margin: 0;
	font-family: "Playfair Display", serif;
	font-size: 28px;
	font-weight: 500;
	line-height: 1.1;
}

.resources-archive__post-title a {
	color: var(--color-blue);
	text-decoration: none;
}

.resources-archive__post-excerpt {
	color: #626a85;
	font-size: 14px;
	line-height: 1.55;
}

.resources-archive__post-excerpt p {
	margin: 0;
}

.resources-archive__post-link {
	color: var(--color-red);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-decoration: none;
	text-transform: uppercase;
}


.resources-archive__pagination {
	margin-top: 1rem;
}

.resources-archive__pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.5rem;
}

.resources-archive__pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 42px;
	padding: 0.5rem 0.8rem;
	color: var(--color-blue);
	font-weight: 600;
	text-decoration: none;
	background-color: #ffffff;
	border: 1px solid #e3ddd2;
	border-radius: 999px;
}

.resources-archive__pagination .page-numbers.current,
.resources-archive__pagination .page-numbers:hover {
	color: #ffffff;
	background-color: var(--color-red);
	border-color: var(--color-red);
}

.resources-archive__empty {
	grid-column: 2 / 16;
	padding: 4rem 0;
	text-align: center;
}


@media only screen and (max-width: 1050px) {

	.resources-archive__hero {
		grid-template-columns: 230px minmax(0, 1fr);
		gap: 2rem;
	}

	.resources-archive__featured-image-link {
		min-height: 450px;
	}

	.resources-archive__featured-card {
		left: 1.5rem;
		width: calc(100% - 3rem);
	}

	.resources-archive__featured-footer {
		align-items: flex-start;
		flex-direction: column;
	}

	.resources-archive__posts-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media only screen and (max-width: 800px) {

	.resources-archive {
		padding-top: 1rem;
	}

	.resources-archive__hero {
		grid-template-columns: 1fr;
		padding-bottom: 3rem;
	}

	.resources-archive__sidebar {
		grid-template-columns: minmax(0, 1fr) minmax(240px, 0.7fr);
		align-items: start;
	}

	.resources-archive__featured {
		padding-bottom: 0;
	}

	.resources-archive__featured-image-link {
		min-height: 430px;
	}

	.resources-archive__featured-card {
		position: relative;
		left: auto;
		bottom: auto;
		width: calc(100% - 2rem);
		margin: -4rem auto 0;
	}

	.resources-archive__posts {
		padding-top: 0;
	}
}

@media only screen and (max-width: 600px) {

	.resources-archive {
		padding-bottom: 4rem;
	}

	.resources-archive__top-line {
		margin-bottom: 1.5rem;
	}

	.resources-archive__hero,
	.resources-archive__posts,
	.resources-archive__empty {
		grid-column: 2 / 16;
	}

	.resources-archive__sidebar {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.resources-archive__title {
		font-size: 48px;
	}

	.resources-archive__topics {
		padding: 1.4rem;
	}

	.resources-archive__featured-image-link {
		min-height: 360px;
		border-radius: 16px;
	}

	.resources-archive__featured-card {
		width: calc(100% - 1rem);
		margin-top: -3rem;
		padding: 1.5rem;
		border-radius: 15px;
	}

	.resources-archive__featured-title {
		font-size: 34px;
	}

	.resources-archive__featured-footer {
		align-items: stretch;
	}

	.resources-archive__featured-button {
		width: 100%;
		text-align: center;
	}

	.resources-archive__posts-grid {
		grid-template-columns: 1fr;
	}
}













/* Centred Box with Floating Boxes and Lines */

.window-map,
.centred-box-floating-boxes-lines {
	position: relative;
	padding: 5em 0;
    gap: 3em;
}

.window-map-inner {
    display: grid;
	grid-column: 2/16;
}

.wm-head {
	display: grid;
    grid-column: 2/16;
	text-align: center;
    justify-self: center;
    max-width: 720px;
    gap: 1em;
}

.wm-motif {
	width: 80px;
	height: 14px;
	margin: 0 auto 24px;
	padding: 0;
}

.wm-head-content {
	display: grid;
	justify-items: center;
	gap: 1rem;
}

.wm-board {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 252px);
	grid-template-rows: repeat(2, minmax(198px, auto));
	align-items: center;
	justify-items: stretch;
	min-height: 646px;
	gap: 35px 11%;
	padding: 70px 50px;
	background: var(--color-cream);
	border-radius: 6px;
    justify-content: center;
}

.wm-card {
	position: relative;
	z-index: 2;
	width: 252px;
	min-height: 198px;
	padding: 24px 28px;
	background: var(--color-white);
	border-radius: 6px;
	box-shadow: 0px 10px 24px 0px #484F7014;
}

.wm-card-top {
	display: flex;
	align-items: center;
	gap: 12px;
}

.wm-card-icon {
	display: block;
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	object-fit: contain;
}

.wm-card-top h3 {
	font-family: "Inter", sans-serif;
	font-size: 20px;
	font-weight: 600;
}

.wm-card-content {
	display: grid;
	gap: 0.75rem;
}

.wm-core {
	position: relative;
	z-index: 1;
	display: flex;
	grid-column: 2;
	grid-row: 1 / span 2;
	flex-direction: column;
	align-self: center;
	justify-self: center;
	justify-content: center;
	width: 348px;
	min-height: 328px;
	padding: 30px 28px;
	text-align: center;
	background: var(--color-white);
	border-radius: 6px;
	box-shadow: 0px 12px 24px 0px #484F701F;
}

.wm-core-content {
	display: grid;
	gap: 1rem;
}

.wm-core-content h3 {
    font-size: 32px;
}

.wm-pointer {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: block;
	width: 124px;
	height: 10px;
	pointer-events: none;
}

.wm-card.casement .wm-pointer,
.wm-card.tilt .wm-pointer,
.wm-card.wm-card--1 .wm-pointer,
.wm-card.wm-card--3 .wm-pointer {
	left: 100%;
	transform: translateY(-50%);
}

.wm-card.bay .wm-pointer,
.wm-card.upvc .wm-pointer,
.wm-card.wm-card--2 .wm-pointer,
.wm-card.wm-card--4 .wm-pointer {
	right: 100%;
	left: auto;
	transform: translateY(-50%) scaleX(-1);
}

.wm-card.casement,
.wm-card.wm-card--1 {
	grid-column: 1;
	grid-row: 1;
	justify-self: start;
}

.wm-card.bay,
.wm-card.wm-card--2 {
	grid-column: 3;
	grid-row: 1;
	justify-self: end;
}

.wm-card.tilt,
.wm-card.wm-card--3 {
	grid-column: 1;
	grid-row: 2;
	justify-self: start;
}

.wm-card.upvc,
.wm-card.wm-card--4 {
	grid-column: 3;
	grid-row: 2;
	justify-self: end;
    display: grid;
    gap: 0.5em;
}

.wm-glazing {
	display: grid;
	grid-template-columns: 260px repeat(3, minmax(0, 1fr));
	align-items: center;
	min-height: 124px;
	gap: 24px;
	margin-top: 24px;
	padding: 30px 36px;
	background: var(--color-dark-blue);
	border-radius: 6px;
}

.wm-glazing-label {
    color: #FFFFFFBD;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 17px;
    letter-spacing: 2.8px;
    text-transform: uppercase;
    align-self: start;
    display: grid;
}

.wm-glaze {
    display: grid;
    gap: 0.5em;
	padding-left: 24px;
	border-left: 1px solid rgba(255, 255, 255, 0.16);
}


.wm-glaze h4 {
	color: var(--color-white);
    font-family: "Inter", sans-serif;
	font-size: 16px;
	font-weight: 600;
}

.wm-glaze p {
	margin: 0;
	color: rgba(255, 255, 255, 0.82);
	font-size: 13.5px;
	font-weight: 400;
	line-height: 20px;
}

.wm-empty {
	padding: 2rem;
	text-align: center;
	background: var(--cream);
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
}

@media only screen and (max-width: 1350px) {

	.wm-pointer {
		width: 75px;
	}
}

@media only screen and (max-width: 1000px) {

	.window-map-inner {
        gap: 1em;
	}

	.wm-board {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: auto;
		gap: 2rem;
		min-height: 0;
		padding: 3rem;
	}

	.wm-card,
	.wm-card.casement,
	.wm-card.bay,
	.wm-card.tilt,
	.wm-card.upvc,
	.wm-card.wm-card--1,
	.wm-card.wm-card--2,
	.wm-card.wm-card--3,
	.wm-card.wm-card--4 {
		grid-column: auto;
		grid-row: auto;
		justify-self: stretch;
		width: 100%;
		min-height: 0;
	}

	.wm-core {
		grid-column: 1 / -1;
		grid-row: 2;
		width: min(100%, 480px);
		min-height: 280px;
	}

	.wm-card.bay,
	.wm-card.wm-card--2 {
		grid-column: 2;
		grid-row: 1;
	}

	.wm-card.tilt,
	.wm-card.wm-card--3 {
		grid-column: 1;
		grid-row: 3;
	}

	.wm-card.upvc,
	.wm-card.wm-card--4 {
		grid-column: 2;
		grid-row: 3;
	}

	.wm-pointer {
		display: none;
	}

	.wm-glazing {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.wm-glazing-label {
		grid-column: 1 / -1;
		max-width: none;
		text-align: center;
	}
}

@media only screen and (max-width: 700px) {

	.window-map,
	.centred-box-floating-boxes-lines {
		padding: 3rem 0;
        gap: 1em;
	}

	.wm-head-content h2 {
		font-size: 36px;
		line-height: 42px;
	}

	.wm-board {
		display: flex;
		flex-direction: column;
		gap: 1rem;
		padding: 1.25rem;
	}

	.wm-card,
	.wm-core {
		width: 100%;
	}

	.wm-core {
		order: -1;
		min-height: 0;
		padding: 2rem 1.5rem;
	}

	.wm-core-content h2,
	.wm-core-content h3 {
		font-size: 28px;
		line-height: 34px;
	}

	.wm-glazing {
		grid-template-columns: 1fr;
		gap: 0;
		padding: 1.5rem;
	}

	.wm-glazing-label {
		padding-bottom: 1.25rem;
		text-align: left;
	}
    
    .wm-glaze {
        text-align: center;
    }

	.wm-glaze,
	.wm-glaze:first-of-type {
		min-height: 0;
		padding: 1.25rem 0;
		border-top: 1px solid rgba(255, 255, 255, 0.16);
		border-left: 0;
	}
}











.perf {
    background: var(--cream);
    width: 100%;
}

.perf-inner {
    max-width: var(--page);
    margin: 0 auto;
    padding: 96px 40px 60px;
}

.perf-rule {
    height: 1px;
    background: var(--sand);
    margin-bottom: 26px;
    border-radius: 0.5px;
}

.perf-head {
    display: grid;
    grid-template-columns: 1fr 454px;
    gap: 40px;
    align-items: start;
    margin-bottom: 48px;
}

.perf-eyebrow {
    margin: 0 0 10px;
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 3.36px;
    text-transform: uppercase;
    color: var(--red);
}

.perf-title {
    margin: 0;
    max-width: 456px;
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 46.08px;
    line-height: 52.99px;
    color: var(--navy);
}

.perf-intro {
    margin: 10px 0 0;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: var(--navy-mid);
}

.perf-composition {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    min-height: 720px;
}

.perf-photo {
    position: absolute;
    left: 50%;
    width: 100%;
    top: 36px;
    transform: translateX(-50%);
    max-width: 42%;
    margin: 0;
    z-index: 1;
}

.perf-photo img {
    width: 100%;
    height: auto;
    aspect-ratio: 500 / 640;
    object-fit: cover;
    border-radius: 6px;
    box-shadow: var(--shadow-hero);
}

.perf-photo figcaption {
    margin-top: 14px;
    text-align: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    color: var(--navy);
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
}

.perf-card {
    position: absolute;
    width: 270px;
    min-height: 122px;
    background: var(--white);
    border-radius: 6px;
    box-shadow: var(--shadow-md);
    padding: 22px 24px 24px;
    z-index: 2;
}

.perf-card h3 {
    margin: 0 0 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 17px;
    line-height: 25.5px;
    color: var(--navy);
}

.perf-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--red);
    flex-shrink: 0;
}

.perf-card p {
    margin: 0;
    padding-left: 18px;
    font-weight: 400;
    font-size: 14.5px;
    line-height: 22px;
    color: var(--navy-mid);
}

.perf-pointer {
    position: absolute;
    top: 50%;
    width: 80px;
    height: 10px;
    pointer-events: none;
    z-index: 1;
}

.perf-card--left .perf-pointer {
    left: 100%;
    transform: translateY(-50%);
}

.perf-card--right .perf-pointer {
    right: 100%;
    left: auto;
    transform: translateY(-50%) scaleX(-1);
}

.perf-card--energy {
    left: 0;
    top: 84px;
}

.perf-card--maint {
    left: 0;
    top: 472px;
}

.perf-card--secure {
    right: 0;
    left: auto;
    top: 36px;
}

.perf-card--last {
    right: 0;
    left: auto;
    top: 266px;
}

.perf-card--quiet {
    right: 0;
    left: auto;
    top: 494px;
}

.ledger {
    background: var(--white);
    width: 100%;
    padding: 63px 0 72px;
}

.ledger-inner {
    max-width: var(--page);
    margin: 0 auto;
    padding: 0 40px;
}

.ledger-head {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 56px;
}

.ledger-motif {
    width: 80px;
    height: 14px;
    margin: 0 auto 22px;
}

.ledger-eyebrow {
    margin: 0 0 10px;
    font-weight: 700;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 3.36px;
    text-transform: uppercase;
    color: var(--red);
}

.ledger-title {
    margin: 0 0 16px;
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 46.08px;
    line-height: 52.99px;
    color: var(--navy);
}

.ledger-lead {
    margin: 0 auto;
    max-width: 600px;
    font-weight: 400;
    font-size: 16px;
    line-height: 28px;
    color: var(--navy-mid);
}

.ledger-board {
    position: relative;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    min-height: 542px;
    background: var(--cream);
    border-radius: 6px;
}

.ledger-grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(var(--sand), var(--sand)) 19.17% 0 / 1px 100% no-repeat,
        linear-gradient(var(--sand), var(--sand)) 80.83% 0 / 1px 100% no-repeat,
        linear-gradient(var(--sand), var(--sand)) 0 50.18% / 100% 1px no-repeat;
}

.ledger-note {
    position: absolute;
    background: var(--white);
    border-radius: 6px;
    box-shadow: 0 8px 18px rgba(72, 79, 112, 0.06);
    text-align: center;
    z-index: 2;
}

.ledger-note h3 {
    margin: 0 0 8px;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 14.5px;
    line-height: 21px;
    color: var(--navy);
}

.ledger-note p {
    margin: 0;
    font-weight: 400;
    font-size: 12.5px;
    line-height: 19px;
    color: var(--navy-mid);
}

.ledger-note--custom h3,
.ledger-note--materials h3,
.ledger-note--process h3,
.ledger-note--secure h3 {
    font-size: 16px;
    line-height: 24px;
}

.ledger-note--custom p,
.ledger-note--materials p,
.ledger-note--process p,
.ledger-note--secure p {
    font-size: 13.5px;
    line-height: 20px;
}

.ledger-note--experience {
    left: 3.17%;
    top: 54px;
    width: 176px;
    min-height: 132px;
    padding: 14px 14px 16px;
}

.ledger-note--guarantees {
    right: 3.17%;
    top: 54px;
    width: 176px;
    min-height: 132px;
    padding: 14px 14px 16px;
}

.ledger-note--custom {
    left: 1.5%;
    top: 334px;
    width: 188px;
    min-height: 128px;
    padding: 14px 14px 16px;
}

.ledger-note--secure {
    right: 1.5%;
    top: 334px;
    width: 188px;
    min-height: 128px;
    padding: 14px 14px 16px;
}

.ledger-note--materials {
    left: 21%;
    top: 408px;
    width: 220px;
    min-height: 114px;
    padding: 14px 14px 16px;
}

.ledger-note--process {
    right: 21.0%;
    top: 408px;
    width: 220px;
    min-height: 114px;
    padding: 14px 14px 16px;
}

.ledger-core {
    position: absolute;
    left: 50%;
    top: 68px;
    transform: translateX(-50%);
    width: 458px;
    max-width: 42%;
    min-height: 268px;
    padding: 42px 34px 36px;
    background: var(--white);
    border-radius: 6px;
    box-shadow: 0 12px 24px rgba(72, 79, 112, 0.12);
    text-align: center;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ledger-core h3 {
    margin: 0 0 20px;
    font-family: var(--font-display);
    font-weight: 500;
    font-size: 38px;
    line-height: 42px;
    color: var(--navy);
}

.ledger-core p {
    margin: 0 auto;
    max-width: 340px;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: var(--navy-mid);
}

@media (max-width: 1000px) {
    .wm-board {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
        gap: 1.25rem;
        min-height: 0;
        padding: 2rem 1.5rem;
    }

    .wm-core {
        grid-column: 1 / -1;
        grid-row: auto;
        width: 100%;
        order: -1;
    }

    .wm-card {
        width: 100%;
        justify-self: stretch !important;
    }

    .wm-card.casement,
    .wm-card.bay,
    .wm-card.tilt,
    .wm-card.upvc {
        grid-column: auto;
        grid-row: auto;
    }

    .wm-pointer {
        display: none;
    }

    .wm-glazing {
        grid-template-columns: 1fr;
    }

    .wm-glazing-label {
        max-width: 100%;
        text-align: center;
    }

    .wm-glaze {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        padding-top: 12px;
    }

    .perf-head {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .perf-composition {
        min-height: 0;
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .perf-photo,
    .perf-card {
        position: static;
        transform: none;
        width: 100%;
        max-width: none;
        left: auto;
        right: auto;
        top: auto;
    }

    .perf-photo {
        order: -1;
        max-width: 500px;
        margin: 0 auto;
    }

    .perf-pointer {
        display: none;
    }

    .ledger-board {
        min-height: 0;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        padding: 1.5rem;
    }

    .ledger-grid {
        display: none;
    }

    .ledger-note,
    .ledger-core {
        position: static;
        transform: none;
        width: 100%;
        max-width: none;
        left: auto;
        right: auto;
        top: auto;
        min-height: 0;
    }

    .ledger-core {
        grid-column: 1 / -1;
        order: -1;
        max-width: none;
    }
}

@media (max-width: 720px) {

    .wm-title {
        font-size: 34px;
        line-height: 40px;
    }

    .wm-board {
        grid-template-columns: 1fr;
        padding: 1em;
    }

    .wm-card-content {
        text-align: center;
    }

    .ledger-title {
        font-size: 34px;
        line-height: 40px;
    }

    .ledger-core h3 {
        font-size: 28px;
        line-height: 34px;
    }

    .ledger-inner {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }
}










/* Contact Info Row */

.truestyle-contact-info-row {
	padding: 5rem 0;
}

.truestyle-contact-info-row__inner {
	display: grid;
	grid-column: 2 / 16;
	gap: 3rem;
}

.truestyle-contact-info-row__header {
	display: grid;
	justify-self: center;
	width: 100%;
	max-width: 620px;
	gap: 1rem;
	text-align: center;
}

.truestyle-contact-info-row__header-content {
	display: grid;
	gap: 1rem;
}

.truestyle-contact-info-row__items {
	display: flex;
	justify-content: space-evenly;
	gap: 1rem;
	padding: 1em;
	border-radius: 6px;
	background-color: var(--color-cream);
	border: 1px solid #E3DDD2;
}


.truestyle-contact-info-row__item {
	display: grid;
	align-content: start;
	width: 100%;
	max-width: 340px;
	gap: 1em;
	padding: 2rem;
	border-radius: 6px;
}

.truestyle-contact-info-row__item-title {
	margin: 0;
	color: var(--color-red);
	font-family: "Playfair Display", serif;
	font-size: 2em;
	font-weight: 500;
	line-height: 1;
}


.truestyle-contact-info-row__item-content {
	display: grid;
	align-content: start;
	gap: 1em;
	min-width: 0;
}

.truestyle-contact-info-row__item-content p {
	display: grid;
	align-items: start;
	gap: 1em;
	margin: 0;
}

.truestyle-contact-info-row__item-link {
	display: inline-flex;
	align-items: center;
	gap: 0.75em;
	width: fit-content;
	color: var(--color-red);
	font-weight: 600;
	text-decoration: none;
}

.truestyle-contact-info-row__item-link:hover {
	text-decoration: underline;
}

.truestyle-contact-info-row__item-link i {
	font-size: 0.85em;
}

.truestyle-contact-info-row__empty {
	padding: 2rem;
	border: 1px dashed #e3ddd2;
	border-radius: 6px;
	background-color: #f7f4f0;
	text-align: center;
}

.contact-row-lower {
	text-align: center;
}

@media only screen and (max-width: 900px) {

	.truestyle-contact-info-row__items {
		justify-items: center;
		grid-template-columns: 1fr;
		display: grid;
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-contact-info-row {
		padding: 3rem 0;
	}

	.truestyle-contact-info-row__inner {
		gap: 2rem;
	}

	.truestyle-contact-info-row__items {	
		padding: 1em;
	}

	.truestyle-contact-info-row__item {
		padding: 1.5rem;
		text-align: center;
	}

	.truestyle-contact-info-row__item-title {
		font-size: 24px;
	}

	.truestyle-contact-info-row__item-link {
		justify-self: center;
	}

}









/* CENTRED IMAGE WITH FLOATING BOXES AND LINES */

.truestyle-centred-image-floating-boxes-lines {
	position: relative;
	display: grid;
	gap: 3em;
	padding: 5em 0;
	background: var(--color-cream);
}

.truestyle-centred-image-floating-boxes-lines__inner {
	display: grid;
	grid-column: 2 / 16;
}

.truestyle-centred-image-floating-boxes-lines__header {
	display: grid;
	grid-column: 2 / 16;
	width: 100%;
	max-width: 456px;
	gap: 1em;
	text-align: center;
    justify-self: center;
}

.truestyle-centred-image-floating-boxes-lines__header-content {
	display: grid;
	gap: 1rem;
}

.truestyle-centred-image-floating-boxes-lines__board {
	--floating-line-length: clamp(60px, 7vw, 126px);

	position: relative;
	display: grid;
	grid-template-columns:
		minmax(240px, 1fr)
		minmax(300px, 420px)
		minmax(240px, 1fr);
	grid-template-areas: "left centre right";
	align-items: stretch;
	column-gap: var(--floating-line-length);
	min-height: 646px;
	padding: 70px 50px;
	border-radius: 6px;
}

.truestyle-centred-image-floating-boxes-lines__side {
	display: grid;
	align-content: space-evenly;
	gap: 2rem;
	min-width: 0;
}

.truestyle-centred-image-floating-boxes-lines__side--left {
	grid-area: left;
}

.truestyle-centred-image-floating-boxes-lines__side--right {
	grid-area: right;
}

.truestyle-centred-image-floating-boxes-lines__card {
	position: relative;
	z-index: 2;
	display: grid;
	align-content: start;
	width: 100%;
	max-width: 320px;
	min-height: 160px;
	gap: 0.75rem;
	padding: 24px 28px;
	border-radius: 6px;
	background: var(--color-white);
	box-shadow: 0 10px 24px 0 #484f7014;
}

.truestyle-centred-image-floating-boxes-lines__card--left {
	justify-self: end;
}

.truestyle-centred-image-floating-boxes-lines__card--right {
	justify-self: start;
}

.truestyle-centred-image-floating-boxes-lines__card-top {
	display: flex;
	align-items: center;
	gap: 12px;
}

.truestyle-centred-image-floating-boxes-lines__card-icon {
	display: block;
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	object-fit: contain;
}

.truestyle-centred-image-floating-boxes-lines__card-title {
	margin: 0;
	font-family: "Inter", sans-serif;
	font-size: 20px;
	font-weight: 600;
}

.truestyle-centred-image-floating-boxes-lines__card-content {
	display: grid;
	gap: 0.75rem;
}

.truestyle-centred-image-floating-boxes-lines__card-content > :first-child {
	margin-top: 0;
}

.truestyle-centred-image-floating-boxes-lines__card-content > :last-child {
	margin-bottom: 0;
}

.truestyle-centred-image-floating-boxes-lines__centre {
	position: relative;
	z-index: 1;
	display: grid;
	grid-area: centre;
	align-self: center;
	justify-self: center;
	align-content: center;
	width: 100%;
	max-width: 500px;
	border-radius: 6px;
	text-align: center;
}

.truestyle-centred-image-floating-boxes-lines__centre-image {
	display: grid;
	justify-items: center;
	width: 100%;
	box-shadow: 0px 18px 40px 0px #484F702E;
}

.truestyle-centred-image-floating-boxes-lines__centre-image-element {
    display: block;
    width: 100%;
    max-width: 500px;
    height: 100%;
    margin: 0 auto;
    object-fit: cover;
    min-height: 640px;
	border-radius: 6px;
}

.truestyle-centred-image-floating-boxes-lines__centre-text {
	display: grid;
	gap: 1rem;
	margin-top: 1.5rem;
	text-align: center;
}

.truestyle-centred-image-floating-boxes-lines__centre-text > :first-child {
	margin-top: 0;
}

.truestyle-centred-image-floating-boxes-lines__centre-text > :last-child {
	margin-bottom: 0;
}

.truestyle-centred-image-floating-boxes-lines__centre-text h2,
.truestyle-centred-image-floating-boxes-lines__centre-text h3 {
	font-size: 32px;
}

.truestyle-centred-image-floating-boxes-lines__pointer {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: block;
	width: var(--floating-line-length);
	height: 10px;
	pointer-events: none;
}

.truestyle-centred-image-floating-boxes-lines__card--left
.truestyle-centred-image-floating-boxes-lines__pointer {
	left: 100%;
	transform: translateY(-50%);
}

.truestyle-centred-image-floating-boxes-lines__card--right
.truestyle-centred-image-floating-boxes-lines__pointer {
	right: 100%;
	left: auto;
	transform: translateY(-50%) scaleX(-1);
}

.truestyle-centred-image-floating-boxes-lines__empty {
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
	background: var(--color-cream);
	text-align: center;
}

@media only screen and (max-width: 1100px) {

	.truestyle-centred-image-floating-boxes-lines__board {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-areas:
			"centre centre"
			"left right";
		gap: 2rem;
		min-height: 0;
		padding: 3rem;
	}

	.truestyle-centred-image-floating-boxes-lines__centre {
		width: min(100%, 520px);
		max-width: none;
	}

	.truestyle-centred-image-floating-boxes-lines__side {
		align-content: start;
		gap: 1.5rem;
	}

	.truestyle-centred-image-floating-boxes-lines__card {
		justify-self: stretch;
		max-width: none;
		min-height: 0;
	}

	.truestyle-centred-image-floating-boxes-lines__pointer {
		display: none;
	}

}

@media only screen and (max-width: 700px) {

	.truestyle-centred-image-floating-boxes-lines {
		gap: 1em;
		padding: 3rem 0;
	}

	.truestyle-centred-image-floating-boxes-lines__header-content h2 {
		font-size: 36px;
		line-height: 42px;
	}

	.truestyle-centred-image-floating-boxes-lines__board {
		grid-template-columns: 1fr;
		grid-template-areas:
			"centre"
			"left"
			"right";
		gap: 1rem;
		padding: 1.25rem;
	}

	.truestyle-centred-image-floating-boxes-lines__centre {
		min-height: 0;
		padding: 2rem 1.5rem;
	}

	.truestyle-centred-image-floating-boxes-lines__centre-text h2,
	.truestyle-centred-image-floating-boxes-lines__centre-text h3 {
		font-size: 28px;
		line-height: 34px;
	}

	.truestyle-centred-image-floating-boxes-lines__side {
		gap: 1rem;
	}

	.truestyle-centred-image-floating-boxes-lines__card {
		padding: 1.5rem;
	}

	.truestyle-centred-image-floating-boxes-lines__centre-image-element {
		min-height: 460px;
	}


}
















/* TRUESTYLE CENTRED BOX WITH FLOATING BOXES AND GRID */

.truestyle-centred-box-floating-boxes-grid {
	position: relative;
	display: grid;
	gap: 4rem;
	padding: 5rem 0;
	background-color: var(--color-white);
}

.truestyle-centred-box-floating-boxes-grid__inner {
	display: grid;
	grid-column: 2 / 16;
}

.truestyle-centred-box-floating-boxes-grid__header {
	display: grid;
	grid-column: 2 / 16;
	justify-self: center;
	width: 100%;
	max-width: 760px;
	gap: 1rem;
	text-align: center;
}

.truestyle-centred-box-floating-boxes-grid__motif {
	width: 80px;
	height: 14px;
	margin: 0 auto 1rem;
	padding: 0;
}

.truestyle-centred-box-floating-boxes-grid__header-content {
	display: grid;
	justify-items: center;
	gap: 1rem;
}

.truestyle-centred-box-floating-boxes-grid__header-content > :first-child {
	margin-top: 0;
}

.truestyle-centred-box-floating-boxes-grid__header-content > :last-child {
	margin-bottom: 0;
}

.truestyle-centred-box-floating-boxes-grid__board {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	grid-template-rows: repeat(2, minmax(210px, 1fr));
	min-height: 542px;
	gap: 1.5rem;
	padding: 3rem 2rem 1rem;
	overflow: hidden;
	border: 1px solid #e5ded4;
	border-radius: 6px;
	background:
		linear-gradient(
			to right,
			transparent 19%,
			#e5ded4 19%,
			#e5ded4 calc(19% + 1px),
			transparent calc(19% + 1px),
			transparent 81%,
			#e5ded4 81%,
			#e5ded4 calc(81% + 1px),
			transparent calc(81% + 1px)
		),
		linear-gradient(
			to bottom,
			transparent 50%,
			#e5ded4 50%,
			#e5ded4 calc(50% + 1px),
			transparent calc(50% + 1px)
		),
		var(--color-cream);
}

.truestyle-centred-box-floating-boxes-grid__card {
	position: relative;
	z-index: 2;
	display: grid;
	align-content: start;
	justify-items: center;
	align-self: center;
	justify-self: center;
	width: 100%;
	max-width: 210px;
	min-height: 120px;
	gap: 0.5rem;
	padding: 1.25rem;
	border-radius: 6px;
	background-color: var(--color-white);
	box-shadow: 0px 8px 18px 0px #484F700F;
	text-align: center;
}

.truestyle-centred-box-floating-boxes-grid__card-icon {
	display: block;
	width: 44px;
	height: 44px;
	margin: 0 auto 0.25rem;
	object-fit: contain;
}

.truestyle-centred-box-floating-boxes-grid__card-title {
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Inter", sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
}

.truestyle-centred-box-floating-boxes-grid__card-content {
	display: grid;
	gap: 0.5rem;
	color: var(--color-dark-blue);
	font-size: 14.5px;
	
}

.truestyle-centred-box-floating-boxes-grid__card-content p {
	line-height: 20px;
}

.truestyle-centred-box-floating-boxes-grid__card-content > :first-child {
	margin-top: 0;
}

.truestyle-centred-box-floating-boxes-grid__card-content > :last-child {
	margin-bottom: 0;
}

.truestyle-centred-box-floating-boxes-grid__card--1 {
	grid-column: 1;
	grid-row: 1;
	align-self: start;
}

.truestyle-centred-box-floating-boxes-grid__card--2 {
	grid-column: 5;
	grid-row: 1;
	align-self: start;
}

.truestyle-centred-box-floating-boxes-grid__card--3 {
	grid-column: 1;
	grid-row: 2;
}

.truestyle-centred-box-floating-boxes-grid__card--4 {
	grid-column: 5;
	grid-row: 2;
}

.truestyle-centred-box-floating-boxes-grid__card--5 {
	grid-column: 2;
	grid-row: 2;
	align-self: end;
}

.truestyle-centred-box-floating-boxes-grid__card--6 {
	grid-column: 4;
	grid-row: 2;
	align-self: end;
}

.truestyle-centred-box-floating-boxes-grid__card--7 {
	grid-column: 2;
	grid-row: 1;
	align-self: start;
}

.truestyle-centred-box-floating-boxes-grid__card--8 {
	grid-column: 4;
	grid-row: 1;
	align-self: start;
}

.truestyle-centred-box-floating-boxes-grid__centre {
	position: absolute;
	top: 35%;
	left: 50%;
	z-index: 3;
	display: grid;
	align-content: center;
	width: min(42%, 520px);
	min-height: 240px;
	padding: 2.75rem 3rem;
	border-radius: 6px;
	background-color: var(--color-white);
	box-shadow: 0px 12px 24px 0px #484F701F;
	text-align: center;
	transform: translate(-50%, -50%);
}

.truestyle-centred-box-floating-boxes-grid__centre-content {
	display: grid;
	gap: 1.5rem;
	color: var(--color-dark-blue);
}

.truestyle-centred-box-floating-boxes-grid__centre-content > :first-child {
	margin-top: 0;
}

.truestyle-centred-box-floating-boxes-grid__centre-content > :last-child {
	margin-bottom: 0;
}

.truestyle-centred-box-floating-boxes-grid__centre-content h2,
.truestyle-centred-box-floating-boxes-grid__centre-content h3 {
	font-size: 38px;
	line-height: 1.1;
}

.truestyle-centred-box-floating-boxes-grid__empty {
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
	background-color: var(--color-cream);
	text-align: center;
}

@media only screen and (max-width: 1100px) {

	.truestyle-centred-box-floating-boxes-grid {
		gap: 2rem;
	}

	.truestyle-centred-box-floating-boxes-grid__board {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
		gap: 1.5rem;
		min-height: 0;
		padding: 2rem;
		background: var(--color-cream);
	}

	.truestyle-centred-box-floating-boxes-grid__centre {
		position: relative;
		top: auto;
		left: auto;
		grid-column: 1 / -1;
		grid-row: 1;
		justify-self: center;
		width: min(100%, 560px);
		min-height: 0;
		transform: none;
	}

	.truestyle-centred-box-floating-boxes-grid__card,
	.truestyle-centred-box-floating-boxes-grid__card--1,
	.truestyle-centred-box-floating-boxes-grid__card--2,
	.truestyle-centred-box-floating-boxes-grid__card--3,
	.truestyle-centred-box-floating-boxes-grid__card--4,
	.truestyle-centred-box-floating-boxes-grid__card--5,
	.truestyle-centred-box-floating-boxes-grid__card--6,
	.truestyle-centred-box-floating-boxes-grid__card--7,
	.truestyle-centred-box-floating-boxes-grid__card--8 {
		grid-column: auto;
		grid-row: auto;
		align-self: stretch;
		justify-self: stretch;
		max-width: none;
		min-height: 0;
	}

}

@media only screen and (max-width: 700px) {

	.truestyle-centred-box-floating-boxes-grid {
		gap: 1rem;
		padding: 3rem 0;
	}

	.truestyle-centred-box-floating-boxes-grid__header-content h2 {
		font-size: 36px;
		line-height: 42px;
	}

	.truestyle-centred-box-floating-boxes-grid__board {
		grid-template-columns: 1fr;
		padding: 1.25rem;
	}

	.truestyle-centred-box-floating-boxes-grid__centre {
		grid-column: 1;
		padding: 2rem 1.5rem;
	}

	.truestyle-centred-box-floating-boxes-grid__centre-content h2,
	.truestyle-centred-box-floating-boxes-grid__centre-content h3 {
		font-size: 28px;
		line-height: 34px;
	}

	.truestyle-centred-box-floating-boxes-grid__card,
	.truestyle-centred-box-floating-boxes-grid__card--1,
	.truestyle-centred-box-floating-boxes-grid__card--2,
	.truestyle-centred-box-floating-boxes-grid__card--3,
	.truestyle-centred-box-floating-boxes-grid__card--4,
	.truestyle-centred-box-floating-boxes-grid__card--5,
	.truestyle-centred-box-floating-boxes-grid__card--6,
	.truestyle-centred-box-floating-boxes-grid__card--7,
	.truestyle-centred-box-floating-boxes-grid__card--8 {
		grid-column: 1;
	}

}








/* REVIEWS BAR */

.truestyle-reviews-bar__inner {
	display: grid;
	grid-column: 2/16;
}

.truestyle-reviews-bar__items {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	gap: 2em;
}









/* SINGLE BLOG CONTENT LAYOUT */

.inner-single-post {
	display: grid;
	grid-template-columns:
		minmax(180px, 220px)
		minmax(0, 1fr);
	grid-column: 1 / 17;
	align-items: start;
	column-gap: 4rem;
	width: 100%;
}

.truestyle-single-blog-header-content,
.truestyle-single-blog-header-content__inner {
	display: contents;
	position: relative;
}

.truestyle-single-blog-header-content__text {
	grid-column: 2;
	min-width: 0;
	width: 100%;
	padding: 4rem 0 2rem;
}

.single-post,
.inner-single-post,
.truestyle-single-blog-header-content,
.truestyle-single-blog-header-content__inner {
	overflow: visible;
}

.truestyle-single-blog-header-content__guide {
	grid-column: 1;
	grid-row: auto / span var(--guide-row-span, 1);
	align-self: stretch;
	min-width: 0;
	margin-top: 4rem;
}

.truestyle-single-blog-header-content__guide-nav {
	position: sticky;
	top: 120px;

	display: grid;
	gap: 1.5rem;

	max-height: calc(100vh - 150px);
	padding: 2rem 1.5rem;
	overflow-y: auto;

	border: 1px solid #e4dbd0;
	border-radius: 24px;
	background-color: var(--color-cream);
}

.truestyle-single-blog-header-content__guide-title {
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Inter", sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2px;
}

.truestyle-single-blog-header-content__guide-list {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-header-content__guide-item {
	margin: 0;
	padding: 0;
}

.truestyle-single-blog-header-content__guide-link {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	align-items: start;
	gap: 0.4rem;
	color: var(--color-dark-blue);
	font-size: 13px;
	line-height: 1.5;
	text-decoration: none;
}

.truestyle-single-blog-header-content__guide-link:hover {
	color: var(--color-red);
}

.truestyle-single-blog-header-content__guide-number {
	color: var(--color-red);
	font-weight: 700;
	letter-spacing: 1px;
}

.truestyle-single-blog-header-content__guide-label {
	min-width: 0;
}

@media only screen and (max-width: 800px) {

	.truestyle-single-blog-header-content__guide {
		grid-column: 1;
		grid-row: auto;
		align-self: start;
		margin-top: 2rem;
	}

	.truestyle-single-blog-header-content__guide-nav {
		position: relative;
		top: auto;
		max-height: none;
		overflow: visible;
	}

}

.truestyle-single-blog-header-content__content {
	display: grid;
	gap: 1.5rem;
	padding-bottom: 2em;
}

.truestyle-single-blog-header-content__content h6 {
	margin: 0;
	color: var(--color-red);
	font-family: "Inter", sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.truestyle-single-blog-header-content__content p {
	margin: 0;
	max-width: 760px;
	line-height: 1.7;
}






/* NUMBERED CONTENT COLUMN */

.inner-single-post
.truestyle-single-blog-numbered-content {
	grid-column: 2;
	min-width: 0;
}

.truestyle-single-blog-numbered-content__inner {
	grid-column: auto;
	width: 100%;
}

.truestyle-single-blog-numbered-content {
	scroll-margin-top: 130px;
}

@media only screen and (max-width: 1000px) {

	.inner-single-post {
		grid-template-columns:
			minmax(160px, 190px)
			minmax(0, 1fr);
		column-gap: 2.5rem;
	}

}

@media only screen and (max-width: 800px) {

	.inner-single-post {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.truestyle-single-blog-header-content__guide {
		grid-column: 1;
		grid-row: auto;
		margin-top: 2rem;
	}

	.truestyle-single-blog-header-content__text,
	.inner-single-post
	.truestyle-single-blog-numbered-content {
		grid-column: 1;
	}

	.truestyle-single-blog-header-content__text {
		padding-top: 3rem;
	}

	.truestyle-single-blog-header-content__guide-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.75rem 1.5rem;
	}

}


@media only screen and (max-width: 600px) {

	.inner-single-post {
		grid-column: 1 / 17;
		padding: 0 1.25rem;
	}

	.truestyle-single-blog-header-content__guide {
		padding: 1.5rem;
		border-radius: 18px;
	}

	.truestyle-single-blog-header-content__guide-list {
		grid-template-columns: 1fr;
	}

	.truestyle-single-blog-header-content__content h1,
	.truestyle-single-blog-header-content__content h2 {
		font-size: 38px;
		line-height: 1.1;
	}

}







/* TRUESTYLE SINGLE BLOG NUMBERED CONTENT */

.truestyle-single-blog-numbered-content {
	display: block;
	width: 100%;
	min-width: 0;
	padding: 2rem 0;
	scroll-margin-top: 130px;
	background-color: var(--color-white);
}

.truestyle-single-blog-numbered-content__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
	gap: 2rem;
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-numbered-content__inner--text-image {
	grid-template-columns:
		minmax(0, 1.4fr)
		minmax(280px, 0.8fr);
	gap: 5rem;
}


.truestyle-single-blog-numbered-content__inner--text-only {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-single-blog-numbered-content__inner--image-only {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-single-blog-numbered-content--has-image
.truestyle-single-blog-numbered-content__inner {
	grid-template-columns:
		minmax(0, 1.4fr)
		minmax(280px, 0.8fr);
	gap: 5rem;
}

.truestyle-single-blog-numbered-content--no-image
.truestyle-single-blog-numbered-content__inner {
	grid-template-columns: minmax(0, 1fr);
	gap: 2rem;
}

.truestyle-single-blog-numbered-content--image-only
.truestyle-single-blog-numbered-content__inner {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-single-blog-numbered-content__text {
	display: grid;
	grid-template-columns: 42px minmax(0, 1fr);
	align-items: start;
	gap: 1rem 1.5rem;
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-numbered-content__text--no-number {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-single-blog-numbered-content__text--has-number {
	grid-template-columns: 42px minmax(0, 1fr);
}

.truestyle-single-blog-numbered-content__text--number-only {
	grid-template-columns: minmax(0, 42px);
}

.truestyle-single-blog-numbered-content--no-number
.truestyle-single-blog-numbered-content__text {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-single-blog-numbered-content__number {
	padding-top: 0.35rem;

	color: var(--color-red);
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 4px;
}

.truestyle-single-blog-numbered-content__content {
	display: grid;
	gap: 1.5rem;
	width: 100%;
	min-width: 0;

	color: var(--color-dark-blue);
}

.truestyle-single-blog-numbered-content__content ul,
.truestyle-single-blog-numbered-content__content ol {
	display: grid;
	gap: 0.35rem;
	margin: 0;
	padding-left: 1.25rem;
	list-style-position: outside;
}

.truestyle-single-blog-numbered-content__content ul {
	list-style-type: disc;
}

.truestyle-single-blog-numbered-content__content ol {
	list-style-type: decimal;
}

.truestyle-single-blog-numbered-content__content li {
	margin: 0;
	padding: 0;
	line-height: 1.5;
}

.truestyle-single-blog-numbered-content__content ul li::marker {
	color: var(--color-red);
}

.truestyle-single-blog-numbered-content__content ol li::marker {
	color: var(--color-red);
	font-weight: 700;
}

.truestyle-single-blog-numbered-content__content a {
	color: var(--color-red);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.truestyle-single-blog-numbered-content__content a:hover,
.truestyle-single-blog-numbered-content__content a:focus {
	color: var(--color-dark-blue);
}

.truestyle-single-blog-numbered-content__image {
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-numbered-content__image-element {
	display: block;
	width: 100%;
	height: auto;
	max-height: 430px;
	border-radius: 6px;
	box-shadow: 0 14px 28px rgba(44, 50, 75, 0.08);
	object-fit: cover;
}

.truestyle-single-blog-numbered-content--image-only
.truestyle-single-blog-numbered-content__image {
	width: 100%;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-numbered-content {
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-numbered-content__inner {
	grid-column: auto;
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-numbered-content__empty {
	padding: 2rem;

	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
	background-color: var(--color-cream);

	text-align: center;
}

.truestyle-single-blog-numbered-content__empty p {
	margin: 0;
}


@media only screen and (max-width: 900px) {

	.truestyle-single-blog-numbered-content__inner,
	.truestyle-single-blog-numbered-content__inner--text-image,
	.truestyle-single-blog-numbered-content--has-image
	.truestyle-single-blog-numbered-content__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 3rem;
	}

	.truestyle-single-blog-numbered-content__image {
		width: min(100%, 600px);
		justify-self: center;
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-single-blog-numbered-content {
		padding: 3rem 0;
	}

	.truestyle-single-blog-numbered-content__inner,
	.truestyle-single-blog-numbered-content__inner--text-image,
	.truestyle-single-blog-numbered-content__inner--text-only,
	.truestyle-single-blog-numbered-content__inner--image-only {
		grid-template-columns: minmax(0, 1fr);
		gap: 2rem;
	}

	.truestyle-single-blog-numbered-content__text,
	.truestyle-single-blog-numbered-content__text--has-number,
	.truestyle-single-blog-numbered-content__text--no-number,
	.truestyle-single-blog-numbered-content__text--number-only {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

	.truestyle-single-blog-numbered-content__number {
		padding-top: 0;
	}

	.truestyle-single-blog-numbered-content__content h2,
	.truestyle-single-blog-numbered-content__content h3 {
		font-size: 30px;
	}

	.truestyle-single-blog-numbered-content__image-element {
		max-height: none;
		border-radius: 18px;
	}

}

















/* SINGLE POST */

.single-post,
.inner-single-post {
	overflow: visible;
}

.truestyle-single-blog-guide-layout {
	width: 100%;
	padding: 4rem 0;
	overflow: visible;
}

.truestyle-single-blog-guide-layout__inner {
	display: grid;
	grid-template-columns:
		minmax(180px, 220px)
		minmax(0, 1fr);
	align-items: stretch;
	gap: 4rem;
	width: 100%;
	overflow: visible;
	grid-column: 2/16;
}

.truestyle-single-blog-guide-layout__sidebar {
	align-self: stretch;
	min-width: 0;
	overflow: visible;
}

.truestyle-single-blog-guide-layout__guide {
	position: sticky;
	top: 120px;
	display: grid;
	gap: 1.5rem;
	box-sizing: border-box;
	width: 100%;
	max-height: calc(100vh - 150px);
	padding: 2rem 1.5rem;
	overflow-x: hidden;
	overflow-y: auto;
	border: 1px solid #e4dbd0;
	border-radius: 6px;
	background-color: var(--color-cream);
}

.truestyle-single-blog-guide-layout__guide-title {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2px;
}

.truestyle-single-blog-guide-layout__guide-list {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-guide-layout__guide-item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-guide-layout__guide-link {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	align-items: start;
	gap: 0.4rem;

	color: var(--color-dark-blue);
	font-size: 13px;
	line-height: 1.5;
	text-decoration: none;
}

.truestyle-single-blog-guide-layout__guide-link:hover,
.truestyle-single-blog-guide-layout__guide-link:focus {
	color: var(--color-red);
}

.truestyle-single-blog-guide-layout__guide-number {
	color: var(--color-red);
	font-weight: 700;
	letter-spacing: 1px;
}

.truestyle-single-blog-guide-layout__guide-label {
	min-width: 0;
}

.truestyle-single-blog-numbered-content {
	display: flex;
}

.truestyle-single-blog-guide-layout__content {
	display: grid;
	min-width: 0;
	width: 100%;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-header-content {
	width: 100%;
	padding: 0 0 2rem;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-header-content__inner {
	display: block;
	width: 100%;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-header-content__text {
	width: 100%;
	padding: 0;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-numbered-content {
	width: 100%;
	padding: 2rem 0;
	scroll-margin-top: 130px;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-numbered-content__inner {
	grid-column: auto;
	width: 100%;
}

html {
	scroll-padding-top: 130px;
}

@media only screen and (max-width: 1000px) {

	.truestyle-single-blog-guide-layout__inner {
		grid-template-columns:
			minmax(160px, 190px)
			minmax(0, 1fr);
		gap: 2.5rem;
	}

}

@media only screen and (max-width: 800px) {

	.truestyle-single-blog-guide-layout {
		padding: 3rem 0;
	}

	.truestyle-single-blog-guide-layout__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 2rem;
	}

	.truestyle-single-blog-guide-layout__guide {
		position: relative;
		top: auto;
		max-height: none;
		overflow: visible;
	}

	.truestyle-single-blog-guide-layout__guide-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.75rem 1.5rem;
	}

}


@media only screen and (max-width: 600px) {

	.inner-single-post {
		grid-column: 1 / 17;
		padding: 0 1.25rem;
	}

	.truestyle-single-blog-guide-layout__guide {
		padding: 1.5rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-guide-layout__guide-list {
		grid-template-columns: minmax(0, 1fr);
	}

}

/* STICKY SIDEBAR BOUNDARY */

.truestyle-single-blog-guide-layout__sidebar {
	align-self: stretch;
	min-width: 0;
	overflow: visible;
}

.truestyle-single-blog-guide-layout__guide {
	position: sticky;
	top: 120px;
	display: grid;
	gap: 1.5rem;
	box-sizing: border-box;
	width: 100%;
	max-height: calc(100vh - 150px);
	padding: 2rem 1.5rem;
	overflow-x: hidden;
	overflow-y: auto;
	border: 1px solid #e4dbd0;
	border-radius: 6px;
	background-color: var(--color-cream);
}

.truestyle-single-blog-guide-layout__guide-title {
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Inter", sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2px;
}

.truestyle-single-blog-guide-layout__guide-list {
	display: grid;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-guide-layout__guide-item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-guide-layout__guide-link {
	display: grid;
	grid-template-columns: 28px minmax(0, 1fr);
	align-items: start;
	gap: 0.4rem;
	color: var(--color-dark-blue);
	font-size: 13px;
	line-height: 1.5;
	text-decoration: none;
}

.truestyle-single-blog-guide-layout__guide-link:hover,
.truestyle-single-blog-guide-layout__guide-link:focus {
	color: var(--color-red);
}

.truestyle-single-blog-guide-layout__guide-number {
	color: var(--color-red);
	font-weight: 700;
	letter-spacing: 1px;
}

.truestyle-single-blog-guide-layout__guide-label {
	min-width: 0;
}

.truestyle-single-blog-guide-layout__content {
	display: grid;
	gap: 0;
	min-width: 0;
	width: 100%;
}

.truestyle-single-blog-guide-layout__content >
.truestyle-single-blog-header-content,
.truestyle-single-blog-guide-layout__content >
.truestyle-single-blog-numbered-content {
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-guide-layout__content h3 {
	font-family: Playfair Display;
	font-weight: 500;
	font-size: 34px;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-header-content {
	padding: 0 0 2rem;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-header-content__inner {
	display: block;
	width: 100%;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-header-content__text {
	width: 100%;
	min-width: 0;
	padding: 0;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-numbered-content {
	width: 100%;
	min-width: 0;
	padding: 2rem 0;
	scroll-margin-top: 130px;
}

.truestyle-single-blog-guide-layout
.truestyle-single-blog-numbered-content__inner {
	grid-column: auto;
	width: 100%;
	min-width: 0;
}

html {
	scroll-padding-top: 130px;
}


@media only screen and (max-width: 1000px) {

	.truestyle-single-blog-guide-layout__inner {
		grid-template-columns:
			minmax(160px, 190px)
			minmax(0, 1fr);
		gap: 2.5rem;
	}

}

@media only screen and (max-width: 800px) {

	.truestyle-single-blog-guide-layout {
		padding: 3rem 0;
	}

	.truestyle-single-blog-guide-layout__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 2rem;
	}

	.truestyle-single-blog-guide-layout__sidebar {
		align-self: start;
	}

	.truestyle-single-blog-guide-layout__guide {
		position: relative;
		top: auto;
		max-height: none;
		overflow: visible;
	}

	.truestyle-single-blog-guide-layout__guide-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.75rem 1.5rem;
	}

}


@media only screen and (max-width: 600px) {

	.inner-single-post {
		grid-column: 1 / 17;
		padding: 0 1.25rem;
	}

	.truestyle-single-blog-guide-layout__guide {
		padding: 1.5rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-guide-layout__guide-list {
		grid-template-columns: minmax(0, 1fr);
	}

}


.truestyle-single-blog-guide-layout__inner {
	align-items: start;
	overflow: visible;
}

.truestyle-single-blog-guide-layout__sidebar {
	position: -webkit-sticky !important;
	position: sticky !important;
	top: 120px !important;

	align-self: start !important;
	height: fit-content !important;
	min-height: 0;
	min-width: 0;

	max-height: none !important;
	overflow: visible !important;
}

.truestyle-single-blog-guide-layout__guide {
	position: static !important;
	top: auto !important;

	height: auto !important;
	max-height: none !important;

	overflow-x: visible !important;
	overflow-y: visible !important;
}


@media only screen and (max-width: 800px) {

	.truestyle-single-blog-guide-layout__sidebar {
		position: relative !important;
		top: auto !important;
		height: auto !important;
	}

}











/* TRUESTYLE SINGLE BLOG ACT BANNER */

.truestyle-single-blog-act-banner {
	width: 100%;
	padding: 2rem 0;
}

.truestyle-single-blog-act-banner__inner {
	display: grid;
	align-items: center;
	width: 100%;
	padding: 2rem 2.5rem;
	grid-column: 1/17;
	border-radius: 6px;
	background-color: var(--color-dark-blue);
	box-shadow: 0px 10px 20px 0px #2C324B0D;
}

.truestyle-single-blog-act-banner__heading-column {
	display: grid;
	gap: 0.5rem;
	min-width: 0;
}

.truestyle-single-blog-act-banner__eyebrow {
	margin: 0;

	color: var(--color-white);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2.5px;
	text-transform: uppercase;
}

.truestyle-single-blog-act-banner__heading {
	margin: 0;

	color: var(--color-white);
	font-family: "Playfair Display", serif;
	font-size: clamp(28px, 3vw, 38px);
	font-weight: 500;
	line-height: 1.05;
}

.truestyle-single-blog-act-banner__content * {
	color: #fff;
}

.truestyle-single-blog-act-banner__empty {
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
	background-color: var(--color-cream);
	text-align: center;
}

@media only screen and (max-width: 800px) {

	.truestyle-single-blog-act-banner__inner {
		gap: 1.5rem;
		padding: 2rem;
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-single-blog-act-banner {
		padding: 1.5rem 0;
	}

	.truestyle-single-blog-act-banner__inner {
		padding: 1.75rem 1.5rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-act-banner__heading {
		font-size: 30px;
	}

}













/* SINGLE BLOG QUOTE CHECKLIST */

.truestyle-single-blog-quote-checklist {
	width: 100%;
	padding: 2rem 0;
}

.truestyle-single-blog-quote-checklist__inner {
	box-sizing: border-box;
	width: 100%;
	padding: 3rem 3.5rem;
	border: 1px solid #e4dbd0;
	border-radius: 6px;
	background-color: var(--color-cream);
	grid-column: 1/17;
    display: grid;
}

.truestyle-single-blog-quote-checklist__content {
	display: grid;
	grid-template-columns: 40% 1fr;
	align-items: start;
	gap: 3rem;
	width: 100%;
	min-width: 0;
}


.truestyle-single-blog-quote-checklist--one-column
.truestyle-single-blog-quote-checklist__content {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-single-blog-quote-checklist--one-column
.truestyle-single-blog-quote-checklist__intro,
.truestyle-single-blog-quote-checklist--one-column
.truestyle-single-blog-quote-checklist__details {
	width: 100%;
	max-width: none;
}

.truestyle-single-blog-quote-checklist__intro {
	display: grid;
	align-content: start;
	gap: 1rem;
	min-width: 0;
}

.truestyle-single-blog-quote-checklist__intro .slashes {
	justify-self: start;
}

.truestyle-single-blog-quote-checklist__intro a {
	color: var(--color-red);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.truestyle-single-blog-quote-checklist__intro a:hover,
.truestyle-single-blog-quote-checklist__intro a:focus {
	color: var(--color-dark-blue);
}

.truestyle-single-blog-quote-checklist__details {
	display: grid;
	align-content: start;
	min-width: 0;
	padding-top: 1rem;
}

.truestyle-single-blog-quote-checklist__list {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-quote-checklist__list-item {
	margin: 0;
	padding: 1rem 0;
	border-top: 1px solid #ded5ca;
	color: var(--color-dark-blue);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.5;
	list-style: none;
}

.truestyle-single-blog-quote-checklist__list-item:last-child {
	border-bottom: 1px solid #ded5ca;
}

.truestyle-single-blog-quote-checklist__details p {
	padding-top: 2em;
}

.truestyle-single-blog-quote-checklist__details ul {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-single-blog-quote-checklist__details li {
	margin: 0;
	padding: 1rem 0;
	border-top: 1px solid #ded5ca;
	color: var(--color-dark-blue);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.5;
	list-style: none;
}

.truestyle-single-blog-quote-checklist__details li:last-child {
	border-bottom: 1px solid #ded5ca;
}

.truestyle-single-blog-quote-checklist__empty {
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius:6px;
	background-color: var(--color-cream);
	text-align: center;
}


@media only screen and (max-width: 900px) {

	.truestyle-single-blog-quote-checklist__inner {
		padding: 2.5rem;
	}

	.truestyle-single-blog-quote-checklist__content {
		grid-template-columns:
			minmax(200px, 0.7fr)
			minmax(0, 1fr);
		gap: 3rem;
	}

	.truestyle-single-blog-quote-checklist--one-column
	.truestyle-single-blog-quote-checklist__content {
		grid-template-columns: minmax(0, 1fr);
	}

}

@media only screen and (max-width: 700px) {

	.truestyle-single-blog-quote-checklist__inner {
		padding: 2rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-quote-checklist__content {
		grid-template-columns: minmax(0, 1fr);
		gap: 2rem;
	}

	.truestyle-single-blog-quote-checklist__details {
		padding-top: 0;
	}

}


@media only screen and (max-width: 500px) {

	.truestyle-single-blog-quote-checklist {
		padding: 1.5rem 0;
	}

	.truestyle-single-blog-quote-checklist__inner {
		padding: 1.75rem 1.5rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-quote-checklist__intro h1,
	.truestyle-single-blog-quote-checklist__intro h2,
	.truestyle-single-blog-quote-checklist__intro h3 {
		font-size: 36px;
	}

	.truestyle-single-blog-quote-checklist__list-item,
	.truestyle-single-blog-quote-checklist__details li {
		padding: 0.85rem 0;
		font-size: 15px;
	}

}






/* SINGLE BLOG INSTALLATION CHECKLIST */

.truestyle-single-blog-installation-checklist {
	width: 100%;
	padding: 2rem 0;
}

.truestyle-single-blog-installation-checklist__inner {
	box-sizing: border-box;
	width: 100%;
	padding: 3.5rem 3rem;
	grid-column: 1/17;
	border-radius: 6px;
	background-color: var(--color-white);
	box-shadow: 0px 14px 36px 0px #2C324B14;
}

.truestyle-single-blog-installation-checklist__layout {
	display: grid;
	grid-template-columns:
		minmax(220px, 0.62fr)
		minmax(0, 1.4fr);
	align-items: start;
	gap: 4rem;
	width: 100%;
	min-width: 0;
}

.truestyle-single-blog-installation-checklist--single-column
.truestyle-single-blog-installation-checklist__layout {
	grid-template-columns: minmax(0, 1fr);
}


.truestyle-single-blog-installation-checklist__intro {
	display: grid;
	align-content: start;
	gap: 1.25rem;
	min-width: 0;
}

.truestyle-single-blog-installation-checklist__intro .slashes {
	justify-self: start;
}

.truestyle-single-blog-installation-checklist__cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: stretch;
	gap: 1rem;
	min-width: 0;
}

.truestyle-single-blog-installation-checklist__card {
	box-sizing: border-box;
	min-width: 0;
	padding: 1.75rem 1.25rem;
	border: 1px solid #e4dbd0;
	border-radius: 6px;
	background-color: var(--color-cream);
}

.truestyle-single-blog-installation-checklist__card-content {
	display: grid;
	align-content: start;
	gap: 1.5rem;
	height: 100%;
	min-width: 0;
}

.truestyle-single-blog-installation-checklist__card-content h3 {
	font-family: "Inter", sans-serif;
	font-weight: 600;
	font-size: 13.5px;
}

.truestyle-single-blog-installation-checklist__card-content ul,
.truestyle-single-blog-installation-checklist__card-content ol {
	display: grid;
	gap: 0.2rem;
	margin: 0;
	padding-left: 1rem;
	list-style-position: outside;
}

.truestyle-single-blog-installation-checklist__card-content ul {
	list-style-type: disc;
}

.truestyle-single-blog-installation-checklist__card-content ol {
	list-style-type: decimal;
}

.truestyle-single-blog-installation-checklist__card-content li {
	margin: 0;
	padding: 0;
	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.5;
}

.truestyle-single-blog-installation-checklist__card-content li::marker {
	color: var(--color-dark-blue);
}

.truestyle-single-blog-installation-checklist__empty {
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
	background-color: var(--color-cream);
	text-align: center;
}


@media only screen and (max-width: 1410px) {

	.truestyle-single-blog-installation-checklist__layout {
		grid-template-columns: 1fr;
	}

}


@media only screen and (max-width: 1000px) {

	.truestyle-single-blog-installation-checklist__inner {
		padding: 3rem 2.5rem;
	}

	.truestyle-single-blog-installation-checklist__cards {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

@media only screen and (max-width: 800px) {

	.truestyle-single-blog-installation-checklist__layout {
		grid-template-columns: minmax(0, 1fr);
		gap: 2.5rem;
	}

	.truestyle-single-blog-installation-checklist__cards {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

}


@media only screen and (max-width: 700px) {

	.truestyle-single-blog-installation-checklist__inner {
		padding: 2rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-installation-checklist__cards {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-single-blog-installation-checklist__card {
		padding: 1.5rem;
	}

}


@media only screen and (max-width: 500px) {

	.truestyle-single-blog-installation-checklist {
		padding: 1.5rem 0;
	}

	.truestyle-single-blog-installation-checklist__inner {
		padding: 1.75rem 1.5rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-installation-checklist__intro h1,
	.truestyle-single-blog-installation-checklist__intro h2,
	.truestyle-single-blog-installation-checklist__intro h3 {
		font-size: 36px;
	}

}










/* Single More Blogs */

.truestyle-more-journal {
	width: 100%;
	padding: 5rem 0 6rem;
	background-color: #F4F0E9;
}

.truestyle-more-journal__inner {
	grid-column: 2 / 16;
	width: 100%;
	border-top: 1px solid #E3DDD2;
	padding-top: 2em;
}

.truestyle-more-journal__header {
	display: grid;
	gap: 1rem;
	margin-bottom: 2.5rem;
}

.truestyle-more-journal__slashes {
	width: 90px;
	height: 16px;

	background-image: repeating-linear-gradient(
		-60deg,
		var(--color-red) 0,
		var(--color-red) 2px,
		transparent 2px,
		transparent 8px
	);
}

.truestyle-more-journal__eyebrow {
	margin: 0;
	color: var(--color-red);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.truestyle-more-journal__title {
	max-width: 560px;
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(40px, 5vw, 58px);
	font-weight: 500;
	line-height: 0.98;
}


.truestyle-more-journal__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.5rem;
	width: 100%;
}

.truestyle-more-journal__card {
	min-width: 0;
	margin: 0;
	border-radius: 6px;
	background-color: var(--color-white);
	box-shadow: 0 12px 28px rgba(44, 50, 75, 0.07);
	overflow: hidden;
}

.truestyle-more-journal__card-link {
	display: grid;
	grid-template-columns: 115px minmax(0, 1fr);
	align-items: stretch;
	gap: 1.25rem;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	min-height: 230px;
	padding: 1rem;
	color: inherit;
	text-decoration: none;
}

.truestyle-more-journal__card-link:hover,
.truestyle-more-journal__card-link:focus {
	color: inherit;
}

.truestyle-more-journal__card-link:focus-visible {
	outline: 2px solid var(--color-red);
	outline-offset: 4px;
}

.truestyle-more-journal__card--no-image
.truestyle-more-journal__card-link {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-more-journal__image {
	width: 100%;
	height: 100%;
	min-height: 198px;
	border-radius: 6px;
	overflow: hidden;
}

.truestyle-more-journal__image-element {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.truestyle-more-journal__content {
	display: grid;
	align-content: start;
	gap: 1rem;
	min-width: 0;
	padding: 1rem 0.75rem 1rem 0;
}

.truestyle-more-journal__card-title {
	margin: 0;

	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: 22px;
	font-weight: 500;
	line-height: 1.05;

	transition: color 0.2s ease;
}

.truestyle-more-journal__card-link:hover
.truestyle-more-journal__card-title,
.truestyle-more-journal__card-link:focus
.truestyle-more-journal__card-title {
	color: var(--color-red);
}

.truestyle-more-journal__excerpt {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 14px;
	line-height: 1.65;
}


@media only screen and (max-width: 1100px) {

	.truestyle-more-journal__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}


@media only screen and (max-width: 800px) {

	.truestyle-more-journal {
		padding: 4rem 0;
	}

	.truestyle-more-journal__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-more-journal__card-link {
		grid-template-columns: 160px minmax(0, 1fr);
		min-height: 210px;
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-more-journal__inner {
		grid-column: 1 / 17;
		padding: 0 1.25rem;
	}

	.truestyle-more-journal__title {
		font-size: 40px;
	}

	.truestyle-more-journal__card-link {
		grid-template-columns: 110px minmax(0, 1fr);
		gap: 1rem;
		min-height: 190px;
		padding: 0.75rem;
	}

	.truestyle-more-journal__image {
		min-height: 170px;
		border-radius: 6px;
	}

	.truestyle-more-journal__content {
		gap: 0.75rem;
		padding: 0.75rem 0.5rem 0.75rem 0;
	}

	.truestyle-more-journal__card-title {
		font-size: 19px;
	}

	.truestyle-more-journal__excerpt {
		font-size: 13px;
		line-height: 1.55;
	}

}


@media only screen and (max-width: 430px) {

	.truestyle-more-journal__card-link {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-more-journal__image {
		height: 210px;
	}

	.truestyle-more-journal__content {
		padding: 0.75rem;
	}

}








/* TRUESTYLE SINGLE BLOG SERVICES CTA */

.truestyle-single-blog-services-cta {
	width: 100%;
	padding: 5rem 0;
	background-color: var(--color-cream);
}

.truestyle-single-blog-services-cta__inner {
    grid-column: 2 / 16;
    width: 100%;
    gap: 2em;
    display: grid;
}

.truestyle-single-blog-services-cta__header {
	display: grid;
	justify-self: center;
	gap: 1rem;
	max-width: 850px;
	text-align: center;
}

.truestyle-single-blog-services-cta__header-content {
	display: grid;
	gap: 1rem;
}

.truestyle-single-blog-services-cta__content {
	display: grid;
	justify-items: center;
	gap: 1.25rem;
	width: 100%;
}


.truestyle-single-blog-services-cta__content p {
	max-width: 650px;
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.7;
}

.truestyle-single-blog-services-cta__service-content {
	display: grid;
	gap: 0.5em;
}

.truestyle-single-blog-services-cta__service-content h3 {
	font-family: "Inter", serif;
	font-size: 15px;
	font-weight: 600;
}

.truestyle-single-blog-services-cta__panel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(170px, 200px);
	align-items: center;
	gap: 2.5rem;
	box-sizing: border-box;
	width: 100%;
	padding: 3rem;
	border-radius: 6px;
	background-color: var(--color-white);
	box-shadow: 0 14px 35px rgba(44, 50, 75, 0.07);
}

.truestyle-single-blog-services-cta__services {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	align-items: start;
	gap: 2.5rem;
	min-width: 0;
}

.truestyle-single-blog-services-cta__service {
	min-width: 0;
}

.truestyle-single-blog-services-cta__service-link {
	display: grid;
	gap: 0.75rem;

	color: inherit;
	text-decoration: none;
}

.truestyle-single-blog-services-cta__service-title {
	margin: 0;

	color: var(--color-dark-blue);
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
}

.truestyle-single-blog-services-cta__service-description {
	margin: 0;

	color: var(--color-dark-blue);
	font-size: 14px;
	line-height: 1.65;
}

.truestyle-single-blog-services-cta__service-link:hover
.truestyle-single-blog-services-cta__service-title,
.truestyle-single-blog-services-cta__service-link:focus
.truestyle-single-blog-services-cta__service-title {
	color: var(--color-red);
}

.truestyle-single-blog-services-cta__button-wrapper {
	display: flex;
	justify-content: flex-end;
}

.truestyle-single-blog-services-cta__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 100%;
	min-height: 48px;
	padding: 0.75rem 2rem;

	border-radius: 999px;
	background-color: var(--color-red);

	color: var(--color-white);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;

	transition:
		background-color 0.2s ease,
		transform 0.2s ease;
}

.truestyle-single-blog-services-cta__button:hover,
.truestyle-single-blog-services-cta__button:focus {
	background-color: var(--color-dark-blue);
	color: var(--color-white);
	transform: translateY(-2px);
}

.truestyle-single-blog-services-cta__empty {
	padding: 2rem;

	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 6px;
	background-color: var(--color-cream);

	text-align: center;
}

.truestyle-single-blog-services-cta__empty p {
	margin: 0;
}

@media only screen and (max-width: 1000px) {

	.truestyle-single-blog-services-cta__panel {
		grid-template-columns: minmax(0, 1fr);
		gap: 2rem;
	}

	.truestyle-single-blog-services-cta__button-wrapper {
		justify-content: flex-start;
	}

	.truestyle-single-blog-services-cta__button {
		width: auto;
		min-width: 190px;
	}

}


@media only screen and (max-width: 800px) {

	.truestyle-single-blog-services-cta {
		padding: 4rem 0;
	}

	.truestyle-single-blog-services-cta__services {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-single-blog-services-cta__inner {
		grid-column: 1 / 17;
		padding: 0 1.25rem;
	}

	.truestyle-single-blog-services-cta__header {
		margin-bottom: 2rem;
	}

	.truestyle-single-blog-services-cta__content h1,
	.truestyle-single-blog-services-cta__content h2,
	.truestyle-single-blog-services-cta__content h3 {
		font-size: 38px;
	}

	.truestyle-single-blog-services-cta__panel {
		padding: 2rem;
		border-radius: 6px;
	}

	.truestyle-single-blog-services-cta__services {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.75rem;
	}

	.truestyle-single-blog-services-cta__button {
		width: 100%;
	}

}



















/* TRUESTYLE SINGLE BLOG JOURNEY GRID */

.truestyle-single-blog-journey-grid {
	width: 100%;
	padding: 4rem 0;

	border-top: 1px solid #ded8d0;
	background-color: var(--color-white);
}

.truestyle-single-blog-journey-grid__inner {
	grid-column: 2 / 16;
	width: 100%;
}

.truestyle-single-blog-journey-grid__header {
	display: grid;
	justify-items: center;
	gap: 1rem;
	max-width: 680px;
	margin: 0 auto 2.5rem;
	text-align: center;
}

.truestyle-single-blog-journey-grid__slashes {
	width: 76px;
	height: 15px;

	background-image: repeating-linear-gradient(
		-60deg,
		var(--color-red) 0,
		var(--color-red) 2px,
		transparent 2px,
		transparent 8px
	);
}

.truestyle-single-blog-journey-grid__header-content {
	display: grid;
	justify-items: center;
	gap: 1rem;
	width: 100%;
}

.truestyle-single-blog-journey-grid__header-content > :first-child {
	margin-top: 0;
}

.truestyle-single-blog-journey-grid__header-content > :last-child {
	margin-bottom: 0;
}

.truestyle-single-blog-journey-grid__header-content label,
.truestyle-single-blog-journey-grid__header-content h6 {
	color: var(--color-red);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.truestyle-single-blog-journey-grid__header-content h1,
.truestyle-single-blog-journey-grid__header-content h2,
.truestyle-single-blog-journey-grid__header-content h3 {
	margin: 0;

	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(34px, 4vw, 48px);
	font-weight: 500;
	line-height: 1.05;
}

.truestyle-single-blog-journey-grid__header-content p {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.7;
}

.truestyle-single-blog-journey-grid__track {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	padding: 1.5rem 1rem;
	border: 1px solid #e4dbd0;
	border-radius: 28px;
	background-color: var(--color-cream);
	overflow: hidden;
}

.truestyle-single-blog-journey-grid__track::before {
	content: "";
	position: absolute;
	top: 50%;
	right: 2rem;
	left: 2rem;
	height: 2px;
	background-color: rgba(211, 37, 31, 0.35);
	transform: translateY(-50%);
}


.truestyle-single-blog-journey-grid__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: repeat(
		auto-fit,
		minmax(125px, 1fr)
	);
	align-items: stretch;
	gap: 0.8rem;
	width: 100%;
}


.truestyle-single-blog-journey-grid__card {
	display: grid;
	align-content: start;
	gap: 0.65rem;
	box-sizing: border-box;
	min-width: 0;
	min-height: 160px;
	padding: 1rem;
	border-radius: 20px;
	background-color: var(--color-white);
	box-shadow: 0 8px 22px rgba(44, 50, 75, 0.06);
	color: inherit;
	text-decoration: none;
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.truestyle-single-blog-journey-grid__card:nth-child(even) {
	background-color: #f8f4ec;
}

.truestyle-single-blog-journey-grid__card:hover,
.truestyle-single-blog-journey-grid__card:focus {
	color: inherit;
	transform: translateY(-4px);
	box-shadow: 0 13px 28px rgba(44, 50, 75, 0.11);
}

.truestyle-single-blog-journey-grid__card:focus-visible {
	outline: 2px solid var(--color-red);
	outline-offset: 4px;
}

.truestyle-single-blog-journey-grid__number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background-color: var(--color-red);
	color: var(--color-white);
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
}

.truestyle-single-blog-journey-grid__card--no-number {
	padding-top: 2rem;
}


.truestyle-single-blog-journey-grid__title {
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.25;
}

.truestyle-single-blog-journey-grid__summary {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 12px;
	line-height: 1.5;
}


.truestyle-single-blog-journey-grid__empty {
	margin: 0 2rem;
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 8px;
	background-color: var(--color-cream);
	text-align: center;
}

.truestyle-single-blog-journey-grid__empty p {
	margin: 0;
}


@media only screen and (max-width: 1000px) {

	.truestyle-single-blog-journey-grid__grid {
		grid-template-columns: repeat(
			4,
			minmax(0, 1fr)
		);
	}

	.truestyle-single-blog-journey-grid__track::before {
		display: none;
	}

}


@media only screen and (max-width: 760px) {

	.truestyle-single-blog-journey-grid__grid {
		grid-template-columns: repeat(
			2,
			minmax(0, 1fr)
		);
	}

}


@media only screen and (max-width: 600px) {

	.truestyle-single-blog-journey-grid {
		padding: 3rem 0;
	}

	.truestyle-single-blog-journey-grid__inner {
		grid-column: 1 / 17;
		padding: 0 1.25rem;
	}

	.truestyle-single-blog-journey-grid__track {
		padding: 1rem;
		border-radius: 22px;
	}

	.truestyle-single-blog-journey-grid__header {
		margin-bottom: 2rem;
	}

	.truestyle-single-blog-journey-grid__header-content h1,
	.truestyle-single-blog-journey-grid__header-content h2,
	.truestyle-single-blog-journey-grid__header-content h3 {
		font-size: 36px;
	}

}


@media only screen and (max-width: 430px) {

	.truestyle-single-blog-journey-grid__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-single-blog-journey-grid__card {
		min-height: auto;
	}

}
















/* TRUESTYLE BLOG ARCHIVE HERO */

.truestyle-blog-archive-hero {
	width: 100%;
	padding: 5em 0;
	overflow: hidden;
	background-color: var(--color-cream);
}

.truestyle-blog-archive-hero__inner {
	display: grid;
	grid-template-columns: 30% 1fr;
	align-items: start;
	gap: 40px;
	box-sizing: border-box;
	padding: 0 36px;
	grid-column: 2/16;
	padding-top: 3em;
	border-top: 1px solid #E3DDD2;
}

.truestyle-blog-archive-hero__sidebar {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding-top: 0;
	gap: 1em;
}

.truestyle-blog-archive-hero__sidebar .slashes {
	justify-content: start;
}


.truestyle-blog-archive-hero__heading-content {
	display: grid;
	gap: 1em;
}

.truestyle-blog-archive-hero__topics {
	display: grid;
	gap: 13px;
	box-sizing: border-box;
	width: 100%;
	margin-top: 54px;
	padding: 20px 26px 24px;
	border-radius: 22px;
	background-color: var(--color-white);
	box-shadow: 0 12px 30px rgba(44, 50, 75, 0.06);
}

.truestyle-blog-archive-hero__topics-heading {
	margin: 0;
	padding: 0 0 11px;
	border-bottom: 1px solid #e2dcd4;
	color: var(--color-dark-blue);
	font-family: "Inter", sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2.5px;
}

.truestyle-blog-archive-hero__topics-list {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-blog-archive-hero__topic {
	display: grid;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.truestyle-blog-archive-hero__topic-title {
	color: var(--color-dark-blue);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
	text-decoration: none;
}

.truestyle-blog-archive-hero__topic-title:hover,
.truestyle-blog-archive-hero__topic-title:focus {
	color: var(--color-red);
}

.truestyle-blog-archive-hero__topic-description {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 12px;
	line-height: 1.55;
}

.truestyle-blog-archive-hero__feature {
	position: relative;
	min-width: 0;
	padding-bottom: 116px;
}

.truestyle-blog-archive-hero__image-link {
	display: block;
	width: 100%;
	height: 560px;

	overflow: hidden;

	border-radius: 26px;
	background-color: #e8e5df;
}

.truestyle-blog-archive-hero__image,
.truestyle-blog-archive-hero__image-placeholder {
	display: block;
	width: 100%;
	height: 100%;
}

.truestyle-blog-archive-hero__image {
	object-fit: cover;
	object-position: center;
}

.truestyle-blog-archive-hero__image-placeholder {
	background-color: #e8e5df;
}

.truestyle-blog-archive-hero__lead-card {
	position: absolute;
	bottom: 0;
	left: 36px;
	z-index: 2;
	box-sizing: border-box;
	width: min(430px, calc(100% - 72px));
	padding: 29px 29px 27px;
	border-radius: 22px;
	background-color: var(--color-white);
	box-shadow: 0 14px 34px rgba(44, 50, 75, 0.12);
}

.truestyle-blog-archive-hero__lead-label {
	margin: 0 0 24px;
	color: var(--color-red);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.truestyle-blog-archive-hero__lead-title {
	margin: 0 0 10px;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: 43px;
	font-weight: 500;
	line-height: 0.95;
}

.truestyle-blog-archive-hero__lead-title a {
	color: inherit;
	text-decoration: none;
}

.truestyle-blog-archive-hero__lead-title a:hover,
.truestyle-blog-archive-hero__lead-title a:focus {
	color: var(--color-red);
}

.truestyle-blog-archive-hero__lead-excerpt {
	margin: 0 0 18px;
	color: var(--color-dark-blue);
	font-size: 14px;
	line-height: 1.55;
}

.truestyle-blog-archive-hero__lead-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
}

.truestyle-blog-archive-hero__lead-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.5;
}

.truestyle-blog-archive-hero__lead-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-height: 44px;
	padding: 0 29px;
	border-radius: 999px;
	background-color: var(--color-red);
	color: var(--color-white);
	font-size: 12px;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	transition:
		background-color 0.2s ease,
		transform 0.2s ease;
}

.truestyle-blog-archive-hero__lead-button:hover,
.truestyle-blog-archive-hero__lead-button:focus {
	background-color: var(--color-dark-blue);
	color: var(--color-white);
	transform: translateY(-2px);
}

@media only screen and (max-width: 950px) {

	.truestyle-blog-archive-hero__inner {
		grid-template-columns:
			220px
			minmax(0, 1fr);
		gap: 28px;
		padding: 0 28px;
	}

	.truestyle-blog-archive-hero__heading-content h1 {
		font-size: 50px;
	}

	.truestyle-blog-archive-hero__image-link {
		height: 500px;
	}

	.truestyle-blog-archive-hero__lead-card {
		left: 24px;
		width: calc(100% - 48px);
	}

	.truestyle-blog-archive-hero__lead-title {
		font-size: 39px;
	}

}

@media only screen and (max-width: 760px) {

	.truestyle-blog-archive-hero {
		padding: 3em 0;
	}

	.truestyle-blog-archive-hero__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 36px;
	}

	.truestyle-blog-archive-hero__topics {
		margin-top: 34px;
	}

	.truestyle-blog-archive-hero__feature {
		padding-bottom: 0;
	}

	.truestyle-blog-archive-hero__image-link {
		height: 430px;
	}

	.truestyle-blog-archive-hero__lead-card {
		position: relative;
		bottom: auto;
		left: auto;

		width: calc(100% - 48px);
		margin: -115px auto 0;
	}

}

@media only screen and (max-width: 520px) {

	.truestyle-blog-archive-hero__inner {
		padding: 0 20px;
	}

	.truestyle-blog-archive-hero__heading-content h1 {
		font-size: 48px;
	}

	.truestyle-blog-archive-hero__image-link {
		height: 330px;
		border-radius: 20px;
	}

	.truestyle-blog-archive-hero__lead-card {
		width: calc(100% - 24px);
		margin-top: -68px;
		padding: 24px 22px;
		border-radius: 20px;
	}

	.truestyle-blog-archive-hero__lead-title {
		font-size: 36px;
		line-height: 1;
	}

	.truestyle-blog-archive-hero__lead-footer {
		align-items: flex-start;
		flex-direction: column;
	}

	.truestyle-blog-archive-hero__lead-button {
		width: 100%;
	}

}
















/* TRUESTYLE JOURNAL LIST */

.truestyle-journal-list {
	width: 100%;
	padding: 5rem 0 6rem;
	background-color: var(--color-white);
}

.truestyle-journal-list__inner {
    box-sizing: border-box;
    padding: 0 36px;
    grid-column: 2 / 16;
}

.truestyle-journal-list__header {
	max-width: 640px;
	margin-bottom: 2.75rem;
}

.truestyle-journal-list__header .slashes {
	justify-content: start;
	padding-bottom: 1em;
}

.truestyle-journal-list__slashes,
.truestyle-journal-list__featured-slashes {
	width: 76px;
	height: 13px;

	background-image: repeating-linear-gradient(
		-60deg,
		var(--color-red) 0,
		var(--color-red) 2px,
		transparent 2px,
		transparent 7px
	);
}

.truestyle-journal-list__slashes {
	margin-bottom: 1.25rem;
}

.truestyle-journal-list__eyebrow {
	margin: 0 0 1rem;

	color: var(--color-red);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 3px;
	text-transform: uppercase;
}

.truestyle-journal-list__heading {
	max-width: 620px;
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(38px, 4vw, 52px);
	font-weight: 500;
	line-height: 1.08;
}

.truestyle-journal-list__description {
	max-width: 620px;
	margin-top: 1.25rem;

	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.7;
}

.truestyle-journal-list__description > :first-child {
	margin-top: 0;
}

.truestyle-journal-list__description > :last-child {
	margin-bottom: 0;
}

.truestyle-journal-list__layout {
	display: grid;
	align-items: stretch;
	gap: 2.5rem;
}

.truestyle-journal-list__layout--has-sidebar {
	grid-template-columns:
		minmax(0, 1fr)
		270px;
}

.truestyle-journal-list__layout--no-sidebar {
	grid-template-columns: minmax(0, 1fr);
}

.truestyle-journal-list__main {
	display: grid;
	align-content: start;
	gap: 2rem;
	min-width: 0;
}

.truestyle-journal-list__lead {
	display: grid;
	grid-template-columns:
		minmax(0, 0.9fr)
		minmax(260px, 1.1fr);
	gap: 2rem;

	min-height: 345px;
	padding: 1.75rem;

	border: 1px solid #e3ddd5;
	border-radius: 24px;
	background-color: var(--color-white);
}

.truestyle-journal-list__lead-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-width: 0;
	padding: 0.75rem 0.25rem 0.5rem;
}

.truestyle-journal-list__lead-label {
	margin: 0 0 1.25rem;

	color: var(--color-red);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2.5px;
}

.truestyle-journal-list__lead-title {
	margin: 0 0 1.25rem;

	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(28px, 3vw, 39px);
	font-weight: 500;
	line-height: 1.06;
}

.truestyle-journal-list__lead-title a {
	color: inherit;
	text-decoration: none;
}

.truestyle-journal-list__lead-title a:hover,
.truestyle-journal-list__lead-title a:focus {
	color: var(--color-red);
}

.truestyle-journal-list__lead-excerpt {
	margin: 0 0 1.5rem;

	color: var(--color-dark-blue);
	font-size: 13px;
	line-height: 1.65;
}

.truestyle-journal-list__lead-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin: auto 0 0;

	color: var(--color-dark-blue);
	font-size: 11px;
	font-weight: 600;
	line-height: 1.5;
}

.truestyle-journal-list__lead-image-link {
	display: block;
	min-width: 0;
	height: 100%;
	max-height: 290px;
	overflow: hidden;
	border-radius: 20px;
	background-color: var(--color-cream);
}

.truestyle-journal-list__lead-image,
.truestyle-journal-list__image-placeholder {
	display: block;
	width: 100%;
	height: 100%;
}

.truestyle-journal-list__lead-image {
	object-fit: cover;
	object-position: center;
}

.truestyle-journal-list__image-placeholder {
	min-height: 220px;
	background-color: var(--color-cream);
}

.truestyle-journal-list__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2rem;
}

.truestyle-journal-list__card {
	min-width: 0;
	overflow: hidden;

	border: 1px solid #e3ddd5;
	border-radius: 22px;
	background-color: var(--color-white);
}

.truestyle-journal-list__card-link {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.truestyle-journal-list__card-image-wrapper {
	height: 205px;
	margin: 1rem 1rem 0;
	overflow: hidden;
	border-radius: 17px;
	background-color: var(--color-cream);
}

.truestyle-journal-list__card-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;

	transition: transform 0.35s ease;
}

.truestyle-journal-list__card-link:hover
.truestyle-journal-list__card-image {
	transform: scale(1.035);
}

.truestyle-journal-list__card-content {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 1.35rem 1.25rem 1.5rem;
}

.truestyle-journal-list__card-category {
	margin: 0 0 0.9rem;
	color: var(--color-red);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2px;
}

.truestyle-journal-list__card-title {
	margin: 0 0 0.65rem;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: 25px;
	font-weight: 500;
	line-height: 1.08;
}

.truestyle-journal-list__card-excerpt {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 12px;
	line-height: 1.6;
}

.truestyle-journal-list__card-link:hover
.truestyle-journal-list__card-title,
.truestyle-journal-list__card-link:focus
.truestyle-journal-list__card-title {
	color: var(--color-red);
}

.truestyle-journal-list__sidebar {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 2rem 1.5rem;

	border: 1px solid #e3ddd5;
	border-radius: 22px;
	background-color: var(--color-cream);
}

.truestyle-journal-list__sidebar-eyebrow {
	margin: 0 0 1rem;

	color: var(--color-red);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 2.5px;
}

.truestyle-journal-list__sidebar-intro {
	margin: 0 0 2rem;

	color: var(--color-dark-blue);
	font-size: 12px;
	line-height: 1.65;
}

.truestyle-journal-list__featured-list {
	display: grid;
	gap: 2.5rem;
}

.truestyle-journal-list__featured-card {
    display: grid;
    padding: 1.5rem;
    border-radius: 18px;
    background-color: var(--color-white);
    box-shadow: 0 12px 28px rgba(44, 50, 75, 0.08);
    gap: 1em;
    justify-items: start;
}

.truestyle-journal-list__featured-slashes {
	width: 64px;
	margin-bottom: 1.25rem;
}

.truestyle-journal-list__featured-title {
	font-size: 25px;;
}

.truestyle-journal-list__featured-title a {
	color: inherit;
	text-decoration: none;
}

.truestyle-journal-list__featured-title a:hover,
.truestyle-journal-list__featured-title a:focus {
	color: var(--color-red);
}

.truestyle-journal-list__featured-excerpt {
	color: var(--color-dark-blue);
	font-size: 11px;
	line-height: 1.65;
}

.truestyle-journal-list__featured-link {
	color: var(--color-red);
	font-size: 10px;
	font-weight: 700;
	text-decoration: none;
}

.truestyle-journal-list__featured-link:hover,
.truestyle-journal-list__featured-link:focus {
	color: var(--color-dark-blue);
}

.truestyle-journal-list__pagination {
	margin-top: 1rem;
}

.truestyle-journal-list__pagination ul {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem;

	margin: 0;
	padding: 0;

	list-style: none;
}

.truestyle-journal-list__pagination a,
.truestyle-journal-list__pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 42px;
	padding: 0.5rem 0.8rem;
	border-radius: 999px;
	background-color: var(--color-cream);
	color: var(--color-dark-blue);
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
}

.truestyle-journal-list__pagination .current,
.truestyle-journal-list__pagination a:hover,
.truestyle-journal-list__pagination a:focus {
	background-color: var(--color-red);
	color: var(--color-white);
}

.truestyle-journal-list__empty {
	padding: 3rem;
	border: 1px dashed #d5cec5;
	border-radius: 20px;
	background-color: var(--color-cream);
	text-align: center;
}

@media only screen and (max-width: 980px) {

	.truestyle-journal-list__layout--has-sidebar {
		grid-template-columns:
			minmax(0, 1fr)
			235px;
		gap: 1.75rem;
	}

	.truestyle-journal-list__lead {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-journal-list__lead-image-link {
		grid-row: 1;
		height: 320px;
	}

	.truestyle-journal-list__lead-content {
		grid-row: 2;
	}

	.truestyle-journal-list__grid {
		gap: 1.5rem;
	}

}

@media only screen and (max-width: 760px) {

	.truestyle-journal-list {
		padding: 4rem 0;
	}

	.truestyle-journal-list__layout--has-sidebar {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-journal-list__sidebar {
		order: 2;
	}

	.truestyle-journal-list__featured-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.5rem;
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-journal-list__inner {
		padding: 0 20px;
	}

	.truestyle-journal-list__heading {
		font-size: 39px;
	}

	.truestyle-journal-list__lead {
		gap: 1.5rem;
		padding: 1rem;
		border-radius: 20px;
	}

	.truestyle-journal-list__lead-content {
		padding: 0.5rem;
	}

	.truestyle-journal-list__lead-image-link {
		height: 270px;
		min-height: 0;
	}

	.truestyle-journal-list__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-journal-list__featured-list {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-journal-list__featured-card {
		min-height: auto;
	}

}













/* TRUESTYLE ARCHIVE SERVICES GRID */

.truestyle-archive-services-grid {
	width: 100%;
	padding: 4.5rem 0 5.5rem;
	background-color: var(--color-cream);
}

.truestyle-archive-services-grid__inner {
	box-sizing: border-box;
	border-top: 1px solid #ddd7ce;
	padding: 0 36px;
	grid-column: 2/16;
	padding-top: 2em;
}

.truestyle-archive-services-grid__header {
	max-width: 850px;
	margin-bottom: 3.5rem;
}

.truestyle-archive-services-grid__header .slashes {
	justify-content: start;
	padding-bottom: 2em;
}

.truestyle-archive-services-grid__slashes {
	width: 84px;
	height: 14px;
	margin-bottom: 1.25rem;

	background-image: repeating-linear-gradient(
		-60deg,
		var(--color-red) 0,
		var(--color-red) 2px,
		transparent 2px,
		transparent 7px
	);
}

.truestyle-archive-services-grid__header-content > :first-child {
	margin-top: 0;
}

.truestyle-archive-services-grid__header-content > :last-child {
	margin-bottom: 0;
}

.truestyle-archive-services-grid__header-content label,
.truestyle-archive-services-grid__header-content h6 {
	display: block;
	margin: 0 0 0.75rem;

	color: var(--color-red);
	font-family: "Inter", sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 3px;
	text-transform: none;
}

.truestyle-archive-services-grid__header-content h1,
.truestyle-archive-services-grid__header-content h2 {
	max-width: 850px;
	margin: 0;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(44px, 5vw, 64px);
	font-weight: 500;
	line-height: 1.02;
}

.truestyle-archive-services-grid__header-content p {
	margin: 0;
	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.7;
}

.truestyle-archive-services-grid__items {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
}

.truestyle-archive-services-grid__item {
	display: grid;
	grid-template-columns:
		minmax(180px, 0.75fr)
		minmax(0, 1fr);
	gap: 1.75rem;
	box-sizing: border-box;
	min-width: 0;
	min-height: 320px;
	padding: 1.4rem;
	border-radius: 24px;
	background-color: var(--color-white);
	box-shadow: 0 15px 36px rgba(44, 50, 75, 0.06);
	color: inherit;
	text-decoration: none;
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}

.truestyle-archive-services-grid__item--linked:hover,
.truestyle-archive-services-grid__item--linked:focus {
	color: inherit;
	transform: translateY(-4px);
	box-shadow: 0 20px 42px rgba(44, 50, 75, 0.11);
}

.truestyle-archive-services-grid__item--linked:focus-visible {
	outline: 2px solid var(--color-red);
	outline-offset: 4px;
}

.truestyle-archive-services-grid__image-wrapper {
	min-width: 0;
	height: 100%;
	min-height: 275px;

	overflow: hidden;
	border-radius: 19px;
	background-color: #e8e5df;
}

.truestyle-archive-services-grid__image {
	display: block;
	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;
}

.truestyle-archive-services-grid__item-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	padding: 0.75rem 0.25rem;
}

.truestyle-archive-services-grid__item-content > :first-child {
	margin-top: 0;
}

.truestyle-archive-services-grid__item-content > :last-child {
	margin-bottom: 0;
}

.truestyle-archive-services-grid__item-content label,
.truestyle-archive-services-grid__item-content h6 {
	display: block;
	margin: 0 0 1.25rem;

	color: var(--color-red);
	font-family: "Inter", sans-serif;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 3px;
}

.truestyle-archive-services-grid__item-content h2,
.truestyle-archive-services-grid__item-content h3 {
	margin: 0 0 1.25rem;

	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(30px, 3vw, 40px);
	font-weight: 500;
	line-height: 1.02;
}

.truestyle-archive-services-grid__item-content p {
	margin: 0;

	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.7;
}

.truestyle-archive-services-grid__empty {
	padding: 2rem;
	border: 1px dashed #ccc4ba;
	border-radius: 16px;
	background-color: var(--color-white);
	text-align: center;
}

.truestyle-archive-services-grid__empty p {
	margin: 0;
}

@media only screen and (max-width: 1000px) {

	.truestyle-archive-services-grid__items {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-archive-services-grid__item {
		grid-template-columns:
			minmax(220px, 0.7fr)
			minmax(0, 1fr);
	}

}

@media only screen and (max-width: 650px) {

	.truestyle-archive-services-grid {
		padding: 3.5rem 0 4rem;
	}

	.truestyle-archive-services-grid__inner {
		padding: 0 20px;
	}

	.truestyle-archive-services-grid__header {
		margin-bottom: 2.5rem;
	}

	.truestyle-archive-services-grid__header-content h1,
	.truestyle-archive-services-grid__header-content h2 {
		font-size: 42px;
	}

	.truestyle-archive-services-grid__item {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.25rem;
		padding: 1rem;
	}

	.truestyle-archive-services-grid__image-wrapper {
		height: 280px;
		min-height: 0;
	}

	.truestyle-archive-services-grid__item-content {
		padding: 0.75rem;
	}

}











/* ARCHIVE JOURNAL LINKS */

.truestyle-archive-journal-links {
	width: 100%;
	padding: 4.5rem 0 5.5rem;
	background-color: var(--color-white);
}

.truestyle-archive-journal-links__inner {
	box-sizing: border-box;
	grid-column: 2/16;
	padding: 0 36px;
	border-top: 1px solid #ded8d0;
	padding-top: 2em;
}

.truestyle-archive-journal-links__header {
	display: grid;
	justify-items: center;
	grid-column: 2/16;
	text-align: center;
	padding-bottom: 2em;
}

.truestyle-archive-journal-links__header .slashes {
	padding-bottom: 2em;
}

.truestyle-archive-journal-links__header-content {
	display: grid;
	justify-items: center;
	gap: 1rem;
	width: 100%;
}

.truestyle-archive-journal-links__header-content label,
.truestyle-archive-journal-links__header-content h6 {
	display: block;
	margin: 0;

	color: var(--color-red);
	font-family: "Inter", sans-serif;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 3px;
	text-transform: none;
}

.truestyle-archive-journal-links__header-content h1,
.truestyle-archive-journal-links__header-content h2 {
	max-width: 680px;
	margin: 0;

	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(42px, 4.5vw, 58px);
	font-weight: 500;
	line-height: 0.98;
}

.truestyle-archive-journal-links__header-content p {
	max-width: 620px;
	margin: 0;

	color: var(--color-dark-blue);
	font-size: 15px;
	line-height: 1.7;
}

.truestyle-archive-journal-links__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.5rem;
}

.truestyle-archive-journal-links__card {
	position: relative;
	gap: 1em;
	display: grid;
	flex-direction: column;
	align-items: flex-start;

	box-sizing: border-box;
	min-width: 0;
	min-height: 290px;
	padding: 2rem 1.75rem;

	border: 1px solid #ded5ca;
	border-radius: 22px;
	background-color: var(--color-cream);

	color: inherit;
	text-decoration: none;

	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease,
		background-color 0.2s ease;
}

.truestyle-archive-journal-links__card .slashes {
	justify-content: start;
}


.truestyle-archive-journal-links__card-content {
	min-width: 0;
	width: 100%;
}

.truestyle-archive-journal-links__card-content h2,
.truestyle-archive-journal-links__card-content h3 {
	margin: 0 0 1.5rem;
	color: var(--color-dark-blue);
	font-family: "Playfair Display", serif;
	font-size: clamp(27px, 2.4vw, 35px);
	font-weight: 500;
	line-height: 1.02;
}

.truestyle-archive-journal-links__empty {
	padding: 2rem;

	border: 1px dashed #cec7be;
	border-radius: 18px;
	background-color: var(--color-cream);

	text-align: center;
}

@media only screen and (max-width: 1000px) {

	.truestyle-archive-journal-links__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

}

@media only screen and (max-width: 600px) {

	.truestyle-archive-journal-links {
		padding: 3.5rem 0 4rem;
	}

	.truestyle-archive-journal-links__inner {
		padding: 0 20px;
	}

	.truestyle-archive-journal-links__header {
		padding: 2em 0;
	}

	.truestyle-archive-journal-links__header-content h1,
	.truestyle-archive-journal-links__header-content h2 {
		font-size: 40px;
	}

	.truestyle-archive-journal-links__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.truestyle-archive-journal-links__card {
		min-height: 250px;
	}

}













/* TRUESTYLE GALLERY GRID */

.truestyle-gallery-grid {
	width: 100%;
	padding: 4.5rem 0 5.5rem;
	background-color: var(--color-white);
}

.truestyle-gallery-grid__inner {
	display: grid;
	grid-column: 2/16;
	gap: 2em;
}

.truestyle-gallery-grid__header {
	max-width: 760px;
	justify-self: center;
}

.truestyle-gallery-grid__header .slashes {
	margin-bottom: 1.25rem;
}

.truestyle-gallery-grid__header-content {
	display: grid;
	gap: 1rem;
}

.truestyle-gallery-grid__images {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-items: stretch;
	gap: 1.5rem;
}

.truestyle-gallery-grid__item {
	position: relative;

	min-width: 0;
	margin: 0;

	overflow: hidden;
	border-radius: 24px;
	background-color: var(--color-cream);
}

.truestyle-gallery-grid__item::before {
	content: "";

	display: block;
	padding-top: 72%;
}

.truestyle-gallery-grid__image {
	position: absolute;
	inset: 0;

	display: block;
	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;

	transition: transform 0.4s ease;
}

.truestyle-gallery-grid__item:hover
.truestyle-gallery-grid__image {
	transform: scale(1.025);
}

.truestyle-gallery-grid__empty {
	padding: 2rem;

	border: 1px dashed #cec7be;
	border-radius: 18px;
	background-color: var(--color-cream);

	text-align: center;
}

.truestyle-gallery-grid__empty p {
	margin: 0;
	color: var(--color-dark-blue);
}


@media only screen and (max-width: 900px) {

	.truestyle-gallery-grid {
		padding: 4rem 0;
	}

	.truestyle-gallery-grid__inner {
		padding: 0 28px;
	}

	.truestyle-gallery-grid__header {
		margin-bottom: 2.5rem;
	}

	.truestyle-gallery-grid__images {
		gap: 1.25rem;
	}

	.truestyle-gallery-grid__item {
		border-radius: 20px;
	}

}


@media only screen and (max-width: 650px) {

	.truestyle-gallery-grid {
		padding: 3.5rem 0 4rem;
	}

	.truestyle-gallery-grid__inner {
		padding: 0 20px;
	}

	.truestyle-gallery-grid__header-content h1,
	.truestyle-gallery-grid__header-content h2 {
		font-size: 40px;
	}

	.truestyle-gallery-grid__images {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}

	.truestyle-gallery-grid__item::before {
		padding-top: 72%;
	}

}

@media only screen and (max-width: 420px) {

	.truestyle-gallery-grid__header-content h1,
	.truestyle-gallery-grid__header-content h2 {
		font-size: 36px;
	}

	.truestyle-gallery-grid__item {
		border-radius: 18px;
	}


}
















/* PROJECTS ARCHIVE */

.truestyle-project-archive {
	padding: 5em 0;
}

.truestyle-project-archive__inner {
	display: grid;
	grid-column: 2 / 16;
	row-gap: 4em;
}

.truestyle-project-archive__header {
	display: grid;
	justify-self: center;
	justify-items: center;
	gap: 1em;
	width: 100%;
	max-width: 620px;
	text-align: center;
}

.truestyle-project-archive__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1em;
	width: 100%;
}

.truestyle-project-archive__card {
	min-width: 0;
	margin: 0;
	overflow: hidden;
	border-radius: 6px;
	background-color: var(--color-cream);
}

.truestyle-project-archive__image-wrapper {
	position: relative;
	width: 100%;
	background-color: var(--color-cream);
	max-height: 400px;
	height: 100%;
}

.truestyle-project-archive__image-wrapper img{
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
	aspect-ratio: 1/1;
}

.truestyle-project-archive__card-content {
    display: grid;
    padding: 2em;
    gap: 1em;
	text-align: center;
}

.truestyle-project-archive__pagination {
	grid-column: 1 / -1;
	margin-top: 3em;
}

.truestyle-project-archive__pagination .nav-links {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0.5em;
}

.truestyle-project-archive__pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0.6em 1em;
	border-radius: 999px;
	background-color: var(--color-cream);
	color: var(--blue);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	transition:
		background-color 0.2s ease,
		color 0.2s ease;
}

.truestyle-project-archive__empty {
	display: grid;
	justify-items: center;
	gap: 1em;
	padding: 3em;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 22px;
	background-color: var(--color-cream);
	text-align: center;
}

.truestyle-project-archive__card-button {
	margin-top: 2em;
}

.truestyle-project-archive__card-link {
	display: grid;
}


@media only screen and (max-width: 900px) {

	.truestyle-project-archive {
		padding: 4em 0;
	}

	.truestyle-project-archive__inner {
		grid-column: 2 / 16;
	}

	.truestyle-project-archive__header {
		margin-bottom: 2.5em;
	}

	.truestyle-project-archive__card-content {
		padding: 1.5em;
	}

	.truestyle-project-archive__image-wrapper {
		max-height: 250px;
	}

}

@media only screen and (max-width: 650px) {

	.truestyle-project-archive {
		padding: 3em 0;
	}

	.truestyle-project-archive__inner {
		grid-column: 1 / 17;
		padding: 0 20px;
	}

	.truestyle-project-archive__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 1.25em;
	}

	.truestyle-project-archive__header {
		margin-bottom: 2em;
	}

	.truestyle-project-archive__title {
		font-size: 42px;
	}

	.truestyle-project-archive__card-title {
		font-size: 34px;
	}

	.truestyle-project-archive__card-button {
		width: 100%;
	}


}

@media only screen and (max-width: 420px) {

	.truestyle-project-archive__title {
		font-size: 38px;
	}

	.truestyle-project-archive__card-title {
		font-size: 30px;
	}

}









/* FEATURED PROJECTS CAROUSEL*/

.truestyle-featured-projects-carousel {
	padding: 5em 0;
}

.truestyle-featured-projects-carousel__inner {
	display: grid;
	grid-column: 2/16;
	row-gap: 4em;
}

.truestyle-featured-projects-carousel__header {
    display: grid;
    justify-items: center;
    text-align: center;
    justify-self: center;
    gap: 2em;
}

.truestyle-featured-projects-carousel__carousel {
	position: relative;
	width: 100%;
}

.truestyle-featured-projects-carousel__viewport {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.truestyle-featured-projects-carousel__track {
	position: relative;
	width: 100%;
	height: 610px;
}

.truestyle-featured-projects-carousel__slide {
	--project-slide-position: 125%;
	--project-slide-scale: 0.55;
	--project-slide-opacity: 0;

	position: absolute;
	top: 0;
	left: 50%;

	width: min(48vw, 540px);

	opacity: var(--project-slide-opacity);
	transform:
		translateX(
			calc(
				-50% + var(--project-slide-position)
			)
		)
		scale(var(--project-slide-scale));

	transform-origin: center center;

	transition:
		transform 0.6s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 0.45s ease;

	pointer-events: none;
}

.truestyle-featured-projects-carousel__slide.is-active {
	pointer-events: auto;
}

.truestyle-featured-projects-carousel__project {
	display: block;
	width: 100%;
	color: inherit;
	text-decoration: none;
}

.truestyle-featured-projects-carousel__image-wrapper {
	width: 100%;
	aspect-ratio: 1/1;
	border-radius: 6px;
	background-color: var(--color-cream);
	box-shadow: 0 18px 42px rgba(31, 42, 68, 0.1);
}

.truestyle-featured-projects-carousel__image,
.truestyle-featured-projects-carousel__image-placeholder {
	display: block;
	width: 100%;
	height: 100%;
}

.truestyle-featured-projects-carousel__image {
	object-fit: cover;
	object-position: center;
	transition: transform 0.4s ease;
	border-radius: 6px;
}

.truestyle-featured-projects-carousel__image-placeholder {
	background-color: var(--color-cream);
}

.truestyle-featured-projects-carousel__project-title {
	margin: 1.25rem 0 0;
	color: var(--color-blue);
	font-family: inherit;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 4px;
	text-align: center;
	text-transform: uppercase;
	opacity: 0;
	transform: translateY(8px);
	transition:
		opacity 0.3s ease 0.15s,
		transform 0.3s ease 0.15s;
}

.truestyle-featured-projects-carousel__slide.is-active
.truestyle-featured-projects-carousel__project-title {
	opacity: 1;
	transform: translateY(0);
}

.truestyle-featured-projects-carousel__control {
	position: absolute;
	top: 205px;
	z-index: 10;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background-color: var(--color-white);
	box-shadow: 0 3px 12px rgba(31, 42, 68, 0.17);
	color: var(--blue);
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
	transition:
		background-color 0.2s ease,
		color 0.2s ease,
		transform 0.2s ease;
}

.truestyle-featured-projects-carousel__control--previous {
	left: 36px;
}

.truestyle-featured-projects-carousel__control--next {
	right: 36px;
}

.truestyle-featured-projects-carousel__pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	margin-top: 0.5rem;
}

.truestyle-featured-projects-carousel__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background-color: rgba(211, 37, 31, 0.3);
	cursor: pointer;
	transition:
		width 0.25s ease,
		background-color 0.25s ease;
}

.truestyle-featured-projects-carousel__dot.is-active {
	width: 30px;
	background-color: var(--color-red);
}

.truestyle-featured-projects-carousel__dot:focus-visible {
	outline: 2px solid var(--color-red);
	outline-offset: 3px;
}

.truestyle-featured-projects-carousel__empty {
	max-width: 1000px;
	margin: 0 auto;
	padding: 2rem;
	border: 1px dashed rgba(31, 42, 68, 0.25);
	border-radius: 20px;
	background-color: var(--color-cream);
	text-align: center;
}

.truestyle-featured-projects-carousel__empty p {
	margin: 0;
	color: var(--blue);
}


@media only screen and (max-width: 900px) {

	.truestyle-featured-projects-carousel__control {
		top: auto !important;
		bottom: 1em;
	}

	.truestyle-featured-projects-carousel__control--previous {
		left: 20px;
	}

	.truestyle-featured-projects-carousel__control--next {
		right: 20px;
	}

}


@media only screen and (max-width: 750px) {

	.truestyle-featured-projects-carousel__track {
		height: 440px;
	}
}
 
@media only screen and (max-width: 650px) {

	.truestyle-featured-projects-carousel {
		padding: 3.5rem 0 4rem;
	}

	.truestyle-featured-projects-carousel__header {
		margin-bottom: 2.25rem;
	}

	.truestyle-featured-projects-carousel__header-content h1,
	.truestyle-featured-projects-carousel__header-content h2 {
		font-size: 42px;
	}

	.truestyle-featured-projects-carousel__track {
		height: 380px;
	}

	.truestyle-featured-projects-carousel__control {
		top: 140px;
		width: 42px;
		height: 42px;
	}

	.truestyle-featured-projects-carousel__control--previous {
		left: 8px;
	}

	.truestyle-featured-projects-carousel__control--next {
		right: 8px;
	}

	.truestyle-featured-projects-carousel__project-title {
		padding: 0 20px;
		font-size: 11px;
		letter-spacing: 3px;
	}

	.truestyle-featured-projects-carousel__slide {
		width: min(55vw, 540px);
	}

}

@media only screen and (max-width: 430px) {

	.truestyle-featured-projects-carousel__track {
		height: 330px;
	}

	.truestyle-featured-projects-carousel__slide {
		width: min(66vw, 540px);
	}


}