/* $colours */
/*
.
.
.
.
set hash bg theme colours ( light / dark ) in modules/branding.php
.
.
.
.
*/
/* borders et al */
/* forms */
:root {
  --submenu-item-border: 1px solid rgba(255, 255, 255, 0.2);
}

/* widths et al */
/* using map.get */
/* used in scssconstants/constants/_sizes.scss: $deskwidth: page-width(tablet-landscape); */
/* end used in scssconstants/constants/_sizes.scss: $deskwidth: page-width(tablet-landscape); */
/* min or max or min and max using sass map */
/* eg */
/* section {
	@include mq(handheld-plus) {
		background: pink;
	}
	@include mq(handheld, max) {
		background: skyblue;
	}
	@include mq(handheld, large-tablet) {
		border: dashed 0.5em turquoise;
	}
} */
/* OR */
/* range using lists */
/* eg */
/* main > p {
	@include mqrange(small) {
		font-weight: bold;
	}
	@include mqrange(large) {
		text-decoration: darkorchid underline;
	}
	@include mqrange(desktop) {
		font-size: 0.85rem;
		font-family: sans-serif;
		text-transform: uppercase;
		color: hsl(0, 0%, 25%);
	}
} */
/* font layout */
/* line-height */
:root {
  --bodytextline: 1.4375;
}

/* forms */
/* $ffborderradius: $borderradius; // see decorations.scss */
/* 0.25em bottom padding to cater for 1.2 lineheight to allow for text wrap on buttons on mobile */
/* see scss/_mixins/_media-query-width.scss for page-width() function */
/* 1100 / 16 = 68.75 */
/* 69 * 16 = 1104 */
/* 69rem = 1104px */
/* 76rem = 1216px */
/* 77rem = 1232px */
/* 78rem = 1248px */
/* 88rem = 1408px */
/* 94rem = 1504px widest */
:root {
  --button-spacing: 1.25em;
  --ffbuttonpadding: 0.75em 2.75em;
  --image-icon-size: 126px;
  --mobilemaxwidth: 90vw;
  --deskwidth: 84rem;
  --pagecontentwidth: 82rem;
}
@media only screen and (max-width: 83.5rem) {
  :root {
    --breakoutwidth: 0;
    --pagesidemargin: 5vw;
  }
  :root .main-menu-styles > li .menu-expando-title .tbrtheme-menu-title, :root .main-menu-styles > li a {
    --ffbuttonpadding: 0.5em 0;
  }
  :root {
    /* the properties you put in */
  }
}
@media only screen and (min-width: 83.5625rem) {
  :root {
    --breakoutwidth: min(3vw, 3rem);
    --pagesidemargin: 2vw;
    /* the properties you put in */
  }
}

body {
  --header-wrapper-height: clamp(66px, 140vw / 16, 116px);
  --banner-height: min(36vmax, 549px);
}
@media only screen and (min-width: 83.5625rem) {
  body {
    --header-wrapper-height: 171px;
    /* the properties you put in */
  }
}
body.home {
  --banner-height: null;
}
@media only screen and (min-width: 72.5625rem) {
  body.home {
    --banner-height: min(62vmax, 986px);
    /* the properties you put in */
  }
}

:root {
  --header-logo-width-aspect-ratio: 198;
  --header-logo-height-aspect-ratio: 91;
  --footer-logo-width-aspect-ratio: 198;
  --footer-logo-height-aspect-ratio: 91;
  --header-logo-width: calc(var(--header-logo-width-aspect-ratio) * 1px);
  --header-logo-height: calc(var(--header-logo-height-aspect-ratio) * 1px);
  --footer-logo-width: clamp(108px, 16vw, calc(var(--footer-logo-width-aspect-ratio) * 1px));
  --footer-logo-height: calc(var(--footer-logo-height-aspect-ratio) * 1px);
}
@media only screen and (max-width: 83.5rem) {
  :root {
    --header-logo-width: 108px;
    /* the properties you put in */
  }
}

