/*
	Theme Name: PHD Base Theme
	Theme URI: https://www.peterhintondesign.co.uk
	Description: Professional modular WordPress base theme for client projects
	Version: 2.0
	Author: Peter Hinton (@peterhinton)
	Author URI: https://www.peterhintondesign.co.uk
	License: GPL-2.0-or-later
	License URI: https://www.gnu.org/licenses/gpl-2.0.html
	Text Domain: phd-base-theme
	Domain Path: /languages
	Tags: gutenberg, custom-blocks, acf, responsive, modern
	Requires at least: 5.8
	Tested up to: 6.5
	Requires PHP: 7.4
*/

/*------------------------------------*/
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;
	list-style: none;
}

:root {
	/* Fonts */
	--font-primary: 'Poppins', sans-serif;
	--font-secondary: 'Inter', sans-serif;

	/* Font Sizes */
	--fontsize-h1: 64px;
	--fontsize-h2: 58px;
	--fontsize-h3: 42px;
	--fontsize-h4: 28px;
	--fontsize-h5: 22px;
	--fontsize-normal: 18px;
	--fontsize-small: 12px;
	--fontsize-medium: 15px;
	--fontsize-large: 24px;

	/* Line Heights */
	--lineheight-small: 1.4;
	--lineheight-normal: 1.4;
	--lineheight-medium: 1.4;
	--lineheight-large: 1.4;

	/* Font Weights */
	--fontweight-normal: 400;
	--fontweight-medium: 400;

	/* Layout Widths */
	--outerwidth: 1280px;
	--outerwidth-narrow: 1000px;
	--outerwidth-wide: 1400px;

	/* Spacing */
	--content-padding: 140px;
	--content-padding-small: 20px;
	--border-radius-small: 20px;
	--border-radius-medium: 40px;

	/* Colors - Brand Colors (from theme.json) */
	--primary: var(--wp--preset--color--primary);
	--secondary: var(--wp--preset--color--secondary);
	--tertiary: var(--wp--preset--color--tertiary);
	--accent: var(--wp--preset--color--accent);
	--dark: var(--wp--preset--color--dark);

	/* Colors - Neutrals (from theme.json) */
	--grey-light: var(--wp--preset--color--grey-light);
	--grey-mid: var(--wp--preset--color--grey-mid);
	--grey-dark: var(--wp--preset--color--grey-dark);
	--white: var(--wp--preset--color--white);
	--black: var(--wp--preset--color--black);

	/* Colors - Status (from theme.json) */
	--status-success: var(--wp--preset--color--status-success);
	--status-success-light: var(--wp--preset--color--status-success-light);
	--status-warning: var(--wp--preset--color--status-warning);
	--status-warning-light: var(--wp--preset--color--status-warning-light);
	--status-error: var(--wp--preset--color--status-error);
	--status-error-light: var(--wp--preset--color--status-error-light);
	--status-info: var(--wp--preset--color--status-info);
	--status-info-light: var(--wp--preset--color--status-info-light);

	/* Effects */
	--box-shadow: 0px 20px 100px 0px rgba(0,0,0,0.16);

	/* WordPress Spacing Presets */
	--wp--preset--spacing--small: 30px;
	--wp--preset--spacing--medium: 60px;
	--wp--preset--spacing--large: 140px;
}

/* ================================================================
   TEXT COLOR UTILITIES
   ================================================================ */
.has-primary-color { color: var(--primary); }
.has-secondary-color { color: var(--secondary); }
.has-tertiary-color { color: var(--tertiary); }
.has-accent-color { color: var(--accent); }
.has-dark-color { color: var(--dark); }
.has-grey-light-color { color: var(--grey-light); }
.has-grey-mid-color { color: var(--grey-mid); }
.has-grey-dark-color { color: var(--grey-dark); }
.has-white-color { color: var(--white); }
.has-black-color { color: var(--black); }

/* ================================================================
   BACKGROUND COLOR UTILITIES
   ================================================================ */

.bg-primary,
	.has-primary-background-color{background-color: var(--primary); color: var(--white);}
.bg-primary .btn-box,
	.bg-primary .wp-block-button__link,
	.has-primary-background-color .btn-box,
	.has-primary-background-color .wp-block-button__link{background: var(--dark); color: var(--white); }
.bg-primary .btn-box:hover,
	.bg-primary .wp-block-button__link:hover,
	.has-primary-background-color .btn-box:hover,
	.has-primary-background-color .wp-block-button__link:hover{background: var(--secondary); color: var(--white); }
.bg-primary input[type="submit"],
	.bg-primary input[type="button"],
	.bg-primary button,
  .has-primary-background-color input[type="submit"],
	.has-primary-background-color input[type="button"],
	.has-primary-background-color button{background: var(--dark); color: var(--white); }
.bg-primary input[type="submit"]:hover,
	.bg-primary input[type="button"]:hover,
	.bg-primary button:hover,
  .has-primary-background-color input[type="submit"]:hover,
	.has-primary-background-color input[type="button"]:hover,
	.has-primary-background-color button:hover{background: var(--secondary); color: var(--white); }
.bg-primary .btn-box-small,
	.has-primary-background-color .btn-box-small {color: var(--white);}
.bg-primary .btn-box-small::after,
	.has-primary-background-color .btn-box-small::after {background-color: var(--white);}
.bg-primary .btn-box-small:hover,
	.has-primary-background-color .btn-box-small:hover {color: var(--secondary);}
.bg-primary a,
	.has-primary-background-color a{color: var(--white); }

.bg-secondary,
	.has-secondary-background-color{background-color: var(--secondary); color: var(--dark); }
.bg-secondary .btn-box,
	.bg-secondary .wp-block-button__link,
	.has-secondary-background-color .btn-box,
	.has-secondary-background-color .wp-block-button__link{background: var(--dark); color: var(--white); }
