/*
Theme Name:		Phire Group 2026 - BCS
Author:			John Green @ Phire Group
Author URI:		https://phiregroup.com/
Description:	The individual BCS theme for the 2026 Phire Group network of sites.
Version:		1.0
*/

:root {--red: #e4002b; --green: #327469; --blue: #6191f2; --online: #3db591; --white: #fff; --black: #000; --black55: rgb(0 0 0 / .55); --gray: #4f4f4f; --gray30: #cacaca; --gray20: #dcdcdc; --tan: #ecece5; --tanhover: #dfdfd7; --tan50: rgb(236 236 229 / .5); --mw: 76.875rem; --hs: .9375rem;}

/* basic styles */
* {margin: 0; padding: 0;}
*, ::before, ::after {box-sizing: border-box;}
html {font: 300 medium/1.3125 'DM Sans', sans-serif; -webkit-text-size-adjust: none; text-size-adjust: none; color: #000; background-color: #fff;}
a {text-decoration-thickness: from-font; color: inherit;}
button {border-width: 0; font: inherit; color: inherit; background-color: transparent; cursor: pointer; touch-action: manipulation;}
dialog {overscroll-behavior: contain;}
dialog::backdrop {overflow: hidden; overscroll-behavior: contain;}
h1, h2, h3, h4, h5, h6 {text-wrap: balance;}
iframe {display: block; max-width: 100%; border: 0;}
img, picture, svg, video {height: auto; max-width: 100%; vertical-align: middle;}
input, select, textarea {font: inherit; letter-spacing: inherit; word-spacing: inherit;}
ol, ul {list-style: none;}
p {text-wrap: pretty;}
summary {list-style: none; cursor: pointer;}
summary::-webkit-details-marker {display: none;}
svg[width="0"][height="0"] {position: fixed;}
svg[width="0"][height="0"][aria-hidden="true"] {display: none;}
[hidden] {display: none !important;}

/* text classes */
.h50, .h40, .h32, .h26 {font-weight: 500; font-family: Gilroy, serif; letter-spacing: -.03em;}
.h50 {font-size: 3.125rem; line-height: 58px;}
.h40 {font-size: 2.5rem; line-height: 44px;}
.h32 {font-size: 2rem; line-height: normal;}
.h26 {font-size: 1.625rem; line-height: normal;}
.txt20 {font-size: 1.25rem; line-height: 1.3;}
.txt18 {font-size: 1.125rem; line-height: 1.333;}
.txt16 {font-size: 1rem; line-height: 1.3125;}
.txt14 {font-size: .875rem; line-height: 1.2857;}
.txt12 {font-size: .75rem; line-height: normal;}
.lt {font-weight: 300;}
.md {font-weight: 500;}
.bd {font-weight: 700;}

/* utility classes */
.btn {display: inline-flex; gap: .625rem; align-items: center; padding: .6875rem 1.25rem; border: 1px solid; font-weight: 500; font-size: .875rem; line-height: 1.43 !important; text-decoration: none; letter-spacing: -.02em; transition: .3s ease-out;}
.btn1 {border-color: var(--black); border-radius: 1.875rem; color: var(--white); background-color: var(--black);}
.btn1:hover {border-color: var(--tan); color: var(--black); background-color: var(--tan);}
.btn2 {border-color: var(--tan); border-radius: 1.875rem; color: var(--black); background-color: var(--tan);}
.btn2:hover {border-color: var(--black); color: var(--white); background-color: var(--black);}
.btn3 {border-color: var(--tan); border-radius: 1.875rem; color: var(--black); background-color: var(--white);}
.btn3:hover {border-color: var(--black); color: var(--white); background-color: var(--black);}
.btn4 {border-color: var(--black); border-radius: .375rem; color: var(--white); background-color: var(--black);}
.btn4:hover {border-radius: 1.875rem;}
.screen-reader-text {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}
.wrap {margin-inline: max(var(--hs), ((100% - var(--mw)) / 2));}
.wys *:where(:not(.btn)) {margin: revert; margin-bottom: 0; padding: revert; list-style: revert;}
.wys > :first-child {margin-top: 0;}

/* header */
.header-skip {display: block; padding: .5rem; text-align: center;}
.header-skip:not(:focus) {position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;}
.header-skip:focus {outline: none;}
.header-skip span {padding-right: .25rem; padding-left: .25rem;}
.header-skip:focus-visible span {outline: 1px solid;}

/* footer */
.pf {padding-block: 3.125rem var(--hs);}
.pf .wrap {display: grid;}
.pf h2 + p {margin-top: 1.25rem; color: var(--gray);}
.pf-ctas {display: flex; flex-wrap: wrap; margin-top: 1.875rem;}
.pf-nav {display: flex; flex-wrap: wrap; margin-top: 3.75rem;}
.pf-nav li:not(:last-child) {margin-right: 1.25rem; padding-right: 1.25rem; border-right: 1px solid;}
.pf-nav a:hover {text-decoration: none;}
.pf-legal {margin-top: 1.25rem;}
.pf-logo {justify-self: end; margin-top: 2.5rem;}

@media (width >= 48em) { /* 768px */

	.pf {padding-block: 6.25rem 2.5rem;}
	.pf .wrap {grid-template-columns: 1fr 16.5625rem; column-gap: 1.875rem;}
	:where(.pf .wrap) > * {grid-column: 1 / -1;}
	.pf-ctas {grid-column: 1; margin-top: 5rem;}
	.pf-nav {grid-column: 1; margin-top: 5rem;}
	.pf-legal {grid-column: 1;}
	.pf-logo {grid-area: 4 / 2 / 6 / -1; align-self: end;}

}

@media print {

	*, *::before, *::after {border-color: #000 !important; text-shadow: none !important; color: #000 !important; background-color: transparent !important;}
	blockquote, figure {break-inside: avoid;}

}

@media (prefers-reduced-motion: no-preference) {

	html:focus-within {scroll-behavior: smooth;}

	@view-transition {navigation: auto;}

}

@media (prefers-reduced-motion: reduce) {

	*, *::before, *::after {scroll-behavior: auto !important; transition-duration: 1ms !important; animation-duration: 1ms !important; animation-iteration-count: 1 !important;}

}

@media (forced-colors: active) {

	/* @TODO */

}