:root {
  /* https://html-color.codes/ */
  --test: lime;
  --light: var(--shade-light);
  --dark: var(--shade-dark-grey);
  --grey-rule: var(--shade-light-grey);
  --light-grey-text: var(--shade-light-grey);
  --heading-color-one: var(--txt);
  --heading-color: var(--txt);
  --table-line: var(--txt);
  --table-head-txt: var(--txt);
  --table-head-bg: var(--shade-pale-grey);
  --table-alt-row-bg: var(--alt-bg);
  --marker-type-ul: disc;
  --marker-colour-ul: var(--txt);
  --marker-colour-ol: var(--txt);
  --accent-color: var(--txt);
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color */
  --tap-highlight-color: var(--color-tap);
  /* search modal dialogue:
  scss/widgets/search/_search-dialogue.scss */
  /* link to top of page */
  --svg-top-link: var(--color-up);
  --scrollbar-thumb: var(--color-footer-bg);
  --scrollbar-track: var(--bg);
  /* bg */
  --placeholder-image-bg-color-dark: var(--color-primary-700-alpha);
  --placeholder-image-bg-color-light: var(--shade-light-beige);
  --post-metadata-text: var(--txt);
  --post-metadata-bg: var(--bg);
  --box-background: var(--color-primary-700);
  /* three levels per @each */
  --shade-light: #ffffff;
  --shade-off-light: #fafafa;
  --shade-alt-light: #f5f5f5;
  --shade-lighter-beige: #fafafc;
  --shade-light-beige: #f9f8f5;
  --shade-beige-overlay: #f0eee8;
  --shade-paler-grey: #e1e1e1;
  --shade-hover-grey: #eaeaea;
  --shade-pale-grey: #ecebec;
  --shade-light-grey: #c1c1c1;
  --shade-lightly-grey: #cececf;
  --shade-mid-grey: #898989;
  --shade-dark-grey: #373737;
  --shade-dark: #303030;
  --shade-dm-light: #f0f0f0;
  --shade-dm-dark-grey: #333;
  --shade-alt-dark: #4d4d4d;
  --shade-form-bg: var(--alt-bg-light);
  --shade-ff-bg: var(--alt-bg);
  --shade-ff-border: var(--txt);
  --shade-placeholder-text: #212121;
  --color-logo: #21a534;
  --color-logo-red: #e52b32;
  --color-header-logo: var(--txt);
  --color-header-logo-home: var(--light);
  --color-primary-700: var(--color-logo);
  --color-primary-700-alpha: rgba(33, 165, 52, 0.3);
  --color-home-gardener: #096541;
  --color-commercial-grower: #009468;
  --color-exports: #259e38;
  --color-research: #65ba22;
  --color-region-hot: #e6262f;
  --color-region-hot-hover: #f07d82;
  --color-region-warm: #eb7405;
  --color-region-warm-hover: #f19e50;
  --color-region-tropical: #259e38;
  --color-region-tropical-hover: #7cc588;
  --color-region-subtropical: #d3428d;
  --color-region-subtropical-hover: #e58ebb;
  --color-region-cool: #1c93d2;
  --color-region-cool-hover: #90cae9;
  --color-highlight: var(--color-primary-700);
  --color-banner-bg-home: #4b5d6d;
  --color-primary-button: var(--bg);
  --color-primary-button-hover: var(--color-primary-700);
  --color-secondary-button: var(--color-primary-700);
  --color-secondary-button-hover: var(--shade-dark-grey);
  --color-card-hover: var(--shade-pale-grey);
  --color-call-to-action: var(--color-primary-700);
  --color-call-to-action-alt: var(--color-primary-700);
  --color-footer-bg: #043532;
  --color-files-upload-bg: rgba(53, 53, 54, 0.05);
  --color-progress: var(--color-primary-700);
  --color-error: #ff0000;
  --color-error-dark-mode: #ff6666;
  --color-up: var(--shade-mid-grey);
  --color-tap: var(--bg);
  --color-hover: var(--color-primary-700);
  --txt: var(--shade-dark);
  --txtalpha: rgba(48, 48, 48, 0.3);
  --txtalphalighter: rgba(48, 48, 48, 0.2);
  --region-text: #231f20;
  --bg: var(--shade-light);
  --alt-bg: var(--shade-light-beige);
  --alt-bg-light: var(--shade-alt-light);
  --menubg: var(--bg);
  --header-bg: var(--shade-lighter-beige);
  --banner-bg: var(--shade-light-beige);
  --hr: rgba(48, 48, 48, 0.2);
  --target-outline: inherit;
}
@media (prefers-color-scheme: dark) {
  :root {
    --txt: var(--shade-dm-light);
    --txtalpha: rgba(255, 255, 255, 0.3);
    --txtalphalighter: rgba(255, 255, 255, 0.2);
    --region-text: #d6d1d2;
    --bg: var(--shade-dm-dark-grey);
    --alt-bg: #2e2d29;
    --alt-bg-light: #2e2e2e;
    --menubg: var(--bg);
    --header-bg: var(--color-footer-bg);
    --banner-bg: var(--color-footer-bg);
    --hr: rgba(255, 255, 255, 0.2);
    --target-outline: inherit;
  }
}

div {
  --formreq: var(--txt);
  --formerror: var(--color-error);
  --formerrorlinks: var(--txt);
  /* outside of nav for tbrtheme private hospital */
  /* top navigation bar */
  --nav-top-fg: var(--txt);
  --nav-top-bg: transparent;
  /* end outside of nav for tbrtheme private hospital */
  --faq-summary-bg-closed: var(--bg);
}
.home div {
  --header-bg: transparent;
  --color-banner-bg-home: transparent;
}
:not(.nav-state-open) .home:not(.tbrtheme-submenu-active) div {
  --nav-top-fg: var(--light);
}

footer {
  --footer-text: var(--light);
  --footer-bg: var(--color-footer-bg);
  --footer-icon-fg: var(--dark);
  --footer-icon-fg-hover: var(--dark);
  --footer-icon-bg: var(--light);
  --footer-icon-bg-hover: var(--color-primary-700);
}

.site-footer a {
  --focus-outline: var(--light);
}

form, .search-form {
  --formlegend: var(--txt);
  --formlabel: var(--txt);
  --fftext: var(--txt);
  --ffplaceholdertext: var(--shade-placeholder-text);
  --ffbg: var(--shade-ff-bg);
  --ffborder: var(--shade-ff-border);
  --ffhoverborder: var(--color-primary-700);
  --ffhoveroutline: var(--color-hover);
  --invalidelement: var(--color-error);
  --invalidelementlight: var(--color-error);
  --progressbar: var(--color-progress);
  --validelement: currentcolor;
}

label {
  --formlabel: var(--txt);
}

label svg {
  --ffhoveroutline: var(--color-hover);
}

input[type=checkbox],
input[type=radio] {
  accent-color: var(--accent-color);
}

figcaption {
  --figcaption: var(--txt);
}