.bg-secondary .btn-box:hover, .bg-secondary .wp-block-button__link:hover,
	.has-secondary-background-color .btn-box:hover,
	.has-secondary-background-color .wp-block-button__link:hover{background: var(--white); color: var(--dark); }
.bg-secondary a,
	.has-secondary-background-color a { color: var(--dark); }

.bg-tertiary,
	.has-tertiary-background-color{background-color: var(--tertiary); color: var(--dark); }
.bg-tertiary a,
	.has-tertiary-background-color a{color: var(--dark); }

.bg-accent,
	.has-accent-background-color{background-color: var(--accent); color: var(--white); }
.bg-accent a, .has-accent-background-color a{color: var(--white); }

.bg-dark,
	.has-dark-background-color{background-color: var(--dark); color: var(--white); }
.bg-dark hr,
	.has-dark-background-color hr{background-color: rgba(255, 255, 255, 0.3); }
.bg-dark a,
	.has-dark-background-color a{color: var(--secondary); }
.bg-dark a:hover,
	.has-dark-background-color a:hover{color: var(--white); }

.bg-grey-light,
	.has-grey-light-background-color{background-color: var(--grey-light); color: var(--grey-dark); }
.bg-grey-mid,
	.has-grey-mid-background-color{background-color: var(--grey-mid); color: var(--grey-dark); }
.bg-grey-dark,
	.has-grey-dark-background-color{background-color: var(--grey-dark); color: var(--white); }

.bg-white,
	.has-white-background-color{background-color: var(--white); color: var(--grey-dark); }

.bg-black,
	.has-black-background-color{background-color: var(--black); color: var(--white);}

.has-bg-image .btn-box-small { color: var(--white); }
.has-bg-image .btn-box-small::after { background-color: var(--white); }
.has-bg-image .btn-box-small:hover { color: var(--secondary); }

body{margin: 0; padding: 0; padding-top: 120px; background: var(--white); color: var(--grey-dark); font-size: var(--fontsize-normal); font-weight: var(--fontweight-normal); line-height: var(--lineheight-normal); font-family: var(--font-secondary);}

.wrapper{display: block; width: 100%; margin: 0 auto; padding: 0; }
.wrapper-content{display: block; width: 100%; margin: 0 auto; position: relative; box-sizing: border-box;}

h1{font-size: var(--fontsize-h1); font-family: var(--font-primary); font-weight: 300; line-height: 1.2; padding: 0 0 var(--content-padding-small) 0;}
h2{font-size: var(--fontsize-h2); font-family: var(--font-primary); font-weight: 300; line-height: 1.2; padding: 0 0 var(--content-padding-small) 0;}
h3{font-size: var(--fontsize-h3); font-family: var(--font-primary); font-weight: 300; line-height: 1.2; padding: 0 0 var(--content-padding-small) 0;}
h4{font-size: var(--fontsize-h4); font-family: var(--font-primary); font-weight: 300; line-height: 1.2; padding: 0 0 var(--content-padding-small) 0;}
h5{font-size: var(--fontsize-h5); font-family: var(--font-primary); font-weight: 500; line-height: 1.2; padding: 0 0 var(--content-padding-small) 0;}

p{padding: 0 0 var(--content-padding-small) 0; margin: 0;}
p.narrow{max-width: var(--outerwidth-narrow); margin: 0 auto;}
div p:last-child {padding-bottom: 0;}

:root :where(.is-layout-flow) > * {margin-block-start: 0px !important; margin-block-end: 0px !important;}

a{text-decoration: none; color: var(--primary); transition: all 0.2s ease-out 0s; text-decoration: none;}
a:hover{color: var(--dark); text-decoration: underline;}
em, i{font-style: italic;}
b, strong{font-weight: 700;}
ul{margin: 0 auto 10px auto; padding: 0;}
ul li{list-style: disc; margin: 0 0 var(--content-padding-small) var(--content-padding-small); list-style-position: outside; list-style: circle;}
ol{margin: 10px auto; padding: 0 0 0 var(--content-padding-small);}
ol li{list-style: decimal; margin: 0 0 var(--content-padding-small) var(--content-padding-small); list-style-position: outside;}
ol ol li{list-style-type: lower-roman;}
img{display: block; max-width: 100%; height: auto;}
iframe{max-width: 100%; width: 100%;}
hr, .wp-block-separator{display: block; width: 100%; height: 1px; margin: 30px auto; overflow: hidden; background: rgba(0,0,0,0.3); border: 0;}
hr.small{margin: 30px auto;}
hr.large{margin: 100px auto;}

input, select, button{font-size: var(--fontsize-medium); font-weight: var(--fontweight-normal); line-height: var(--lineheight-medium); font-family: var(--font-primary); display: inline-block; width: 100%; padding: 10px 15px; margin: 6px auto 10px auto; box-sizing: border-box; border-radius: 0px; max-width: none; border: none; background: var(--grey-light);}
textarea{font-size: 15px; font-family: 'Roboto', sans-serif;  display: inline-block; width: 100%; height: 110px; box-sizing: border-box; padding: 10px 15px; margin: 6px auto 10px auto; border-radius: 0px; max-width: none; border: none; background: var(--grey-light);}
input[type="checkbox"],
	.wpcf7-list-item-label{display: inline-block; vertical-align: middle; width: auto; margin: 0 15px 0 0}