nav,
.navigation {
  /* breadcrumb navigation */
  --breadcrumb-button-text: var(--txt);
  --current-breadcrumb: var(--txt);
  --visited-breadcrumb: var(--txt);
  /* used for breadcrumb nav siblings */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/Privacy_and_the_:visited_selector */
  --breadcrumb-button-bg: transparent;
  /* edit other colours in scss/scss-core/navigation/_menu-main.scss */
  --scrollbar-nav-thumb: var(--main-menu-button-text);
  --scrollbar-nav-track: var(--main-menu-button-bg);
  /* bg */
  /* site map page */
  --menu-sitemap-border: var(--color-primary-700);
  /* pagination */
  --pagination-text: var(--color-call-to-action);
  --pagination-bg: var(--bg);
  --pagination-text-current: var(--txt);
  --pagination-bg-current: var(--bg);
  --pagination-text-disabled: var(--shade-mid-grey);
  --pagination-bg-disabled: var(--bg);
  --pagination-link: var(--color-call-to-action);
  --pagination-link-hover: var(--txt);
  --pagination-bg-hover: var(--bg);
  /* main menu */
  /* main site menu */
  --main-menu-button-text: var(--txt);
  --main-menu-button-fg-hover: var(--txt);
  --main-menu-button-bg: var(--bg);
  --main-menu-button-bg-hover: var(--bg);
  --main-menu-submenu-text: var(--txt);
  --main-menu-submenu-text-hover: var(--txt);
  --main-menu-submenu-bg: var(--bg);
  --main-menu-submenu-bg-hover: var(--bg);
  --current-sub-menu-item: var(--txt);
  --current-menu-item: var(--txt);
  --current-menu-item-bg: var(--main-menu-button-bg-hover);
}
.home nav,
.home .navigation {
  --current-menu-item: var(--light);
}
@media only screen and (min-width: 83.5625rem) {
  nav,
  .navigation {
    --main-menu-button-bg: var(--header-bg);
    --main-menu-button-bg-hover: var(--header-bg);
    /* the properties you put in */
  }
}
@media only screen and (min-width: 83.5625rem) {
  .home:not(.tbrtheme-submenu-active) nav,
  .home:not(.tbrtheme-submenu-active) .navigation {
    --main-menu-button-text: var(--light);
    --main-menu-button-fg-hover: var(--light);
    /* the properties you put in */
  }
}
@media only screen and (min-width: 83.5625rem) {
  nav,
  .navigation {
    --main-menu-submenu-bg: var(--bg);
    /* the properties you put in */
  }
}

summary {
  --faq-summary-text-closed: var(--txt);
  --faq-summary-text-open: var(--feature-colour);
  --faq-summary-text-hover: var(--feature-colour);
  --faq-summary-bg-open: var(--bg);
  --faq-summary-bg-hover: var(--bg);
  --faq-line: var(--txt);
}

.tbrtheme-accordion-content {
  --faq-line: var(--txt);
}

.wp-block-heading {
  color: var(--heading-color);
}

blockquote,
q {
  --blockquote: var(--feature-colour) ;
}

strong,
b {
  --bold: currentColor;
}

mark {
  --text-mark: rgb(238, 217, 29);
}

a {
  --button-underline-hover: var(--color-call-to-action, var(--test));
  --button-sideline-hover: var(--color-call-to-action, var(--test));
  --social-icon-fg: var(--light);
  --social-icon-fg-hover: var(--color-research, var(--test));
  --social-icon-bg: var(--color-footer-bg);
  --social-icon-bg-hover: var(--color-footer-bg);
}

a,
button,
a.button,
p.button a,
input[type=submit] {
  /* primary solid and secondary outline buttons */
  --color-cta: var(--color-call-to-action);
  --color-cta-light: var(--color-call-to-action-alt);
  /* secondary solid buttons - using outline button for secondary button on tbrtheme */
  --color-cta-secondary: var(--color-primary-700);
  --color-cta-secondary-light: var(--color-primary-700);
  --focus-outline: var(--color-highlight);
}

:not(.tbrtheme-person-details):target {
  position: relative;
}
:not(.tbrtheme-person-details):target::before {
  content: " ";
  position: absolute;
  inset: 0.5rem auto auto -1rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background-color: var(--color-primary-700);
}

@media (prefers-color-scheme: dark) {
  :root {
    --heading-color-one: var(--txt);
    --light: var(--shade-dm-light);
    --light-grey-text: var(--shade-alt-light);
    --color-error: var(--color-error-dark-mode);
    --image-bg-darkmode: var(--shade-dm-light);
    --shade-paler-grey: hwb(0 28% 72%);
    --shade-pale-grey: var(--shade-alt-dark);
    --scrollbar-thumb: var(--color-region-tropical);
    --shade-lighter-beige: hwb(240 18% 81%);
    --shade-lightly-grey: hwb(240 31% 69%);
    --shade-hover-grey: hwb(0 12% 88%);
    --shade-off-light: hwb(0 18% 82%);
    --shade-beige-overlay: hwb(45 11% 86%);
  }
  strong,
  b {
    --bold: currentColor;
  }
  a {
    --button-underline-hover: var(--feature-colour);
  }
  nav,
  .navigation {
    --light-grey-text: var(--shade-mid-grey);
  }
  form, .search-form {
    --ffplaceholdertext: var(--light);
    --ffbg: var(--shade-alt-dark);
    --ffhoverborder: var(--color-primary-700);
  }
  input[data-com-onepassword-filled=light],
  select[data-com-onepassword-filled=light] {
    --btn-bg: var(--color-primary-700);
  }
}
.tbrtheme-alt-bg {
  background-color: var(--alt-bg);
}

/*
	@mixin dark-bg($bg: --bg-alt-dark) {
		color: var(--light);
		background-color: var($bg);
	}
	@include dark-bg();
*/
/*
	https://www.youtube.com/watch?v=gP8yFWCTr7Q
	https://css-tricks.com/breaking-css-custom-properties-out-of-root-might-be-a-good-idea/
	eg
	button {
		kludge to fix button text colours in iOS
		@link https://stackoverflow.com/a/4648315/911083
		-webkit-text-fill-color: currentcolor;
	}
*/
:root {
  --card-year-n-orange: #ea7524;
  --card-year-n-green: #21a534;
  --card-year-n-blue: #1c93d2;
  --commercial-card-svg-n-beige: #f0eee8;
  --commercial-card-bg-n-beige: #f9f8f5;
  --home-card-svg-n-orange: #fae6d3;
  --home-card-svg-n-green: #f1fae9;
  --home-card-svg-n-blue: #e7f0f5;
  --home-card-bg-n-orange: #fff7f0;
  --home-card-bg-n-green: #fbfff8;
  --home-card-bg-n-blue: #f1f9fd;
}

/* font families */
:root {
  --serif: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif;
  --serif-antique: Superclarendon, 'Bookman Old Style', 'URW Bookman', 'URW Bookman L', 'Georgia Pro', Georgia, serif;
  --sans-serif: Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif;
  --monospace: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, 'DejaVu Sans Mono', Consolas, monospace;
  --cursive: 'Segoe Print', 'Bradley Hand', Chilanka, TSCu_Comic, casual, cursive;
  --emoji: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}

/* 300 */
/* used for wordpress login page */
/*
$fontbanner: var(--serif-antique);
$fonthead: var(--serif-antique);
$fontbutton: var(--monospace);
$fontbold: var(--monospace);
$fontfam: var(--monospace);
$fontnumberbutton: var(--monospace);
$fontsystem: var(--monospace); // used for wordpress login page
*/
/* https://simplecss.eu/pxtoems.html */
:root {
  --remsize4: 0.25rem;
  --remsize6: 0.375rem;
  --remsize8: 0.5rem;
  --remsize10: 0.625rem;
  --remsize12: 0.75rem;
  --remsize13: 0.8125rem;
  --remsize14: 0.875rem;
  --remsize15: 0.9375rem;
  --remsize16: 1rem;
  --remsize17: 1.0625rem;
  --remsize18: 1.125rem;
  --remsize20: 1.25rem;
  --remsize22: 1.375rem;
  --remsize24: 1.5rem;
  --remsize25: 1.5625rem;
  --remsize28: 1.75rem;
  --remsize30: 1.875rem;
  --remsize34: 2.125rem;
  --remsize36: 2.25rem;
  --remsize40: 2.5rem;
  --remsize42: 2.625rem;
  --remsize46: 2.875rem;
  --remsize60: 3.75rem;
  --remsize12-16: clamp(0.75rem, 1vw + 0.5rem, 1rem);
  --remsize14-16: clamp(0.875rem, 1vw + 0.5rem, 1rem);
  --remsize14-16cq: clamp(0.875rem, 5cqw + 0.5rem, 1rem);
  --remsize14-17: clamp(0.875rem, 1vw + 0.5rem, 1.0625rem);
  --remsize14-17cq: clamp(0.875rem, 5cqw + 0.5rem, 1.0625rem);
  --remsize14-18: clamp(0.875rem, 1vw + 0.5rem, 1.125rem);
  --remsize16-18: clamp(1rem, 1vw + 0.5rem, 1.125rem);
  --remsize14-19: clamp(0.875rem, 1vw + 0.5rem, 1.1875rem);
  --remsize18-19: clamp(1.125rem, 1vw + 0.5rem, 1.1875rem);
  --remsize18-20: clamp(1.125rem, 1vw + 0.5rem, 1.25rem);
  --remsize16-20: clamp(1rem, 1vw + 0.5rem, 1.25rem);
  --remsize16-19: clamp(1rem, 1vw + 0.5rem, 1.1875rem);
  --remsize16-22: clamp(1rem, 1vw + 1.375rem, 1.375rem);
  --remsize16-23: clamp(1rem, min(9vw, 1.4375rem), 1.4375rem);
  --remsize16-24: clamp(1rem, min(9vw, 1.5rem), 1.5rem);
  --remsize16-25: clamp(1rem, 1vw + 0.5rem, 1.5625rem);
  --remsize18-25: clamp(1.125rem, 1vw + 0.75rem, 1.5625rem);
  --remsize20-25: clamp(1.25rem, 1vw + 1rem, 1.5625rem);
  --remsize17-25cq: clamp(1.0625rem, min(6cqw, 1.5625rem), 1.5625rem);
  --remsize20-30: clamp(1.25rem, 2vw + 1rem, 1.875rem);
  --remsize20-34: clamp(1.25rem, 1vw + 1rem, 2.125rem);
  --remsize24-50: clamp(1.5rem, 7vw + 1rem, 3.125rem);
  --remsize24-50cq: clamp(1.5rem, 7vw + 1rem, 3.125rem);
  --remsize24-52: clamp(1.5rem, 7vw + 1rem, 3.25rem);
  --remsize24-60: clamp(1.5rem, 7vw + 1rem, 3.75rem);
  --remsize66: clamp(3.125rem, 2vw + 1rem, 4.125rem);
  --remsize45-70: clamp(2.8125rem, 7vw + 1rem, 4.375rem);
  --remsize40-80: clamp(2.5rem, 7vw + 1rem, 5rem);
  --remsize30-80: clamp(1.875rem, 4vw + 1rem, 5rem);
  --remsizeh1: clamp(2.8125rem, 4vw + 1rem, 5.3125rem);
  --remsizeh1-inside-pages: clamp(2.8125rem, 3vw + 1rem, 4.0625rem);
}
:root .tbrtheme-banner-content {
  --remsizeh1-inside-pages: clamp(1.875rem, 3vw + 1rem, 3.125rem);
}
:root {
  --remsizeh2: clamp(1.25rem, 1vw + 1rem, 1.5625rem);
  --remsizeh2contain: clamp(1.25rem, 4cqw + 0.7rem, 1.5625rem);
  --remsizeh3: var(--remsize18-25);
  --remsizeh4: var(--remsize14-18);
  --remsizeh5: var(--remsize16);
  --remsizeh6: var(--remsize15);
  --intro-text: var(--remsize20);
  --bodytextsize: var(--remsize16);
  --remsizeh2small: var(--remsize18);
  --remsizefooterh2: var(--remsize20);
  --remsizefootertext: var(--remsize16);
  --highlighttextsize: var(--remsize20);
  --cardtitlesize: var(--remsize20);
  --cardtextsize: var(--remsize16);
  --featcardtextsizefallback: clamp(0.8rem, min(6vw, 1rem), 1.0625rem);
  --featcardtextsize: clamp(0.8rem, min(6cqw, 1rem), 1.0625rem);
  --label: var(--bodytextsize);
  --caption: var(--remsize18);
  --fontsmall: var(--remsize16);
  --remsizereq: var(--remsize16);
  --buttontextsize: var(--remsize16);
  --inputtextsize: var(--remsize16);
}
@media only screen and (max-width: 48rem) {
  :root .site-content {
    --font-mobile-calc: 1.3;
  }
  :root {
    /* the properties you put in */
  }
}