input[type="submit"], input[type="button"], button{display: inline-block; width: auto; line-height: normal; cursor: pointer; padding: 10px 25px; border-radius: 0px; transition: all 0.25s linear 0s; font-size: var(--fontsize-medium); font-weight: var(--fontweight-medium); line-height: var(--lineheight-medium); font-family: var(--font-primary); background: var(--primary); color: var(--white); margin: 0px auto 20px auto; border: none;}
input[type="submit"]:hover, input[type="button"]:hover, button:hover{background: var(--dark); color: var(--white);}
input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 24px; min-width: 24px; height: 24px; min-height: 24px; border: 1px solid var(--secondary); background: none; cursor: pointer; position: relative; display: block; margin: 6px 6px 0 0; vertical-align: middle; padding: 0; overflow: hidden; }
input[type="checkbox"]:checked { background-color: var(--secondary); }
input[type="checkbox"]:checked::after { content: '\2714'; font-size: 14px; color: var(--dark); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

blockquote{font-size: var(--fontsize-large); line-height: var(--lineheight-large); margin: var(--content-padding-small) auto; max-width: var(--outerwidth-narrow); border-left: 4px solid var(--dark); color: var(--white); background: var(--primary); font-style: normal; font-weight: normal; padding: calc(var(--content-padding-small) * 2); box-sizing: border-box; border-radius: var(--border-radius-medium);}
blockquote:before { content: ''; background-color: var(--white); color: var(--white); display: inline-block; margin-bottom: var(--content-padding-small); width: 80px; aspect-ratio: 4/3; height: auto; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 65.6'%3E%3Cpath d='M7.8,6.6c-1.1,1-2,2-2.7,3c-4.4,6.1-6,13.2-4.6,21.3c2.4,13.9,13.3,27.7,27.1,34.4c0.4,0.2,0.9,0.4,1.5,0.4c1.1,0,2-0.6,2.4-1.6c0.3-0.8,0.4-2-0.9-3.3c-3.7-3.8-6-10.3-6-12.6c0-1.5,1.2-1.6,1.2-1.6c11.8-0.6,20-8.6,21.6-20.7c0.7-5.6-0.8-11.3-4.4-16.1c-3.5-4.7-8.5-8-14.2-9.3C21.8-0.9,13.9,0.6,7.8,6.6z M60.2,6.6c-1.1,1-2,2-2.7,3c-4.4,6.1-6,13.2-4.6,21.3C55.3,44.8,66.2,58.6,80,65.2c0.4,0.2,0.9,0.4,1.5,0.4c1.1,0,2-0.6,2.4-1.6c0.3-0.8,0.4-2-0.9-3.3c-3.7-3.8-6-10.3-6-12.6c0-1.5,1.2-1.6,1.2-1.6c11.8-0.6,20-8.6,21.6-20.7c0.7-5.6-0.8-11.3-4.4-16.1c-3.5-4.7-8.5-8-14.2-9.3C74.2-0.9,66.3,0.6,60.2,6.6z'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-size: contain; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 65.6'%3E%3Cpath d='M7.8,6.6c-1.1,1-2,2-2.7,3c-4.4,6.1-6,13.2-4.6,21.3c2.4,13.9,13.3,27.7,27.1,34.4c0.4,0.2,0.9,0.4,1.5,0.4c1.1,0,2-0.6,2.4-1.6c0.3-0.8,0.4-2-0.9-3.3c-3.7-3.8-6-10.3-6-12.6c0-1.5,1.2-1.6,1.2-1.6c11.8-0.6,20-8.6,21.6-20.7c0.7-5.6-0.8-11.3-4.4-16.1c-3.5-4.7-8.5-8-14.2-9.3C21.8-0.9,13.9,0.6,7.8,6.6z M60.2,6.6c-1.1,1-2,2-2.7,3c-4.4,6.1-6,13.2-4.6,21.3C55.3,44.8,66.2,58.6,80,65.2c0.4,0.2,0.9,0.4,1.5,0.4c1.1,0,2-0.6,2.4-1.6c0.3-0.8,0.4-2-0.9-3.3c-3.7-3.8-6-10.3-6-12.6c0-1.5,1.2-1.6,1.2-1.6c11.8-0.6,20-8.6,21.6-20.7c0.7-5.6-0.8-11.3-4.4-16.1c-3.5-4.7-8.5-8-14.2-9.3C74.2-0.9,66.3,0.6,60.2,6.6z'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; }blockquote cite{font-size: var(--fontsize-normal);}

#header{display: block; position: fixed;; top: 10px; left: 0; width: 100%; z-index: 999; transition: all 0.3s ease-in-out 0s; }
#header .content{margin: 0 auto; width: 90%; max-width: var(--outerwidth); padding: 20px 0; border-radius: var(--border-radius-small); position: relative; display: flex; align-items: center; justify-content: space-between; transition: all 0.3s ease-in-out 0s; overflow: visible;}
#header .logo{width: 100%; max-width: 210px;  transition: all 0.3s ease-in-out 0s;}

#logo-header{transition: all 0.3s ease-in-out 0s;}
.logo-path{fill:#fff; transition: all 0.3s ease-in-out 0s;}
.logo-line{fill:#fff; transition: all 0.3s ease-in-out 0s;}
.logo-tagline-02{fill:#fff; transition: all 0.3s ease-in-out 0s;}
.logo-tagline-01{fill:#fff; transition: all 0.3s ease-in-out 0s;}

#btn-nav{width: 50px; height: 50px; display: none; position: absolute; top: 20px; right: 20px; z-index: 999; background: none;}
#btn-nav .relative{display: block; height: 100%; width :100%;}
#btn-nav .line{width: 40px; height: 3px; display: block; background: var(--dark); position: absolute; left: 50%; transform: translateX(-50%); transition: all 0.2s linear 0s; margin-top: -1px; top: 50%;}
#btn-nav .line-01{transform: translateX(-50%) translateY(-13px);}
#btn-nav .line-03{transform: translateX(-50%) translateY(13px);}
#btn-nav:hover .line-01{transform: translateX(-50%) translateY(-18px);}
#btn-nav:hover .line-03{transform: translateX(-50%) translateY(18px);}
body.nav-open #btn-nav .line{background: var(--white);}
body.nav-open #btn-nav .line-01{transform: translateX(-50%) rotate(45deg); transition: all 0.25s linear 0s;}
body.nav-open #btn-nav .line-02{opacity: 0; transition: all 0.25s linear 0s;}
body.nav-open #btn-nav .line-03{transform: translateX(-50%) rotate(-45deg); transition: all 0.25s linear 0s;}

/* Block: Hero Default */
#hero-default{display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; padding: var(--content-padding) 0;}
#hero-default .content{display: block; width: 90%; max-width: var(--outerwidth); padding: 0; margin: 0 auto; }

/* Block: Testimonial */
.testimonial-container{display: block; position: relative; z-index: 0;}
.testimonial-individual{display: block; width: 100%; box-sizing: border-box; padding: 0 0 0 150px; position: relative;}
.testimonial-individual::after { display: block; width: 120px; height: 120px; position: absolute; top: 0; left: 0; content: ' '; background: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="92px" height="60.5px" viewBox="0 0 92 60.5" xml:space="preserve"><style type="text/css">.st0{fill:%2376EA9D;}</style><g><g><path class="st0" d="M7.2,6.1C6.2,7,5.4,7.9,4.7,8.9c-4,5.6-5.5,12.1-4.2,19.6C2.7,41.3,12.7,54,25.4,60.1c0.4,0.2,0.8,0.4,1.4,0.4c1,0,1.8-0.6,2.2-1.5c0.3-0.7,0.4-1.8-0.8-3c-3.4-3.5-5.5-9.5-5.5-11.6c0-1.4,1.1-1.5,1.1-1.5c10.8-0.6,18.4-7.9,19.9-19c0.6-5.1-0.7-10.4-4-14.8c-3.2-4.3-7.8-7.4-13.1-8.5C20.1-0.8,12.8,0.6,7.2,6.1z"/></g><g><path class="st0" d="M55.4,6.1c-1,0.9-1.8,1.8-2.5,2.8c-4,5.6-5.5,12.1-4.2,19.6C50.9,41.3,60.9,54,73.6,60c0.4,0.2,0.8,0.4,1.4,0.4c1,0,1.8-0.6,2.2-1.5c0.3-0.7,0.4-1.8-0.8-3c-3.4-3.5-5.5-9.5-5.5-11.6c0-1.4,1.1-1.5,1.1-1.5c10.8-0.6,18.4-7.9,19.9-19c0.6-5.1-0.7-10.4-4-14.8c-3.2-4.3-7.8-7.4-13.1-8.5C68.3-0.8,61,0.6,55.4,6.1z"/></g></g></svg>') top left no-repeat; background-size: contain; }
.testimonial-individual .testimonial-quote-large{font-size: var(--fontsize-large); line-height: var(--lineheight-large);}
.testimonial-individual .testimonial-details{color: var(--primary); padding-top: 22px; border-top: 1px solid var(--grey-mid); }

.btn-box, .wp-block-button__link{background: var(--primary); border-radius: var(--border-radius-medium); height: auto; line-height: normal; color: var(--white); text-decoration: none; padding: 15px 25px; position: relative; display: inline-block; box-sizing: border-box; width: auto; transition: all 0.3s ease; margin: 10px 0 0 0;}
.btn-box:hover, .wp-block-button__link:hover{color: var(--white); background: var(--dark); cursor: pointer; text-decoration: none;}

.btn-box-small{position: relative; display: inline-block; padding: 0 45px 0 0; box-sizing: border-box; width: auto; background: none; border-radius: 0; height: auto; line-height: normal; color: var(--primary); text-decoration: none;  transition: all 0.3s ease; }
.btn-box-small::after{ position: absolute; right: 20px; top: 50%; transition: all 0.3s ease; transform: translateY(-50%); width: 20px; height: 12px; content: ''; background-color: var(--primary); mask: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="31.4px" height="24.1px" viewBox="0 0 31.4 24.1"><g><line fill="none" stroke="black" stroke-width="2" stroke-miterlimit="10" x1="0" y1="12.1" x2="30" y2="12.1"/><polyline fill="none" stroke="black" stroke-width="2" stroke-miterlimit="10" points="18.6,0.7 30,12.1 18.6,23.4"/></g></svg>'); mask-size: contain; mask-repeat: no-repeat; mask-position: center;}
.btn-box-small:hover{color: var(--dark); cursor: pointer;}
.btn-box-small:hover:after{transform: translate(25%, -50%);}

.col-container{display: flex; width: 100%; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 30px; margin: var(--content-padding-small) auto;}
.col-02 .col{flex: 0 0 calc(50% - 18px); position: relative;}
.col-03 .col{flex: 0 0 calc(33% - 18px); position: relative;}
.col-04 .col{flex: 0 0 calc(25% - 18px); position: relative; }
.col-auto .col{width: auto;}
.col-reverse{flex-direction: row-reverse}
.col-vertical-center{align-items: center;}
.col-post-container{margin: var(--content-padding-small) 0; flex-wrap: nowrap;}
.col-post{flex: 1 1 70%; position: relative;}
.col-post .col-container{align-items: stretch; margin: 0 0 calc(var(--content-padding-small) * 2) 0;}
.col-post-sidebar{flex: 0 0 30%;}
.col-post-sidebar.sticky{position: sticky; top: 120px;}
.col-post-sidebar.non-sticky{position: relative;}
.form-container{border-radius: var(--border-radius-small); padding: var(--content-padding-small); box-sizing: border-box;}
.no-rounding{border-radius: 0 !important;}

.wp-block-columns{align-items: stretch; padding: 0;}
.wp-block-column{padding: 0; flex: 1;}
.wp-block-spacer{display: block; width: 100%; height: 1px !important; background: var(--grey-mid); overflow: hidden; margin: var(--content-padding-small) auto;}

.content,
.wp-block-group {display: block; width: 100%; max-width: 100%; padding: 0; margin: 0 auto;}
.wp-block-group .wp-block-group,
	.content .content {display: block; width: 90%; max-width: var(--outerwidth); padding: 0; margin: 0 auto; border-radius: var(--border-radius-medium); }
.wp-block-group .wp-block-group .wp-block-group,
	.wp-block-group .wp-block-group .content,
	.content .content .content,
	.content .content .wp-block-group {width: 100%; max-width: 100%;}
.content.padding-none{padding: 0;}
.content.padding-medium{padding: var(--wp--preset--spacing--medium) 0;}
.content-narrow{display: block; width: 90%; max-width: var(--outerwidth-narrow); padding: var(--content-padding) 0; margin: 0 auto;}
.icon{display: block; max-width: 60px; margin-bottom: var(--content-padding-small);}
.message-error{color: var(--status-error);}
.message-success{color: var(--status-success);}
.message-warning{color: var(--status-warning);}
.message-info{color: var(--status-info);}
.no-padding{padding: 0 !important;}
.no-padding-top{padding-top: 0 !important;}
.text-large{font-size: var(--fontsize-large); line-height: var(--lineheight-large);}
.text-small,
	small{font-size: var(--fontsize-small); line-height: var(--lineheight-small);}

.resources-posts-section,
	.latest-posts-section{display: block; padding: var(--content-padding-small) 0;}
.latest-posts{align-items: stretch; margin-top: 0;}
.resources-posts-section .content{width: 90%; max-width: var(--outerwidth); margin: 0 auto;}
.recommended-posts{padding: var(--content-padding) 0;}
.content-header .content-inner{padding-bottom: 0;}
.post-title{padding: 0 0 18px 0;}
.post-meta{display: flex; align-items: center; justify-content: flex-start; gap: 10px; flex-direction: row; padding: 0 0 15px 0; font-size: var(--fontsize-medium); line-height: var(--lineheight-medium);}
.author-container{display: flex; align-items: center; justify-content: flex-start; gap: 5px; flex-direction: row;}
.author-icon{display: block; width: 30px ; height: 30px; border-radius: 50%; overflow: hidden;}
.post-categories{display: block; width: 100%;}
.post-tags{display: block; width: 100%;}
.post-author{display: inline-block;}
.post-date{display: block; }
.post-excerpt{display: block; width: 100%;}
.post-button{display: inline-block; margin-top: 10px;}
.post-featured{display: block; width: 100%;}
.hide-categories .post-categories,
	.hide-tags .post-tags,
	.hide-author .post-author,
	.hide-date .post-date,
	.hide-excerpt .post-excerpt,
	.hide-button .post-button,
	.hide-featured .post-featured{display: none; }

.sidebar{display: block;}
.sidebar-list ul{list-style: none; border-top: 1px solid var(--grey-mid);}
.sidebar-list ul li{list-style: none; padding: 7px 0; margin: 0; border-bottom: 1px solid var(--grey-mid);}

.post-link{border-bottom: 1px solid rgba(0,0,0,0.1); padding-bottom: var(--content-padding-small);}
.post-link.feature-col-container{border-bottom: 2px solid var(--white); padding-bottom: 0; color: var(--dark);}
.post-link.feature-col-container .post-title{color: var(--primary);}
.post-link .feature-col{display: flex; flex-direction: column; justify-content: space-between;}
.post-link .author-icon{display: block; width: 30px; height: 30px; position: relative; }
.post-link .author-icon img{display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.post-link .post-excerpt img{display: none;}
.post-link:hover{cursor: pointer; text-decoration: none;}
.post-link:hover .post-title{text-decoration: underline !important; color: var(--dark)}
.post-link:hover .btn-box-small{cursor: pointer;}
.post-link:hover .btn-box-small:after{transform: translate(25%, -50%); background-color: var(--dark) !important;}
.post-link.feature-col-container:hover{border-color: var(--primary);}
.post-link .post-meta{padding: 0 0 15px 0;}

.featured-post-container{display: block; color: var(--white) !important; padding: calc(var(--content-padding-small) * 2); margin-bottom: calc(var(--content-padding-small) * 1.5); box-sizing: border-box; border-radius: var(--border-radius-medium);}
.featured-post-container .post-title a{color: var(--white); text-decoration: none; transition: none;}
.featured-post-container .post-details{border-color: rgba(255,255,255,0.2);}
.featured-post-container .col-container{align-items: center;}
.featured-post-container .post-excerpt{display: block;}
.featured-post-container .post-meta{font-size: var(--fontsize-small); line-height: var(--lineheight-small);}
.featured-post-container .item-category, 
	.featured-post-container .item-tag{background: transparent; color: var(--white); border: 1px solid var(--white);}
.featured-post-container .btn-box{color: var(--primary); background-color: var(--white); margin-top: calc(var(--content-padding-small) * 1.5);}
.featured-post-content{display: block; }
.featured-post-content .author-icon{display: block; width: 30px !important; height: 30px !important;}
.featured-post-image{display: block; aspect-ratio: 1/1; border-radius: var(--border-radius-small); overflow: hidden;}
.featured-post-image img{display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.featured-post-container:hover{background-color: var(--dark); color: var(--white) !important;}
.featured-post-container:hover .post-title{color: var(--white);}
.featured-post-container:hover .btn-box{color: var(--dark); background-color: var(--white)}

.feature-col{display: block; box-shadow: var(--box-shadow); background-color: var(--white); height: 100%; color: var(--grey-grey);  border-radius: var(--border-radius-small); overflow: hidden; border: none;}
.feature-col img{display: block; width: 100%;}
.feature-col video{display: block; width: 100%; height: auto; aspect-ratio: 16/9;}
.feature-col iframe{display: block; width: 100%; height: auto; aspect-ratio: 16/9;}
.feature-col .content-inner{padding: var(--content-padding-small); box-sizing: border-box;}
.feature-col .post-featured{display: block; width: 100%; aspect-ratio: 16/9; border-radius: var(--border-radius-small); overflow: hidden;}
.feature-col .post-featured img{display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: all 0.3s ease;}
a:hover .feature-col .post-featured img{transform: scale(1.1);}
a.feature-col{cursor: pointer;}

.post-details{display: flex; align-items: center; font-size: var(--fontsize-small); line-height: var(--lineheight-small); padding: calc(var(--content-padding-small) / 2) 0; justify-content: space-between; border-top: 1px solid var(--grey-mid); border-bottom: 1px solid var(--grey-mid); margin-bottom: calc(var(--content-padding-small) / 1.5);}
.post-taxonomy{margin-top: calc(var(--content-padding-small) * 2); }

.post-item{display: flex; flex-direction: row-reverse; padding: 50px 0; border-bottom: 1px solid var(--grey-mid); gap: 30px;}
.post-item:first-of-type{padding-top: 0;}
.post-content{flex: 1; padding: 0 0 var(--content-padding-small) 0;}
.post-thumbnail{display: block; width: 30%;}
.post-thumbnail img{display: block; border-radius: var(--border-radius-small); overflow: hidden;}
.post-item h2{font-size: var(--fontsize-h3);}
.post-link,
	.post-link a,
	.post-item a{color: var(--primary);}
.post-item .btn-box-small{margin: 20px 0;}
.post-item .post-excerpt img{display: none;}

.post-guests-container{border-bottom: 1px solid rgba(0,0,0,0.2);}
.post-guest-item h4{padding-bottom: 10px;}
.post-guest-item .guest-info{flex: 1;}
.guest-photo{display: block; width: 100px; aspect-ratio: 1/1; position: relative; overflow: hidden; border-radius: 50%;}
.guest-photo img{display: block; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.guest-title,
	.guest-company{padding: 0; margin: 0;}

.item-category, .item-tag{display: inline-block; background: var(--grey-light); margin: 0 4px 4px 0; font-size: var(--fontsize-small); line-height: var(--lineheight-small); padding: 7px 13px;}

.single p{max-width: none;}
.single img{width: 100%;}
.single .content{width: 90%; max-width: var(--outerwidth); margin: 0 auto; padding: var(--content-padding-small) 0;}
.single .author-icon{display: block; width: 50px; height: 50px;}
.single .col-post .post-details{background: var(--grey-light); font-size: var(--fontsize-medium); line-height: var(--lineheight-medium); border-radius: var(--border-radius-small); padding: calc(var(--content-padding-small) / 1.5); margin: var(--content-padding-small) auto;}
.single .col-post .post-details span{display: block;}
.single .col-post .post-details-01{margin-top: 0;}
.single .col-post .post-details-02{margin-bottom: 0;}
.single .col-post .post-meta{padding: 0;}
.single .col-post .single-post-thumbnail{border-radius: var(--border-radius-small); overflow: hidden; margin: 0 0 calc(var(--content-padding-small) / 2) 0;}
.single iframe,
	.single video{aspect-ratio: 16/9; height: auto; margin: 0 0 var(--content-padding-small) 0;}
.resource-page .content{padding: var(--content-padding) 0;}
.cta-form{display: block; width: 100%; padding: 30px; box-sizing: border-box; border-radius: var(--border-radius-small); overflow: hidden;}

.pagination{margin: 10px 0; text-align: center; clear: both;}
.pagination-wrapper{display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin-bottom: 10px;}
.pagination-numbers{display: flex; align-items: center; gap: 10px;}
.pagination-link{display: inline-flex; color: var(--dark); background: var(--white);  border: 1px solid var(--primary); transition: all 0.3s ease; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 10px; text-decoration: none;}
.pagination-link:hover { background: var(--secondary); border-color: var(--primary); color: var(--white); text-decoration: none; }
.pagination-link.current { background: var(--primary); color: var(--white); border-color: var(--primary); font-weight: bold; }
.pagination-link.current:hover{background: var(--primary); border-color: var(--primary);}
.pagination-ellipsis{display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px;}
.prev-link,
    .next-link {padding: 10px;}
.pagination-info {color: #666;}

/* Hubspot Embed */
.hbspt-form{font-weight: inherit; font-size: var(--fontsize-medium); line-height: var(--lineheight-medium); box-sizing: border-box; font-family: inherit;}
.hbspt-form ul li{margin: 0;}
.hbspt-form li::marker{display: none !important; content: " " !important; }
.hbspt-form p{font-weight: 400; line-height: inherit; font-size: var(--fontsize-medium) !important;}
.hbspt-form label{font-weight: 400; font-size: inherit; font-family: var(--font-secondary); display: flex; flex-direction: row; align-items: flex-start; justify-content: flex-start;}
.hbspt-form .input input{display: block; width: 100%; box-sizing: border-box; }
.hbspt-form textarea{font-weight: 400; font-size: inherit; font-family: var(--font-secondary); width: 100%; min-height: 100px; padding: 10px; box-sizing: border-box;}
.hbspt-form  .hs-fieldtype-checkbox{max-width: calc(50% - 10px); padding: 20px 0; display: inline-block; width: 100%; vertical-align: top; box-sizing: border-box; border: none !important;}
.hbspt-form  .hs-fieldtype-checkbox ul {list-style: none; padding: 0; padding: 0;}
.hbspt-form  .hs-fieldtype-checkbox ul li{line-height: normal; padding: 0 !important; margin: 6px 0 0 0 !important;}
.hbspt-form  .hs-fieldtype-checkbox ul li span{margin-top: 8px;}
.hbspt-form  .hs-fieldtype-checkbox .input input{display: inline-block; width: auto; padding: 0px; border-radius: 50px;}
.hbspt-form .hs-button{display: inline-block;}
.hbspt-form .hs-form-booleancheckbox label{display: flex; justify-content: flex-start; align-items: flex-start;}
.hbspt-form .inputs-list{padding: 0 !important;}
.hbspt-form .hs-form-booleancheckbox label input{width: auto  !important;}
.hbspt-form .hs-form-booleancheckbox-display p{line-height: inherit; }
.hbspt-form .actions{padding: 20px 0 0 0 !important;}
.hbspt-form .legal-consent-container .hs-richtext p{font-size: var(--fontsize-small); line-height: var(--lineheight-small);}
.legal-consent-container .hs-form-booleancheckbox-display>span{margin-left: 0 !important;}
.hbspt-form .hs-error-msg{color: var(--accent);}

#hs-eu-cookie-confirmation-inner{font-weight: inherit; font-size: var(--fontsize-medium); line-height: var(--lineheight-medium); }
#hs-eu-cookie-confirmation-inner div,
	#hs-eu-cookie-confirmation-inner p{margin: 0 !important; color: var(--grey-dark) !important; }

#footer .content{padding: var(--content-padding) 0 var(--content-padding-small) 0; max-width: var(--outerwidth); width: 90%; max-width: var(--outerwidth); }
#footer .logo{display: inline-block; max-width: 70%; margin-bottom: 30px;}
#footer-info{display: flex; width: 25%; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; gap: 0; flex-direction: column;  margin: 0;}
#footer .col-container{flex-wrap: nowrap;}
#footer-nav{display: flex; width: calc(75% - 30px); flex-direction: column;}
#footer-nav-inner{display: flex; width: 100%; align-items: flex-start; justify-content: space-between; flex-wrap: nowrap; gap: 0; flex-direction: row; margin: 0;}
#footer-nav-inner ul{list-style: none; margin: 0 0 30px 0; font-size: var(--fontsize-medium);}
#footer-nav-inner ul li{list-style:  none; margin: 0 0 5px 0; padding: 0; display: block;}
#footer-nav-inner ul li.menu-item-has-children{margin: 0 0 20px 0;}
#footer-nav-inner ul li.menu-item-has-children > a{font-weight: bold; color: var(--white); }
#footer-nav-inner ul li.menu-item-has-children .sub-menu{padding-top: 5px;}
#footer-nav-inner .col{padding: 0; width: calc(33.33% - 30px);}
#footer .footer-address{font-size: var(--fontsize-medium); line-height: var(--lineheight-medium); }
.footer-contact p{margin: 0; padding: 0;}
.social-container{display: block;}
.social-container .social{display: inline-block; margin: 5px 8px 5px 0; width: 40px; height: 40px; border-radius: 40px; background: url(images/social-media.svg) no-repeat var(--primary); border: 2px solid var(--primary); background-size: 240px; text-indent: -9999px; overflow: hidden;}
.social-container .social:hover{background-color: var(--secondary); border-color: var(--secondary);}
.social-container .social.twitter{background-position: -40px 0;}
.social-container .social.linkedin{background-position: 0 0;}
.social-container .social.facebook{background-position: -80px 0;}
.social-container .social.youtube{background-position: -160px 0;}
.social-container .social.instagram{background-position: -120px 0;}
.social-container .social.whatsapp{background-position: -200px 0;}
.footer-copyright{font-size: var(--fontsize-small); line-height: var(--lineheight-small);}
.footer-logo-container{display: flex; width: 100%; overflow: hidden; flex-wrap: wrap; align-items: center; justify-content: space-between;}
.footer-logo{display: inline-block; max-width: 180px; margin: 10px 10px 10px 0; vertical-align: top;}

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

	body.scrolled #header .content{background: var(--primary); padding: 0px 20px; box-sizing: border-box;}
	body.scrolled #header .logo{width: 100%; max-width: 150px;}
	body.scrolled #header .header-menu > li > a{color: var(--white);}
	body.scrolled #header .header-menu > li:hover > a{background-color: transparent; color: var(--white);}

	#btn-nav{display: none;}

	/* Simple Menu Styles */
	#header #nav {position: relative; z-index: 990;}
	.header-menu {list-style: none; margin: 0; padding: 0; display: flex; flex-direction: row;}
	.header-menu li {list-style: none; margin: 0; padding: 0;}
	.header-menu > li {position: relative;}
	.header-menu > li > a {display: block; padding: 20px; text-decoration: none; transition: all 0.3s ease; color: var(--dark);}
	.header-menu > li > a:hover {color: var(--primary);}
	.header-menu > li.menu-item-has-children > a::after {
		content: ''; background-color: var(--dark); display: inline-block; width: 12px; height: 7px; margin-left: 8px; vertical-align: middle; transition: all 0.2s ease; 
		mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22.7 14'%3E%3Cpolyline points='1.3,1.3 11.3,11.3 21.3,1.3' fill='none' stroke='black' stroke-width='3.75' stroke-miterlimit='10'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-size: contain; mask-position: center;
		-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22.7 14'%3E%3Cpolyline points='1.3,1.3 11.3,11.3 21.3,1.3' fill='none' stroke='black' stroke-width='3.75' stroke-miterlimit='10'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; -webkit-mask-position: center;
	}
	.header-menu > li.menu-item-has-children:hover > a::after { background-color: var(--primary); transform: rotate(180deg);}
	.header-menu .sub-menu {
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 200px;
		list-style: none;
		margin: 0;
		padding: 10px 0;
		background: white;
		border: 1px solid var(--grey-mid);
		border-radius: var(--border-radius-small);
		box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
		display: none;
		z-index: 999;
	}
	.header-menu > li:hover > .sub-menu {display: block;}
	.header-menu .sub-menu li {margin: 0;}
	.header-menu .sub-menu li a {display: block; padding: 10px 20px; text-decoration: none; transition: all 0.2s ease; }
	.header-menu .sub-menu li:hover > .sub-menu{display: block;}
	.header-menu .sub-menu .sub-menu{position: absolute; top: 0; left: 100%; margin-left: 0; display: none;}
	.header-menu li.has-cta-menu > .sub-menu{padding-bottom: calc(var(--content-padding-small) * 2);}
	.header-menu .menu-item-cta {
		display: flex;
		flex-direction: row;
		font-size: var(--fontsize-small);
		align-items: center;
		justify-content: flex-start;
		gap: 20px;
		height: 50px;
		padding: 0 20px;
		box-sizing: border-box;
		margin: 0;
		width: 100%;
		background: var(--dark);
		position: absolute;
		z-index: 0;
		bottom: 0;
		left: 0;
		right: 0;
		border-radius: 0 0 var(--border-radius-small) var(--border-radius-small);
	}

	.header-menu .menu-item-cta a {
		color: var(--secondary) !important;
		text-decoration: none;
	}

	.header-menu .menu-item-cta a:hover {
		color: var(--white) !important;
		text-decoration: underline;
	}

	/* Featured menu items (like CTA buttons) */
	.header-menu .featured a {
		display: block;
		padding: 7px 20px;
		margin: 0;
		background: var(--secondary);
		color: var(--dark) !important;
		border-radius: 50px;
		border: 2px solid var(--secondary);
		transition: all 0.2s ease;
	}

	.header-menu .featured a:hover {
		background: white;
		border-color: var(--secondary);
		color: var(--dark) !important;
	}

}


@media (max-width: 1119px) {

	body{overflow: auto;}
	body.nav-open{overflow: hidden;}
	body.nav-open #header .logo{display: none;}

	body{padding-top: 100px;}

	#header{min-height: 100px; position: absolute;}
    #header .content{max-width: 90%; margin: 0 auto;}
	#header .logo{position: relative; z-index: 991; max-width: 160px;}

	#header #nav{position: fixed; display: block; width: 100%; min-height: 100vh; height: 100vh; padding: var(--content-padding) var(--content-padding-small) calc( var(--content-padding) * 4) var(--content-padding-small); box-sizing: border-box; background: var(--primary); transition: all 0.3s ease; max-height: none; transform: translateX(100%); top: 0; left: 0; overflow: scroll; }
	.header-menu a{color: var(--white);} 
	.header-menu li {list-style: none; margin: 0; padding: 0;}
	.header-menu > li{border-bottom: 1px solid var(--white);}
	.header-menu > li > a {font-weight: bold; padding: 10px 0; display: inline-block;}
	.header-menu li{margin: 0 0 0 var(--content-padding-small); padding: calc(var(--content-padding-small) / 4) 0;}

	body.nav-open #header #nav{transform: translateX(0);}
	#btn-nav{display: block;}

    #articles-wrapper{flex-wrap: wrap;}
    #articles-sidebar{position: static; top: unset;}
    #articles-sidebar {flex: 0 0 100%;}

	.col-article-sidebar{width: 100%; flex: auto;}

	.col-container{flex-wrap: wrap;}

}

@media (max-width: 768px) {

	:root {
		--fontsize-h1: 32px;
		--fontsize-h2: 36px;
		--fontsize-h3: 26px;
		--fontsize-normal: 15px;
		--fontsize-small: 12px;
		--fontsize-large: 20px;
		--content-padding: 75px;
		--content-padding-small: 20px;
		--wp--preset--spacing--small: 20px;
		--wp--preset--spacing--medium: 40px;
		--wp--preset--spacing--large: 60px;
	}

	h1.hero-title{padding-bottom: calc(var(--content-padding-small) / 2);}
    blockquote{padding: calc(var(--content-padding-small) * 2);}

	.featured-post-container{border-radius: var(--border-radius-small);}
	.post-item{flex-direction: column; padding: 50px 0; border-bottom: 1px solid #ccc;}
	.post-title {padding: 10px 0;}
	.post-thumbnail{display: block; width: 100%; aspect-ratio: 3/2; border-radius: var(--border-radius-small); overflow: hidden;}
	.post-thumbnail img{display: block; width: 100%;}

	/* Block: Random Testimonial */
	.testimonial-individual{padding: 0 0 0 60px;}
	.testimonial-individual::after{margin-top: 3px; width: 45px; height: 45px;}

	.btn-box, .wp-block-button__link{padding: 10px 15px;}
	.col-container{flex-wrap: wrap;}
	.col-02 .col,
		.col-03 .col,
		.col-04 .col,
		.col-article,
		.col-article-sidebar{width: 100%; max-width: 100%; flex: auto;}
	.col-article-sidebar{top: unset; position: relative;}

	#footer .col-container{flex-wrap: wrap;}
	#footer-info{display: flex; width: 100%;}
	#footer-nav-inner{display: flex; width: 100%; flex-wrap: wrap;}
	#footer-nav-inner .col{padding: 0; width: calc(50% - 30px);}
	.footer-logo{display: inline-block; max-width: 150px;}


	#no-hero .col-container,
		#no-hero .wp-block-columns{flex-direction: column-reverse;}

	.pagination-link { min-width: 35px; height: 35px;}
	.prev-link .pagination-text,
	.next-link .pagination-text {display: none;}
	.prev-link::before {content: "‹";}
	.next-link::before {content: "›";}

	.wp-block-columns{padding-bottom: calc(var(--content-padding-small) * 2);}

}

@media (max-width: 480px) {

  .pagination-numbers .page-number:not(.current) {display: none;}
  .pagination-numbers .page-number:first-child,
  .pagination-numbers .page-number:last-child {display: inline-flex;}

}