/*
* 100 thin
* 200 extralight
* 300 light
* 400 regular
* 500 medium
* 600 semibold
* 700 bold
* 800 extrabold
* 900 black
*/
:root {
  --fwthin: 100;
  --fwextralight: 200;
  --fwlight: 300;
  --fwregular: 400;
  --fwmedium: 500;
  --fwsemibold: 600;
  --fwbold: 700;
  --fwextrabold: 800;
  --fwblack: 900;
  --fontweight300: 300;
  --fontweight400: 400;
  --fontweight500: 500;
  --fontweight600: 600;
  --fontweight700: 700;
  --bannerheadingweight: 500;
  --bannerweight: 400;
  --headingtwoweight: 500;
  --headingweight: 500;
  --bodytextweight: 400;
  --footerheadingweight: 500;
  --footertextweight: 300;
  --bodytextbold: 500;
  --bodytextstrong: 600;
  --linktextweight: 400;
  --inputfontweight: 400;
  --buttontextweight: 500;
  --cardtextweight: 400;
}

/* font mixins */
/* mixins */
/* hide / show */
/* for screen reader text */
/* for screen reader text */
/* for mobile menu */
/* for mobile menu */
/* tab into hidden articles */
/* tab into hidden articles and show them */
/* for logo */
/* before content so list items are still recognised by some screen readers */
/* @link https://www.scottohara.me/blog/2019/01/12/lists-and-safari.html */
/* for print css */
/* for list items */
:root {
  --heading-letter-spacing: 0;
}

h1.website-title {
  margin: 0;
}

.tbrtheme-banner-title {
  font-family: "neue-haas-grotesk-text", var(--sans-serif);
  font-size: var(--remsizeh1);
  font-weight: var(--bannerheadingweight);
  line-height: 1.05;
  text-wrap: balance;
  margin-block-end: 1rem;
}
@media only screen and (max-width: 83.5rem) {
  .tbrtheme-banner-title {
    margin-block-end: 0.75rem;
    /* the properties you put in */
  }
}

:not(.home).wp-block-tbrtheme-banner h1.wp-block-heading,
h1.wp-block-heading,
.tbrtheme-post-metadata h1 {
  font-size: var(--remsizeh1-inside-pages);
  line-height: 1.06;
  color: inherit;
}

.entry-text > h1.wp-block-heading {
  font-size: var(--remsize45-70);
}

h1.wp-block-heading,
.tbrtheme-post-metadata h1 {
  margin-block-end: 1.5rem;
}

.tbrtheme-newsletter-dialogue h2,
h2.tbrtheme-season-heading,
.tbrtheme-season-planting h3,
.tbrtheme-season-tips h3,
.single-post h1 {
  font-family: "neue-haas-grotesk-text", var(--sans-serif);
  font-size: var(--remsizeh2);
  font-weight: var(--headingtwoweight);
  line-height: 1.36;
  margin-block-end: 1em;
}

h2.tbrtheme-season-heading {
  padding-block-end: 0.5em;
  margin-block-end: 1.5em;
  border-block-end: 1px solid var(--txtalpha);
}

.tbrtheme-season-planting h3 {
  margin-block-end: 0.75rem;
}

.single-post h1 {
  line-height: 1.16;
  margin-block-end: 0.75em;
}

summary h2,
h2.wp-block-heading,
h2.tbrtheme-timeline-heading {
  font-size: var(--remsizeh2);
  font-weight: var(--headingtwoweight);
  line-height: 1.36;
  margin-block-end: 0.5em;
}

h2.tbrtheme-timeline-heading {
  margin-block-end: min(6vw, 3rem);
}

h2.wp-block-heading.margin-half {
  margin-block-end: 0.5em;
}

.page-template-investors h2.wp-block-heading {
  font-family: Inter, var(--sans-serif);
  font-size: var(--remsize18-19);
  font-weight: 600;
  margin-block-end: 0.25em;
}

.page-template-investors h2.wp-block-heading + .wp-block-flexible-table-block-table {
  margin-block-start: 0.25em;
}

.wp-block-heading,
.tbrtheme-timeline-heading {
  font-family: "neue-haas-grotesk-text", var(--sans-serif);
  font-weight: var(--headingweight);
  letter-spacing: var(--heading-letter-spacing);
  text-wrap: balance;
}

h3.wp-block-heading {
  font-size: var(--remsizeh3);
  font-weight: var(--headingweight);
  line-height: 1.2;
  margin-block-end: 0.25em;
}
h3.wp-block-heading ~ h3.wp-block-heading {
  margin-block-start: 0.25em;
}

:is(h5, h6).wp-block-heading {
  font-family: Inter, var(--sans-serif);
}

h4.wp-block-heading {
  font-size: var(--remsizeh4);
  line-height: 1.2;
}

h5.wp-block-heading {
  font-size: var(--remsizeh5);
  line-height: 1.2;
}

h6.wp-block-heading {
  font-size: var(--remsizeh6);
  line-height: 1.2;
}

p:has(+ .wp-block-heading) {
  --margin-size: 1em;
}

p + .wp-block-heading {
  margin-block-start: 0.75em;
}

:is(.privacy-policy, .terms-conditions) h2.wp-block-heading {
  font-size: var(--bodytextsize);
  font-weight: var(--headingtwoweight);
}
:is(.privacy-policy, .terms-conditions) p:has(+ .wp-block-heading) {
  --margin-size: inherit;
}

.footer-menu-main h2,
.site-footer h2 {
  font-family: Inter, var(--sans-serif);
  font-weight: var(--fwsemibold);
}

.site-footer h2 {
  font-size: var(--footertextsize);
  line-height: 1.7;
}

/* see reset.scss */
/* https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-ligatures */
/* form fields */
/* button base */
/* form fields */
/* form fields & buttons */
/* buttons */
/* form fields */
/* buttons */
/*	https://developer.mozilla.org/en-US/docs/Web/CSS/mix-blend-mode

	https://codepen.io/thebabydino/pen/dyOvmRY

	difference
	exclusion
*/
/* form fields */
/* buttons */
/* form fields */
/* cater for pseudo element alt text support where there is some */
/* @include content("*", "splat"); */
/* mixins for ::before ::after placement and content */
/* eg */
/* .pseudo-element-absolute { */
/* 	@include sudoplace(3%, 3%, 3%, 3%, $content: "Hello World", $pos: before) { */
/* 		background-color: pink; */
/* 	} */
/* } */
/* buttons */
.tbrtheme-button-frosted {
  color: var(--light);
}
.tbrtheme-button-frosted .wp-block-heading {
  color: var(--light);
}
.tbrtheme-button-frosted a {
  inline-size: 100%;
  border-radius: var(--remsize15);
  border: var(--line-thickness, 1px) solid var(--light, var(--test));
  position: relative;
  isolation: isolate;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3em;
  font-size: var(--remsize16-25);
  font-weight: 500;
  line-height: 1.16;
  text-decoration: none;
  padding: 1em;
  overflow: hidden;
}
.tbrtheme-button-frosted a::before {
  content: " ";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  /* From https://css.glass */
  background: rgba(47, 43, 43, 0.063);
  backdrop-filter: blur(6px);
  background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(102, 102, 102, 0.08) 100%);
}
.tbrtheme-button-frosted a svg {
  --svg-inline: 0.8em;
  --svg-block: 0.8em;
}
@media (any-hover: hover) {
  .tbrtheme-button-frosted a :is(span, svg) {
    transform: translateY(0);
    transition: transform 200ms cubic-bezier(0.55, 0.09, 0.68, 0.53);
  }
  .tbrtheme-button-frosted a:hover :is(span, svg), .tbrtheme-button-frosted a:active :is(span, svg), .tbrtheme-button-frosted a:focus-visible :is(span, svg) {
    transform: translateY(-0.125em);
  }
  .tbrtheme-button-frosted a:hover, .tbrtheme-button-frosted a:active, .tbrtheme-button-frosted a:focus-visible {
    /* the properties you put in */
  }
}

/* form fields */
/* form fields */
/* for mixin includes */
/* for mixin includes */
html {
  hanging-punctuation: first last;
}

body {
  font-family: Inter, var(--sans-serif);
  font-variant-ligatures: no-common-ligatures;
  font-variant-numeric: tabular-nums lining-nums;
}

strong {
  font-family: Inter, var(--sans-serif);
}

.capitalise-text {
  text-transform: uppercase;
}

.intro-text p,
p.intro-text {
  font-size: var(--intro-text);
  line-height: 1.25;
  font-weight: var(--bodytextbold);
  --margin-size: 0.5em;
}

p,
li {
  text-wrap: pretty;
}

figcaption,
.wp-element-caption {
  font-style: italic;
}

.wp-element-caption {
  padding-block-end: 1em;
  border-block-end: 1px solid var(--txtalpha);
}

/* news posts */
.archive .hentry h2 a {
  text-decoration: none;
}

/* for fixed header and hash links to another page */
/* html.hashlink-padding body { */
/* 	padding-block-start: 9rem; */
/* } */
.site-footer {
  color: var(--footer-text, var(--test));
  background-color: var(--footer-bg, var(--test));
}

a.tbrtheme-cta-link,
.tbrtheme-cta-link a,
.wp-block-button-link a {
  --linktextweight: var(--buttontextweight);
  text-decoration: none;
  --btn-fg: var(--txt, var(--test));
  --btn-bg: transparent;
  --btn-bdr: var(--txt, var(--test));
  --btn-fg: currentcolor;
  --btn-bg: transparent;
  --btn-bdr: currentcolor;
  /* end override wordpress style */
  min-inline-size: 3rem;
  max-inline-size: min(100%, 90vw);
  border-radius: 0.5625rem;
  color: var(--btn-fg, var(--test)) !important;
  background-color: var(--btn-bg, var(--test)) !important;
  border: var(--btn-bdr-size, 1px) solid var(--btn-bdr, transparent) !important;
  /* !important to override gravity forms opinionated bullshit */
  word-break: normal;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  border-radius: var(--buttonborderradius, 100vw);
  position: relative;
  /* cater for ::before ::after position absolute */
  isolation: isolate;
  /* cater for z-index -1 of ::before ::after */
  overflow: hidden;
  font-family: Inter, var(--sans-serif);
  font-weight: var(--buttontextweight);
  font-size: var(--buttontextsize);
  line-height: 1.2;
  text-align: center;
  justify-content: center;
  text-transform: capitalize;
  white-space: normal;
  cursor: pointer;
  opacity: 1;
  padding: var(--ffbuttonpadding);
  /* fix button text colours in iOS */
  -webkit-text-fill-color: currentcolor;
  /* for browsers that don't seem to support outline: */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color */
  -webkit-tap-highlight-color: var(--tap-highlight-color);
  position: relative;
  isolation: isolate;
  -webkit-tap-highlight-color: var(--tap-highlight-color);
  outline: 0.125em solid transparent;
  outline-offset: 0.125em;
  transition: outline-color ease-in 150ms;
  /* for browsers that don't seem to support outline: */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color */
}
a.tbrtheme-cta-link:focus-visible,
.tbrtheme-cta-link a:focus-visible,
.wp-block-button-link a:focus-visible {
  outline-color: var(--focus-outline, currentColor);
  transform: rotate(0);
  /* Prevent outline overlapping, by creating a new stacking context with the transform property you can fix the outline overlapping - rotate(0) is just an example
  	https://equinusocio.dev/blog/hot-tips-css/#prevent-outline-overlapping */
}
a.tbrtheme-cta-link:focus,
.tbrtheme-cta-link a:focus,
.wp-block-button-link a:focus {
  box-shadow: none;
}
a.tbrtheme-cta-link[href^=mailto],
.tbrtheme-cta-link a[href^=mailto],
.wp-block-button-link a[href^=mailto] {
  text-transform: none;
}
@media (prefers-reduced-motion: no-preference) {
  a.tbrtheme-cta-link,
  .tbrtheme-cta-link a,
  .wp-block-button-link a {
    --button-transition: 300ms;
    will-change: transform;
  }
}
a.tbrtheme-cta-link:disabled,
.tbrtheme-cta-link a:disabled,
.wp-block-button-link a:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed;
  filter: grayscale(100%);
  pointer-events: none;
}
a.tbrtheme-cta-link::before,
.tbrtheme-cta-link a::before,
.wp-block-button-link a::before {
  content: " ";
  position: absolute;
  inset: 0;
  width: 0;
  background-color: var(--color-cta, var(--test));
  border-radius: inherit;
  transition: var(--button-transition, 200ms) width cubic-bezier(0.55, 0.09, 0.68, 0.53);
  z-index: -1;
}
a.tbrtheme-cta-link:hover::before, a.tbrtheme-cta-link:active::before, a.tbrtheme-cta-link:focus-visible::before,
.tbrtheme-cta-link a:hover::before,
.tbrtheme-cta-link a:active::before,
.tbrtheme-cta-link a:focus-visible::before,
.wp-block-button-link a:hover::before,
.wp-block-button-link a:active::before,
.wp-block-button-link a:focus-visible::before {
  width: 100%;
}
a.tbrtheme-cta-link:hover, a.tbrtheme-cta-link:active, a.tbrtheme-cta-link:focus-visible,
.tbrtheme-cta-link a:hover,
.tbrtheme-cta-link a:active,
.tbrtheme-cta-link a:focus-visible,
.wp-block-button-link a:hover,
.wp-block-button-link a:active,
.wp-block-button-link a:focus-visible {
  /* the properties you put in */
}
@media (any-hover: none) {
  a.tbrtheme-cta-link::before,
  .tbrtheme-cta-link a::before,
  .wp-block-button-link a::before {
    content: none;
  }
  a.tbrtheme-cta-link:hover, a.tbrtheme-cta-link:active, a.tbrtheme-cta-link:focus-visible,
  .tbrtheme-cta-link a:hover,
  .tbrtheme-cta-link a:active,
  .tbrtheme-cta-link a:focus-visible,
  .wp-block-button-link a:hover,
  .wp-block-button-link a:active,
  .wp-block-button-link a:focus-visible {
    --btn-bg: var(--color-cta, var(--test));
    /* the properties you put in */
  }
  .menu-item.current-menu-item a.tbrtheme-cta-link,
  .menu-item.current-menu-item .tbrtheme-cta-link a,
  .menu-item.current-menu-item .wp-block-button-link a {
    --btn-bg: var(--color-cta, var(--test));
  }
}
a.tbrtheme-cta-link:hover, a.tbrtheme-cta-link:active, a.tbrtheme-cta-link:focus-visible,
.tbrtheme-cta-link a:hover,
.tbrtheme-cta-link a:active,
.tbrtheme-cta-link a:focus-visible,
.wp-block-button-link a:hover,
.wp-block-button-link a:active,
.wp-block-button-link a:focus-visible {
  --btn-fg: var(--light, var(--test));
  --btn-bdr: var(--color-cta, var(--test));
  /* the properties you put in */
}

a.tbrtheme-cta-link-alt,
.tbrtheme-cta-link-alt a {
  /* use either secondary (solid) OR outline */
  --btn-bg: transparent;
  --color-primary-button-hover: transparent;
  --linktextweight: var(--buttontextweight);
  --btn-fg: var(--bg);
  --btn-bg: var(--color-primary-button);
  text-decoration: none;
  border-radius: 0;
  padding-inline: 0;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-thickness: 0.0625rem;
  text-underline-offset: 0.5em;
  transition: 100ms cubic-bezier(0.55, 0.09, 0.68, 0.53);
  --btn-solid-bdr: transparent;
  /* end override wordpress style */
  min-inline-size: 3rem;
  max-inline-size: min(100%, 90vw);
  border-radius: 0.5625rem;
  color: var(--btn-fg, var(--test)) !important;
  background-color: var(--btn-bg, var(--test)) !important;
  border: var(--btn-bdr-size, 1px) solid var(--btn-bdr, transparent) !important;
  /* !important to override gravity forms opinionated bullshit */
  word-break: normal;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  border-radius: var(--buttonborderradius, 100vw);
  position: relative;
  /* cater for ::before ::after position absolute */
  isolation: isolate;
  /* cater for z-index -1 of ::before ::after */
  overflow: hidden;
  font-family: Inter, var(--sans-serif);
  font-weight: var(--buttontextweight);
  font-size: var(--buttontextsize);
  line-height: 1.2;
  text-align: center;
  justify-content: center;
  text-transform: capitalize;
  white-space: normal;
  cursor: pointer;
  opacity: 1;
  padding: var(--ffbuttonpadding);
  /* fix button text colours in iOS */
  -webkit-text-fill-color: currentcolor;
  /* for browsers that don't seem to support outline: */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color */
  -webkit-tap-highlight-color: var(--tap-highlight-color);
  border-color: var(--btn-solid-bdr, var(--test)); /* background colour */
  -webkit-tap-highlight-color: var(--tap-highlight-color);
  outline: 0.125em solid transparent;
  outline-offset: 0.125em;
  transition: outline-color ease-in 150ms;
  /* for browsers that don't seem to support outline: */
  /* https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-color */
}
a.tbrtheme-cta-link-alt:focus-visible,
.tbrtheme-cta-link-alt a:focus-visible {
  outline-color: var(--focus-outline, currentColor);
  transform: rotate(0);
  /* Prevent outline overlapping, by creating a new stacking context with the transform property you can fix the outline overlapping - rotate(0) is just an example
  	https://equinusocio.dev/blog/hot-tips-css/#prevent-outline-overlapping */
}
a.tbrtheme-cta-link-alt:focus,
.tbrtheme-cta-link-alt a:focus {
  box-shadow: none;
}
a.tbrtheme-cta-link-alt[href^=mailto],
.tbrtheme-cta-link-alt a[href^=mailto] {
  text-transform: none;
}
@media (prefers-reduced-motion: no-preference) {
  a.tbrtheme-cta-link-alt,
  .tbrtheme-cta-link-alt a {
    --button-transition: 300ms;
    will-change: transform;
  }
}
a.tbrtheme-cta-link-alt:disabled,
.tbrtheme-cta-link-alt a:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed;
  filter: grayscale(100%);
  pointer-events: none;
}
a.tbrtheme-cta-link-alt:hover, a.tbrtheme-cta-link-alt:active, a.tbrtheme-cta-link-alt:focus-visible,
.tbrtheme-cta-link-alt a:hover,
.tbrtheme-cta-link-alt a:active,
.tbrtheme-cta-link-alt a:focus-visible {
  --btn-bg: var(--color-primary-button-hover);
  /* the properties you put in */
}
@media (prefers-color-scheme: dark) {
  a.tbrtheme-cta-link-alt:hover, a.tbrtheme-cta-link-alt:active, a.tbrtheme-cta-link-alt:focus-visible,
  .tbrtheme-cta-link-alt a:hover,
  .tbrtheme-cta-link-alt a:active,
  .tbrtheme-cta-link-alt a:focus-visible {
    --btn-bg: var(--shade-light-beige);
    /* the properties you put in */
  }
}
.wp-block-column a.tbrtheme-cta-link-alt,
.wp-block-column .tbrtheme-cta-link-alt a {
  margin-block-start: 1.5em;
}
a.tbrtheme-cta-link-alt:hover, a.tbrtheme-cta-link-alt:active, a.tbrtheme-cta-link-alt:focus-visible,
.tbrtheme-cta-link-alt a:hover,
.tbrtheme-cta-link-alt a:active,
.tbrtheme-cta-link-alt a:focus-visible {
  text-decoration-line: underline !important;
  text-decoration-style: solid !important;
  text-decoration-thickness: 0.25em !important;
  text-underline-offset: 0.5em;
  text-decoration-color: var(--color-primary-700) !important;
  /* the properties you put in */
}
a.tbrtheme-cta-link-alt,
.tbrtheme-cta-link-alt a {
  /* end use either secondary (solid) OR outline */
}

/* <s>: The Strikethrough element - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s */
mark::before, mark::after, del::before, del::after, ins::before, ins::after, s::before, s::after {
  clip-path: inset(100%);
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

s::before {
  content: " [start of stricken text] ";
}
s::after {
  content: " [end of stricken text] ";
}

/* <ins>: The Insert element - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/ins */
ins::before {
  content: " [insertion start] ";
}
ins::after {
  content: " [insertion end] ";
}

/* <del>: The Delete element - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/del */
del::before {
  content: " [deletion start] ";
}
del::after {
  content: " [deletion end] ";
}

/* <mark>: The Highlight element - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/mark */
mark::before {
  content: " [highlight start] ";
}
mark::after {
  content: " [highlight end] ";
}

/*# sourceMappingURL=all.css.map */